/* OLSM design system tokens, copied from design-export/_ds/.../colors_and_type.css (:root only).
   Local edits (build 4, spec §19 maroon & gold): the two navy "lake" tokens are removed, --info repointed, and a role-token block added at the end. */
:root {
  /* ============================================================
     COLOR — Primary Palette
     Crimson is the heart of the identity. It matches the
     block "SM" monogram and the ring around the crest.
     ============================================================ */
  --ols-crimson:       #B3121A;  /* primary brand red — crest ring, monogram */
  --ols-crimson-deep:  #8C0E14;  /* pressed / hover darker */
  --ols-crimson-dark:  #5E0A0E;  /* rich maroon — headers, footers */
  --ols-crimson-ink:   #2E0507;  /* near-black with red undertone */

  --ols-ivory:         #F7F2E7;  /* warm off-white, parchment */
  --ols-cream:         #EFE7D3;  /* slightly deeper cream */
  --ols-paper:         #FBF8F1;  /* card surface, bg */
  --ols-white:         #FFFFFF;

  --ols-gold:          #C8A24B;  /* heraldic gold — crest accents */
  --ols-gold-deep:     #8A6D23;  /* darker ornamental gold */

  --ols-ink:           #1A1714;  /* body text, near-black with warmth */
  --ols-ink-soft:      #3A332D;
  --ols-stone:         #6B625A;  /* muted supporting text */
  --ols-stone-light:   #A79F93;
  --ols-line:          #D9D0BE;  /* hairline borders on cream */
  --ols-line-soft:     #E8E0CE;

  /* Supporting heritage tones (Polish-American / ecclesiastical) */
  --ols-sage:          #4A5A3A;  /* campus grounds green */
  --ols-parchment-sh:  #C9BEA3;  /* aged paper shadow */

  /* ============================================================
     COLOR — Semantic Tokens
     ============================================================ */
  --fg-1:      var(--ols-ink);         /* primary text */
  --fg-2:      var(--ols-ink-soft);    /* secondary text */
  --fg-3:      var(--ols-stone);       /* tertiary / captions */
  --fg-muted:  var(--ols-stone-light); /* de-emphasized */
  --fg-inverse:var(--ols-ivory);       /* on dark */

  --bg-1:      var(--ols-paper);       /* page */
  --bg-2:      var(--ols-ivory);       /* surface */
  --bg-3:      var(--ols-cream);       /* raised / section */
  --bg-dark:   var(--ols-crimson-dark);
  --bg-ink:    var(--ols-crimson-ink);

  --accent:        var(--ols-crimson);
  --accent-hover:  var(--ols-crimson-deep);
  --accent-fg:     var(--ols-ivory);
  --accent-gold:   var(--ols-gold);

  --border:        var(--ols-line);
  --border-soft:   var(--ols-line-soft);
  --border-strong: var(--ols-ink);

  --success: #3F6B2E;
  --warning: #B87A1B;
  --danger:  #A1121A;
  --info:    var(--ols-crimson-deep);

  /* ============================================================
     TYPE — Families
     ============================================================ */
  --font-display: 'Playfair Display', 'Hoefler Text', 'Garamond', Georgia, serif;
  --font-body:    'Lora', 'Hoefler Text', 'Iowan Old Style', Georgia, serif;
  --font-varsity: 'Alfa Slab One', 'Rockwell', 'Clarendon', Georgia, serif;
  --font-script:  'Pinyon Script', 'Snell Roundhand', cursive;
  --font-mono:    ui-monospace, 'SF Mono', 'Menlo', 'Consolas', monospace;

  /* Size scale — anchored to 16px, fluid for display sizes */
  --fs-xs:   12px;
  --fs-sm:   14px;
  --fs-base: 16px;
  --fs-md:   18px;
  --fs-lg:   20px;
  --fs-xl:   24px;
  --fs-2xl:  32px;
  --fs-3xl:  44px;
  --fs-4xl:  60px;
  --fs-5xl:  84px;
  --fs-6xl:  120px;

  /* Weights */
  --fw-regular: 400;
  --fw-medium:  500;
  --fw-semi:    600;
  --fw-bold:    700;
  --fw-black:   900;

  /* Line heights */
  --lh-tight: 1.08;
  --lh-snug:  1.22;
  --lh-body:  1.55;
  --lh-loose: 1.75;

  /* Letter spacing */
  --tr-tight:  -0.02em;
  --tr-normal:  0em;
  --tr-wide:    0.04em;
  --tr-caps:    0.14em;   /* ALL-CAPS small eyebrow labels */
  --tr-crest:   0.22em;   /* around-the-ring crest style */

  /* ============================================================
     SPACING, RADII, SHADOW, MOTION
     ============================================================ */
  --sp-0:  0;
  --sp-1:  4px;
  --sp-2:  8px;
  --sp-3:  12px;
  --sp-4:  16px;
  --sp-5:  24px;
  --sp-6:  32px;
  --sp-7:  48px;
  --sp-8:  64px;
  --sp-9:  96px;
  --sp-10: 128px;

  --r-0:   0;
  --r-1:   2px;
  --r-2:   4px;    /* most UI — school style is tailored / low radius */
  --r-3:   6px;
  --r-4:   10px;
  --r-pill: 999px;

  /* Shadows — restrained, slightly warm */
  --sh-1: 0 1px 2px rgba(46, 5, 7, 0.06);
  --sh-2: 0 2px 6px rgba(46, 5, 7, 0.08), 0 1px 2px rgba(46, 5, 7, 0.06);
  --sh-3: 0 8px 24px rgba(46, 5, 7, 0.12), 0 2px 6px rgba(46, 5, 7, 0.08);
  --sh-4: 0 18px 48px rgba(46, 5, 7, 0.18), 0 4px 12px rgba(46, 5, 7, 0.10);
  --sh-inset: inset 0 0 0 1px rgba(46, 5, 7, 0.08);

  --ring-focus: 0 0 0 3px rgba(179, 18, 26, 0.28);

  /* Motion — calm, educational; no bounces */
  --ease-standard: cubic-bezier(0.2, 0.0, 0.2, 1);
  --ease-out:      cubic-bezier(0.0, 0.0, 0.2, 1);
  --dur-fast:   140ms;
  --dur-base:   220ms;
  --dur-slow:   380ms;

  /* Layout rhythm */
  --container-max: 1200px;
  --container-wide: 1360px;
  --gutter: 24px;
}

/* ---- Site role tokens (spec §19, maroon & gold). site.css uses these instead of raw palette names. ---- */
:root {
  --c-heading:   var(--ols-crimson-dark);  /* h1–h3, wordmark, metric numerals, .chip b, statlines: 13.0:1 on paper */
  --c-link:      var(--ols-crimson-deep);  /* links, .metric .go, outline .btn, focus outline, active nav: 9.1:1 on paper */
  --c-verified:  var(--ols-crimson-dark);  /* Verified chip border + text on ivory: 12.3:1 */
  --c-bar:       var(--ols-crimson-dark);  /* /coach bar, skip link, footer band (ivory text) */
  --c-film:      var(--ols-crimson-dark);  /* film box / poster placeholder / clip thumb gradient start */
  --c-film-deep: var(--ols-crimson-ink);   /* film box bg, gradient end, playing thumb */
  --c-rule-gold: var(--ols-gold);          /* decorative rules only; gold text only on --c-bar / --c-film-deep */
}

/* ---- spec §22.1 type scale + §22.2 rhythm (Todd, 6:57 PM Sep 29). Phone (<1024) values, then ≥1024. site.css sizes text only through these. ---- */
:root {
  --t-body: 17px;       --lh-t-body: 1.6;
  --t-support: 15px;    --lh-t-support: 1.45;
  --t-label: 13px;      --lh-t-label: 1.2;   --tr-t-label: 0.1em;   /* caps, Lora 600: the only 13px text */
  --t-tile-lbl: 17px;   --lh-t-tile-lbl: 1.3;
  --t-table: 16px;      --lh-t-table: 1.35;
  --t-h3: 22px;         --lh-t-h3: 1.2;      --tr-t-h3: -0.01em;
  --t-h2: 34px;         --lh-t-h2: 1.1;      --tr-t-h2: -0.015em;
  --t-h1: 46px;         --lh-t-h1: 1.02;     --tr-t-h1: -0.02em;
  --t-metric: 46px;     --t-metric-unit: 20px;
  /* Build 8d (Design Lead, Sept 30): headline stat numerals 44px on phones, three across; the row is a size container (.metrics) and the numeral
     shrinks only where .979 (2.278em in Alfa Slab One) would outgrow its box: (row/3 - gaps - 1px borders - 5px side padding) / 2.29 -> 40px at 360. */
  --t-metric-box: clamp(32px, calc((33.333cqi - 14.67px) / 2.29), 44px); --t-metric-box-unit: 15px;
  --t-feature: clamp(36px, calc(36px + (100vw - 390px) * 0.011429), 48px);      --lh-t-feature: 0.95;   /* Build 8d (Design Lead): 34-FOR-65 36px at <=390, 48px at 1440, linear between (43px at 1024) */
  --t-feature-avg: 30px;
  --t-quote: 20px;     --lh-t-quote: 1.4;   /* Build 8g (§28): homepage Coach quote, Playfair 400 italic */
  --t-ui: 15px;         /* chapter chips, buttons, tags, tab bar: never under 14px (§22.1 floor) */
  --gap-band: 40px;     /* section top padding */
  --gap-head: 16px;     /* section head -> content */
  --gap-foot: 48px;     /* footer top margin */
  --measure: 62ch;
}
@media (min-width: 1024px) {
  :root {
    --t-body: 19px; --t-support: 16px; --t-label: 13px; --t-tile-lbl: 18px; --t-table: 17px;
    --t-h3: 26px; --t-h2: 48px; --t-h1: 68px; --t-metric: 60px; --t-metric-unit: 24px;
    --t-quote: 24px;   /* Build 8g (§28) */
    /* Build 8d: target 72px at 1440; capped by what fits three equal boxes in the profile column (8px gaps, 6px side padding): ~47px at 1024, ~58px at 1440 */
    --t-metric-box: clamp(44px, calc((33.333cqi - 19.34px) / 2.29), 72px); --t-metric-box-unit: 18px;
    --t-feature-avg: 40px;
    --gap-band: 72px; --gap-head: 24px; --gap-foot: 72px;
  }
}