/* Hallmark · tokens: kinetic finance atlas · anchor hue: electric gold */
:root {
  --color-ink: oklch(16% 0.018 78);
  --color-muted: oklch(46% 0.034 74);
  --color-paper: oklch(96% 0.025 85);
  --color-paper-warm: oklch(91% 0.044 82);
  --color-coal: oklch(12% 0.018 72);
  --color-coal-2: oklch(18% 0.023 70);
  --color-gold: oklch(82% 0.142 82);
  --color-red: oklch(46% 0.15 34);
  --color-teal: oklch(42% 0.095 178);
  --color-platinum: oklch(86% 0.012 78);
  --color-champagne: oklch(89% 0.074 88);
  --color-focus: oklch(84% 0.18 88);
  --color-line: color-mix(in oklch, var(--color-ink) 14%, transparent);
  --color-line-soft: color-mix(in oklch, var(--color-ink) 6%, transparent);
  --color-line-on-dark: color-mix(in oklch, var(--color-paper) 16%, transparent);
  --color-hero-scrim: color-mix(in oklch, var(--color-coal) 88%, transparent);

  --font-display: "Unbounded", "Arial Black", system-ui, sans-serif;
  --font-body: "Inter Tight", Inter, "Segoe UI", system-ui, sans-serif;

  --space-2xs: 0.375rem;
  --space-xs: 0.625rem;
  --space-sm: 0.875rem;
  --space-md: 1.25rem;
  --space-lg: 1.75rem;
  --space-xl: 2.5rem;
  --space-2xl: 3.5rem;
  --space-3xl: 5rem;
  --space-4xl: 7rem;

  --text-xs: 0.78rem;
  --text-sm: 0.92rem;
  --text-md: 1rem;
  --text-lg: 1.18rem;
  --text-xl: 1.45rem;
  --text-display-s: clamp(2.5rem, 7vw, 5.8rem);
  --text-display: clamp(3.6rem, 10vw, 8.4rem);

  --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-fast: 180ms;
  --dur-med: 320ms;
  --dur-slow: 720ms;

  --radius-sm: 0.5rem;
  --radius-md: 0.75rem;
  --radius-lg: 1rem;
  --radius-pill: 999px;
  --rule-thin: 1px;
  --focus-size: 3px;
  --focus-offset: 4px;
  --max-width: 1180px;

  --shadow-card: 0 18px 70px color-mix(in oklch, var(--color-ink) 9%, transparent);
  --shadow-lift: 0 28px 90px color-mix(in oklch, var(--color-ink) 15%, transparent);
  --shadow-floating: 0 18px 60px color-mix(in oklch, var(--color-coal) 28%, transparent);
  --shadow-gold: 0 18px 50px color-mix(in oklch, var(--color-gold) 28%, transparent);
  --shadow-gold-soft: 0 14px 36px color-mix(in oklch, var(--color-gold) 18%, transparent);
  --shadow-platinum: 0 22px 80px color-mix(in oklch, var(--color-platinum) 18%, transparent);
  --shadow-ink: 0 18px 48px color-mix(in oklch, var(--color-ink) 20%, transparent);
}
