/* Sticky header and mobile drawer */
.site-header{
  position:fixed;
  inset:0 0 auto;
  z-index:100;
  height:var(--header-h);
  display:flex;
  align-items:center;
  border-bottom:1px solid transparent;
  transition:background var(--t-med),border-color var(--t-med),backdrop-filter var(--t-med);
}
.site-header.is-stuck{
  background:rgba(3,7,13,.72);
  backdrop-filter:blur(18px) saturate(150%);
  border-bottom-color:var(--color-border);
}

.header-inner{display:flex;align-items:center;gap:var(--space-md);width:100%}

.brand{display:flex;align-items:center;gap:.7rem;flex-shrink:0}
.brand .mark{width:40px;height:32px;flex:none}
.brand__image{max-height:44px;width:auto}
.brand-text{line-height:1}
.brand-text b{display:block;font-size:1.05rem;font-weight:800;letter-spacing:.14em}
.brand-text span{
  display:block;font-size:.6rem;letter-spacing:.28em;
  color:var(--color-text-secondary);
  text-transform:uppercase;margin-top:2px;
}

.nav{margin-inline:auto}
.nav > ul{display:flex;align-items:center;gap:clamp(.35rem,1.1vw,1.05rem)}
.nav-item{position:relative}

.nav-link{
  display:inline-flex;align-items:center;gap:.32rem;
  padding:.55rem .35rem;
  font-size:.94rem;font-weight:500;
  color:#E7EDF5;
  border-radius:var(--radius-sm);
  transition:color var(--t-fast);
}
.nav-link:hover,
.nav-item:focus-within > .nav-link,
.current-menu-item > .nav-link,
.current-menu-parent > .nav-link{color:var(--color-primary)}

.nav-link .chev{width:10px;height:10px;opacity:.65;transition:transform var(--t-fast)}
.nav-item:hover .chev,
.nav-item:focus-within .chev{transform:rotate(180deg)}

.submenu{
  position:absolute;
  top:calc(100% + 12px);
  left:50%;
  translate:-50% 0;
  min-width:230px;
  padding:.5rem;
  background:rgba(9,15,25,.95);
  backdrop-filter:blur(20px);
  border:1px solid var(--color-border);
  border-radius:var(--radius-md);
  box-shadow:var(--shadow-card);
  opacity:0;
  visibility:hidden;
  transform:translateY(-6px);
  transition:opacity var(--t-fast),transform var(--t-fast),visibility var(--t-fast);
}
/* Invisible bridge so the pointer can travel from trigger to panel */
.submenu::before{content:"";position:absolute;inset:-12px 0 auto;height:12px}
.nav-item:hover .submenu,
.nav-item:focus-within .submenu{opacity:1;visibility:visible;transform:translateY(0)}

.submenu a{
  display:block;
  padding:.6rem .8rem;
  border-radius:var(--radius-sm);
  font-size:.9rem;
  color:var(--color-text-secondary);
  transition:background var(--t-fast),color var(--t-fast);
}
.submenu a:hover{background:rgba(25,199,242,.1);color:#fff}

.header-cta{flex-shrink:0}

.nav-toggle{
  display:none;
  width:44px;height:44px;
  border:1px solid var(--color-border);
  border-radius:var(--radius-sm);
  align-items:center;justify-content:center;
}
.nav-toggle span{
  display:block;width:18px;height:2px;
  background:#fff;position:relative;
  transition:background var(--t-fast);
}
.nav-toggle span::before,
.nav-toggle span::after{
  content:"";position:absolute;left:0;
  width:18px;height:2px;background:#fff;
  transition:transform var(--t-fast),top var(--t-fast);
}
.nav-toggle span::before{top:-6px}
.nav-toggle span::after{top:6px}

body.nav-open .nav-toggle span{background:transparent}
body.nav-open .nav-toggle span::before{top:0;transform:rotate(45deg)}
body.nav-open .nav-toggle span::after{top:0;transform:rotate(-45deg)}