/* Hallmark · genre: modern-minimal · theme: Cobalt · design-system: design.md
 * Scopes: app (Workbench — public/, admin-static/) · marketing (Stat-Led — marketing-static/)
 * Canonical token set — mirror any change into public/css/tokens.css,
 * admin-static/css/tokens.css and marketing-static/css/tokens.css
 * (the three services ship their own copies). */

:root {
  /* colour — cool engineered light, one steel-blue signal.
     Accent sampled from the brand wordmark (logo blue #005580);
     --color-danger already sits on the brand red (#b01f26). */
  --color-paper:       oklch(98.5% 0.004 250);
  --color-paper-2:     oklch(96.2% 0.006 250);
  --color-rule:        oklch(90% 0.008 252);
  --color-rule-2:      oklch(83% 0.012 252);
  --color-ink:         oklch(21% 0.02 258);
  --color-ink-2:       oklch(34% 0.018 257);
  --color-muted:       oklch(46% 0.022 257);
  --color-accent:      oklch(43% 0.10 240);
  --color-accent-2:    oklch(38% 0.09 240);
  --color-accent-ink:  oklch(98.5% 0.004 250);
  --color-accent-wash: oklch(95% 0.02 240);
  --color-graphite:    oklch(22% 0.016 260);
  --color-graphite-2:  oklch(30% 0.02 260);
  --color-graphite-ink: oklch(94% 0.008 250);
  --color-graphite-muted: oklch(75% 0.012 255); /* secondary text on graphite */
  --color-danger:      oklch(50% 0.19 27);
  --color-danger-wash: oklch(96% 0.02 27);
  --color-focus:       oklch(43% 0.10 240);

  /* type */
  --font-display: 'Space Grotesk', 'Segoe UI', sans-serif;
  --font-body:    'IBM Plex Sans', 'Segoe UI', sans-serif;
  --font-mono:    'IBM Plex Mono', ui-monospace, monospace;

  --text-xs:        0.75rem;
  --text-sm:        0.875rem;
  --text-md:        1.0625rem;
  --text-lg:        1.375rem;
  --text-display-s: clamp(1.55rem, 3.5vw + 0.4rem, 2.25rem);
  --text-display:   clamp(1.9rem, 4.5vw + 0.5rem, 2.75rem);
  --text-display-xl: clamp(2.4rem, 6vw + 0.5rem, 3.9rem);  /* marketing hero headline only */
  --text-figure:     clamp(4rem, 9vw + 1rem, 7rem);        /* marketing hero stat figure only */

  /* space — 4pt scale */
  --space-2xs: 0.25rem;
  --space-xs:  0.5rem;
  --space-sm:  0.75rem;
  --space-md:  1rem;
  --space-lg:  1.5rem;
  --space-xl:  2.5rem;
  --space-2xl: 4rem;
  --space-3xl: 6rem;   /* marketing section rhythm only */

  /* motion */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in:  cubic-bezier(0.7, 0, 0.84, 0);
  --dur-micro: 120ms;
  --dur-short: 200ms;
  --dur-swap:  280ms;
  --dur-reveal: 560ms; /* marketing reveals + hero entrance only */
  --dur-sweep:  1100ms; /* marketing hero art sweep-in only */

  /* shape */
  --radius-ctl:  6px;
  --radius-chip: 4px;
  --radius-card: 10px;
}