/* =====================================================================
   cabecalho.css — cabeçalho padrão do site.

   Visualmente idêntico ao que foi aprovado na home. Diferenças de
   construção, todas deliberadas:

   1. Tudo vive sob .site-cab. A versão da home usava os seletores
      genéricos "header" e ".brand", que aqui atingiriam os cabeçalhos
      que /local e /manual já têm na abertura de cada página.

   2. Nada depende do reset de cada página. A home zera margens e tira
      o sublinhado dos links globalmente; as outras páginas não. Então
      o próprio cabeçalho zera o que precisa.

   3. Cores e curva de movimento são variáveis próprias (--cab-*), para
      não herdar nem sobrescrever as de cada página.

   4. z-index 40, não 100. Precisa ficar acima da fita marcadora do
      /manual (15) e abaixo do véu escuro que abre o painel de cada
      presente em /presentes (90). Com 100, o cabeçalho ficaria aceso
      e clicável por cima do véu enquanto o painel estivesse aberto.

   Não é fixo nem flutuante: rola junto com a página (decisão do site).
   ===================================================================== */

.site-cab{
  --cab-marfim:#F3EFE8;
  --cab-tinta:#2E3327;
  --cab-dourado:#7D6231;
  --cab-curva:cubic-bezier(.22,.61,.36,1);

  position:relative;z-index:40;
  display:grid;grid-template-columns:auto 1fr;align-items:center;gap:14px;
  margin:0;
  padding:16px clamp(18px,4vw,44px);
  background:var(--cab-marfim);
  box-shadow:0 1px 0 rgba(46,51,39,.1);
  box-sizing:border-box;
  -webkit-font-smoothing:antialiased;
}
.site-cab *,
.site-cab *::before,
.site-cab *::after{box-sizing:border-box}

.site-cab a{color:inherit;text-decoration:none}

.site-cab__marca{display:flex;align-items:center;gap:10px;color:var(--cab-tinta)}
.site-cab__marca img{display:block;width:28px;height:28px;object-fit:contain;margin:0}
.site-cab__marca span{
  font-family:'Fraunces',Georgia,serif;font-weight:500;font-size:.95rem;
  line-height:1.2;white-space:nowrap;letter-spacing:0;
}

.site-cab__nav{
  /* Centralização segura: justify-content fica no início e as margens
     automáticas das pontas (abaixo) fazem a centralização. Quando a linha
     cabe, ela fica no centro; quando não cabe, as margens se anulam e a
     rolagem horizontal começa pelo "Início" — com justify-content:center,
     o primeiro link ficaria cortado à esquerda e inalcançável. */
  display:flex;flex-wrap:nowrap;justify-content:flex-start;align-items:center;
  gap:clamp(12px,2vw,28px);
  margin:0;padding:0;
  overflow-x:auto;-webkit-overflow-scrolling:touch;
  scrollbar-width:none;-ms-overflow-style:none;
}
.site-cab__nav::-webkit-scrollbar{display:none}
.site-cab__nav a:first-child{margin-left:auto}
.site-cab__nav a:last-child{margin-right:auto}

.site-cab__nav a{
  flex:0 0 auto;position:relative;
  padding-bottom:3px;
  font-family:'Spectral',Georgia,serif;font-size:.78rem;font-weight:400;
  line-height:1.4;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;
  color:var(--cab-tinta);opacity:.85;
  transition:opacity .3s,transform .25s var(--cab-curva);
}
.site-cab__nav a::after{
  content:'';position:absolute;left:0;bottom:0;width:0;height:1px;
  background:var(--cab-dourado);transition:width .35s var(--cab-curva);
}
.site-cab__nav a:hover{opacity:1}
.site-cab__nav a:hover::after{width:100%}
.site-cab a:focus-visible{outline:2px solid var(--cab-dourado);outline-offset:3px}

@media (max-width:680px){
  .site-cab{grid-template-columns:1fr;justify-items:center;gap:10px;padding:14px}
  /* O espaço entre os itens encolhe com a tela (13px → 6px) para a linha
     caber nos celulares comuns com ~10px de folga — em 375 e 390px ela passava da borda e o
     "Presença" ficava cortado. A letra mantém o tamanho: legibilidade primeiro.
     Os números vêm da medição da linha em Spectral (≈299px de texto). */
  .site-cab__nav{width:100%;gap:clamp(6px,calc((100vw - 355px) / 5),13px)}
  .site-cab__nav a{font-size:.68rem;letter-spacing:.03em}
}
/* Ajuste herdado da home: em telas até 600px o respiro lateral sobe
   de 14px para 18px. */
@media (max-width:600px){
  .site-cab{padding:14px 18px}
}
@media (max-width:360px){
  .site-cab__nav{gap:clamp(5px,calc((100vw - 328px) / 5),10px)}
  .site-cab__nav a{font-size:.62rem}
}
