/* SHUR shared base: fonts, the type-over-canvas stack, and motion defaults.
   Import it first: @import '/base/base.css'; (or <link rel="stylesheet">), and preload the
   one face the first screen needs:
   <link rel="preload" href="/base/fonts/geist-latin.woff2" as="font" type="font/woff2" crossorigin> */

/* Latin subsets (base/tools/fonts.py), swap, plus local fallbacks sized to the same metrics,
   so text painted before the font arrives takes the same space and the swap moves nothing. */
@font-face {
  font-family: 'Geist';
  src: url('./fonts/geist-latin.woff2') format('woff2');
  font-style: normal;
  font-weight: 100 900;
  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+2190-2193, U+2197, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Newsreader';
  src: url('./fonts/newsreader-italic-latin.woff2') format('woff2');
  font-style: italic;
  font-weight: 200 800;
  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+2190-2193, U+2197, U+2212, U+2215, U+FEFF, U+FFFD;
}


@font-face {
  font-family: 'Geist Fallback';
  src: local('Arial'), local('ArialMT');
  font-style: normal;
  font-weight: 100 549;
  size-adjust: 105.31%;
  ascent-override: 95.44%;
  descent-override: 28.01%;
  line-gap-override: 0.00%;
}

@font-face {
  font-family: 'Geist Fallback';
  src: local('Arial Bold'), local('Arial-BoldMT');
  font-style: normal;
  font-weight: 550 900;
  size-adjust: 105.09%;
  ascent-override: 95.63%;
  descent-override: 28.07%;
  line-gap-override: 0.00%;
}

@font-face {
  font-family: 'Newsreader Fallback';
  src: local('Georgia Italic'), local('Georgia-Italic');
  font-style: italic;
  font-weight: 200 800;
  size-adjust: 88.05%;
  ascent-override: 83.48%;
  descent-override: 30.10%;
  line-gap-override: 0.00%;
}

:root {
  --base-sans: 'Geist', 'Geist Fallback', system-ui, sans-serif;
  --base-serif: 'Newsreader', 'Newsreader Fallback', Georgia, serif;
  --base-navy: #050a1a;
  --base-peri: #8b9cf0;
  --base-ink: #eef0fb;
}

/* The stack: a background canvas (shader, texture, footage field) strictly behind live type.
   <section class="base-stack">
     <canvas class="base-bg" aria-hidden="true"></canvas>
     <div class="base-type"> ...DOM / SVG text... </div>
   </section>
   Effects belong to .base-bg (or to media elements). The type layer gets no filter,
   backdrop-filter, will-change, scale() or fractional translate: those resample it. */
.base-stack {
  position: relative;
  isolation: isolate;
}

.base-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

/* A page-wide ground that stays put while the page scrolls over it. */
.base-bg.is-fixed {
  position: fixed;
  z-index: -1;
}

.base-type {
  position: relative;
  z-index: 1;
}

/* A blur or frost behind type goes on its own sibling layer, never on the type's box. */
.base-frost {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 1ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 1ms !important;
    scroll-behavior: auto !important;
  }
}