/* SuperFile top nav — THE single source of truth for the global .gnav navbar on
   every marketing page. Loaded AFTER the per-page CSS so it wins the cascade over
   any legacy per-page .gnav rules (several had drifted: wrong background opacity,
   missing saturate, 14px vs 22px gutter — which knocked the sub-nav title out of
   alignment with the logo). No page should hardcode its own .gnav styles.
   Canonical values mirror /assets/base.css (used by console pages + /partners). */
.gnav{height:44px;background:rgba(250,250,252,.8);backdrop-filter:saturate(1.8) blur(20px);-webkit-backdrop-filter:saturate(1.8) blur(20px);border-bottom:1px solid rgba(0,0,0,.07);position:sticky;top:0;z-index:30}
.gnav .in{max-width:1024px;margin:0 auto;height:100%;padding:0 22px;display:flex;align-items:center;justify-content:center;gap:40px;font-size:12px;letter-spacing:-.01em}
.gnav a{text-decoration:none;color:rgba(29,29,31,.8);transition:color .1s ease}
.gnav a:hover{color:#000;text-decoration:none}
.gnav .lg{height:15.4px;width:68px;color:var(--ink,#1d1d1f);display:block}
.gnav .ndrop{position:relative;display:inline-flex;align-items:center}
.gnav .ndrop>.ntop{cursor:pointer}
.gnav .nmenu{position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(8px);min-width:184px;background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:12px;box-shadow:0 14px 38px rgba(0,0,0,.16);padding:7px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .18s ease,transform .18s ease;z-index:130}
.gnav .nmenu::before{content:"";position:absolute;left:0;right:0;top:-10px;height:10px}
.gnav .nmenu a{display:block;color:var(--ink,#1d1d1f);font-size:13.5px;font-weight:400;padding:9px 14px;border-radius:8px;white-space:nowrap}
.gnav .nmenu a:hover{background:#f5f5f7;color:#000;text-decoration:none}
.gnav .ndrop:hover .nmenu,.gnav .ndrop:focus-within .nmenu{opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(2px)}
.mnavb{display:flex;border:0;background:none;cursor:pointer;color:var(--ink,#1d1d1f);padding:6px;margin-left:2px;-webkit-tap-highlight-color:transparent}
.sipill{background:var(--blue,#0071E3);color:#fff !important;border-radius:999px;padding:4.5px 13px;line-height:1;display:inline-flex;align-items:center;white-space:nowrap;transition:background .15s}
.sipill:hover{background:var(--blue-h,#0077ED);text-decoration:none !important;color:#fff}
/* account-nav layout (marketing pages use .gnav.agnav — right-aligned, logo pushes left) */
.gnav.agnav .in{justify-content:flex-end;max-width:1024px;padding:0 22px;gap:28px}
.gnav.agnav .in > a:first-child{margin-right:auto}
.agnav .gico{display:flex !important;color:var(--ink,#1d1d1f)}
/* bag icon is hidden until the visitor has something in their bag (nav.js toggles .bag-hidden).
   Higher specificity than the rule above so it beats its !important. */
.agnav .gico.bag-hidden{display:none !important}
.agnav .mnavb{display:none}
.gnav .gico{align-items:center;justify-content:center;min-height:44px;padding:0 5px}
@media (max-width:740px){
  .gnav .in{gap:20px;padding:0 14px}
  .gnav.agnav .in{gap:18px;padding:0 16px}
  .gnav.agnav .in > a:not(:first-child):not(.gico){display:none}
  .gnav.agnav .in > .ndrop{display:none}
  .gnav.agnav .in > .sipill{display:inline-flex !important}
  .agnav .mnavb{display:flex}
  .mnavb{align-items:center;justify-content:center;min-height:44px}
}
