:root {
	/* ---- Brand base values ---- */
	--brand-primary: #7a2035;
	--brand-secondary: #1a1a1a;
	--brand-accent: #1b4b5a;

	--brand-background: #faf8f5;
	--brand-surface: #f0ebe1;
	--brand-surface-elevated: #e7dfd3;

	--brand-text-primary: #1a1a1a;
	--brand-text-secondary: #4f4943;
	--brand-text-muted: #7a726a;

	--brand-border: #c9bcae;

	/* Supporting / material palette */
	--brand-travertine: #c9bcae;
	--brand-travertine-deep: #a89985;
	--brand-burgundy: #7a2035;
	--brand-burgundy-deep: #5c1727;
	--brand-teal: #1b4b5a;
	--brand-teal-deep: #123640;
	--brand-warm-white: #faf8f5;
	--brand-warm-beige: #f0ebe1;
	--brand-sand: #ece3d6;

	/* ---- Semantic tokens ---- */
	--color-primary: var(--brand-primary);
	--color-primary-strong: var(--brand-burgundy-deep);
	--color-secondary: var(--brand-secondary);
	--color-accent: var(--brand-accent);

	--color-background: var(--brand-background);
	--color-surface: var(--brand-surface);
	--color-surface-elevated: var(--brand-surface-elevated);
	--color-surface-dark: var(--brand-secondary);

	--color-text-primary: var(--brand-text-primary);
	--color-text-secondary: var(--brand-text-secondary);
	--color-text-muted: var(--brand-text-muted);
	--color-text-on-dark: #f2ece3;
	--color-text-on-primary: #f7ede9;

	--color-border: var(--brand-border);
	--color-border-soft: color-mix(in srgb, var(--brand-border) 55%, var(--brand-warm-white));

	/* Material and decorative roles */
	--color-material: var(--brand-travertine);
	--color-highlight: var(--brand-burgundy);
	--color-decorative: var(--brand-teal);

	/* ---- Interaction states ---- */
	--color-primary-hover: color-mix(in srgb, var(--color-primary) 88%, var(--brand-warm-white));
	--color-primary-active: color-mix(in srgb, var(--color-primary) 86%, var(--color-secondary));
	--color-accent-hover: color-mix(in srgb, var(--color-accent) 88%, var(--brand-warm-white));
	--color-surface-hover: color-mix(in srgb, var(--color-surface) 80%, var(--brand-travertine));
	--color-focus-ring: color-mix(in srgb, var(--color-primary) 38%, transparent);
	--color-overlay: color-mix(in srgb, var(--color-secondary) 72%, transparent);
	--color-overlay-soft: color-mix(in srgb, var(--color-secondary) 40%, transparent);

	/* ---- Typography ---- */
	--font-display: "Cormorant Garamond", "Cormorant", Georgia, serif;
	--font-text: "Hanken Grotesk", "Helvetica Neue", Arial, sans-serif;

	--fw-light: 300;
	--fw-regular: 400;
	--fw-medium: 500;
	--fw-semibold: 600;
	--fw-bold: 700;

	--text-display-xl: clamp(3.25rem, 7vw, 6.5rem);
	--text-display-lg: clamp(2.75rem, 5vw, 4.5rem);
	--text-display-md: clamp(2rem, 3.4vw, 3rem);
	--text-display-sm: clamp(1.6rem, 2.4vw, 2.1rem);

	--text-lead: clamp(1.15rem, 1.4vw, 1.375rem);
	--text-body: 1.0625rem;
	--text-body-sm: 0.9375rem;
	--text-caption: 0.8125rem;
	--text-eyebrow: 0.75rem;

	--lh-display: 1.04;
	--lh-heading: 1.14;
	--lh-body: 1.65;
	--lh-tight: 1.25;

	--ls-display: -0.01em;
	--ls-tight: -0.02em;
	--ls-normal: 0;
	--ls-eyebrow: 0.22em;
	--ls-wide: 0.08em;

	/* ---- Spacing ---- */
	--space-2xs: 0.25rem;
	--space-xs: 0.5rem;
	--space-sm: 0.75rem;
	--space-md: 1rem;
	--space-lg: 1.5rem;
	--space-xl: 2rem;
	--space-2xl: 3rem;
	--space-3xl: 4.5rem;
	--space-4xl: 6.5rem;
	--space-5xl: 9rem;

	/* ---- Layout ---- */
	--container-max: 1240px;
	--container-wide: 1440px;
	--container-text: 640px;
	--gutter: clamp(1.25rem, 4vw, 3rem);

	/* ---- Radius ---- */
	--radius-xs: 2px;
	--radius-sm: 4px;
	--radius-md: 8px;
	--radius-lg: 14px;
	--radius-pill: 999px;

	/* ---- Borders ---- */
	--border-hairline: 1px solid var(--color-border);
	--border-soft: 1px solid var(--color-border-soft);

	/* ---- Shadows ---- */
	--shadow-xs: 0 1px 2px color-mix(in srgb, var(--brand-secondary) 8%, transparent);
	--shadow-sm: 0 2px 8px color-mix(in srgb, var(--brand-secondary) 8%, transparent);
	--shadow-md: 0 10px 30px color-mix(in srgb, var(--brand-secondary) 10%, transparent);
	--shadow-lg: 0 24px 60px color-mix(in srgb, var(--brand-secondary) 14%, transparent);
	--shadow-focus: 0 0 0 3px var(--color-focus-ring);

	/* ---- Motion ---- */
	--ease-out: cubic-bezier(0.22, 0.61, 0.36, 1);
	--ease-in-out: cubic-bezier(0.65, 0.05, 0.36, 1);
	--dur-fast: 160ms;
	--dur-base: 280ms;
	--dur-slow: 520ms;

	/* ---- Overlays ---- */
	--overlay-bottom: linear-gradient(to top, color-mix(in srgb, var(--brand-secondary) 78%, transparent), transparent 62%);
	--overlay-full: linear-gradient(to top, color-mix(in srgb, var(--brand-secondary) 62%, transparent), color-mix(in srgb, var(--brand-secondary) 12%, transparent));
}
