/* =========================================================================
   theme.css — tokens, palette, self-hosted type (lane: type-color)
   =========================================================================

   CONTRAST — verified (WCAG 2.x relative-luminance formula, computed):
     --ink      #1C1A17  on  --bg #F2F1EE  =  15.37 : 1   (body text, PASS)
     --ink-dim  #66625B  on  --bg #F2F1EE  =   5.37 : 1   (>= 4.5:1, PASS)
     --accent   #A6431C  on  --bg #F2F1EE  =   5.40 : 1   (AA at any size)

   Two families, self-hosted, 44.7 KB total, zero external requests:
     display — Instrument Serif 400  (21.0 KB)
     body    — Inter 400             (23.7 KB)
   Metric-matched local fallbacks (size-adjust derived from real font
   metrics: fontTools weighted x-advance) keep CLS at 0 during swap.
   ========================================================================= */

/* ---- faces ------------------------------------------------------------- */

@font-face {
  font-family: "Instrument Serif";
  src: url("../assets/fonts/instrument-serif-latin-400-normal.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: optional; /* perf lane: swap→optional — swap re-layout moved .site-nav ~11px (CLS 0.0000147); optional uses the font from the first frame (it loads in ~60ms locally, within the render-hold) and never swaps mid-page, so font CLS is 0 by construction */
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2212, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "Inter";
  src: url("../assets/fonts/inter-latin-400-normal.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: optional; /* perf lane: same reason as above */
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2212, U+FEFF, U+FFFD;
}

/* Metric shims — same two voices, zero layout shift while loading. */

@font-face {
  font-family: "Instrument Serif Fallback";
  src: local("Times New Roman");
  size-adjust: 84.63%;
  ascent-override: 116.98%;
  descent-override: 36.63%;
  line-gap-override: 0%;
}

@font-face {
  font-family: "Inter Fallback";
  src: local("Arial");
  size-adjust: 107.49%;
  ascent-override: 90.13%;
  descent-override: 22.44%;
  line-gap-override: 0%;
}

/* ---- tokens ------------------------------------------------------------ */

:root {
  color-scheme: light;

  /* palette — warm paper, warm ink, one terracotta accent. no gradients. */
  --bg: #F2F1EE;
  --ink: #1C1A17;
  --ink-dim: #66625B;
  --accent: #A6431C;

  /* families */
  --font-display: "Instrument Serif", "Instrument Serif Fallback",
    "Times New Roman", serif;
  --font-body: "Inter", "Inter Fallback", Arial, "Helvetica Neue",
    sans-serif;

  /* fluid scale — quiet through step-2, editorial at step-3,
     enormous at step-4 (hero name ≈ 216 px on a 1920 frame). */
  --step--1: clamp(0.72rem, 0.7rem + 0.1vw, 0.8125rem);
  --step-0: clamp(1rem, 0.95rem + 0.22vw, 1.1875rem);
  --step-1: clamp(1.15rem, 1.05rem + 0.45vw, 1.5rem);
  --step-2: clamp(1.45rem, 1.24rem + 0.9vw, 2.25rem);
  --step-3: clamp(1.9rem, 1.35rem + 2.4vw, 3.75rem);
  --step-4: clamp(3.5rem, 2rem + 10.8vw, 13.5rem);
}

/* Base canvas lives with the tokens so the hero render (built on #F2F1EE)
   can never seam against the page, whatever loads after this file. */
html {
  background-color: var(--bg);
}

body {
  background-color: var(--bg);
  color: var(--ink);
}