/*
 * Wolke design tokens. One block, taken from the design's Build.html :root.
 * A rebrand is an edit here, not a hunt through widgets.
 */
:root {
	--ok-blue: #0131FF;           /* links, primary header button */
	--ok-ink: #191919;            /* text, the only primary button fill on light grounds */
	--ok-cream: #FFFEFA;          /* page */
	--ok-grey: #6B665F;           /* warm grey text */
	--ok-rule: #B6CAFF;           /* every rule and divider */
	--ok-indigo: #3F59E4;         /* eyebrows, active tab, hover borders */
	--ok-body: rgba(0, 0, 0, .66);
	--ok-orange: #E87142;         /* bullets and brand mark only; never text on light */
	--ok-footer-head: #AFABA1;
	--ok-util: #040813;           /* utility bar */
	--ok-glass: rgba(0, 0, 0, .66);
	--ok-gradient: linear-gradient(150deg, #7B5CF0 0%, #4A2EA8 45%, #151119 100%);

	--ok-font: Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
	--ok-font-display: Newsreader, Georgia, serif;
	--ok-font-mono: "IBM Plex Mono", ui-monospace, monospace;

	--grid-max: 1440px;
	--content-max: 1312px;
	--gutter: 64px;
	--ease-out: cubic-bezier(.25, .8, .25, 1);
}

@media (max-width: 1023px) {
	:root { --gutter: 16px; }
}
