/* ------------------------------------------------------------------ *
 *  tokens.css — the whole palette, scale and motion in one place.
 *  Warm off-white and ink. No accent colour. No dark mode.
 *  The hover "glow" is the text going darker + a soft shadow in its
 *  own colour — never a second hue.
 * ------------------------------------------------------------------ */

:root {
  /* — colour ————————————————————————————————————————————— */
  --paper:      #F4F1EA;   /* background — warm off-white, never pure */
  --paper-sink: #ECE8DE;   /* a shade down — hover wells, edges */
  --ink:        #1C1A17;   /* text at full strength (the active / hovered word) */
  --ink-soft:   #4A463F;   /* body text, captions */
  --ink-faint:  #B7B1A3;   /* the resting big words */
  --ink-ghost:  #D6D0C2;   /* barely-there — dividers, disabled */
  --glow:       rgba(28, 26, 23, 0.28);  /* the soft shadow under a hovered word */

  /* — type: one family in the uniform build; type-mixed.css swaps
       every role for a different family in the artistic build ——————— */
  --font-fallback: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-word-1:  'Space Grotesk', var(--font-fallback);
  --font-word-2:  'Space Grotesk', var(--font-fallback);
  --font-word-3:  'Space Grotesk', var(--font-fallback);
  --font-display: 'Space Grotesk', var(--font-fallback);   /* gallery h1 */
  --font-body:    'Space Grotesk', var(--font-fallback);   /* notes, intro */
  --font-caption: 'Space Grotesk', var(--font-fallback);   /* figure + preview captions */
  --font-meta:    'Space Grotesk', var(--font-fallback);   /* year · medium, counts */
  --font-ui:      'Space Grotesk', var(--font-fallback);   /* back link, wordmark, toggle */

  --w-light: 300;
  --w-reg:   400;
  --w-med:   500;

  /* — scale ——————————————————————————————————————————————— */
  --big:        clamp(1.35rem, 2.9vw, 2.35rem);   /* the three words — a quiet menu, not a headline */
  --pad-edge:   clamp(1.25rem, 4vw, 3rem);
  --col:        44rem;   /* narrow measure for prose */
  --media:      1180px;
  --media-wide: 1560px;

  /* — motion ——————————————————————————————————————————————— */
  --t-fast: 0.14s;
  --t-mid:  0.26s;
  --t-slow: 0.5s;
  --ease:   cubic-bezier(.4, 0, .2, 1);
  --ease-soft: cubic-bezier(.2, .75, .25, 1);   /* the letter-in curve */
}