/* Shared primary header. Loaded after page-specific styles to keep navigation consistent. */
@font-face { font-family: HeaderMono; src:url("../fonts/JetBrainsMono-Regular.woff2") format("woff2"); font-display:swap; }
:root { --header-height: 64px; }

header.site-header,
header.persistent {
  z-index: 10;
  border-bottom: 1px solid var(--line, #b8c8c4);
}

header.site-header {
  position: sticky;
  top: 0;
  background: rgba(237, 242, 240, .94);
  color: #162125;
  backdrop-filter: blur(12px);
}

header.persistent {
  position: sticky;
  top: 0;
  bottom: auto;
  background:#172126;
  color: #eff8f8;
  border-color: rgba(184, 200, 196, .35);
}

header.site-header .nav,
header.persistent .nav {
  width: min(1120px, calc(100% - 40px));
  min-height: 64px;
  height:auto;
  display: flex;
  align-items: center;
  gap: 20px;
  margin: auto;
}

header.site-header .brand,
header.persistent .brand {
  display: inline-flex;
  align-items: center;
  gap: 0;
  font: 700 16px/1.55 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  letter-spacing: -.04em;
  color: inherit;
  text-decoration: none;
  white-space: nowrap;
}

header.site-header .brand-glyph,
header.persistent .brand-glyph {
  display: inline-grid;
  place-items: center;
  width: 28px;
  height: 28px;
  margin-right: 7px;
  border-radius: 0;
  letter-spacing:normal;
  background: #111b20;
  color: #b8f6f2 !important;
  font: 11px/1 HeaderMono, ui-monospace, monospace;
}

header.persistent .brand-glyph { background: #edf2f0; color: #111b20 !important; }
header.site-header .brand-word span,
header.persistent .brand-word span { color: #00c9d1; }

header.site-header .nav-links,
header.site-header .links,
header.persistent .nav-links,
header.persistent .links {
  display: flex;
  align-items: center;
  gap: 20px;
  margin-left: auto;
}

header.site-header .nav a,
header.persistent .nav a { color: inherit; text-decoration: none; }
header.site-header .nav-links a:not(.nav-cta),
header.site-header .links a:not(.nav-cta),
header.persistent .nav-links a:not(.nav-cta),
header.persistent .links a:not(.nav-cta) { font: 13px/1.55 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
header.site-header .nav a[aria-current="page"],
header.persistent .nav a[aria-current="page"] { color: #056f78; text-decoration: underline; text-underline-offset: 6px; }

header.site-header .nav-cta,
header.persistent .nav-cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 13px;
  border: 1px solid #111b20;
  background: #111b20;
  color: #fff !important;
  font: 16px/1.55 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

header.persistent .nav-cta { background: #eff8f8; border-color: #eff8f8; color: #102126 !important; }

header.site-header .menu-button,
header.site-header .menu,
header.persistent .menu-button,
header.persistent .menu,
header.site-header .motion-toggle,
header.persistent .motion-toggle {
  min-height: 40px;
  border: 1px solid var(--line, #b8c8c4);
  background: transparent;
  color: inherit;
  font: 11px/1 HeaderMono, ui-monospace, monospace;
}

header.site-header .menu-button,
header.site-header .menu,
header.persistent .menu-button,
header.persistent .menu { display: none; padding: 8px 10px; }
header.site-header .motion-toggle,
header.persistent .motion-toggle { padding: 7px 9px; white-space: nowrap; }

@media (max-width: 1000px) {
  :root { --header-height: 58px; }
  header.site-header .nav,
  header.persistent .nav { min-height: 58px; width: min(100% - 28px, 1120px); gap: 9px; }
  .has-js header.site-header .menu-button,
  .has-js header.site-header .menu,
  .has-js header.persistent .menu-button,
  .has-js header.persistent .menu { display: block; margin-left: auto; }
  .has-js header.site-header .nav-links,
  .has-js header.site-header .links,
  .has-js header.persistent .nav-links,
  .has-js header.persistent .links {
    display: none;
    position: absolute;
    top: 100% !important;
    left: 0;
    right: 0;
    align-items: flex-start;
    flex-direction: column;
    margin: 0;
    padding: 16px 14px;
    background: #edf2f0;
    color: #162125;
    border-bottom: 1px solid #b8c8c4;
  }
  .has-js header.site-header .nav-links.open,
  .has-js header.site-header .links.open,
  .has-js header.persistent .nav-links.open,
  .has-js header.persistent .links.open { display: flex; }
  .has-js header.site-header .motion-toggle,
  .has-js header.persistent .motion-toggle { margin-left: 0; }
  .has-js header.persistent .nav-links,
  .has-js header.persistent .links { background: #111d21; color: #eff8f8; border-bottom-color: rgba(184, 200, 196, .35); }
}

header.site-header .nav-cta, header.persistent .nav-cta { border-radius:0; }
header.site-header .nav-cta:hover, header.persistent .nav-cta:hover { transform:none; }
header.site-header .menu-mark, header.persistent .menu-mark { display:none; }