/* ============================================================
   PORTAL DO PEREGRINO — CSS v2 (Bootstrap 5 + Dark/Light Mode)
   ============================================================ */

/* ─── VARIÁVEIS — TEMA CLARO ─────────────────────────────── */
:root {
  --pp-bg:           #F8F9FB;
  --pp-surface:      #FFFFFF;
  --pp-surface-2:    #F1F4F8;
  --pp-primary:      #1A3F7A;
  --pp-primary-h:    #2755A8;
  --pp-primary-rgb:  26, 63, 122;
  --pp-gold:         #C49A2A;
  --pp-gold-h:       #D4AA3A;
  --pp-blue:         #2C5F8A;
  --pp-green:        #2D7A4F;
  --pp-text:         #1A202C;
  --pp-text-2:       #4A5568;
  --pp-muted:        #718096;
  --pp-border:       #E2E8F0;
  --pp-border-2:     #CBD5E0;
  --pp-shadow-sm:    0 1px 4px rgba(0,0,0,.06);
  --pp-shadow:       0 4px 20px rgba(0,0,0,.09);
  --pp-shadow-lg:    0 8px 40px rgba(0,0,0,.12);
  --pp-radius:       12px;
  --pp-radius-lg:    20px;
  --pp-transition:   .25s ease;
  --pp-nav-bg:       rgba(255,255,255,.95);
  --pp-nav-h:        68px;

  /* Bootstrap overrides */
  --bs-body-bg:       var(--pp-bg);
  --bs-body-color:    var(--pp-text-2);
  --bs-border-color:  var(--pp-border);
  --bs-card-bg:       var(--pp-surface);
}

/* ─── VARIÁVEIS — TEMA ESCURO ─────────────────────────────── */
[data-theme="dark"] {
  --pp-bg:          #111110;
  --pp-surface:     #1C1B1A;
  --pp-surface-2:   #252422;
  --pp-primary:     #4A7EDE;
  --pp-primary-h:   #5E90EE;
  --pp-primary-rgb: 74, 126, 222;
  --pp-gold:        #D4A830;
  --pp-gold-h:      #E4B840;
  --pp-blue:        #4A8EC2;
  --pp-green:       #3DAA6A;
  --pp-text:        #EDE8E3;
  --pp-text-2:      #C4B8B0;
  --pp-muted:       #8A8078;
  --pp-border:      #2E2B28;
  --pp-border-2:    #3E3B38;
  --pp-shadow-sm:   0 1px 4px rgba(0,0,0,.2);
  --pp-shadow:      0 4px 20px rgba(0,0,0,.28);
  --pp-shadow-lg:   0 8px 40px rgba(0,0,0,.38);
  --pp-nav-bg:      rgba(17,17,16,.94);

  --bs-body-bg:      var(--pp-bg);
  --bs-body-color:   var(--pp-text-2);
  --bs-border-color: var(--pp-border);
  --bs-card-bg:      var(--pp-surface);
  --bs-dropdown-bg:  var(--pp-surface);
  --bs-dropdown-link-color: var(--pp-text);
  --bs-dropdown-link-hover-bg: var(--pp-surface-2);
  --bs-dropdown-border-color: var(--pp-border);
}

/* ─── TRANSIÇÃO SUAVE AO TROCAR TEMA ─────────────────────── */
*, *::before, *::after {
  transition: background-color var(--pp-transition),
              border-color var(--pp-transition),
              box-shadow var(--pp-transition);
}
/* Exclui transição em elementos que NÃO devem mudar lento */
a, button, .btn, .nav-link, .pp-card, input, textarea, select {
  transition: all var(--pp-transition);
}

/* ─── BASE ────────────────────────────────────────────────── */
html { scroll-behavior: smooth; }
body {
  font-family: 'Inter', system-ui, sans-serif;
  background: var(--pp-bg);
  color: var(--pp-text-2);
  padding-top: var(--pp-nav-h);
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3 { font-family: 'Playfair Display', Georgia, serif; color: var(--pp-text); }
h4, h5, h6 { font-weight: 600; color: var(--pp-text); }
a { color: var(--pp-primary); }
a:hover { color: var(--pp-primary-h); }
img { max-width: 100%; height: auto; }

/* ─── CORES UTILITÁRIAS ───────────────────────────────────── */
.text-pp      { color: var(--pp-primary) !important; }
.text-pp-gold { color: var(--pp-gold) !important; }
.text-pp-blue { color: var(--pp-blue) !important; }
.text-muted   { color: var(--pp-muted) !important; }
.bg-pp-surface  { background: var(--pp-surface) !important; }
.bg-pp-surface2 { background: var(--pp-surface-2) !important; }

/* ─── BOTÕES ─────────────────────────────────────────────── */
.btn-pp {
  background: var(--pp-primary);
  border-color: var(--pp-primary);
  color: #fff;
  font-weight: 600;
  border-radius: var(--pp-radius);
}
.btn-pp:hover, .btn-pp:focus {
  background: var(--pp-primary-h);
  border-color: var(--pp-primary-h);
  color: #fff;
  box-shadow: 0 4px 16px rgba(var(--pp-primary-rgb),.35);
  transform: translateY(-1px);
}
.btn-pp-outline {
  background: transparent;
  border: 2px solid var(--pp-border-2);
  color: var(--pp-text);
  font-weight: 600;
  border-radius: var(--pp-radius);
}
.btn-pp-outline:hover {
  border-color: var(--pp-primary);
  color: var(--pp-primary);
  background: rgba(var(--pp-primary-rgb),.06);
}
.btn-pp-gold {
  background: var(--pp-gold);
  border-color: var(--pp-gold);
  color: #fff;
  font-weight: 600;
  border-radius: var(--pp-radius);
}
.btn-pp-gold:hover {
  background: var(--pp-gold-h);
  border-color: var(--pp-gold-h);
  color: #fff;
  box-shadow: 0 4px 16px rgba(196,154,42,.35);
  transform: translateY(-1px);
}

/* ─── NAVBAR ─────────────────────────────────────────────── */
.pp-navbar {
  height: var(--pp-nav-h);
  background: var(--pp-nav-bg);
  backdrop-filter: blur(16px) saturate(160%);
  -webkit-backdrop-filter: blur(16px) saturate(160%);
  border-bottom: 1px solid var(--pp-border);
  box-shadow: var(--pp-shadow-sm);
}
.pp-navbar.scrolled { box-shadow: var(--pp-shadow); }

/* Brand */
/* Brand — garantir flex em todos os tamanhos de tela */
.navbar .pp-brand,
.pp-brand {
  text-decoration: none !important;
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  gap: .55rem;
  max-width: calc(100vw - 80px); /* Deixar espaço para o toggler */
}
.pp-brand-icon {
  width: 40px; height: 40px;
  background: var(--pp-primary);
  color: #fff;
  border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.2rem; flex-shrink: 0;
  transition: transform var(--pp-transition);
}
.pp-brand:hover .pp-brand-icon { transform: rotate(-6deg) scale(1.05); }
.pp-brand-texts { line-height: 1.1; }
.pp-brand-name {
  display: block; font-family: 'Playfair Display', serif;
  font-size: .92rem; font-weight: 700; color: var(--pp-text);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  max-width: 160px; /* segurança para telas muito pequenas */
}
.pp-brand-sub { display: block; font-size: .68rem; color: var(--pp-muted); }
.pp-brand-icon-sm {
  width: 32px; height: 32px;
  background: var(--pp-primary);
  color: #fff; border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1rem;
}
.pp-footer-name { font-family: 'Playfair Display', serif; font-size: 1rem; font-weight: 700; color: rgba(255,255,255,.9); }

/* Nav links */
.pp-navbar .nav-link {
  font-size: .82rem; font-weight: 500; color: var(--pp-text-2);
  padding: .4rem .55rem !important;
  border-radius: 8px;
  display: flex; align-items: center; gap: .3rem;
  white-space: nowrap;
}
.pp-navbar .nav-link:hover, .pp-navbar .nav-link.active {
  color: var(--pp-primary);
  background: rgba(var(--pp-primary-rgb), .07);
}
.pp-navbar .nav-link.active { font-weight: 600; }

/* Dropdown */
.pp-dropdown {
  background: var(--pp-surface);
  border: 1px solid var(--pp-border);
  border-radius: var(--pp-radius);
  box-shadow: var(--pp-shadow-lg);
  padding: .5rem;
  min-width: 230px;
}
.pp-dropdown .dropdown-item {
  border-radius: 8px; padding: .5rem .85rem;
  font-size: .875rem; font-weight: 500;
  color: var(--pp-text-2);
  display: flex; align-items: center; gap: .55rem;
}
.pp-dropdown .dropdown-item:hover {
  background: var(--pp-surface-2);
  color: var(--pp-primary);
}
.pp-dropdown .dropdown-item .fa-fw { font-size: .85rem; }
.pp-dropdown hr.dropdown-divider { border-color: var(--pp-border); margin: .4rem .5rem; }

/* Toggler mobile */
.pp-toggler {
  border: 1.5px solid var(--pp-border); border-radius: 8px;
  padding: .45rem .55rem; background: transparent;
  display: flex; flex-direction: column; gap: 5px;
}
.pp-toggler span {
  display: block; width: 22px; height: 2px;
  background: var(--pp-text); border-radius: 2px;
  transition: all var(--pp-transition);
}
.pp-toggler[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.pp-toggler[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.pp-toggler[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
.pp-toggler:focus { box-shadow: 0 0 0 3px rgba(var(--pp-primary-rgb),.15); }

/* Botão tema */
.pp-theme-btn {
  width: 36px; height: 36px; border-radius: 8px;
  background: var(--pp-surface-2);
  border: 1.5px solid var(--pp-border);
  color: var(--pp-text); font-size: .9rem;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; transition: all var(--pp-transition);
}
.pp-theme-btn:hover {
  background: rgba(var(--pp-primary-rgb),.1);
  border-color: var(--pp-primary);
  color: var(--pp-primary);
}

/* User button */
.pp-user-btn {
  display: flex; align-items: center; gap: .45rem;
  padding: .35rem .75rem; border-radius: 8px;
  background: var(--pp-surface-2);
  border: 1.5px solid var(--pp-border);
  color: var(--pp-text); font-size: .85rem; font-weight: 600;
  text-decoration: none; transition: all var(--pp-transition);
}
.pp-user-btn:hover { border-color: var(--pp-primary); color: var(--pp-primary); }
.pp-avatar { width: 26px; height: 26px; border-radius: 50%; object-fit: cover; }
.pp-user-btn .fa-circle-user { color: var(--pp-muted); }

/* Alertas dentro do main */
#ppMain > .alert { margin: 1rem auto; max-width: 900px; border-radius: var(--pp-radius); }

/* ─── HERO ───────────────────────────────────────────────── */
.pp-hero {
  position: relative; min-height: 504px;
  display: flex; align-items: center; overflow: hidden;
}
.pp-hero-bg {
  position: absolute; inset: 0; z-index: 0;
  background: #111; /* fallback só se foto não carregar */
}
[data-theme="dark"] .pp-hero-bg { background: #000; }
.pp-hero-glow {
  position: absolute; inset: 0; z-index: 1;
  background: radial-gradient(ellipse 50% 50% at 20% 70%, rgba(255,255,255,.04) 0%, transparent 50%);
}
.pp-hero-inner { position: relative; z-index: 2; color: #fff; padding: 22px 0; }
/* Garantir legibilidade do texto sobre qualquer foto */
.pp-hero h1, .pp-hero .lead, .pp-hero-label, .pp-hero-stat-num, .pp-hero-stat-lbl {
  text-shadow: 0 1px 8px rgba(0,0,0,.8), 0 2px 20px rgba(0,0,0,.6);
}
.pp-hero .btn { text-shadow: none; } /* botões não precisam */
.pp-hero-label {
  display: inline-flex; align-items: center; gap: .45rem;
  font-size: .75rem; font-weight: 700; letter-spacing: .16em;
  text-transform: uppercase; color: rgba(255,255,255,.6);
  margin-bottom: 1rem;
}
.pp-hero h1 { color: #fff; font-size: clamp(1.75rem, 4vw, 2.7rem); line-height: 1.15; margin-bottom: .5rem; }
.pp-hero h1 em { font-style: normal; color: #E0B84A; }
.pp-hero .lead { color: rgba(255,255,255,.78); font-size: 1.05rem; margin-bottom: .9rem; max-width: 520px; }
.pp-hero-stats { display: flex; gap: 2rem; margin-top: 1rem; flex-wrap: wrap; }
.pp-hero-anchor-link:hover { color: #fff; border-bottom-color: rgba(255,255,255,.8); }
.pp-hero-stat-num { font-size: 1.75rem; font-weight: 800; color: #E0B84A; line-height: 1; }
.pp-hero-stat-lbl { font-size: .72rem; text-transform: uppercase; letter-spacing: .1em; color: rgba(255,255,255,.55); margin-top: .25rem; }

/* Cards flutuantes da hero */
.pp-float-cards { display: flex; flex-direction: column; gap: .9rem; }

/* ─── FOTO HERO (desktop: metade esquerda absoluta) ──── */

/* Desktop: foto cobre a metade ESQUERDA do hero */
.pp-hero-photo {
  position: absolute;
  top: 0; left: 0; bottom: 0; right: 0;
  width: 100%;
  z-index: 1;
  overflow: hidden;
}
.pp-hero-photo-img {
  width: 100%; height: 100%;
  object-fit: cover; /* object-position: via style inline - controlado pelo admin */
}
/* Degradê direito: funde foto → fundo do hero (onde está o texto) */
.pp-hero-photo-grad-right { display: none; }
[data-theme="dark"] .pp-hero-photo-grad-right { display: none; }
/* Degradê inferior suave */
.pp-hero-photo-grad-bottom {
  display: none;
}
[data-theme="dark"] .pp-hero-photo-grad-bottom {
  display: none;
}

/* Mobile: imagem 16:10 ACIMA do texto, bloco normal */
.pp-hero-photo-mobile {
  width: 100%;
  aspect-ratio: 16 / 10;
  border-radius: 16px;
  overflow: hidden;
  margin-bottom: 1.75rem;
  box-shadow: 0 8px 32px rgba(0,0,0,.35);
}
.pp-hero-photo-mobile img {
  width: 100%; height: 100%;
  object-fit: cover; object-position: center 30%;
}
.pp-float-card {
  background: rgba(255,255,255,.1);
  backdrop-filter: blur(20px);
  border: 1px solid rgba(255,255,255,.15);
  border-radius: var(--pp-radius);
  padding: 1rem 1.25rem;
  display: flex; align-items: center; gap: .9rem;
  color: #fff; text-decoration: none;
  transition: transform var(--pp-transition), background var(--pp-transition);
}
.pp-float-card:hover { transform: translateX(5px); background: rgba(255,255,255,.17); color: #fff; }
.pp-float-card-icon {
  width: 44px; height: 44px; border-radius: 10px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center; font-size: 1.25rem;
}
.pp-float-card strong { display: block; font-size: .9rem; font-weight: 600; }
.pp-float-card span { font-size: .75rem; opacity: .65; }
.pp-float-card .fa-chevron-right { margin-left: auto; opacity: .4; font-size: .75rem; }

/* ─── SEÇÃO QUICK ACCESS ─────────────────────────────────── */
.pp-quick { background: var(--pp-surface); border-bottom: 1px solid var(--pp-border); padding: 56px 0; }
.pp-quick-card {
  display: flex; flex-direction: column; align-items: center; text-align: center;
  padding: 1.75rem 1.25rem;
  border-radius: var(--pp-radius-lg);
  border: 1.5px solid var(--pp-border);
  background: var(--pp-surface);
  text-decoration: none; color: var(--pp-text-2);
  transition: all var(--pp-transition);
}
.pp-quick-card:hover {
  border-color: var(--pp-primary);
  background: var(--pp-surface);
  box-shadow: var(--pp-shadow);
  transform: translateY(-5px);
  color: var(--pp-primary);
}
.pp-quick-icon {
  width: 60px; height: 60px; border-radius: var(--pp-radius);
  display: flex; align-items: center; justify-content: center;
  font-size: 1.6rem; margin-bottom: 1rem;
  transition: transform var(--pp-transition);
}
.pp-quick-card:hover .pp-quick-icon { transform: scale(1.08); }
.pp-quick-card h5 { font-family: 'Inter', sans-serif; font-weight: 700; font-size: .95rem; margin-bottom: .3rem; color: inherit; }
.pp-quick-card p { font-size: .8rem; color: var(--pp-muted); margin: 0; }

/* Cores dos ícones */
.pp-qi-gps  { background: rgba(196,154,42,.12); color: var(--pp-gold); }
.pp-qi-cred { background: rgba(var(--pp-primary-rgb),.1); color: var(--pp-primary); }
.pp-qi-rom  { background: rgba(44,95,138,.1); color: var(--pp-blue); }
.pp-qi-down { background: rgba(45,122,79,.1); color: var(--pp-green); }

/* ─── SEÇÃO GENÉRICA ─────────────────────────────────────── */
.pp-section { padding: 80px 0; }
.pp-section-alt { background: var(--pp-surface-2); }
.pp-section-dark {
  background: linear-gradient(135deg, #0A1F4A 0%, #1A3F7A 100%);
  color: #fff;
}
[data-theme="dark"] .pp-section-dark {
  background: linear-gradient(135deg, #1A0505 0%, #3A1010 100%);
}
.pp-section-label {
  display: inline-flex; align-items: center; gap: .4rem;
  font-size: .72rem; font-weight: 700; letter-spacing: .14em;
  text-transform: uppercase; color: var(--pp-gold);
  margin-bottom: .6rem;
}
.pp-section-dark .pp-section-label { color: rgba(255,255,255,.5); }

/* ─── CARDS GENÉRICOS ────────────────────────────────────── */
.pp-card {
  background: var(--pp-surface);
  border: 1px solid var(--pp-border);
  border-radius: var(--pp-radius);
  overflow: hidden;
  box-shadow: var(--pp-shadow-sm);
  transition: transform var(--pp-transition), box-shadow var(--pp-transition), border-color var(--pp-transition);
}
.pp-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--pp-shadow);
  border-color: var(--pp-border-2);
}
.pp-card-body { padding: 1.35rem; }
.pp-card-img { width: 100%; height: 190px; object-fit: cover; }
.pp-card-img-ph {
  width: 100%; height: 190px;
  background: linear-gradient(135deg, var(--pp-primary), var(--pp-primary-h));
  display: flex; align-items: center; justify-content: center;
  font-size: 2.5rem; color: rgba(255,255,255,.25);
}
[data-theme="dark"] .pp-card-img-ph {
  background: linear-gradient(135deg, #2A0A0A, #4A1515);
}
.pp-romaria-card-link {
  display: block; height: 100%; color: inherit; text-decoration: none;
}
.pp-romaria-card-link:hover { color: inherit; text-decoration: none; }

/* Selo discreto de tamanho ideal de imagem — visível só para administradores */
.pp-imgsize-badge {
  position: absolute; z-index: 11;
  background: rgba(0,0,0,.5); color: rgba(255,255,255,.85);
  font-size: .62rem; font-weight: 600; letter-spacing: .01em;
  padding: .18rem .5rem; border-radius: 5px;
  backdrop-filter: blur(3px);
  pointer-events: none;
  font-family: 'Inter', sans-serif;
}

/* ─── ABOUT SECTION ──────────────────────────────────────── */
.pp-about-img {
  width: 100%; aspect-ratio: 4/3;
  border-radius: var(--pp-radius-lg);
  box-shadow: var(--pp-shadow-lg);
  object-fit: cover; background: var(--pp-surface-2);
  display: flex; align-items: center; justify-content: center;
  font-size: 5rem; color: var(--pp-border-2);
}
.pp-about-badge {
  background: var(--pp-primary); color: #fff;
  border-radius: var(--pp-radius); padding: 1.1rem 1.4rem;
  text-align: center; box-shadow: var(--pp-shadow);
}
.pp-about-badge-num { font-size: 1.9rem; font-weight: 800; line-height: 1; }
.pp-about-badge-txt { font-size: .72rem; opacity: .8; margin-top: .2rem; }
.pp-feature-list { list-style: none; padding: 0; margin: 1.5rem 0; display: grid; grid-template-columns: 1fr 1fr; gap: .9rem; }
.pp-feature-list li { display: flex; align-items: flex-start; gap: .6rem; }
.pp-feature-list li i { color: var(--pp-gold); font-size: 1rem; margin-top: .15rem; flex-shrink: 0; }
.pp-feature-list li strong { display: block; font-size: .9rem; color: var(--pp-text); font-weight: 600; }
.pp-feature-list li span { font-size: .8rem; color: var(--pp-muted); }

/* ─── ROMARIAS ───────────────────────────────────────────── */
.pp-romaria-meta { font-size: .8rem; color: var(--pp-muted); display: flex; gap: 1rem; flex-wrap: wrap; margin-bottom: .6rem; }
.pp-romaria-meta i { color: var(--pp-gold); }
.pp-romaria-rota { font-size: .8rem; color: var(--pp-muted); }
.pp-badge-status { display: inline-flex; align-items: center; gap: .3rem; padding: .25rem .65rem; border-radius: 50px; font-size: .72rem; font-weight: 700; }
.pp-status-ativa    { background: #E8F5EE; color: #1A5C35; }
.pp-status-em_breve { background: #FDF4DC; color: #7A5C0A; }
.pp-status-encerrada{ background: var(--pp-surface-2); color: var(--pp-muted); }
[data-theme="dark"] .pp-status-ativa    { background: #0D2E1A; color: #5ACD8A; }
[data-theme="dark"] .pp-status-em_breve { background: #2E2000; color: #CDA030; }
[data-theme="dark"] .pp-status-encerrada{ background: var(--pp-surface-2); color: var(--pp-muted); }

/* ─── VÍDEOS ─────────────────────────────────────────────── */
.pp-video-thumb {
  position: relative; aspect-ratio: 16/9;
  overflow: hidden; background: #000; cursor: pointer;
}
.pp-video-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--pp-transition), opacity var(--pp-transition); }
.pp-video-thumb:hover img { transform: scale(1.05); opacity: .85; }
.pp-video-play {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  background: rgba(0,0,0,.25); transition: background var(--pp-transition);
}
.pp-video-thumb:hover .pp-video-play { background: rgba(0,0,0,.1); }
.pp-video-play i { font-size: 3rem; color: #fff; filter: drop-shadow(0 2px 8px rgba(0,0,0,.5)); }
.pp-video-cat { font-size: .72rem; text-transform: uppercase; letter-spacing: .1em; color: var(--pp-gold); }
.pp-video-title { font-size: .92rem; font-weight: 600; color: var(--pp-text); margin-top: .25rem; }

/* ─── DICAS ──────────────────────────────────────────────── */
.pp-dica-card {
  background: var(--pp-surface);
  border: 1.5px solid var(--pp-border);
  border-radius: var(--pp-radius);
  padding: 1.6rem;
  transition: all var(--pp-transition);
}
.pp-dica-card:hover { border-color: var(--pp-gold); box-shadow: var(--pp-shadow); transform: translateY(-3px); }
.pp-dica-icon {
  width: 50px; height: 50px; border-radius: var(--pp-radius);
  background: linear-gradient(135deg, var(--pp-gold), var(--pp-gold-h));
  color: #fff; font-size: 1.2rem;
  display: flex; align-items: center; justify-content: center; margin-bottom: .9rem;
}
.pp-dica-title { font-size: .95rem; font-weight: 700; color: var(--pp-text); font-family: 'Inter', sans-serif; margin-bottom: .4rem; }
.pp-dica-text { font-size: .85rem; color: var(--pp-muted); margin: 0; }

/* ─── TESTEMUNHOS ────────────────────────────────────────── */
.pp-test-card {
  background: rgba(255,255,255,.1);
  backdrop-filter: blur(12px);
  border: 1px solid rgba(255,255,255,.13);
  border-radius: var(--pp-radius);
  padding: 1.75rem;
}
.pp-test-quote {
  font-style: italic; color: rgba(255,255,255,.88);
  margin-bottom: 1.25rem; font-size: .95rem; line-height: 1.7;
  position: relative; padding-left: 1.2rem;
}
.pp-test-quote::before {
  content: '\201C'; position: absolute; left: -.1rem; top: -.4rem;
  font-size: 3rem; color: rgba(196,154,42,.6); line-height: 1; font-family: Georgia, serif;
}
.pp-test-author { display: flex; align-items: center; gap: .75rem; }
.pp-test-avatar {
  width: 42px; height: 42px; border-radius: 50%;
  background: rgba(255,255,255,.15);
  display: flex; align-items: center; justify-content: center;
  font-size: 1.1rem; color: rgba(255,255,255,.5); flex-shrink: 0;
  overflow: hidden;
}
.pp-test-avatar img { width: 100%; height: 100%; object-fit: cover; }
.pp-test-name { font-weight: 700; color: #fff; font-size: .9rem; }
.pp-test-route { font-size: .75rem; color: rgba(255,255,255,.55); }
.pp-stars { color: #E0B84A; font-size: .8rem; margin-top: .2rem; }

/* ─── PARCEIROS ──────────────────────────────────────────── */
.pp-parceiro {
  display: flex; align-items: center; gap: .7rem;
  padding: .9rem 1.4rem;
  border: 1.5px solid var(--pp-border);
  border-radius: var(--pp-radius);
  color: var(--pp-muted); font-size: .875rem; font-weight: 600;
  text-decoration: none; transition: all var(--pp-transition);
}
.pp-parceiro:hover { border-color: var(--pp-primary); color: var(--pp-primary); box-shadow: var(--pp-shadow-sm); }

/* ─── CTA ────────────────────────────────────────────────── */
.pp-cta { background: var(--pp-surface-2); padding: 96px 0; text-align: center; }
.pp-cta h2 { font-size: clamp(1.6rem,4vw,2.2rem); margin-bottom: 1rem; }
.pp-cta p { color: var(--pp-muted); font-size: 1.05rem; max-width: 500px; margin: 0 auto 2rem; }

/* ─── MODAL YOUTUBE ──────────────────────────────────────── */
#ppVideoModal { display: none; position: fixed; inset: 0; z-index: 9999;
  background: rgba(0,0,0,.88); align-items: center; justify-content: center; }
#ppVideoModal.open { display: flex; }
.pp-modal-inner { position: relative; width: min(900px,95vw); aspect-ratio: 16/9; }
.pp-modal-inner iframe { width: 100%; height: 100%; border: none; border-radius: var(--pp-radius); }
.pp-modal-close {
  position: absolute; top: -44px; right: 0;
  background: none; border: none; color: #fff; font-size: 1.5rem; cursor: pointer; opacity: .7; transition: opacity var(--pp-transition);
}
.pp-modal-close:hover { opacity: 1; }

/* ─── FOOTER ─────────────────────────────────────────────── */
.pp-footer { background: #0F0D0C; border-top: 1px solid rgba(255,255,255,.05); }
[data-theme="dark"] .pp-footer { background: #080706; }
.pp-footer-text { font-size: .875rem; color: rgba(255,255,255,.5); line-height: 1.7; }
.pp-footer-heading { font-size: .72rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: rgba(255,255,255,.3); margin-bottom: 1rem; font-family: 'Inter', sans-serif; }
.pp-footer-links { list-style: none; padding: 0; margin: 0; }
.pp-footer-links li + li { margin-top: .5rem; }
.pp-footer-links a { font-size: .875rem; color: rgba(255,255,255,.55); text-decoration: none; transition: color var(--pp-transition); }
.pp-footer-links a:hover { color: #fff; }
.pp-footer-contact { list-style: none; padding: 0; margin: 0; }
.pp-footer-contact li { display: flex; align-items: flex-start; gap: .6rem; font-size: .875rem; color: rgba(255,255,255,.5); margin-bottom: .65rem; }
.pp-footer-contact a { color: rgba(255,255,255,.6); text-decoration: none; }
.pp-footer-contact a:hover { color: #fff; }
.pp-contact-icon { color: var(--pp-gold); flex-shrink: 0; margin-top: .1rem; }
.pp-social { width: 36px; height: 36px; border-radius: 8px; background: rgba(255,255,255,.07); color: rgba(255,255,255,.55); display: flex; align-items: center; justify-content: center; font-size: .9rem; text-decoration: none; transition: all var(--pp-transition); }
.pp-social:hover { background: var(--pp-primary); color: #fff; }
.pp-footer-bottom { border-top: 1px solid rgba(255,255,255,.06); color: rgba(255,255,255,.3); }
.pp-footer-link-sm { font-size: .8rem; color: rgba(255,255,255,.35); text-decoration: none; transition: color var(--pp-transition); }
.pp-footer-link-sm:hover { color: rgba(255,255,255,.7); }
.pp-footer-brand:hover .pp-footer-name { color: #fff; }

/* ─── BACK TO TOP ────────────────────────────────────────── */
.pp-back-top {
  position: fixed; bottom: 24px; right: 24px; z-index: 800;
  width: 42px; height: 42px; border-radius: 10px;
  background: var(--pp-primary); color: #fff; border: none;
  display: flex; align-items: center; justify-content: center;
  font-size: .9rem; box-shadow: var(--pp-shadow);
  opacity: 0; pointer-events: none; transform: translateY(12px);
  transition: all var(--pp-transition);
}
.pp-back-top.show { opacity: 1; pointer-events: auto; transform: translateY(0); }
.pp-back-top:hover { background: var(--pp-primary-h); transform: translateY(-2px); }

/* ─── ALERTAS ────────────────────────────────────────────── */
.alert {
  border-radius: var(--pp-radius) !important;
  border: none !important;
  font-size: .9rem;
  display: flex; align-items: flex-start; gap: .65rem;
}
.alert-success { background: #E8F5EE; color: #1A5C35; border-left: 4px solid var(--pp-green) !important; }
.alert-danger  { background: #EBF0FB; color: #1A3F7A; border-left: 4px solid var(--pp-primary) !important; }
.alert-warning { background: #FDF4DC; color: #7A5C0A; border-left: 4px solid var(--pp-gold) !important; }
.alert-info    { background: #E8F0F8; color: #1A3F6B; border-left: 4px solid var(--pp-blue) !important; }
[data-theme="dark"] .alert-success { background: #0D2E1A; color: #5ACD8A; }
[data-theme="dark"] .alert-danger  { background: #2A0A0A; color: #F08080; }
[data-theme="dark"] .alert-warning { background: #2E2000; color: #CDA030; }
[data-theme="dark"] .alert-info    { background: #0A1A2E; color: #6AABDF; }

/* ─── FORMULÁRIOS ────────────────────────────────────────── */
.form-control, .form-select {
  background: var(--pp-surface) !important;
  border-color: var(--pp-border) !important;
  color: var(--pp-text) !important;
  border-radius: var(--pp-radius) !important;
  padding: .65rem 1rem !important;
}
.form-control:focus, .form-select:focus {
  border-color: var(--pp-primary) !important;
  box-shadow: 0 0 0 3px rgba(var(--pp-primary-rgb),.12) !important;
}
.form-control::placeholder { color: var(--pp-muted) !important; }
.form-label { font-weight: 600; font-size: .875rem; color: var(--pp-text); margin-bottom: .4rem; }

/* ─── AUTH PAGES ─────────────────────────────────────────── */
.pp-auth { min-height: 100vh; display: grid; grid-template-columns: 1fr 1fr; }
.pp-auth-left {
  background: linear-gradient(145deg, #0A1F4A 0%, #1A3F7A 55%, #2755A8 100%);
  position: relative; overflow: hidden;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 60px 48px; color: #fff;
}
.pp-auth-left::after {
  content: ''; position: absolute; inset: 0;
  background: radial-gradient(ellipse at 70% 30%, rgba(196,154,42,.15), transparent 60%);
}
.pp-auth-left > * { position: relative; z-index: 1; }
.pp-auth-left h2 { color: #fff; }
.pp-auth-features { margin-top: 2rem; display: flex; flex-direction: column; gap: .85rem; }
.pp-auth-features li { display: flex; align-items: center; gap: .7rem; font-size: .9rem; color: rgba(255,255,255,.8); }
.pp-auth-features li i { color: #E0B84A; font-size: .95rem; }
.pp-auth-right { display: flex; align-items: center; justify-content: center; padding: 48px 40px; background: var(--pp-bg); }
.pp-auth-box { width: 100%; max-width: 420px; }

/* ─── PAGE BANNER ────────────────────────────────────────── */
.pp-page-banner {
  background: linear-gradient(135deg, #0A1F4A, #1A3F7A);
  color: #fff; padding: 56px 0;
}
[data-theme="dark"] .pp-page-banner { background: linear-gradient(135deg, #1A0505, #3A1010); }
.pp-page-banner h1 { color: #fff; }
.pp-page-banner p { color: rgba(255,255,255,.72); }
.pp-breadcrumb { font-size: .8rem; color: rgba(255,255,255,.5); margin-bottom: .6rem; }
.pp-breadcrumb a { color: rgba(255,255,255,.65); text-decoration: none; }
.pp-breadcrumb a:hover { color: #fff; }
.pp-breadcrumb .sep { margin: 0 .4rem; opacity: .4; }

/* ─── ANIMAÇÕES ──────────────────────────────────────────── */
[data-aos] { opacity: 0; transform: translateY(24px); transition: opacity .65s ease, transform .65s ease; }
[data-aos].aos-in { opacity: 1; transform: translateY(0); }
[data-aos][data-aos-delay="100"].aos-in { transition-delay: .1s; }
[data-aos][data-aos-delay="200"].aos-in { transition-delay: .2s; }
[data-aos][data-aos-delay="300"].aos-in { transition-delay: .3s; }
[data-aos][data-aos-delay="400"].aos-in { transition-delay: .4s; }
[data-aos][data-aos-delay="500"].aos-in { transition-delay: .5s; }

/* ─── LOADING / SPINNER ──────────────────────────────────── */
.pp-spinner { width: 36px; height: 36px; border: 3px solid var(--pp-border); border-top-color: var(--pp-primary); border-radius: 50%; animation: spin .7s linear infinite; margin: 2rem auto; }
@keyframes spin { to { transform: rotate(360deg); } }

/* ─── EMPTY STATE ────────────────────────────────────────── */
.pp-empty { text-align: center; padding: 60px 20px; color: var(--pp-muted); }
.pp-empty i { font-size: 3rem; display: block; margin-bottom: 1rem; opacity: .3; }

/* ─── RESPONSIVO ─────────────────────────────────────────── */
@media (max-width: 991px) {
  :root { --pp-nav-h: 62px; }
  .pp-navbar .navbar-collapse {
    background: var(--pp-surface);
    border: 1px solid var(--pp-border);
    border-radius: var(--pp-radius);
    padding: 1rem;
    margin-top: .5rem;
    box-shadow: var(--pp-shadow-lg);
  }
  .pp-navbar .nav-link { padding: .65rem .75rem !important; }
  .pp-dropdown { box-shadow: none; border: none; padding-left: 1rem; }
  .pp-hero-inner { padding: 60px 0; }
  .pp-float-cards { display: none; }
}

@media (max-width: 767px) {
  .pp-section { padding: 60px 0; }
  .pp-hero h1 { font-size: 1.9rem; }
  .pp-hero-stats { gap: 1.5rem; }
  .pp-auth { grid-template-columns: 1fr; }
  .pp-auth-left { display: none; }
  .pp-auth-right { padding: 40px 24px; }
  .pp-feature-list { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  [data-aos] { transition: none; }
  * { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* ── Mobile: garantir brand inline em qualquer tela ── */
@media (max-width: 991px) {
  .navbar .navbar-brand.pp-brand {
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
  }
  .pp-brand-icon { width: 36px; height: 36px; font-size: 1.05rem; flex-shrink: 0; }
  .pp-brand-texts { display: block; min-width: 0; }
  .pp-brand-name { max-width: 145px; font-size: .88rem; }
  .pp-brand-sub  { display: none !important; }
}
@media (max-width: 380px) {
  .pp-brand-name { max-width: 120px; font-size: .82rem; }
}

/* ═══════════════════════════════════════════════════════
   LANDING SECTIONS — Suporte claro/escuro
   ═══════════════════════════════════════════════════════ */

/* Seção "Como é hoje" */
.ls-problems-section { background: var(--pp-surface); }
.ls-section-title    { color: var(--pp-text); }
.ls-label            { color: var(--pp-muted); }

/* Seção "A Plataforma" */
.ls-tabs-section    { background: var(--pp-surface-2); }
.ls-tab-pills-wrap  { background: var(--pp-surface); }
.ls-tab-title       { color: var(--pp-text); }
.ls-tab-desc        { color: var(--pp-muted); }
.ls-feature-item    { color: var(--pp-text-2); }

/* Ícone check das features */
.ls-feature-item .fa-check { color: var(--pp-primary); }

/* Botão CTA das tabs — adapta ao tema */
a[style*="background:#0F2040"] {
  background: var(--pp-primary) !important;
  color: #fff !important;
}

/* Pill ativo — adapta ao tema escuro */
[data-theme="dark"] #pill-org,
[data-theme="dark"] #pill-rom.active-pill {
  background: var(--pp-primary) !important;
}

/* Pills inativos */
[data-theme="dark"] #pill-org:not([style*="background:#0F2040"]),
[data-theme="dark"] #pill-rom:not([style*="background:#0F2040"]) {
  color: var(--pp-text-2) !important;
}

/* Imagem placeholder nas abas */
.ls-tab-img-empty {
  border: 2.5px dashed var(--pp-border);
  border-radius: 14px;
  min-height: 360px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--pp-surface);
}