/* Design tokens. Every color, space, type size and easing lives here. */

:root {
  /* Palette: the studio at night */
  --ground: #1e1c1a;
  --raised: #252320;
  --card: #2c2a27;
  --deepest: #0f0e0c;
  --cream: #f0ece4;
  --secondary: #b8b0a4;
  --muted: #766e65;
  --muted-text: #8d8478;
  --rule: #3a3733;
  --rule-light: #454240;

  /* Sand: one job, the action and what is measured */
  --sand: #c4a97d;
  --sand-hover: #d4bc97;
  --sand-ink: #7d6437;

  /* Paper stage: the manifest section only */
  --paper: #f0ece4;
  --paper-ink: #1e1c1a;
  --paper-secondary: #4a453f;
  --paper-rule: #d8d0c0;

  /* Semantic aliases */
  --ink: var(--cream);
  --bg: var(--ground);

  /* Type */
  --font-display: 'Playfair Display', Georgia, serif;
  --font-body: 'DM Sans', -apple-system, sans-serif;
  --font-mono: 'DM Mono', ui-monospace, monospace;

  /* Type scale: running text, six steps */
  --size-micro: 0.6875rem;
  --size-fine: 0.8125rem;
  --size-small: 0.9375rem;
  --size-body: 1.0625rem;
  --size-lead: 1.15rem;
  --size-h3: 1.25rem;

  /* Type scale: display and heading */
  --size-eyebrow: var(--size-micro);
  --size-h2: clamp(1.9rem, 4vw, 2.9rem);
  --size-h1: clamp(2.6rem, 6vw, 5.2rem);

  /* Type scale: counted and quoted figures, each its own device */
  --size-display-price: clamp(2.2rem, 5vw, 3.4rem);
  --size-display-stat: clamp(1.9rem, 4vw, 2.6rem);
  --size-quote: clamp(1.1rem, 2.4vw, 1.5rem);

  /* Space */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 1rem;
  --space-4: 1.5rem;
  --space-5: 2.5rem;
  --space-6: 4rem;
  --space-7: 6rem;
  --space-8: 9rem;

  /* Layout */
  --content-max: 1180px;
  --content-narrow: 760px;
  --edge: clamp(1.5rem, 5vw, 4rem);
  --rail-cols: 0.55fr 0.55fr 0.7fr repeat(5, 1.22fr);

  /* Motion */
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-out: cubic-bezier(0, 0, 0.2, 1);
  --dur-reveal: 700ms;
  --dur-count: 1200ms;
  --dur-rail-step: 90ms;

  /* Misc */
  --radius: 2px;
  --grain-opacity: 0.04;
}
