/*
 * Meristem design tokens as CSS custom properties.
 * Section 1 is synced from tokens/dist/variables.css (source of truth:
 * tokens/src/brand.json, built by `npm run tokens:build`). Re-sync after every
 * token build. Section 2 bridges legacy variable names still used by plugin
 * surfaces (quiz.css) onto the current token set.
 * Enqueued sitewide before build/index.css (see functions.php) so every
 * var(--pwp-*) reference resolves to brand values instead of stale fallbacks.
 */

/* Section 1: generated token values (synced from tokens/dist/variables.css). */
:root {
	--pwp-color-brand-primary: #2E4636;
	--pwp-color-brand-primary-deep: #22362A;
	--pwp-color-brand-primary-soft: #E9EDE2;
	--pwp-color-brand-secondary: #7C8B72;
	--pwp-color-brand-secondary-deep: #4C5A42;
	--pwp-color-brand-accent: #B4682F;
	--pwp-color-brand-accent-deep: #8C4A1F;
	--pwp-color-neutral-50: #FAF7F2;
	--pwp-color-neutral-100: #F4EEE4;
	--pwp-color-neutral-200: #EAE1D3;
	--pwp-color-neutral-300: #D8CCBA;
	--pwp-color-neutral-400: #B0A48F;
	--pwp-color-neutral-500: #8A7E6C;
	--pwp-color-neutral-600: #675D4E;
	--pwp-color-neutral-700: #4E453A;
	--pwp-color-neutral-800: #342E26;
	--pwp-color-neutral-900: #211C16;
	--pwp-color-semantic-success: #2F6B3C;
	--pwp-color-semantic-success-surface: #E3EFE0;
	--pwp-color-semantic-warning: #8F5B12;
	--pwp-color-semantic-warning-accent: #B37718;
	--pwp-color-semantic-warning-surface: #F8EDD9;
	--pwp-color-semantic-error: #A63A2E;
	--pwp-color-semantic-error-surface: #F7E5E0;
	--pwp-color-surface-page: #FAF7F2;
	--pwp-color-surface-card: #FFFFFF;
	--pwp-color-surface-sage: #E9EDE2;
	--pwp-color-surface-clay: #F5E9DF;
	--pwp-color-surface-inverse: #211C16;
	--pwp-typography-family-display: 'Fraunces', Georgia, 'Times New Roman', serif;
	--pwp-typography-family-body: 'Hanken Grotesk', 'Segoe UI', -apple-system, sans-serif;
	--pwp-typography-scale-xs: 0.75rem;
	--pwp-typography-scale-sm: 0.875rem;
	--pwp-typography-scale-base: 1rem;
	--pwp-typography-scale-lg: 1.125rem;
	--pwp-typography-scale-xl: 1.25rem;
	--pwp-typography-scale-2xl: 1.75rem;
	--pwp-typography-scale-3xl: 2.5rem;
	--pwp-typography-scale-4xl: 3.25rem;
	--pwp-typography-lineHeight-tight: 1.2;
	--pwp-typography-lineHeight-snug: 1.4;
	--pwp-typography-lineHeight-base: 1.6;
	--pwp-typography-lineHeight-relaxed: 1.75;
	--pwp-layout-rootPadding: clamp(1.25rem, 5vw, 3rem);
	--pwp-spacing-1: 0.25rem;
	--pwp-spacing-2: 0.5rem;
	--pwp-spacing-3: 0.75rem;
	--pwp-spacing-4: 1rem;
	--pwp-spacing-5: 1.25rem;
	--pwp-spacing-6: 1.5rem;
	--pwp-spacing-7: 2rem;
	--pwp-spacing-8: 2.5rem;
	--pwp-spacing-9: 3rem;
	--pwp-spacing-10: 3.5rem;
	--pwp-spacing-11: 4rem;
	--pwp-spacing-12: 5rem;
	--pwp-spacing-13: 6rem;
	--pwp-spacing-14: 7rem;
	--pwp-spacing-15: 8rem;
	--pwp-spacing-16: 10rem;
	--pwp-radius-sm: 0.375rem;
	--pwp-radius-md: 0.75rem;
	--pwp-radius-lg: 1.25rem;
	--pwp-radius-pill: 9999px;
	--pwp-shadow-sm: 0 1px 2px rgba(33, 28, 22, 0.05), 0 1px 3px rgba(33, 28, 22, 0.07);
	--pwp-shadow-md: 0 2px 4px rgba(33, 28, 22, 0.05), 0 6px 16px rgba(33, 28, 22, 0.08);
	--pwp-shadow-lg: 0 4px 8px rgba(33, 28, 22, 0.05), 0 20px 48px rgba(33, 28, 22, 0.12);
}

/* Section 2: compatibility aliases for legacy names used by plugin CSS. */
:root {
	--pwp-color-brand-primary-strong: var(--pwp-color-brand-primary-deep);
	--pwp-color-semantic-danger: var(--pwp-color-semantic-error);
	--pwp-color-semantic-danger-soft: var(--pwp-color-semantic-error-surface);
	--pwp-color-surface: var(--pwp-color-neutral-100);
	--pwp-color-border: var(--pwp-color-neutral-300);
	--pwp-color-text-muted: var(--pwp-color-neutral-600);
	--pwp-spacing-sm: var(--pwp-spacing-3);
	--pwp-spacing-md: var(--pwp-spacing-4);
	--pwp-spacing-lg: var(--pwp-spacing-6);
	--pwp-spacing-xl: var(--pwp-spacing-7);
	--pwp-typography-scale-md: var(--pwp-typography-scale-base);
}
