/* ==========================================================================
   Allora Pilates — design tokens
   Mirrors design-system/tokens/{colors,typography,spacing}.css 1:1.
   Keep variable names in sync with the design system; add theme-only
   tokens at the bottom under "Theme additions".
   ========================================================================== */

/* tokens/colors.css */
:root{
--color-white:#FFFFFF;
--color-cream:#FBF7F0;
--color-beige-100:#F4EDE1;
--color-beige-200:#E9DFC9;
--color-tan-300:#D9C6A0;
--color-gold-400:#DAC48C;
--color-gold-500:#CBA968;
--color-gold-600:#A8874F;
--color-gold-700:#86693D;
--color-brown-900:#3A2F22;
--color-brown-700:#5C4E3A;
--color-brown-500:#8A7A62;
--surface-page:var(--color-cream);
--surface-raised:var(--color-white);
--surface-card:var(--color-beige-100);
--surface-section-alt:var(--color-beige-200);
--surface-dark:var(--color-brown-900);
--text-primary:var(--color-brown-900);
--text-secondary:var(--color-brown-700);
--text-muted:var(--color-brown-500);
--text-on-dark:var(--color-cream);
--text-on-accent:var(--color-brown-900); /* theme: brown on gold (was white) — readable on the dark CTA band and hero */
--accent:var(--color-gold-500);
--accent-hover:var(--color-gold-600);
--accent-active:var(--color-gold-700);
--accent-soft:var(--color-tan-300);
--border-subtle:var(--color-beige-200);
--border-strong:var(--color-tan-300);
--focus-ring:var(--color-gold-400);
}

/* tokens/typography.css */
:root{
--font-logo:'TAN Whistling',"Cormorant Garamond",serif;
--font-display:'Marcellus',"Times New Roman",serif;
--font-sans:'Jost',"Segoe UI",sans-serif; /* theme: Jost replaces the Sora stand-in — lighter, more editorial, full Polish diacritics */
--text-display-xl:clamp(48px,6vw,84px);
--text-display-lg:clamp(38px,4.5vw,60px);
--text-heading-xl:40px;
--text-heading-lg:32px;
--text-heading-md:24px;
--text-heading-sm:20px;
--text-body-lg:18px;
--text-body-md:16px;
--text-body-sm:14px;
--text-caption:12px;
--text-eyebrow:13px;
--leading-tight:1.1;
--leading-snug:1.3;
--leading-normal:1.5;
--leading-relaxed:1.7;
--tracking-tight:-0.01em;
--tracking-normal:0;
--tracking-wide:0.04em;
--tracking-wider:0.14em;
--weight-regular:400;
--weight-medium:500;
--weight-semibold:600;
--weight-bold:700;
}

/* tokens/spacing.css */
:root{
--space-1:4px;
--space-2:8px;
--space-3:12px;
--space-4:16px;
--space-5:24px;
--space-6:32px;
--space-7:48px;
--space-8:64px;
--space-9:96px;
--space-10:128px;
--radius-sm:6px;
--radius-md:12px;
--radius-lg:20px;
--radius-xl:32px;
--radius-pill:999px;
--shadow-sm:0 2px 8px rgba(58,47,34,0.06);
--shadow-md:0 8px 24px rgba(58,47,34,0.10);
--shadow-lg:0 20px 48px rgba(58,47,34,0.14);
--container-max:1200px;
--container-narrow:760px;
}

/* Theme additions (not in the design system) */
:root{
--color-error:#B5482F;             /* error red used by Input.jsx */
--gutter:clamp(16px,4vw,48px);     /* horizontal page padding */
--section-y:clamp(64px,8vw,96px);  /* vertical section rhythm (readme: 64–96px) */
--header-h:76px;
--motion:200ms ease-in-out;        /* readme: 150–250ms ease-in-out only */
}