/* ============================================================
   Global site navigation — shared by every page on the site.
   Injected by nav.js so adding a new page never requires
   touching markup on the existing pages.
   ============================================================ */
.site-nav{
  position:sticky; top:0; z-index:200;
  background:rgba(7,9,15,0.92);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(224,228,240,0.14);
  font-family:'Inter',sans-serif;
}
.site-nav-wrap{
  max-width:1180px; margin:0 auto; padding:0 32px;
  display:flex; align-items:center; justify-content:space-between; height:64px; gap:24px;
}
.site-brand{ display:flex; align-items:center; gap:10px; flex-shrink:0; }
.site-brand-mark{ width:20px; height:20px; flex-shrink:0; display:block; }
.site-brand-name{ font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:14px; color:#F3F5FA; letter-spacing:-0.01em; }

.site-navlinks{ display:flex; align-items:center; gap:22px; }
.site-navlinks > a,
.site-navdrop > button{
  font-family:'IBM Plex Mono',monospace; font-size:11.5px; letter-spacing:0.06em; text-transform:uppercase;
  color:#8A90AC; background:none; border:none; cursor:pointer; padding:0; display:flex; align-items:center; gap:5px;
  transition:color .2s ease;
}
.site-navlinks > a:hover, .site-navlinks > a:focus-visible, .site-navlinks > a.active,
.site-navdrop > button:hover, .site-navdrop > button:focus-visible, .site-navdrop > button.active{
  color:#3FC9AE;
}
.site-navlinks a:focus-visible, .site-navdrop button:focus-visible{ outline:2px solid #3FC9AE; outline-offset:4px; }

.site-navdrop{ position:relative; }
.site-navdrop .caret{ font-size:9px; transition:transform .2s ease; }
.site-navdrop[data-open="true"] .caret{ transform:rotate(180deg); }
.site-navdrop-menu{
  position:absolute; top:calc(100% + 14px); right:0; min-width:230px;
  background:#0C1018; border:1px solid rgba(224,228,240,0.16); border-radius:10px;
  padding:8px; box-shadow:0 20px 40px -16px rgba(0,0,0,0.6);
  opacity:0; visibility:hidden; transform:translateY(-6px);
  transition:opacity .18s ease, transform .18s ease, visibility .18s ease;
}
.site-navdrop[data-open="true"] .site-navdrop-menu{ opacity:1; visibility:visible; transform:translateY(0); }
.site-navdrop-menu a{
  display:block; padding:9px 12px; border-radius:6px;
  font-family:'Inter',sans-serif; font-size:13px; color:#DDE1F0; text-transform:none; letter-spacing:normal;
}
.site-navdrop-menu a:hover, .site-navdrop-menu a:focus-visible{ background:rgba(63,201,174,0.12); color:#F3F5FA; }
.site-navdrop-menu a.active{ color:#3FC9AE; }

@media (max-width:760px){
  .site-navlinks{ display:none; }
}

.nav-hamburger{
  display:none; align-items:center; justify-content:center;
  width:36px; height:36px; border-radius:8px;
  border:1px solid rgba(224,228,240,0.18); background:none; cursor:pointer;
  color:#B9BFD6; flex-shrink:0;
  transition:color .2s ease, border-color .2s ease;
}
.nav-hamburger:hover, .nav-hamburger:focus-visible{ color:#3FC9AE; border-color:rgba(63,201,174,0.4); }
.nav-hamburger:focus-visible{ outline:2px solid #3FC9AE; outline-offset:2px; }
.nav-hamburger svg{ width:18px; height:18px; display:block; }
.nav-hamburger .icon-close{ display:none; }
.nav-hamburger[aria-expanded="true"] .icon-open{ display:none; }
.nav-hamburger[aria-expanded="true"] .icon-close{ display:block; }

.site-mobile-menu{
  display:flex; flex-direction:column;
  max-height:0; overflow:hidden; opacity:0;
  border-top:0 solid rgba(224,228,240,0.14);
  background:rgba(7,9,15,0.98);
  transition:max-height .25s ease, opacity .2s ease, border-top-width .25s ease;
}
.site-mobile-menu[data-open="true"]{ max-height:70vh; opacity:1; overflow-y:auto; border-top-width:1px; }
.site-mobile-menu-inner{ padding:8px 32px 24px; display:flex; flex-direction:column; }
.site-mobile-menu a{
  padding:13px 2px; font-family:'IBM Plex Mono',monospace; font-size:12.5px; letter-spacing:0.06em; text-transform:uppercase;
  color:#B9BFD6; border-bottom:1px solid rgba(224,228,240,0.08);
}
.site-mobile-menu a:last-child{ border-bottom:none; }
.site-mobile-menu a:hover, .site-mobile-menu a:focus-visible, .site-mobile-menu a.active{ color:#3FC9AE; }
.mobile-menu-label{
  padding:18px 2px 6px; font-family:'IBM Plex Mono',monospace; font-size:10.5px; letter-spacing:0.08em; text-transform:uppercase; color:#6B7290;
}

@media (max-width:760px){
  .nav-hamburger{ display:flex; }
}
@media (prefers-reduced-motion: reduce){
  .site-mobile-menu{ transition:none; }
}

.theme-toggle{
  display:flex; align-items:center; justify-content:center;
  width:34px; height:34px; border-radius:50%;
  border:1px solid rgba(224,228,240,0.18); background:none; cursor:pointer;
  color:#B9BFD6; flex-shrink:0; margin-left:4px;
  transition:color .2s ease, border-color .2s ease, background .2s ease;
}
.theme-toggle:hover, .theme-toggle:focus-visible{ color:#3FC9AE; border-color:rgba(63,201,174,0.4); }
.theme-toggle:focus-visible{ outline:2px solid #3FC9AE; outline-offset:2px; }
.theme-toggle svg{ width:16px; height:16px; display:block; }
