/* One persistent header with enough room for every page section. */
:root { --site-header-height: 156px; }
html { scroll-padding-top: calc(var(--site-header-height) + 16px); }
body { padding-top: var(--site-header-height); }
html[lang] body #siteHeader.site-header {
  position: fixed !important;
  inset: 0 0 auto;
  z-index: 82;
  display: block !important;
  height: auto !important;
  padding: 14px clamp(16px, 2.5vw, 40px) 0 !important;
  background: #07170f !important;
  border-bottom: 1px solid #94bc6c45;
  box-shadow: 0 6px 24px #0002;
  backdrop-filter: none !important;
  mix-blend-mode: normal;
}
#siteHeader .header-top { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
html[lang] #siteHeader .brand { width: 230px !important; flex: 0 1 230px !important; min-width: 0; }
#siteHeader .header-actions { display: flex; height: auto; align-items: center; gap: 14px !important; margin: 0; }
#siteHeader .account-links { position: static; display: flex; gap: 10px !important; }
html[lang] #siteHeader .account-links :is(.register-button, .login-button) {
  display: inline-flex !important;
  width: auto !important;
  min-width: 100px !important;
  max-width: none !important;
  flex: 1 0 auto !important;
  height: 44px;
  min-height: 44px;
  padding: 10px 18px !important;
  font-size: 14px !important;
  border-radius: 999px;
}
html[lang] #siteHeader .lang-switch { display: inline-flex !important; align-items: center; justify-content: center; min-height: 44px; min-width: 74px; padding: 8px 14px !important; font-size: 14px !important; border-radius: 999px; }
html[lang] #siteHeader :is(.lang-switch, .register-button) { background: var(--green) !important; color: #06100c !important; border: 1px solid var(--green) !important; }
html[lang] #siteHeader .lang-switch:hover { filter: brightness(1.08); }
html[lang] #siteHeader .menu-toggle { display: block !important; width: 44px; height: 44px; flex: none; }
html[lang] #siteHeader .desktop-nav {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center;
  gap: 0 22px !important;
  width: 100%;
  margin: 12px 0 0;
  border-top: 1px solid #a4c38924;
}
html[lang] #siteHeader .desktop-nav > a {
  display: flex !important;
  align-items: center;
  min-height: 48px;
  padding: 10px 0;
  font-size: 14px !important;
  line-height: 1.4;
  font-weight: 600;
  letter-spacing: 0;
}
html[lang] #siteHeader .desktop-nav > a::before { display: none !important; }
#siteHeader .desktop-nav > a.active::after { bottom: 5px; }
html[lang] #mobileNav.mobile-nav {
  position: fixed !important;
  top: var(--site-header-height) !important;
  left: auto;
  right: 24px;
  z-index: 81;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 26px;
  width: min(660px, calc(100% - 48px));
  max-height: calc(100dvh - var(--site-header-height) - 12px);
  overflow: auto;
  overscroll-behavior: contain;
  padding: 12px 24px 20px;
  background: #071b12;
  border: 1px solid #60864b;
  border-radius: 0 0 16px 16px;
  transform: translateY(-12px);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .18s, transform .18s, visibility .18s;
}
html[lang] #mobileNav.open { transform: none; opacity: 1; visibility: visible; pointer-events: auto; }
html[lang] #mobileNav a { display: block; padding: 14px 0; border-bottom: 1px solid #63854a44; text-decoration: none; font-size: 15px; line-height: 1.5; color: #e4f3da; }
html[lang] #mobileNav a.active { color: var(--green); }
#siteHeader :is(a, button):focus-visible, #mobileNav a:focus-visible { outline: 2px solid #c9ff9d; outline-offset: 4px; }
html[lang] main [id] { scroll-margin-top: 0 !important; }
html[lang] #home.hero { padding-top: 34px !important; }
#home .home-language-note { position: relative; margin-top: 0 !important; }
#home .home-launchpad[hidden] { display: none !important; }
#free-review .closing-chapter { margin: 0 0 24px; color: #adf685; font-size: 16px; line-height: 1.5; letter-spacing: .08em; font-weight: 700; }
@media (max-width: 1199px) {
  :root { --site-header-height: 94px; }
  html[lang] body #siteHeader.site-header { padding-bottom: 14px !important; }
  html[lang] #siteHeader .desktop-nav { display: none !important; }
}
@media (max-width: 768px) {
  :root { --site-header-height: 142px; }
  html[lang] body #siteHeader.site-header { padding: 12px 16px !important; }
  #siteHeader .header-top { display: grid; grid-template-columns: minmax(0, 1fr) auto 44px; align-items: center; gap: 12px 8px; }
  html[lang] #siteHeader .brand { grid-column: 1; grid-row: 1; width: min(230px, 100%) !important; max-width: 100%; }
  #siteHeader .header-actions { display: contents; }
  #siteHeader .lang-switch { grid-column: 2; grid-row: 1; }
  #siteHeader .menu-toggle { grid-column: 3; grid-row: 1; }
  #siteHeader .account-links { grid-column: 1 / -1; grid-row: 2; width: 100%; }
  html[lang] #siteHeader .account-links :is(.register-button, .login-button) { flex: 1 1 0 !important; min-width: 0 !important; padding-inline: 12px !important; }
  html[lang] #mobileNav.mobile-nav { right: 12px; width: calc(100% - 24px); grid-template-columns: 1fr; padding: 8px 20px 20px; }
  html[lang] #home.hero { padding-top: 32px !important; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  html[lang] #mobileNav.mobile-nav { transition: none; }
}
