/**
 * Design tokens.
 *
 * The colours below are the ones already used across the site, collected in
 * one place. Nothing changes visually: every stylesheet still carries its
 * literal values, and these variables exist so future edits happen once
 * rather than in 355 places.
 */
:root {
	--ta-violet: #4f46e5;
	--ta-violet-dark: #4338ca;
	--ta-violet-soft: #f4f3ff;
	--ta-violet-chip: #ece9ff;

	--ta-ink: #16181d;
	--ta-ink-soft: #4b5058;
	--ta-muted: #8a8f98;
	--ta-muted-light: #a8adb5;
	--ta-line: #e6e7eb;
	--ta-line-soft: #f0f1f4;
	--ta-surface: #ffffff;
	--ta-surface-alt: #f4f5f7;

	--ta-green: #16a34a;
	--ta-green-soft: #f0fdf4;
	--ta-red: #dc2626;
	--ta-red-soft: #fef2f2;

	--ta-radius-card: 16px;
	--ta-radius-pill: 999px;
	--ta-radius-tile: 10px;

	--ta-container: 1200px;
	--ta-font: var(--wp--preset--font-family--body-font, -apple-system, BlinkMacSystemFont, 'Inter', sans-serif);

	--ta-shadow-card: 0 6px 18px -14px rgba(16, 20, 30, .15);
	--ta-shadow-lift: 0 10px 24px -12px rgba(16, 20, 30, .2);
	--ta-shadow-violet: 0 14px 32px -10px rgba(79, 70, 229, .38);
}