/* Design tokens – values from design/*.dc.html */
:root {
	/* Colors */
	--color-bg: #F7F5F0;
	--color-ink: #1E2A22;
	--color-muted: #4A544E;
	--color-subtle: #5C6660;
	--color-green: #2F5D44;
	--color-green-dark: #254A36;
	--color-mustard: #E8B04B;
	--color-sand: #EAE4D6;
	--color-line: #D6D1C4;
	--color-line-soft: #E2DED4;
	--color-jul: #9A3B24;
	--color-white: #FFFFFF;
	--color-on-dark: #F7F5F0;
	--color-on-dark-muted: #C9D1CB;
	--color-on-dark-line: #4A5A50;
	--color-placeholder: #D8CFC0;
	--color-error: #9A3B24;

	/* Type */
	--font-display: "Bricolage Grotesque", ui-sans-serif, system-ui, sans-serif;
	--font-body: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;

	--fs-hero: clamp(2.5rem, 1.6rem + 3.6vw, 4rem);       /* 40 → 64 */
	--fs-h1: clamp(2.25rem, 1.7rem + 2.2vw, 3.5rem);       /* 36 → 56 */
	--fs-h1-sm: clamp(2rem, 1.6rem + 1.6vw, 3rem);         /* 32 → 48 */
	--fs-h1-product: clamp(2rem, 1.7rem + 1.2vw, 2.75rem); /* 32 → 44 */
	--fs-h2-lg: clamp(1.875rem, 1.5rem + 1.5vw, 2.5rem);   /* 30 → 40 */
	--fs-h2: clamp(1.75rem, 1.45rem + 1.2vw, 2.25rem);     /* 28 → 36 */
	--fs-h2-sm: clamp(1.5rem, 1.3rem + 0.8vw, 2rem);       /* 24 → 32 */
	--fs-quote: clamp(1.5rem, 1.25rem + 1vw, 2.125rem);    /* 24 → 34 */
	--fs-lead: clamp(1.0625rem, 1rem + 0.25vw, 1.1875rem); /* 17 → 19 */
	--fs-body: 1.0625rem;  /* 17 */
	--fs-ui: 0.9375rem;    /* 15 */
	--fs-sm: 0.875rem;     /* 14 */
	--fs-xs: 0.8125rem;    /* 13 */
	--fs-2xs: 0.75rem;     /* 12 */

	--lh-tight: 1.05;
	--lh-snug: 1.25;
	--lh-body: 1.6;

	--ls-display: -0.03em;
	--ls-heading: -0.015em;

	/* Layout */
	--container: 1280px;
	--gutter: 24px;
	--section-y: clamp(48px, 4vw + 24px, 80px);

	/* Radius */
	--radius-input: 10px;
	--radius-thumb: 12px;
	--radius-card: 16px;
	--radius-media: 20px;
	--radius-panel: 28px;
	--radius-pill: 999px;

	/* Controls */
	--control-h: 44px;
	--cta-h: 56px;

	--focus: 0 0 0 3px var(--color-bg), 0 0 0 5px var(--color-green);
}