/* =====================================================================
   CONTEUDO.CSS — a camada de conteúdo do site
   ---------------------------------------------------------------------
   Só as páginas de conteúdo carregam este arquivo. As páginas de
   anúncio (Plano de Voo, Caixa Preta, Raio X, Diagnóstico) continuam
   sem menu de propósito: quem chega nelas veio de um clique pago, e
   cada link no topo é uma porta de saída antes da conversão.

   Aqui é o contrário. Quem chega veio de uma busca ou de uma IA, sem
   custo, e precisa de caminho para explorar o resto.
   ===================================================================== */

.nav-conteudo{
  position: sticky; top: 0; z-index: 50;
  background: rgba(5, 8, 15, .82);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--line-soft);
}

.nav-conteudo .wrap{
  display: flex; align-items: center; gap: 18px;
  min-height: 62px;
  padding-top: 10px; padding-bottom: 10px;
}

/* O logo não encolhe nem quebra quando os links disputam espaço */
.nav-conteudo .logo{ flex-shrink: 0; }

/* A navegação ocupa o espaço do meio e a lista rola na horizontal
   quando não cabe. O `min-width:0` é o que permite o encolhimento —
   sem ele o flex respeita o conteúdo e empurra o botão para fora. */
.nav-conteudo nav{
  flex: 1 1 auto; min-width: 0;
  display: flex; justify-content: flex-end;
}

.nav-links{
  display: flex; align-items: center; gap: 4px;
  list-style: none; padding: 0;
  overflow-x: auto;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.nav-links::-webkit-scrollbar{ display: none; }

.nav-links a{
  display: block; white-space: nowrap;
  padding: 8px 13px; border-radius: 8px;
  font-size: .88rem; color: var(--text-2);
  transition: color .2s, background .2s;
}
.nav-links a:hover{ color: var(--text); background: rgba(255,255,255,.05); }

/* A página em que o leitor está fica marcada — orienta a pessoa e
   diz ao leitor de tela onde ele está. */
.nav-links a[aria-current="page"]{
  color: var(--gold);
  background: rgba(216,196,140,.09);
}

/* Fora da lista que rola, e sem encolher: o convite para o Raio X é o
   destino de toda a camada de conteúdo e não pode ficar cortado. */
.nav-cta{
  flex: 0 0 auto;
  white-space: nowrap;
  padding: 9px 18px;
  border-radius: 100px;
  border: 1px solid rgba(216,196,140,.4);
  color: var(--gold);
  font-size: .88rem; font-weight: 500;
  transition: background .2s;
}
.nav-cta:hover{ background: rgba(216,196,140,.12); }

@media (max-width: 900px){
  .nav-conteudo .wrap{ gap: 10px; }
  .nav-links{ gap: 2px; }
  .nav-links a{ padding: 8px 9px; font-size: .82rem; }
  .nav-cta{ padding: 8px 14px; font-size: .82rem; }
  /* No celular o nome longo da marca some e fica só o selo PV,
     liberando a largura para os links. */
  .nav-conteudo .logo-text{ display: none; }
}

/* As páginas de conteúdo têm menu fixo no topo, então precisam de
   menos respiro do que as landing pages, que não têm. */
.nav-conteudo + .article{ padding-top: clamp(48px, 7vw, 72px); }