nav{
  position:fixed; top:0; left:0; right:0; z-index:50;
  display:flex; align-items:center; justify-content:space-between;
  padding:20px clamp(20px,5vw,64px);
  backdrop-filter:blur(10px);
  background:linear-gradient(to bottom, rgba(5,8,16,0.85), rgba(5,8,16,0));
}
.mark{ display:flex; align-items:center; gap:12px; }
.mark img.symbol{ height:34px; width:auto; }
.mark img.wordmark{ height:16px; width:auto; margin-top:2px; }

.navlinks{ display:flex; gap:34px; font-size:0.92rem; color:#C7CEDC; }
.navlinks a{ position:relative; padding-bottom:4px; }
.navlinks a.active{ color:var(--ink); }
.navlinks a.active::after{ content:''; position:absolute; left:0; right:0; bottom:-2px; height:2px; background:var(--grad-primary); }

.nav-right{ display:flex; align-items:center; gap:16px; }
.langtoggle{
  display:flex; align-items:center; background:var(--panel); border:1px solid var(--line);
  border-radius:20px; padding:3px; font-family:'IBM Plex Mono', monospace; font-size:0.7rem; letter-spacing:0.05em;
}
.langtoggle button{ padding:6px 12px; border-radius:16px; color:var(--muted); background:none; border:none; font:inherit; }
.langtoggle button.on{ background:var(--grad-primary); color:#fff; }

@media (max-width:820px){
  .navlinks{ display:none; }
  .nav-right .langtoggle{ display:none; }
}

/* ---------- mobile hamburger ---------- */
.nav-toggle{
  display:none; flex-direction:column; justify-content:center; gap:5px;
  width:38px; height:38px; background:none; border:none; padding:0; flex-shrink:0;
}
.nav-toggle span{ display:block; width:100%; height:2px; background:var(--ink); border-radius:2px; transition:transform .25s ease, opacity .25s ease; }
.nav-toggle[aria-expanded="true"] span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.nav-toggle[aria-expanded="true"] span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

@media (max-width:820px){
  .nav-toggle{ display:flex; }
}

/* ---------- mobile drawer ---------- */
.mobile-menu{
  position:fixed; top:0; right:0; z-index:49; height:100vh; width:min(78vw,320px);
  background:var(--deep); border-left:1px solid var(--line);
  padding:100px 28px 40px; display:flex; flex-direction:column; gap:26px;
  transform:translateX(100%); transition:transform .3s ease;
  overflow-y:auto;
}
.mobile-menu.open{ transform:translateX(0); }
.mobile-menu a{ font-size:1.05rem; color:#C7CEDC; }
.mobile-menu a.active{ color:var(--ink); }
.mobile-menu .langtoggle{ align-self:flex-start; }

.nav-scrim{
  position:fixed; inset:0; z-index:48; background:rgba(5,8,16,0.6);
  opacity:0; pointer-events:none; transition:opacity .3s ease;
}
.nav-scrim.open{ opacity:1; pointer-events:auto; }

@media (min-width:821px){
  .mobile-menu, .nav-scrim{ display:none; }
}