/* nav.css — header padrão do site: cartão "à mão" sticky, largura da row.
   Mesma técnica dos cards: papel + borda + sombra no ::before (nada vaza).
   Nav centralizada; troca de idioma ancorada à direita; mobile colapsa
   atrás do botão "Menu" (JS mínimo no header.php). */
.site-header {
    position: sticky;
    top: var(--space-3);
    z-index: 10;
    width: min(100% - 2 * var(--space-3), 72rem);
    margin: var(--space-3) auto 0;
    padding: var(--space-3) var(--space-6);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
}
.site-header::before {
    content: "";
    position: absolute;
    inset: 0;
    background: var(--paper-box);
    border: var(--border-w) solid var(--line);
    border-radius: 10px 26px 12px 30px / 28px 12px 24px 10px;
    box-shadow: 3px 4px 0 rgba(58, 56, 47, 0.18);
    filter: url(#rough-2);
    pointer-events: none;
}
.site-header > * { position: relative; }

.site-nav ul {
    list-style: none;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--space-3);
}

.site-nav a {
    font-family: var(--font-sans);
    font-weight: 700;
    color: var(--muted);
    text-decoration: none;
}
.site-nav a:hover, .site-nav a:focus-visible { color: var(--ink); }

/* Troca de idioma: canto direito do header, fora do fluxo centralizado.
   PT→EN: bandeira UK doodle; EN→PT: texto "PT" (sem bandeira BR ainda). */
.lang-switch {
    position: absolute;
    right: var(--space-3);
    top: 50%;
    translate: 0 -50%;
}

/* Botão do menu mobile (só existe visualmente < 40rem, e só com JS) */
.site-header__toggle {
    display: none;
    font-family: var(--font-sans);
    font-weight: 700;
    font-size: 1rem;
    color: var(--ink);
    background: none;
    border: 0;
    padding: var(--space-1) var(--space-2);
    cursor: pointer;
}

@media (max-width: 39.9999rem) {
    .site-header__toggle:not([hidden]) { display: inline-block; }
    .site-header__toggle[aria-expanded="false"] ~ .site-nav { display: none; }
}
