/**
 * Visit Oradea — design tokens (design2-purple.html).
 */

:root {
	/* Brand colors */
	--vo-red: #F9423A;
	--vo-accent: #F9423A;
	--vo-gold: #C69214;
	--vo-ink: #1F2A44;
	--vo-plum: #984878;
	--vo-line: #E5E5E5;
	--vo-muted: #6B6B6B;
	--vo-paper: #FFFFFF;

	/* Layout */
	--vo-container: 1440px;
	--vo-container-pad: 24px;
	--content-width: 100%;
	--content-pad: 24px;
	--content-pad-mobile: 24px;
	--content-pad-tablet: 24px;
	--content-pad-desktop: 24px;
	--content-pad-wide: 24px;
	--content-pad-wide-mobile: 24px;
	--content-pad-wide-tablet: 24px;
	--content-pad-wide-desktop: 24px;

	/* Typography */
	--vo-font: "Fira Sans", system-ui, sans-serif;
	--vo-hand: "Shadows Into Light", cursive;

	/* Photo scrims */
	--vo-tint: linear-gradient(180deg, rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, 0.55) 100%);
	--vo-tint-gold: linear-gradient(160deg, rgba(198, 146, 20, 0.18), rgba(122, 42, 26, 0.28));
	--vo-tint-magenta: linear-gradient(160deg, rgba(152, 72, 120, 0.18), rgba(31, 42, 68, 0.32));
	--vo-tint-red: linear-gradient(160deg, rgba(249, 66, 58, 0.2), rgba(122, 31, 43, 0.32));
	--vo-tint-green: linear-gradient(160deg, rgba(34, 136, 72, 0.2), rgba(31, 42, 68, 0.32));
	--vo-tint-blue: linear-gradient(160deg, rgba(66, 152, 181, 0.18), rgba(31, 42, 68, 0.32));
	--vo-tint-ink: linear-gradient(160deg, rgba(31, 42, 68, 0.28), rgba(152, 72, 120, 0.34));
	--vo-tint-teal: linear-gradient(160deg, rgba(73, 107, 126, 0.2), rgba(34, 136, 72, 0.3));
	--vo-tint-burnt: linear-gradient(160deg, rgba(156, 68, 34, 0.2), rgba(58, 22, 16, 0.32));

	/* Header / hero */
	--vo-topbar-h: 42px;
	--vo-header-h: 76px;
	--vo-chrome-h: calc(var(--vo-topbar-h) + var(--vo-header-h));
	--vo-spotlight-h: min(70vh, 720px);
	--vo-section-cut-h: clamp(120px, 14vw, 200px);
}

@media (max-width: 640px) {
	:root {
		--vo-topbar-h: 0px;
		--vo-header-h: 74px;
		--vo-container-pad: 18px;
		--vo-section-cut-h: clamp(88px, 18vw, 140px);
	}

	body {
		--vo-spotlight-h: calc(100vw - 36px);
	}
}