/**
 * Design tokens — Roscoe & Co.
 * Palette, type scale and motion timing live here as CSS custom properties.
 * Values marked provisional are placeholders pending final art direction sign-off.
 */

:root {
  /* Palette — provisional */
  --bone: #f3eee4;
  --linen: #e7ddcb;
  --sand: #d4c0a1;
  --clay: #b07a58;
  --sage: #9aa58c;
  --moss: #4e5a44;
  --ink: #2a2824;
  --wa-green: #4e7a5b;

  /* Semantic aliases */
  --color-bg: var(--bone);
  --color-surface: var(--linen);
  --color-border: var(--sand);
  --color-accent: var(--clay);
  --color-accent-natural: var(--sage);
  --color-dark: var(--moss);
  --color-text: var(--ink);
  --color-text-inverse: var(--bone);

  /* Typography */
  --font-display: 'Instrument Serif', Georgia, 'Times New Roman', serif;
  --font-body: 'Hanken Grotesk', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, monospace;

  --fs-display-xl: clamp(2.75rem, 6vw + 1rem, 7.5rem);
  --fs-display-lg: clamp(2.25rem, 4.5vw + 1rem, 5rem);
  --fs-display-md: clamp(1.75rem, 2.5vw + 1rem, 3rem);
  --fs-body-lg: clamp(1.125rem, 0.5vw + 1rem, 1.375rem);
  --fs-body: 1rem;
  --fs-mono-label: 0.75rem;

  --tracking-label: 0.14em;

  /* Spacing scale */
  --space-2xs: 0.5rem;
  --space-xs: 0.75rem;
  --space-sm: 1.25rem;
  --space-md: 2rem;
  --space-lg: 3.5rem;
  --space-xl: 6rem;
  --space-2xl: 10rem;

  /* Motion */
  --ease-organic: cubic-bezier(0.16, 1, 0.3, 1);
  --duration-fast: 0.4s;
  --duration-base: 0.8s;
  --duration-slow: 1.4s;

  /* Layout */
  --container-max: 90rem;
  --gutter: clamp(1.25rem, 4vw, 3rem);
  --radius-organic: 42% 58% 61% 39% / 45% 41% 59% 55%;

  /* Focus ring */
  --focus-ring: 0 0 0 3px var(--color-bg), 0 0 0 5px var(--color-accent);
}

@media (prefers-color-scheme: dark) {
  /* Reserved: the brand is intentionally light-first. No dark mode swap yet. */
}