/* Hallmark · tokens — Sparked brand, locked.
 * paper #FAF3E1 · ink #1A3263 · accent #FA8112 · Playfair Display + IBM Plex Sans
 * axes: paper=light · display=high-contrast-serif · accent=warm-orange
 */
:root {
  /* colour — brand, expressed as OKLCH */
  --color-paper:      oklch(96.2% 0.028 92);          /* #FAF3E1 */
  --color-paper-2:    oklch(92.5% 0.030 94);          /* #EDE5D0 */
  --color-paper-3:    oklch(87.8% 0.031 96);          /* #DDD6C0 */
  --color-card:       oklch(99.2% 0.010 92);          /* warm near-white */
  --color-ink:        oklch(31.8% 0.083 263);         /* #1A3263 */
  --color-ink-2:      oklch(31.8% 0.083 263 / 0.62);
  --color-ink-3:      oklch(31.8% 0.083 263 / 0.42);
  --color-rule:       oklch(31.8% 0.083 263 / 0.14);
  --color-rule-soft:  oklch(31.8% 0.083 263 / 0.08);
  --color-accent:     oklch(72.0% 0.171 55);          /* #FA8112 */
  --color-accent-soft:oklch(72.0% 0.171 55 / 0.12);
  --color-accent-ink: oklch(99.2% 0.010 92);
  --color-on-ink:     oklch(96.2% 0.028 92);
  --color-on-ink-2:   oklch(96.2% 0.028 92 / 0.58);
  --color-on-ink-3:   oklch(96.2% 0.028 92 / 0.34);
  --color-on-ink-rule:oklch(96.2% 0.028 92 / 0.14);
  --color-focus:      oklch(58% 0.16 55);
  --color-shadow:     oklch(31.8% 0.083 263 / 0.16);
  --color-shadow-soft:oklch(31.8% 0.083 263 / 0.08);
  --color-nav-veil:   oklch(96.2% 0.028 92 / 0.85);
  --color-pill-veil:  oklch(99.2% 0.010 92 / 0.88);

  /* type */
  --font-display: "Playfair Display", Georgia, serif;
  --font-body: "IBM Plex Sans", system-ui, sans-serif;

  --text-sm:   0.875rem;
  --text-base: 1rem;
  --text-md:   1.125rem;
  --text-lg:   1.375rem;
  --text-xl:   1.75rem;
  --text-2xl:  2.25rem;
  --text-display-s: clamp(2.1rem, 2.6vw + 1rem, 3.2rem);
  --text-display:   clamp(2.75rem, 4.2vw + 1rem, 4.9rem);

  /* space — 4pt */
  --space-3xs: 0.25rem;
  --space-2xs: 0.5rem;
  --space-xs:  0.75rem;
  --space-sm:  1rem;
  --space-md:  1.5rem;
  --space-lg:  2rem;
  --space-xl:  3rem;
  --space-2xl: 4.5rem;
  --space-3xl: 7rem;

  /* motion */
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in:     cubic-bezier(0.7, 0, 0.84, 0);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-micro: 120ms;
  --dur-short: 220ms;
  --dur-long:  420ms;
  --dur-nav:   520ms;

  /* shape */
  --radius-card:  20px;
  --radius-pill:  999px;
  --radius-input: 12px;
  --rule-hair: 1px;

  /* layout */
  --page-max: 72rem;
  --page-gutter: clamp(1rem, 4vw, 3rem);

  /* z scale */
  --z-base: 0;
  --z-raised: 10;
  --z-sticky: 20;
  --z-nav: 40;
}