/* Navbar: six flat links centred between the logo in the site's condensed DIN, points and cart on the right, a full-screen menu on
   phones. Page layers keep their own bar colours; this file sets type, spacing and states. */
@font-face{font-family:"Roboto Condensed";src:url(/fonts/gsd/roboto-condensed-latin.woff2) format("woff2");font-weight:400 700;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
:root{--gn-cond:"Bahnschrift Condensed","DIN Condensed","Roboto Condensed","Arial Narrow",ui-sans-serif,sans-serif;--gn-din:"Bahnschrift","DIN Alternate","Roboto Condensed",ui-sans-serif,system-ui,sans-serif;
  --gn-link:rgb(226 232 240 / .8);--gn-hi:#fff;--gn-mark:#a5b4fc;--gn-pts:#86efac;--gn-accent:#605dff;--gn-ease:var(--gsd-ease,cubic-bezier(.22,1,.36,1))}

nav.navbar{padding-inline:24px;transition:min-height .3s var(--gn-ease)}
nav.navbar .navbar-end{gap:6px}

/* Count bubbles: cart items and unread notifications */
nav.navbar .navbar-end .indicator > .indicator-item{height:18px;min-width:18px;padding:0 5px;border:0;border-radius:9px;background:var(--gn-accent);color:#fff;font:700 11.5px/18px var(--gn-din);box-shadow:0 0 0 2px rgb(10 15 30 / .9)}
nav.navbar a[href="/cart"] .indicator > .indicator-item:empty{display:none}
nav.navbar .navbar-end a[href="/cart"]{background:transparent;box-shadow:none}
nav.navbar .navbar-end a[href="/cart"] svg{width:22px;height:22px}
nav.navbar .navbar-end .avatar > div{width:36px;box-shadow:0 0 0 2px rgb(255 255 255 / .14)}

/* Points: the signed-in GSD Rewards balance; it replaces the Rewards nav link */
.gn-pts{display:none;align-items:center;gap:6px;height:40px;padding:0 8px;margin-right:2px;color:var(--gn-pts);font:700 17px/1 var(--gn-cond);font-variant-numeric:tabular-nums;white-space:nowrap;text-decoration:none;transition:color .15s}
.gn-pts svg{width:15px;height:15px;flex:none}
.gn-pts:hover,.gn-pts:focus-visible{color:#bbf7d0}
.gn-pts:focus-visible{outline:2px solid var(--gn-mark);outline-offset:2px;border-radius:8px}
.gn-pts[aria-current="page"]{color:#bbf7d0}
.gn-pts[hidden]{display:none!important}

/* Sign in */
nav.navbar .navbar-end > a[href^="/login"]{height:38px;min-height:0;padding:0 16px;margin-left:6px;border:0;border-radius:10px;background:var(--gn-accent);color:#fff;font:650 15px/1 var(--gn-din);box-shadow:0 1px 0 rgb(255 255 255 / .16) inset,0 6px 16px -8px rgb(96 93 255 / .9);transform:translateZ(0);transition:background-color .15s,transform .16s var(--gn-ease),box-shadow .16s var(--gn-ease)}
nav.navbar .navbar-end > a[href^="/login"]:hover{background:#6e6bff;box-shadow:0 1px 0 rgb(255 255 255 / .2) inset,0 8px 20px -8px rgb(96 93 255 / 1)}
nav.navbar .navbar-end > a[href^="/login"]:active,nav.navbar .navbar-end > a[href^="/login"].gn-pressed{background:#4f4cf0;transform:scale(.95);box-shadow:0 1px 0 rgb(255 255 255 / .1) inset,0 2px 6px -3px rgb(96 93 255 / .8);transition-duration:.08s}
nav.navbar .navbar-end > a[href^="/login"]:focus-visible{outline:2px solid var(--gn-mark);outline-offset:3px}
nav.navbar .navbar-end > a[href^="/login"] > svg{display:none}

/* Full-screen menu button (phones and tablets) */
.gn-burger{display:none;width:44px;height:44px;min-height:0;padding:0;margin-left:2px;align-items:center;justify-content:center;border:0;border-radius:10px;background:transparent;color:inherit;box-shadow:none;cursor:pointer}
.gn-burger svg{width:24px;height:24px}
.gn-burger:focus-visible{outline:2px solid var(--gn-mark);outline-offset:0}

@media (min-width:1024px){
  nav.navbar{min-height:76px}
  html.gsd-scrolled nav.navbar{min-height:62px}
  nav.navbar .navbar-start{width:auto;flex:1 1 0;min-width:max-content}
  nav.navbar .navbar-start > a.btn-link{height:auto;min-height:0;padding:0 4px}
  nav.navbar .navbar-start > a.btn-link img{width:54px;transition:width .3s var(--gn-ease)}
  html.gsd-scrolled nav.navbar .navbar-start > a.btn-link img{width:44px}
  nav.navbar .navbar-center{flex:none;margin:0 28px}
  nav.navbar .navbar-center > ul.menu-horizontal{gap:26px;padding:0}
  nav.navbar .navbar-center > ul.menu-horizontal > li:has(> a:is([href="/"],[href="/team"],[href="/partners"],[href="/loyalty"])){display:none}
  nav.navbar .navbar-center > ul.menu-horizontal > li > a{position:relative;padding:8px 0;border-radius:0;background:transparent!important;color:var(--gn-link);font:700 19px/1 var(--gn-cond);letter-spacing:.01em;white-space:nowrap;transition:color .15s}
  nav.navbar .navbar-center > ul.menu-horizontal > li > a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;border-radius:2px;background:var(--gn-mark);opacity:.4;transform:scaleX(0);transition:transform .22s var(--gn-ease),opacity .22s}
  nav.navbar .navbar-center > ul.menu-horizontal > li > a:hover,nav.navbar .navbar-center > ul.menu-horizontal > li > a:focus-visible,nav.navbar .navbar-center > ul.menu-horizontal > li > a[aria-current="page"]{color:var(--gn-hi)}
  nav.navbar .navbar-center > ul.menu-horizontal > li > a:hover::after{transform:none}
  nav.navbar .navbar-center > ul.menu-horizontal > li > a[aria-current="page"]::after{transform:none;opacity:1}
  nav.navbar .navbar-center > ul.menu-horizontal > li > a:focus-visible{outline:2px solid var(--gn-mark);outline-offset:4px;border-radius:4px}
  nav.navbar .navbar-end{width:auto;flex:1 1 0;min-width:max-content;justify-content:flex-end}
  .gn-pts{display:flex}
}
@media (max-width:1023.98px){
  nav.navbar{min-height:64px;padding-inline:12px 8px}
  nav.navbar .navbar-start > .dropdown{display:none}
  nav.navbar .navbar-start > a.btn-link{padding:0 4px;min-height:0;height:auto}
  nav.navbar .navbar-start > a.btn-link img{width:46px}
  nav.navbar .navbar-end > a[href^="/login"]{display:none}
  .gn-burger{display:inline-flex}
}

/* Over the home and pack heroes, a fade keeps the bar readable on any photo */
html:is(.gsd-home-on,[data-gsd-flagship]) div.relative:has(> nav.navbar)::before{content:"";position:absolute;left:0;right:0;top:0;height:150px;background:linear-gradient(180deg,rgb(5 9 22 / .7),rgb(5 9 22 / .3) 55%,transparent);pointer-events:none;transition:opacity .35s var(--gn-ease)}
html.gsd-scrolled:is(.gsd-home-on,[data-gsd-flagship]) div.relative:has(> nav.navbar)::before{opacity:0}

/* Cortex pages paint a light bar */
html[data-gsd-cortex]{--gn-link:#4a505b;--gn-hi:#111317;--gn-mark:#605dff;--gn-pts:#15803d}
html[data-gsd-cortex] nav.navbar .navbar-center .menu-horizontal > li > a,html[data-gsd-cortex] nav.navbar .navbar-center .menu-horizontal > li > a:hover{background:transparent!important}
html[data-gsd-cortex] nav.navbar .navbar-center .menu-horizontal > li > a:is(:hover,[aria-current="page"]){color:#111317!important}
html[data-gsd-cortex] .gn-pts:hover{color:#166534}
html[data-gsd-cortex].cx-night{--gn-link:rgb(232 234 238 / .8);--gn-hi:#fff;--gn-mark:#a5b4fc;--gn-pts:#86efac}
html[data-gsd-cortex].cx-night nav.navbar .navbar-center .menu-horizontal > li > a:is(:hover,[aria-current="page"]){color:#fff!important}
html[data-gsd-cortex] .gn-burger{color:#16181d}
html[data-gsd-cortex].cx-night .gn-burger{color:#e8eaee}

/* The full-screen menu */
.gn-sheet{position:fixed;inset:0;z-index:1200;display:flex;flex-direction:column;padding:0 20px calc(20px + env(safe-area-inset-bottom));background:rgb(8 13 32 / .97);-webkit-backdrop-filter:blur(20px) saturate(150%);backdrop-filter:blur(20px) saturate(150%);color:#eef2f7;overflow-y:auto;overscroll-behavior:contain;opacity:0;visibility:hidden;transition:opacity .22s var(--gn-ease),visibility 0s linear .22s}
.gn-sheet.is-open{opacity:1;visibility:visible;transition:opacity .22s var(--gn-ease)}
.gn-sheet-top{display:flex;align-items:center;justify-content:space-between;flex:none;height:64px;margin:0 -8px 8px -8px}
.gn-sheet-top img{width:46px;height:auto;margin-left:4px}
.gn-close{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:0;border-radius:10px;background:transparent;color:#eef2f7;cursor:pointer}
.gn-close svg{width:24px;height:24px}
.gn-close:focus-visible,.gn-sheet a:focus-visible{outline:2px solid #a5b4fc;outline-offset:2px;border-radius:8px}
.gn-main{display:flex;flex-direction:column}
.gn-main a{display:flex;align-items:center;justify-content:space-between;min-height:62px;color:rgb(226 232 240 / .82);font:700 32px/1.05 var(--gn-cond);letter-spacing:.005em;text-decoration:none;box-shadow:0 1px 0 rgb(148 163 184 / .16);opacity:0;transform:translateY(8px);transition:color .15s,opacity .3s var(--gn-ease),transform .3s var(--gn-ease)}
.gn-main a > span{display:flex;align-items:center;gap:12px}
.gn-main a svg{width:18px;height:18px;flex:none;color:#8e9bb0}
.gn-main a[aria-current="page"]{color:#fff}
.gn-main a[aria-current="page"] > span::before{content:"";width:8px;height:8px;border-radius:50%;background:#a5b4fc}
.gn-main a:active{color:#fff}
.gn-sheet.is-open .gn-main a{opacity:1;transform:none;transition-delay:calc(var(--i) * 30ms)}
.gn-more{display:flex;flex-wrap:wrap;gap:6px 22px;margin-top:18px}
.gn-more a{display:inline-flex;align-items:center;min-height:40px;color:#8e9bb0;font:500 16px/1 var(--gn-din);text-decoration:none}
.gn-more a[aria-current="page"]{color:#fff}
.gn-acct{display:flex;align-items:center;gap:12px;padding:14px;border-radius:14px;background:rgb(255 255 255 / .05);color:inherit;text-decoration:none}
.gn-acct-wrap{margin-top:auto;padding-top:28px}
.gn-acct img{width:40px;height:40px;border-radius:50%;object-fit:cover;flex:none}
.gn-acct-name{font:650 16px/1.2 var(--gn-din);color:#fff}
.gn-acct .gn-pts{display:flex;height:auto;padding:0;margin-top:4px;font-size:16px}
.gn-acct-go{margin-left:auto;color:#a5b4fc;font:600 15px/1 var(--gn-din)}
.gn-signin{display:flex;align-items:center;justify-content:center;height:50px;border-radius:12px;background:#605dff;color:#fff;font:650 17px/1 var(--gn-din);text-decoration:none;transition:background-color .15s,transform .16s var(--gn-ease)}
.gn-signin:active,.gn-signin.gn-pressed{background:#4f4cf0;transform:scale(.97);transition-duration:.08s}
html.gn-locked,html.gn-locked body{overflow:hidden}
@media (min-width:1024px){.gn-sheet{display:none}}
@media (prefers-reduced-motion:reduce){
  nav.navbar,nav.navbar *,nav.navbar *::after,.gn-sheet,.gn-sheet *{transition:none!important}
  .gn-main a{opacity:1;transform:none}
}
@media print{.gn-sheet,.gn-pts,.gn-burger{display:none!important}}