/* editorial — tokens
 *
 * Modify values, never key names. The whole page recomposes when these change.
 */

:root {
  /* Palette — paper-warm with a single muted accent */
  --color-bg: #f3f1ec;
  --color-surface: #faf9f6;
  --color-surface-strong: #ffffff;
  --color-text: #242329;
  --color-text-muted: #716f76;
  --color-text-soft: #98959b;
  --color-border: #d8d4cb;
  --color-border-strong: #bdb8ae;
  --color-accent: #b65339;
  --color-accent-text: #ffffff;
  --color-accent-soft: #efe0da;

  /* Typography — serif headlines, clean sans for body */
  --font-heading: "Cormorant Garamond", "EB Garamond", Georgia, serif;
  --font-body: "Inter", system-ui, -apple-system, sans-serif;
  --fs-display: clamp(3rem, 9vw, 6rem);
  --fs-h1: clamp(2.5rem, 6vw, 4rem);
  --fs-h2: clamp(1.75rem, 4vw, 2.5rem);
  --fs-h3: 1.5rem;
  --fs-body: 1.0625rem;
  --fs-small: 0.95rem;
  --lh-tight: 1.05;
  --lh-body: 1.6;
  --tracking-tight: -0.015em;

  /* Spacing — 8px grid */
  --s-1: 0.5rem;
  --s-2: 1rem;
  --s-3: 1.5rem;
  --s-4: 2rem;
  --s-6: 3rem;
  --s-8: 4rem;
  --s-12: 6rem;
  --s-16: 8rem;

  /* Radii — mostly square, soft only on inputs */
  --r-sm: 2px;
  --r-md: 4px;
  --r-lg: 8px;
  --r-pill: 9999px;

  /* Layout */
  --container: 1160px;
  --container-narrow: 720px;
}

html[data-theme="dark"] {
  --color-bg: #151715;
  --color-surface: #1c1f1d;
  --color-surface-strong: #242825;
  --color-text: #eeece6;
  --color-text-muted: #aaa9a3;
  --color-text-soft: #858781;
  --color-border: #343934;
  --color-border-strong: #4b514b;
  --color-accent: #dc8063;
  --color-accent-text: #171917;
  --color-accent-soft: #3a2924;
}