/* ═══════════════════════════════════════════════════════════════════════
   CANONICAL NAV — single source of truth for the site menu (2026-07-05).
   Loaded LAST on every page; !important so page-local nav styles can't
   fork the design again. Values copied from the Trade page reference.
   One burger breakpoint (900px) for every page family.
   ═══════════════════════════════════════════════════════════════════════ */

nav.nav{
  position:sticky !important;top:0 !important;z-index:50 !important;
  background:rgba(8,9,11,.55) !important;
  backdrop-filter:blur(18px) saturate(140%) !important;
  -webkit-backdrop-filter:blur(18px) saturate(140%) !important;
  border-bottom:1px solid rgba(255,255,255,.09) !important;
}
nav.nav .nav-inner{
  max-width:1320px !important;margin:0 auto !important;
  padding:14px 28px !important;
  display:flex !important;align-items:center !important;gap:36px !important;
  justify-content:flex-start !important;
}
nav.nav .brand{display:flex !important;flex-direction:column !important;line-height:1 !important;text-decoration:none !important}
nav.nav .brand-name{
  font-family:'Inter',-apple-system,sans-serif !important;
  font-weight:600 !important;font-size:15px !important;letter-spacing:.18em !important;
  color:#fff !important;text-transform:none !important;
}
nav.nav .brand-name b{color:#1652F0 !important;font-weight:600 !important}
nav.nav .brand-tag{display:none !important}

nav.nav .nav-links{
  display:flex !important;gap:28px !important;
  font-family:'Inter',-apple-system,sans-serif !important;
  font-size:12.5px !important;font-weight:450 !important;letter-spacing:.01em !important;
  color:rgba(255,255,255,.72) !important;text-transform:none !important;
}
nav.nav .nav-links a{
  color:rgba(255,255,255,.72) !important;text-decoration:none !important;
  font-size:12.5px !important;font-weight:450 !important;letter-spacing:.01em !important;
  padding:0 !important;border:none !important;background:none !important;
  transition:color .15s !important;
}
nav.nav .nav-links a:hover{color:#fff !important}
nav.nav .nav-links a.active{color:#fff !important}

/* pushes CTA to the right on pages that have .nav-spacer; harmless otherwise */
nav.nav .nav-spacer{flex:1 !important}
/* pages without a spacer: last flex child pushed right via margin */
nav.nav .nav-cta{
  margin-left:auto !important;
  display:inline-flex !important;align-items:center !important;gap:8px !important;
  padding:9px 16px !important;
  font-family:'JetBrains Mono',ui-monospace,monospace !important;
  font-size:11px !important;letter-spacing:.08em !important;text-transform:uppercase !important;font-weight:600 !important;
  background:linear-gradient(180deg,#1652F0,#0a3ec0) !important;color:#fff !important;
  border:1px solid #1652F0 !important;border-radius:0 !important;text-decoration:none !important;
  transition:all .18s !important;
}
nav.nav .nav-cta:hover{background:linear-gradient(180deg,#3870ff,#1652F0) !important;box-shadow:0 0 20px rgba(22,82,240,.35) !important}
/* if a page has both spacer and cta, margin-left:auto is redundant but harmless */

/* burger hidden on desktop */
nav.nav .nav-burger{display:none !important}

/* ── MOBILE: one breakpoint for the whole site ── */
@media(max-width:900px){
  nav.nav .nav-burger{
    display:flex !important;flex-direction:column !important;justify-content:center !important;align-items:center !important;
    gap:5px !important;width:36px !important;height:36px !important;
    background:transparent !important;border:1px solid rgba(255,255,255,.16) !important;
    cursor:pointer !important;padding:0 !important;order:99 !important;margin-left:auto !important;
  }
  nav.nav .nav-cta{margin-left:0 !important}
  nav.nav .nav-burger span{display:block !important;width:18px !important;height:1.5px !important;background:#fff !important;transition:transform .25s,opacity .2s !important}
  body.nav-open nav.nav .nav-burger span:nth-child(1){transform:translateY(6.5px) rotate(45deg) !important}
  body.nav-open nav.nav .nav-burger span:nth-child(2){opacity:0 !important}
  body.nav-open nav.nav .nav-burger span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg) !important}

  nav.nav .nav-inner{padding:12px 16px !important;gap:14px !important}

  nav.nav .nav-links{
    position:fixed !important;left:0 !important;right:0 !important;top:60px !important;
    flex-direction:column !important;align-items:stretch !important;gap:0 !important;
    background:rgba(5,6,8,.97) !important;
    backdrop-filter:blur(20px) saturate(140%) !important;
    -webkit-backdrop-filter:blur(20px) saturate(140%) !important;
    border-bottom:1px solid rgba(255,255,255,.09) !important;
    padding:12px 16px 24px !important;
    transform:translateY(-120%) !important;
    transition:transform .28s cubic-bezier(.4,0,.2,1) !important;
    z-index:49 !important;max-height:calc(100vh - 60px) !important;overflow-y:auto !important;
  }
  body.nav-open nav.nav .nav-links{transform:translateY(0) !important}
  body.nav-open{overflow:hidden !important}
  nav.nav .nav-links a{
    padding:15px 8px !important;border-bottom:1px solid rgba(255,255,255,.06) !important;
    font-size:15px !important;letter-spacing:.02em !important;
    display:flex !important;align-items:center !important;justify-content:space-between !important;
  }
  nav.nav .nav-links a::after{content:'→';color:rgba(255,255,255,.4);font-family:'JetBrains Mono',monospace;font-size:14px}
  nav.nav .nav-links a:last-child{border-bottom:none !important}
}
