/*
 * Design tokens. Values here are a working placeholder palette, not an
 * owner-approved final brand system (see code_guidelines.md section 7 and
 * docs/architecture.md "Not yet decided"). Update this file, not individual
 * component files, when the brand is confirmed.
 *
 * Direction: warm, family-friendly palette (cream/ivory neutrals, one warm
 * berry/rose accent, deep plum reserved for inverse sections) rather than a
 * cold corporate-navy foundation, based on a review of dance-studio sites
 * aimed at parents/families rather than nightclub-style adult studios.
 */

:root {
	/* Color: foundation */
	--color-cream-100: #fdf8f3;
	--color-cream-200: #f6ede2;
	--color-cream-300: #ecdfd0;
	--color-plum-900: #2d2038;
	--color-plum-800: #392a47;
	--color-plum-700: #4a3760;
	--color-plum-100: #ece4f2;
	--color-white: #ffffff;

	/* Color: accent */
	--color-accent-700: #9c3552;
	--color-accent-600: #c1476b;
	--color-accent-500: #d6607f;
	--color-accent-100: #f9e4ea;
	--color-gold-500: #d9a441;

	/* Color: semantic */
	--color-bg: var(--color-white);
	--color-bg-soft: var(--color-cream-100);
	--color-bg-inverse: var(--color-plum-900);
	--color-text: #2b2420;
	--color-text-inverse: var(--color-white);
	--color-text-muted: #6b5f56;
	--color-text-muted-inverse: var(--color-plum-100);
	--color-border: var(--color-cream-300);
	--color-link: var(--color-accent-700);
	--color-link-hover: var(--color-accent-600);
	--color-focus-ring: var(--color-accent-600);
	--color-success: #256d3b;
	--color-error: #a3242c;

	/* Typography */
	--font-body: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	--font-display: Georgia, "Iowan Old Style", "Palatino Linotype", "Times New Roman", serif;

	--font-size-sm: 0.9rem;
	--font-size-base: 1rem;
	--font-size-md: 1.15rem;
	--font-size-lg: 1.6rem;
	--font-size-xl: 2.1rem;
	--font-size-2xl: 3rem;

	--line-height-body: 1.65;
	--line-height-heading: 1.15;
	--letter-spacing-eyebrow: 0.08em;

	/* Spacing */
	--space-2xs: 0.25rem;
	--space-xs: 0.5rem;
	--space-sm: 0.75rem;
	--space-md: 1.25rem;
	--space-lg: 2.25rem;
	--space-xl: 3.5rem;
	--space-2xl: 5rem;

	/* Layout */
	--content-width: 72rem;
	--content-width-narrow: 44rem;
	--radius-sm: 6px;
	--radius-md: 14px;
	--radius-lg: 26px;
	--radius-pill: 999px;

	/* Elevation */
	--shadow-sm: 0 1px 3px rgba(45, 32, 56, 0.08);
	--shadow-md: 0 12px 28px rgba(45, 32, 56, 0.14);
	--shadow-lg: 0 20px 45px rgba(45, 32, 56, 0.18);

	/* Motion */
	--transition-fast: 150ms ease;
	--transition-medium: 250ms ease;
}

@media (prefers-reduced-motion: reduce) {
	:root {
		--transition-fast: 0ms;
		--transition-medium: 0ms;
	}
}