/**
 * Design tokens shared by the experience and the section pages.
 * Values come from theme.json (--wp--preset--*); the second argument is a fallback.
 */

:root {
	--f80-red: var(--wp--preset--color--fce-80-red, #b5342f);
	--f80-red-dark: var(--wp--preset--color--fce-80-red-dark, #8f2721);
	--f80-red-text: var(--wp--preset--color--fce-80-red-text, #e0605a); /* 5.5:1 on the panel. */
	--f80-gold: var(--wp--preset--color--fce-80-gold, #f2c14e);
	--f80-night: var(--wp--preset--color--fce-80-night, #0a0908);
	--f80-panel: var(--wp--preset--color--fce-80-panel, #100e0d);
	--f80-ink: var(--wp--preset--color--fce-80-ink, #f3f2f2);
	--f80-font: var(--wp--preset--font-family--fce-80-archivo, "Archivo", system-ui, sans-serif);
	--f80-ink-muted: rgb(243 242 242 / 62%);
	--f80-ink-faint: rgb(243 242 242 / 55%);
	--f80-line: rgb(243 242 242 / 42%); /* ≥ 3:1 for UI borders. */
	--f80-hairline: rgb(243 242 242 / 14%);
	--f80-edge: 1.25rem;
}

@media (min-width: 60em) {

	:root {
		--f80-edge: 2.125rem;
	}
}