/* FIRST TOUCH — brand tokens
 * Leithon English · leithonenglish.me
 * v1.0
 */
:root {
  /* Surface — warm-cool ink, never pure black */
  --ft-ink-900: #0E110F;
  --ft-ink-700: #1A1F1C;
  --ft-ink-500: #363E39;
  --ft-fog:     #8A9490;

  /* Chalk — off-whites, low saturation */
  --ft-chalk-100: #F5F3EC;
  --ft-chalk-300: #E2DED3;
  --ft-chalk-500: #C6C1B4;

  /* Accents — close in lightness & chroma, hue apart */
  --ft-kit:   #4499D7; /* oklch(0.66 0.12 243) — primary signal, matches the resume */
  --ft-gold:  #D89A1A; /* oklch(0.73 0.15 79)  — secondary, sparing */
  --ft-kit-deep:  #1172AD; /* the kit, darkened for chalk surfaces */
  --ft-gold-deep: #9B6000; /* the gold, darkened for chalk surfaces */

  /* Type */
  --ft-font-display: "Bricolage Grotesque", ui-sans-serif, system-ui, sans-serif;
  --ft-font-text:    "Instrument Sans", ui-sans-serif, system-ui, sans-serif;
  --ft-font-mono:    "JetBrains Mono", ui-monospace, monospace;

  /* Scale — 1920 desktop */
  --ft-size-hero:    96px;  /* display, -0.035em, lh 0.94 */
  --ft-size-h1:      64px;
  --ft-size-h2:      40px;
  --ft-size-h3:      26px;
  --ft-size-body:    18px;  /* lh 1.65 */
  --ft-size-small:   15px;
  --ft-size-eyebrow: 12px;  /* mono, uppercase, 0.16em */

  /* Line — chalk markings, always hairline */
  --ft-line: 1px solid rgba(226,222,211,0.14);
  --ft-line-light: 1px solid #E2DED3;

  /* Radius — the arc language */
  --ft-radius-pill: 999px;
  --ft-radius-card: 10px;
  --ft-radius-tight: 4px;

  /* Space — 8pt, four steps only */
  --ft-space-1: 8px;
  --ft-space-2: 16px;
  --ft-space-3: 32px;
  --ft-space-4: 64px;
  --ft-space-5: 112px;

  /* Motion — the first touch: control, then settle */
  --ft-ease-touch: cubic-bezier(0.22, 1.2, 0.36, 1);
  --ft-ease-glide: cubic-bezier(0.4, 0, 0.2, 1);
  --ft-dur-fast: 180ms;
  --ft-dur-base: 280ms;
  --ft-dur-slow: 620ms;
}