/* Scenotopie — design tokens. The entire visual contract lives here.
   Light only. Rules of the system:
   - plates (pastel surfaces) always carry ink text, never deep hues
   - deep hues are text accents on paper only
   - every diagonal in the product is the same 12° cut (run = rise / tan 12°)
   - two typefaces: Fraunces speaks (names, titles, numerals), Archivo works */

@font-face {
  font-family: "Fraunces";
  src: url("../fonts/fraunces-var.woff2") format("woff2");
  font-weight: 600 900;
  font-display: swap;
}
@font-face {
  font-family: "Archivo";
  src: url("../fonts/archivo-var.woff2") format("woff2");
  font-weight: 400 700;
  font-display: swap;
}

:root {
  color-scheme: light;

  /* ---- color ---- */
  --paper: #faf6ef;
  --ink: #181511;
  --ink-soft: #57514a;
  --line: rgba(24, 21, 17, 0.14);

  --rose: #f2c7cf;
  --mint: #c9e4d4;
  --butter: #f5dfa6;
  --peri: #c7d3f0;
  --peach: #f6d3b4;
  --lilac: #dfd0ec;

  --rose-deep: #97404f;
  --mint-deep: #2f6a4e;
  --butter-deep: #7a5a10;
  --peri-deep: #36509b;
  --peach-deep: #8c4f1d;
  --lilac-deep: #5f4680;

  --link: var(--peri-deep);

  /* ---- type ---- */
  --font-display: "Fraunces", Georgia, serif;
  --font-ui: "Archivo", system-ui, sans-serif;

  /* Two small sizes only: --text-tag for uppercase tags/eyebrows, --text--1
     for every readable caption/footnote/meta. Nothing renders below 0.75rem. */
  --text-tag: 0.75rem;
  --text--1: 0.875rem;
  --text-0: 1rem;                           /* body */
  --text-1: 1.1875rem;                      /* ledes */
  --display-3: clamp(1.5rem, 2.5vw, 2rem);  /* card titles */
  --display-2: clamp(2rem, 4vw, 3.25rem);   /* section heads */
  --display-1: clamp(2.625rem, 7vw, 5.5rem); /* page heroes; floor fits
                                                "Scenotopie" on a phone */
  --mega: clamp(3.5rem, 9vw, 7rem);         /* hero numerals, Fraunces 900 */

  /* ---- space ---- */
  --sp-1: 0.25rem;
  --sp-2: 0.5rem;
  --sp-3: 0.75rem;
  --sp-4: 1rem;
  --sp-5: 1.5rem;
  --sp-6: 2.5rem;
  --sp-7: 4rem;
  --sp-8: 6.5rem;
  --gutter: clamp(16px, 4vw, 48px);
  --measure: 68ch;

  /* ---- the 12° cut ---- */
  --tan12: 0.21256;
  --cut-sm: 1.25rem;
  --cut-md: 3rem;
  --cut-lg: 4.5rem;

  /* ---- touch ---- */
  --tap: 44px; /* minimum hit target on coarse pointers */
}