/* Hallmark · tokens · theme: studied-DNA (source: cip_spark_pitch_template_feb26End.pdf)
 * paper-band: light · display-style: humanist-sans (Carlito ≈ Calibri) · accent-hue: cool (teal 218°)
 * Brand teal #29b5d6 and dot mustard #ffcd69 taken from the deck + eldr-logo.svg.
 */
:root {
  /* Surface */
  --color-paper:      oklch(100% 0 0);
  --color-paper-2:    oklch(97.8% 0.008 220);
  --color-paper-3:    oklch(95% 0.014 220);
  --color-rule:       oklch(91% 0.012 220);

  /* Ink */
  --color-ink:        oklch(21.5% 0.008 240);   /* 17:1 on paper */
  --color-ink-2:      oklch(50% 0.02 240);      /* 5.8:1 on paper */

  /* Brand */
  --color-brand:      oklch(71.7% 0.121 218.5); /* #29b5d6 — art, fills, large marks only */
  --color-brand-soft: oklch(94% 0.03 218.5);
  --color-accent-ink: oklch(52.5% 0.095 222);   /* teal text, 5.3:1 on paper */
  --color-sun:        oklch(87.3% 0.131 82.9);  /* #ffcd69 — the logo dot */
  --color-focus:      oklch(52.5% 0.095 222);

  /* App screen colours, sampled from the demo recording (used around the video) */
  --color-app-bg:     oklch(96.9% 0.004 100);  /* ≈ #f5f4f1, app body */
  --color-app-top:    oklch(99.2% 0.003 135);  /* ≈ #fcfdfb, app header */

  /* Type */
  --font-display: "Carlito", "Calibri", "Segoe UI", system-ui, sans-serif;
  --font-body:    "Carlito", "Calibri", "Segoe UI", system-ui, sans-serif;

  --text-xs:   0.8125rem;
  --text-sm:   0.9375rem;
  --text-md:   1.1875rem;
  --text-lg:   1.375rem;
  --text-xl:   clamp(1.5rem, 1.2rem + 1vw, 1.875rem);
  --text-2xl:  clamp(2rem, 1.4rem + 2.4vw, 3.25rem);
  --text-display-s: clamp(2.5rem, 1.7rem + 3.2vw, 4.25rem);
  --text-stat: clamp(3rem, 2rem + 4vw, 5.5rem);

  /* Space — 4pt scale */
  --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;
  --gutter:    clamp(1rem, 4vw, 2.5rem);
  --measure:   34rem;
  --page-max:  85rem;

  /* Shape */
  --radius-sm:   0.5rem;
  --radius-card: 1.25rem;
  --radius-pill: 999px;
  --rule-hair:   1px;

  /* 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-fast:    160ms;
  --dur-short:   240ms;
  --dur-med:     520ms;
  --dur-long:    1400ms;

  --shadow-lift: 0 1px 2px oklch(21.5% 0.008 240 / 0.06), 0 12px 32px -12px oklch(52.5% 0.095 222 / 0.25);
}