/* =====================================================================
   GLASS — one look for the footer and every navigation bar
   Dark, semi-transparent panel with a Gaussian blur of whatever is behind
   it, and light grey text and links (brighter on hover).
   Loaded last on every page so it wins over the older per-theme rules.
   ===================================================================== */
:root {
  --glass-bg: transparent;                      /* clear: no tint — only the blur */
  --glass-bg-strong: rgba(22, 22, 24, 0.93);   /* phone drop-down menu only, over busy content */
  --glass-filter: saturate(160%) blur(20px);
  --glass-border: rgba(255, 255, 255, 0.12);
  --glass-text: #d2d2d7;      /* light grey: text and links (switches to dark over light sections) */
  --glass-muted: #a1a1a6;     /* secondary text (copyright line) */
  --glass-bright: #f5f5f7;    /* hover / current item */
  --glass-rule: rgba(255, 255, 255, 0.14);
}

/* ---------- Footer (all pages) ---------- */
.u-footer {
  --ft-bg: var(--glass-bg); --ft-ink: var(--glass-bright); --ft-text: var(--glass-muted);
  --ft-link: var(--glass-text); --ft-rule: var(--glass-rule);
  background: var(--glass-bg);
  -webkit-backdrop-filter: var(--glass-filter); backdrop-filter: var(--glass-filter);
  border: 1px solid var(--glass-border);
  color: var(--glass-muted);
}
.u-footer h3 { color: var(--glass-text); }
.u-footer a { color: var(--glass-text); }
.u-footer a:hover, .u-footer a:focus-visible { color: var(--glass-bright); }
.u-footer .motion-optin { color: var(--glass-text); }

/* ---------- Home page header (every state: top of page, scrolled capsule, over light or dark sections) ---------- */
.site-header.site-header.site-header.site-header {
  color: var(--glass-text);
  background: var(--glass-bg);
  -webkit-backdrop-filter: var(--glass-filter); backdrop-filter: var(--glass-filter);
  border-color: var(--glass-border);
}
.site-header.site-header.site-header .site-nav li + li { border-left-color: var(--glass-rule); }
.site-header .site-nav a:hover, .site-header .site-nav a:focus-visible,
.site-header .site-nav a[aria-current="page"], .site-header .brand-mark:hover { color: var(--glass-bright); }
@media (max-width: 767px) {
  .site-header.site-header.site-header .site-nav {
    background: var(--glass-bg-strong); color: var(--glass-text);
    -webkit-backdrop-filter: var(--glass-filter); backdrop-filter: var(--glass-filter);
    border-color: var(--glass-border);
  }
  .site-header.site-header.site-header .site-nav li + li { border-left: 0; border-top-color: var(--glass-rule); }
}

/* ---------- Product pages: global bar and the sticky product bar ---------- */
.u-gnav {
  background: var(--glass-bg);
  -webkit-backdrop-filter: var(--glass-filter); backdrop-filter: var(--glass-filter);
  border-bottom: 1px solid var(--glass-border);
}
.u-gnav a, .u-gnav .lang-switch { color: var(--glass-text); }
.u-gnav a:hover, .u-gnav a[aria-current="page"] { color: var(--glass-bright); }
.u-gnav .u-gnav__mark { color: var(--glass-text) !important; }

.u-lnav, .u-lnav.is-stuck {
  background: var(--glass-bg);
  -webkit-backdrop-filter: var(--glass-filter); backdrop-filter: var(--glass-filter);
  border-color: var(--glass-border);
}
.u-lnav .u-lnav__title { color: var(--glass-text); }
.u-lnav .u-lnav__home, .u-lnav__sep { color: var(--glass-muted); }
.u-lnav .u-lnav__home:hover, .u-lnav .u-lnav__home:focus-visible { color: var(--glass-bright); }
.u-lnav__links a:not(.u-pill) { color: var(--glass-text); }
.u-lnav__links a:not(.u-pill):hover, .u-lnav__links a[aria-current="true"] { color: var(--glass-bright); }
.u-lnav__links a[aria-current="true"] { border-bottom-color: var(--glass-bright); }

/* Browsers without backdrop blur: use a more solid panel so text stays readable */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .u-footer, .site-header.site-header.site-header.site-header, .u-gnav, .u-lnav, .u-lnav.is-stuck { background: rgba(22, 22, 24, 0.94); }
  .glass-on-light.glass-on-light { background: rgba(245, 245, 247, 0.94) !important; }
}

/* ---------- STADIA logo (white) in place of the icon + "STADIA GLOBAL" text ---------- */
.nav-logo, .nav-logo img { display: block; }
.nav-logo img { width: auto; max-width: none; }
.site-header .nav-logo img { height: 28px; }                 /* home header */
.u-gnav .nav-logo img { height: 26px; }                      /* product pages’ top bar */
.brand-mark, .u-gnav__mark { opacity: .92; transition: opacity .2s ease; }
.brand-mark:hover, .u-gnav__mark:hover, .brand-mark:focus-visible, .u-gnav__mark:focus-visible { opacity: 1; }
@media (max-width: 767px) {
  .site-header .nav-logo img { height: 22px; }
  .u-gnav .nav-logo img { height: 17px; }
}

/* ---------- Clear glass over light sections ----------
   The bars have no tint, so js/site.js adds .glass-on-light while a bar sits over a light
   section (white, light grey, bright green or orange). Text, borders and the logo turn dark there. */
.glass-on-light {
  --glass-text: #1d1d1f; --glass-muted: #3a3a3c; --glass-bright: #000000;
  --glass-border: rgba(0, 0, 0, 0.12); --glass-rule: rgba(0, 0, 0, 0.16);
}
.site-header.glass-on-light.glass-on-light.glass-on-light.glass-on-light { color: var(--glass-text); border-color: var(--glass-border); }
.glass-on-light .nav-logo img { filter: invert(1) brightness(0.12); }
.glass-on-light .lang-switch__select option { color: #111; }
.u-lnav.glass-on-light .u-lnav__title { color: var(--glass-text); }
.nav-logo img { transition: filter .3s ease; }
.site-header, .u-gnav, .u-lnav, .u-footer { transition: color .3s ease, border-color .3s ease, background-color .3s ease; }

/* Over photos and video (no single background colour), a soft shadow keeps the light text legible */
.site-header:not(.glass-on-light), .u-gnav:not(.glass-on-light), .u-lnav:not(.glass-on-light) { text-shadow: 0 1px 10px rgba(0, 0, 0, 0.55); }
.site-header:not(.glass-on-light) .nav-logo img, .u-gnav:not(.glass-on-light) .nav-logo img { filter: drop-shadow(0 1px 6px rgba(0, 0, 0, 0.5)); }
.glass-on-light { text-shadow: none; }
.u-pill, .lang-switch__select { text-shadow: none; }
.site-header.glass-on-light .site-nav a { opacity: .9; }

/* ---------- Copy deterrents (html.is-protected, set by js/site.js) ---------- */
.is-protected body { -webkit-touch-callout: none; }           /* iOS long-press "Save image" sheet */
.is-protected img, .is-protected video, .is-protected picture, .is-protected svg {
  -webkit-user-select: none; user-select: none; -webkit-user-drag: none;
}
.is-protected main { -webkit-user-select: none; user-select: none; }
.is-protected main input, .is-protected main textarea, .is-protected main select,
.is-protected main [contenteditable="true"] { -webkit-user-select: text; user-select: text; }
@media print { .is-protected body { display: none !important; } }   /* printing shows a blank page */