.site-header{position:sticky;top:0;z-index:1000;background:rgba(7,21,20,.9);backdrop-filter:blur(18px);border-bottom:1px solid rgba(121,231,202,.16);height:74px}
.header-inner{display:flex;align-items:center;justify-content:space-between;height:100%}
.brand{display:flex;align-items:center;gap:var(--space-2);flex-shrink:0}
.brand-mark{height:38px;width:auto;border-radius:50%;filter:hue-rotate(85deg) saturate(.85)}
.brand-text{font-family:var(--font-heading);font-size:1.05rem;font-weight:700;letter-spacing:-.03em}
.primary-nav{display:flex;align-items:center;gap:var(--space-4)}
.nav-list{display:flex;gap:var(--space-3);margin:0;padding:0}
.nav-list li{margin:0;padding:0}
.nav-list a{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.07em}
.nav-list a[aria-current="page"]{color:var(--color-detail-bronze);border-bottom:2px solid var(--color-detail-bronze)}
.nav-cta{white-space:nowrap}
.nav-toggle{display:none;background:transparent;border:none;cursor:pointer;padding:8px;flex-direction:column;justify-content:center;align-items:center;gap:5px;z-index:1001}
.nav-line{width:24px;height:2px;background:var(--color-text-primary);transition:transform 0.3s ease, opacity 0.3s ease;display:block}

/* Morph burger button into X when open */
.nav-toggle.open .nav-line:nth-child(1),
.nav-toggle[aria-expanded="true"] .nav-line:nth-child(1) {
  transform: translateY(7px) rotate(45deg);
}
.nav-toggle.open .nav-line:nth-child(2),
.nav-toggle[aria-expanded="true"] .nav-line:nth-child(2) {
  opacity: 0;
  transform: scaleX(0);
}
.nav-toggle.open .nav-line:nth-child(3),
.nav-toggle[aria-expanded="true"] .nav-line:nth-child(3) {
  transform: translateY(-7px) rotate(-45deg);
}

@media(max-width:900px){
  .nav-toggle{display:inline-flex}
  .primary-nav{position:fixed;top:74px;right:0;background:var(--color-bg-secondary);border-left:var(--border-strong);flex-direction:column;align-items:flex-start;padding:var(--space-4);width:min(320px,90vw);height:calc(100vh - 74px);transform:translateX(100%);transition:transform var(--transition-fast);overflow-y:auto;box-shadow:-5px 0 25px rgba(0,0,0,0.5)}
  .primary-nav.open{transform:translateX(0)}
  .nav-list{flex-direction:column;width:100%}
  .nav-cta{width:100%}
}
@media(max-width:768px){.site-header{height:56px}.brand-mark{height:30px}.brand-text{font-size:1rem}.primary-nav{top:56px;height:calc(100vh - 56px)}}


