/*
 * Design tokens, from Concept 2 ("The kitchen table"). Every other
 * stylesheet uses these variables, never raw values.
 *
 * Rule from the concept: --give red is for giving and nothing else.
 * --coral is decorative only (it fails contrast as text on paper).
 */

:root {
	/* Palette */
	--ink: #1d2a22;
	--forest: #26422f;
	--leaf: #4e7f3a;
	--moss: #8fa23e;
	--sprout: #c9db94; /* pale leaf, the hopeful note */
	--loch: #3d6784;
	--loch-pale: #dce8ef;
	--coral: #e0714f;
	--give: #c8431f; /* GIVING ONLY */
	--give-deep: #a23213;
	--paper: #f7f4ec;
	--paper-2: #efebdf;
	--card: #ffffff;
	--slate: #5a665e;

	--rule: rgb(38 66 47 / 0.14);
	--rule-mid: rgb(38 66 47 / 0.3);

	/* Type: Fraunces with its SOFT axis up for headings, Figtree for text */
	--serif: "Fraunces", Georgia, "Times New Roman", serif;
	--sans: "Figtree", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

	--t1: clamp(2.9rem, 6.4vw, 6.4rem);
	--t2: clamp(2.1rem, 3.8vw, 3.6rem);
	--t3: clamp(1.3rem, 1.8vw, 1.7rem);
	--t4: 1.0625rem;
	--t5: 0.78rem;

	/* Layout */
	--r: 22px; /* card radius */
	--max: 1320px;
	--g: clamp(20px, 4.5vw, 64px); /* page gutter */
	--sp: clamp(80px, 9vw, 150px); /* space between sections */
	--header-height: 84px;

	--ease: cubic-bezier(0.2, 0.7, 0.3, 1);

	/* Starter names, kept so the starter's templates (page, single, search)
	   pick up the design until each is restyled. */
	--color-text: var(--ink);
	--color-text-muted: var(--slate);
	--color-bg: var(--paper);
	--color-surface: var(--paper-2);
	--color-primary: var(--forest);
	--color-primary-contrast: #ffffff;
	--color-accent: var(--sprout);
	--color-border: var(--rule);
	--color-focus: var(--coral);
	--font-body: var(--sans);
	--font-heading: var(--serif);
	--text-sm: 0.875rem;
	--text-base: var(--t4);
	--text-lg: 1.25rem;
	--text-xl: var(--t3);
	--text-2xl: var(--t2);
	--text-3xl: var(--t1);
	--leading: 1.65;
	--leading-tight: 1.1;
	--space-1: 0.25rem;
	--space-2: 0.5rem;
	--space-3: 1rem;
	--space-4: 1.5rem;
	--space-5: 2rem;
	--space-6: 3rem;
	--space-7: 4rem;
	--space-8: 6rem;
	--container: var(--max);
	--container-narrow: 46rem;
	--gutter: var(--g);
	--radius: var(--r);
}
