/* One breakpoint and comfortable touch targets across both page templates. */
.site-header { --nav-height: 84px; }
.refreshed-header.site-header { --nav-height: 94px; }
.site-header .nav-item > button,
.site-header .home-nav-trigger,
.site-header .menu-toggle { touch-action: manipulation; }
.site-header .nav-panel[hidden],
.site-header .home-nav-panel[hidden] { display: none !important; }
.site-header .nav-panel a { min-height: 46px; }
.site-header .nav-panel a > span { display: none; }
@media (max-width: 1100px) {
  html { scroll-padding-top: 100px; }
  html.mobile-nav-open, html.mobile-nav-open body { overflow: hidden; }
  .site-header, .refreshed-header.site-header { --nav-height: 80px; }
  .site-header .nav, .refreshed-header .nav { min-height: var(--nav-height); gap: 20px; }
  .site-header .menu-toggle, .refreshed-header .menu-toggle {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 76px; min-height: 44px; font-size: 14px; line-height: 24px;
    padding: 9px 13px; border-radius: 4px; flex-shrink: 0;
  }
  .site-header .nav-links, .refreshed-header .nav-links {
    display: none; position: absolute; inset: 100% 0 auto;
    flex-direction: column; align-items: stretch; gap: 0;
    max-height: calc(100vh - var(--menu-top, var(--nav-height)));
    max-height: calc(100dvh - var(--menu-top, var(--nav-height)));
    overflow-y: auto; overscroll-behavior: contain;
    padding: 10px max(20px, env(safe-area-inset-right)) max(24px, env(safe-area-inset-bottom)) max(20px, env(safe-area-inset-left));
    background: #111315; border-bottom: 1px solid #ffffff24;
    box-shadow: 0 20px 32px #11131526;
  }
  .site-header .nav-links.open, .refreshed-header .nav-links.open { display: flex; }
  .site-header .nav-links > a, .site-header .nav-item > button,
  .refreshed-header .home-nav-trigger, .refreshed-header .nav-links > a {
    display: flex; justify-content: space-between; align-items: center;
    width: 100%; min-height: 54px; padding: 14px 0;
    font-size: 16px; line-height: 1.6; text-align: left;
    border-bottom: 1px solid #ffffff1c;
  }
  .site-header .nav-panel, .refreshed-header .home-nav-panel,
  .refreshed-header .home-nav-item:last-of-type .home-nav-panel {
    position: static; width: 100%; max-height: none; margin: 0 0 12px;
    padding: 14px 18px 8px; background: #242038; color: #f3f0ff;
    border-top: 2px solid #7463eb; border-radius: 0 0 4px 4px; box-shadow: none;
  }
  .site-header .nav-panel small, .refreshed-header .home-nav-panel small { color: #c6bfdc; }
  .site-header .nav-panel a, .refreshed-header .home-nav-panel a {
    min-height: 48px; padding: 12px 0; font-size: 15px; line-height: 1.6;
    border-color: #ffffff20; color: #f3f0ff;
  }
  .site-header .nav-panel a:after { color: #bdb2ff; }
  .site-header .nav-links > .nav-contact, .refreshed-header .nav-links > .home-nav-contact {
    justify-content: center; min-height: 48px; padding: 12px 20px; margin-top: 14px;
    border: 1px solid #7463eb; border-radius: 4px; background: #6050d2; color: #fff;
  }
}
@media (max-width: 580px) {
  .site-header, .refreshed-header.site-header { --nav-height: 76px; }
  .site-header .brand img, .refreshed-header .brand img { width: 38px; height: 48px; }
  .site-header .brand, .refreshed-header .brand { gap: 11px; }
  .site-header .brand-title, .refreshed-header .brand > span { font-size: 20px; }
}
@media (prefers-reduced-motion: reduce) { .site-header * { transition: none !important; } }
