/* design-system.css — Pigment. Single source of truth for tokens.
   Painterly Gallery: warm paper ground + plum-ink + coral lead accent; teal/marigold/violet are WASHES (atmosphere), never UI color. */
:root{
  /* ── colour — UI palette: ≤5 hex, one accent (coral). No pure #000/#fff, not beige/brass. ── */
  --bg:#FBF7F0;            /* warm paper-white */
  --surface:#FAF2E6;       /* raised wet-paper */
  --text:#2A1E2C;          /* plum-ink */
  --muted:#7C6A78;         /* dusk-mauve */
  --accent:#E8623C;        /* coral — the LEAD, CTAs/links/active */
  --on-accent:#FFFBF5;     /* near-white on coral (AA) */

  /* ── washes — atmosphere ONLY (bloom, gradients, section bleeds). Never a button/label colour. ── */
  --teal:#1E8A86;
  --marigold:#F2A93B;
  --violet:#7A5AA6;
  --coral:var(--accent);

  /* soft tints (paper-mixed) for wash fills + borders */
  --accent-wash:color-mix(in srgb,var(--accent) 16%,var(--bg));
  --teal-wash:color-mix(in srgb,var(--teal) 15%,var(--bg));
  --marigold-wash:color-mix(in srgb,var(--marigold) 20%,var(--bg));
  --violet-wash:color-mix(in srgb,var(--violet) 14%,var(--bg));
  --border:color-mix(in srgb,var(--text) 12%,transparent);
  --border-strong:color-mix(in srgb,var(--text) 22%,transparent);

  /* ── type ── */
  --font-display:"Bricolage Grotesque",system-ui,sans-serif;
  --font-body:"Figtree",system-ui,sans-serif;
  --font-mono:"Figtree",system-ui,sans-serif; /* no mono in this brand */

  /* type scale (intentional) */
  --step--1:.84rem;
  --step-0:1.0625rem;
  --step-1:1.3rem;
  --step-2:1.72rem;
  --step-3:2.45rem;
  --step-4:3.4rem;
  --step-5:clamp(3.2rem,8.5vw,7rem);

  /* spacing + radius — ONE radius scale (soft, watercolor-rounded) */
  --space:clamp(1rem,3vw,2rem);
  --section-y:clamp(2.75rem,4.8vw,4.5rem);
  --radius:14px;
  --radius-lg:24px;
  --radius-pill:999px;

  --ease:cubic-bezier(.16,1,.3,1);
  --ease-soft:cubic-bezier(.33,1,.68,1);

  color-scheme:light;
}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}
