/* Lumen Meter — Gotham + design tokens (Figma: Lumen-Meter-Infographics, node 531:435) */

@font-face {
	font-family: "Gotham";
	src: url("fonts/GothamPro.woff2") format("woff2"),
		url("fonts/GothamPro.woff") format("woff");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Gotham";
	src: url("fonts/Gotham-Light.woff2") format("woff2"),
		url("fonts/Gotham-Light.woff") format("woff");
	font-weight: 300;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Gotham";
	src: url("fonts/Gotham-Medium.woff2") format("woff2"),
		url("fonts/Gotham-Medium.woff") format("woff");
	font-weight: 500;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Gotham";
	src: url("fonts/Gotham-Bold.woff2") format("woff2"),
		url("fonts/Gotham-Bold.woff") format("woff");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Gotham";
	src: url("fonts/Gotham-Black.woff2") format("woff2"),
		url("fonts/Gotham-Black.woff") format("woff");
	font-weight: 900;
	font-style: normal;
	font-display: swap;
}

:root {
	--lumen-color-page: #ffffff;
	--lumen-color-headline: #08272a;
	--lumen-color-meter: #4a55a2;
	--lumen-color-lumen-wordmark: #000000;
	--lumen-color-cta-start: #f95e4a;
	--lumen-color-cta-end: #fb8429;
	--lumen-color-text-on-cta: #ffffff;
	--lumen-color-body-text: #08272a;
	--lumen-color-preloader-track: rgba(8, 39, 42, 0.12);
	--lumen-color-preloader-fill-start: #f95e4a;
	--lumen-color-preloader-fill-end: #fb8429;
	--lumen-header-bg: rgba(255, 255, 255, 0.6);
	--lumen-header-blur: 15px;
	--lumen-font-sans: "Gotham", system-ui, -apple-system, "Segoe UI", sans-serif;
}