.nav {
  position:fixed; top:0; left:0; right:0; z-index:600;
  height:64px;
  display:flex; align-items:center; justify-content:space-between;
  padding:0 var(--pad);
  transition:height .4s var(--ease), background .4s var(--ease), border-color .4s var(--ease);
  border-bottom:1px solid transparent;
}

/* Sobre o hero escuro: elementos brancos */
.nav-logo {
  font-family:var(--fm); font-size:15px; letter-spacing:.22em;
  color:#fff; text-transform:uppercase;
  transition:color .4s var(--ease), opacity .2s; line-height:1; flex-shrink:0;
}
.nav-logo:hover { opacity:.55 }
.nav-r { display:flex; align-items:center; gap:28px }
.nav-links { display:flex; gap:24px; list-style:none }
.nav-links a {
  font-family:var(--fm); font-size:10px; letter-spacing:.1em; text-transform:uppercase;
  color:rgba(255,255,255,.52); transition:color .4s var(--ease);
  position:relative;
}
.nav-links a::after {
  content:''; position:absolute; bottom:-3px; left:0; right:100%;
  height:1px; background:currentColor;
  transition:right .35s var(--ease);
}
.nav-links a:hover::after,
.nav-links a.active::after { right:0 }
.nav-links a:hover,
.nav-links a.active { color:#fff }
.nav.on .nav-links a.active { color:var(--ink) }
/* Scrolled: fundo claro, elementos escuros */
.nav.on {
  height:56px;
  background:rgba(245,243,238,.92);
  backdrop-filter:blur(20px) saturate(1.5);
  -webkit-backdrop-filter:blur(20px) saturate(1.5);
  border-color:var(--rule);
}
.nav.on .nav-logo { color:var(--ink) }
.nav.on .nav-links a { color:var(--gray2) }
.nav.on .nav-links a:hover { color:var(--ink) }

/* Menu aberto: força fundo claro mesmo no topo */
.nav.menu-open {
  background:var(--off) !important;
  border-color:var(--rule) !important;
}
.nav.menu-open .nav-logo { color:var(--ink) }
.nav.menu-open .nav-burger { color:var(--ink) }

/* Burger — Δ → hamburger → ✕ */
.nav-burger {
  display:none;
  position:relative; width:44px; height:44px;
  align-items:center; justify-content:center;
  cursor:pointer; flex-shrink:0;
  background:transparent; border:none;
  color:#fff;
  transition:color .4s var(--ease);
  -webkit-tap-highlight-color:transparent;
}
.nav.on .nav-burger         { color:var(--ink) }
.nav.menu-open .nav-burger  { color:var(--ink) }
.nav-burger svg {
  position:absolute; width:28px; height:28px;
  top:50%; left:50%;
  transform-origin:center;
  transition:opacity 380ms var(--ease), transform 380ms var(--ease);
  pointer-events:none;
}

/* ── topo: Δ visível, hamburger oculto, X oculto ── */
.nav-burger .burger-delta {
  opacity:1;
  transform:translate(-50%,-50%) scale(1) rotate(0deg);
}
.nav-burger .burger-ham {
  opacity:0;
  transform:translate(-50%,-50%) scale(.82) rotate(-10deg);
}
.nav-burger .burger-close {
  opacity:0;
  transform:translate(-50%,-50%) scale(.75) rotate(45deg);
}

/* ── scrolled (menu fechado): hamburger visível, Δ oculto ── */
.nav.on:not(.menu-open) .nav-burger .burger-delta {
  opacity:0;
  transform:translate(-50%,-50%) scale(.82) rotate(10deg);
}
.nav.on:not(.menu-open) .nav-burger .burger-ham {
  opacity:1;
  transform:translate(-50%,-50%) scale(1) rotate(0deg);
}

/* ── menu aberto: X visível, Δ e hamburger ocultos ── */
.nav.menu-open .nav-burger .burger-delta,
.nav.menu-open .nav-burger .burger-ham {
  opacity:0;
  transform:translate(-50%,-50%) scale(.75);
}
.nav.menu-open .nav-burger .burger-close {
  opacity:1;
  transform:translate(-50%,-50%) scale(1) rotate(0deg);
}

.nav-burger:focus-visible {
  outline:1px solid currentColor; outline-offset:4px; border-radius:999px;
}

/* Menu mobile overlay */
.nav-mobile {
  position:fixed; inset:0; z-index:590;
  background:var(--off);
  display:flex; flex-direction:column; justify-content:center;
  padding:80px var(--pad) 48px;
  opacity:0; pointer-events:none;
  transition:opacity .35s var(--ease);
}
.nav-mobile.open { opacity:1; pointer-events:all }

.nav-mobile-links { list-style:none; display:flex; flex-direction:column; gap:2px; margin-bottom:48px }
.nav-mobile-links a {
  font-family:var(--fd); font-optical-sizing:auto;
  font-size:clamp(28px,7vw,48px); font-weight:300;
  color:var(--ink); letter-spacing:-.02em; line-height:1.15;
  display:block; padding:8px 0;
  opacity:0; transform:translateY(10px);
  transition:opacity .3s var(--ease), transform .3s var(--ease), color .2s;
}
.nav-mobile.open .nav-mobile-links a { opacity:1; transform:translateY(0) }
.nav-mobile-links li:nth-child(1) a { transition-delay:.06s }
.nav-mobile-links li:nth-child(2) a { transition-delay:.10s }
.nav-mobile-links li:nth-child(3) a { transition-delay:.14s }
.nav-mobile-links li:nth-child(4) a { transition-delay:.18s }
.nav-mobile-links li:nth-child(5) a { transition-delay:.22s }
.nav-mobile-links li:nth-child(6) a { transition-delay:.26s }
.nav-mobile-links li:nth-child(7) a { transition-delay:.30s }
.nav-mobile-links li:nth-child(8) a { transition-delay:.34s }
.nav-mobile-links a:hover { color:var(--gray2) }
.nav-mobile-links a.active { color:var(--gray2) }

.nav-mobile-cta {
  width:fit-content;
  opacity:0; transform:translateY(6px);
  transition:opacity .3s var(--ease) .38s, transform .3s var(--ease) .38s;
}
.nav-mobile.open .nav-mobile-cta { opacity:1; transform:translateY(0) }

/* Oculta links/cta no mobile — mostra hamburger */
@media (max-width:768px) {
  .nav-links { display:none }
  .nav-burger { display:flex }
}
