:root {
	--cn-primary: #C41858;
	--cn-surface: #FFFBFC;
	--cn-dark: #1A0A14;
	--cn-primary-tint: #F8E8EF;

	--cn-primary-rgb: 196, 24, 88;
	--cn-dark-rgb: 26, 10, 20;

	--cn-font: "Golos Text", system-ui, -apple-system, sans-serif;
	--cn-radius-sm: 12px;
	--cn-radius-md: 16px;
	--cn-radius-lg: 24px;
	--cn-radius-xl: 32px;

	--cn-shadow-sm: 0 4px 16px rgba(var(--cn-dark-rgb), 0.06);
	--cn-shadow-md: 0 12px 40px rgba(var(--cn-dark-rgb), 0.1);
	--cn-shadow-lg: 0 24px 64px rgba(var(--cn-dark-rgb), 0.14);

	--cn-header-h: 72px;
	--cn-container: 1200px;
	--cn-gutter: clamp(1rem, 4vw, 2rem);

	--cn-ease-out: cubic-bezier(0.22, 1, 0.36, 1);
	--cn-ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);

	--cn-space-xs: 0.5rem;
	--cn-space-sm: 0.75rem;
	--cn-space-md: 1.25rem;
	--cn-space-lg: 2rem;
	--cn-space-xl: 3rem;
	--cn-space-2xl: 5rem;
}

@media (prefers-reduced-motion: reduce) {
	:root {
		--cn-ease-out: linear;
		--cn-ease-spring: linear;
	}
}
