/* ==========================================================================
   Vonimate design tokens — Angell-inspired luxury-editorial
   Cream + ink, no accent color (imagery and type weight carry the design).
   First established for the contact page; shared across the whole rebuild.
   ========================================================================== */

:root {
  /* --- Palette: cream (light side) + ink/black (dark side), no accent --- */
  --color-cream:        oklch(96.5% 0.006 85);   /* warm paper white, page base */
  --color-cream-deep:   oklch(93% 0.008 85);     /* slightly deeper cream, surfaces */
  --color-ink:          oklch(18% 0.005 60);     /* near-black, primary text on cream */
  --color-black:        oklch(12% 0 0);          /* true dark side */
  --color-black-soft:   oklch(20% 0 0);          /* dark surface */
  --color-line:         oklch(85% 0.006 85);     /* hairline dividers on cream */
  --color-muted:        oklch(48% 0.006 60);     /* secondary text on cream */
  --color-on-dark:      oklch(94% 0.006 85);     /* cream text on black */
  --color-on-dark-muted:oklch(68% 0.005 60);     /* secondary text on black */
  --color-danger:       oklch(55% 0.18 25);      /* form error state */
  --color-success:      oklch(58% 0.13 150);     /* form success state */

  /* --- Type families ---
     Hanken Grotesk is the free, open-source predecessor of HK Grotesk (same
     designer) — the closest free substitute for the Angell type system.
     Swap in Helvetica Now Display / HK Grotesk here if/when licensed. */
  --font-display: 'Hanken Grotesk', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-body:    'Hanken Grotesk', system-ui, -apple-system, 'Segoe UI', sans-serif;

  /* --- Type scale: clamp-based, editorial --- */
  --text-xs:    clamp(0.75rem, 0.72rem + 0.15vw, 0.82rem);
  --text-sm:    clamp(0.875rem, 0.84rem + 0.18vw, 0.95rem);
  --text-base:  clamp(1rem, 0.94rem + 0.30vw, 1.125rem);
  --text-lg:    clamp(1.25rem, 1.10rem + 0.60vw, 1.5rem);
  --text-xl:    clamp(1.75rem, 1.40rem + 1.60vw, 2.75rem);
  --text-2xl:   clamp(2.5rem, 1.80rem + 3.20vw, 4.5rem);
  --text-hero:  clamp(3rem, 1rem + 7vw, 8rem);

  --leading-tight:  1.05;
  --leading-snug:   1.2;
  --leading-normal: 1.55;
  --tracking-tight: -0.02em;
  --tracking-wide:  0.12em;   /* eyebrow / small-caps labels */

  /* --- Spacing --- */
  --space-2xs: 0.375rem;
  --space-xs:  0.5rem;
  --space-sm:  1rem;
  --space-md:  1.5rem;
  --space-lg:  2.5rem;
  --space-xl:  4rem;
  --space-section: clamp(4rem, 3rem + 5vw, 9rem);

  /* --- Motion --- */
  --duration-fast:   180ms;
  --duration-normal: 360ms;
  --duration-slow:   720ms;
  --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out:   cubic-bezier(0.65, 0, 0.35, 1);

  /* --- Layout --- */
  --max-content: 75rem;
  --radius: 2px;            /* Angell runs near-square; minimal radius */
  --border-hair: 1px solid var(--color-line);
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}