/* A prominent, permanent brand bar inspired by the supplied Topgolf reference. */
:root{--header-height:128px;--header-blue:#09077d}
html{scroll-padding-top:calc(var(--header-height) + 24px)}
header.site-header{
  position:sticky;top:0;z-index:40;height:var(--header-height);width:100%;
  display:flex;align-items:center;justify-content:space-between;gap:22px;
  padding:0 28px 0 0;border:0;background:var(--header-blue);color:white;
  box-shadow:0 8px 24px #02043c26;
}
.site-header .brand{
  position:relative;isolation:isolate;display:flex;align-items:center;justify-content:center;
  align-self:stretch;flex:0 0 360px;width:360px;max-width:none;
}
header.site-header:has(nav.open){background:var(--header-blue)}
.site-header .brand img{width:100%;height:auto;max-height:100%;object-fit:contain;filter:url(#header-logo-white)}
.site-header nav{
  position:static;display:flex;align-items:center;justify-content:center;flex:1;flex-direction:row;
  width:auto;min-width:max-content;gap:20px;padding:0;background:transparent;
  font-family:'Shield Sans Condensed',var(--body);font-size:20px;font-weight:700;
  line-height:1.1;letter-spacing:.01em;text-transform:uppercase;
}
.site-header nav>a:not(.mobile-signup-link){position:relative;display:flex;align-items:center;min-height:48px;white-space:nowrap}
.site-header nav>a:not(.mobile-signup-link)::after{
  content:"";position:absolute;bottom:0;left:0;right:0;height:3px;background:var(--neon);
  transform:scaleX(0);transform-origin:left;transition:transform .18s ease;
}
.site-header nav>a:hover,.site-header nav>a:focus-visible{color:white}
.site-header nav>a:hover::after,.site-header nav>a:focus-visible::after{transform:scaleX(1)}
.site-header nav .mobile-signup-link{display:none}
.site-header>.friend-cta{
  display:flex;flex:0 0 190px;min-height:58px;max-width:190px;margin:0;gap:14px;
  padding:13px 20px;border-radius:32px;background:var(--green);color:var(--ink);
}
.site-header .friend-cta .friend-cta-copy{max-width:none;font-size:14px;line-height:1.25;white-space:nowrap}
.site-header>.friend-cta:hover{background:var(--neon);transform:none}
.site-header .language-switch{gap:5px}
.site-header .language-button{min-height:44px;background:transparent}
.site-header .language-button[aria-pressed="true"]{background:#ffffff14}
.site-header .menu-toggle{
  display:none;align-items:center;justify-content:center;flex:0 0 48px;width:48px;height:48px;
  padding:10px;margin:0;border:1px solid #ffffff65;border-radius:5px;background:transparent;
}
.site-header .menu-toggle svg{display:block;width:26px;height:26px}
.site-header a:focus-visible,.site-header button:focus-visible{outline-color:var(--neon);outline-offset:4px}
.site-header .brand:focus-visible{outline-offset:-5px}
/* The header now occupies its own space above the video. */
.hero{height:auto;min-height:766px;max-height:none}
.hero-content{padding-top:76px;padding-bottom:130px}
.hero-claim{top:116px}
@media(min-width:1600px){
  .site-header .brand{flex-basis:390px;width:390px}
  .hero{min-height:856px}.hero-claim{top:131px}
}
@media(min-width:1280px) and (max-width:1499px){
  header.site-header{gap:18px;padding-right:22px}
  .site-header .brand{flex-basis:300px;width:300px}
  .site-header nav{font-size:18px;gap:18px}
  .site-header>.friend-cta{flex-basis:190px;max-width:190px;padding:13px 18px}
}
@media(max-width:1279px){
  :root{--header-height:112px}
  header.site-header{gap:20px;padding-right:24px}
  .site-header .brand{flex-basis:326px;width:326px}
  .site-header>.friend-cta{margin-left:auto}
  .site-header .menu-toggle{display:flex;order:4}
  .site-header .language-switch{order:3}
  .site-header nav{
    display:none;position:absolute;top:100%;left:0;width:100%;min-width:0;max-height:calc(100dvh - var(--header-height));
    overflow-y:auto;overscroll-behavior:contain;align-items:stretch;justify-content:flex-start;
    flex-direction:column;gap:0;padding:18px 5% 24px;background:var(--header-blue);
    box-shadow:0 14px 22px #02043c26;font-size:28px;
  }
  .site-header nav.open{display:flex}
  .site-header nav>a:not(.mobile-signup-link){min-height:60px;padding:10px 0;border-bottom:1px solid #ffffff26}
}
@media(min-width:651px) and (max-width:1000px){.hero-claim{top:156px}}
@media(max-width:800px){
  :root{--header-height:96px}
  header.site-header{gap:14px;padding-right:18px}
  .site-header .brand{flex-basis:280px;width:280px}
  .site-header>.friend-cta{display:none}
  .site-header .language-switch{margin-left:auto}
  .site-header nav .mobile-signup-link{
    display:flex;align-items:center;justify-content:space-between;max-width:none;gap:18px;
    padding:18px 22px;margin-top:22px;border-radius:32px;background:var(--green);color:var(--ink);
    font-family:var(--body);text-transform:none;
  }
  .site-header nav .friend-cta .friend-cta-copy{font-size:16px;line-height:1.3;max-width:none}
}
@media(max-width:650px){
  :root{--header-height:86px}
  header.site-header{gap:10px;padding-right:12px}
  .site-header .brand{flex:0 1 240px;width:240px;min-width:0}
  .site-header .language-switch{gap:4px}
  .site-header .language-button{min-width:38px;min-height:44px;padding:7px 5px}
  .site-header .language-button span{display:none}
  .site-header .menu-toggle{flex-basis:44px;width:44px;height:44px;margin:0}
  .site-header nav{padding:12px 6% 24px;font-size:27px}
  .hero{height:auto;min-height:0}.hero-content{padding-top:49px;padding-bottom:32px}
  .hero-claim{top:auto}
}
@media(prefers-reduced-motion:reduce){.site-header nav>a::after{transition:none}}
