/*
 * The Digital BM — design tokens (Master Brand Manual, 5 Nov 2026).
 * Brand colours: green #7ED957 (primary), red #EE0000, blue #38B6FF, black, white.
 * Font: Open Sauce Sans (SIL OFL, self-hosted in assets/fonts).
 *
 * Accessibility notes (WCAG 2.2 AA):
 *  - Green carries BLACK text (11.9:1). White on green is 1.8:1 and is never used.
 *  - Blue and red are for marks, bars and large text; small error text uses --dbm-red-text.
 *  - Body text is pure black on white, as in the logo.
 */
@font-face { font-family: "Open Sauce Sans"; src: url("../fonts/open-sauce-sans-latin-400-normal.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Open Sauce Sans"; src: url("../fonts/open-sauce-sans-latin-400-italic.woff2") format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "Open Sauce Sans"; src: url("../fonts/open-sauce-sans-latin-500-normal.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "Open Sauce Sans"; src: url("../fonts/open-sauce-sans-latin-700-normal.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Open Sauce Sans"; src: url("../fonts/open-sauce-sans-latin-800-normal.woff2") format("woff2"); font-weight: 800; font-style: normal; font-display: swap; }

:root {
	--dbm-green: #7ED957;
	--dbm-red: #EE0000;
	--dbm-blue: #38B6FF;
	--dbm-black: #000000;
	--dbm-white: #FFFFFF;

	--dbm-green-soft: #EEF9E8;   /* tint for highlighted rows and success notices */
	--dbm-blue-soft: #E8F6FF;
	--dbm-red-soft: #FDECEC;
	--dbm-red-text: #C40000;     /* small error text */
	--dbm-muted: #4D554F;        /* secondary text, 7.6:1 */
	--dbm-line: #D7DCD5;
	--dbm-surface: #F3F6F1;

	--dbm-agency: var(--dbm-blue);
	--dbm-academy: var(--dbm-green);

	--dbm-font: "Open Sauce Sans", Arial, Helvetica, sans-serif;

	/* Type scale: perfect fourth (1.333) from an 18px body */
	--dbm-step--1: 0.875rem;
	--dbm-step-0: 1.125rem;
	--dbm-step-1: 1.5rem;
	--dbm-step-2: clamp(1.75rem, 1.4rem + 1.4vw, 2rem);
	--dbm-step-3: clamp(2.1rem, 1.5rem + 2.6vw, 2.67rem);
	--dbm-step-4: clamp(2.6rem, 1.6rem + 4.4vw, 3.55rem);
	--dbm-step-5: clamp(3rem, 1.6rem + 6.2vw, 4.75rem);

	--dbm-s1: 0.25rem; --dbm-s2: 0.5rem; --dbm-s3: 0.75rem; --dbm-s4: 1rem; --dbm-s5: 1.5rem;
	--dbm-s6: 2rem; --dbm-s7: 3rem; --dbm-s8: 4.5rem; --dbm-s9: 6.5rem;

	--dbm-radius: 6px;
	--dbm-radius-lg: 14px;
	--dbm-measure: 68ch;
	--dbm-width: 76rem;
	--dbm-focus: 0 0 0 3px var(--dbm-white), 0 0 0 6px var(--dbm-black);

	/* Premium + motion layer (lt-). Reuses the brand variables above. */
	color-scheme: light;
	--lt-accent: var(--dbm-green);              /* the one accent: emphasis only */
	--lt-accent-soft: rgba(126, 217, 87, 0.42); /* marker highlight behind black text (green text fails contrast) */
	--lt-ink: var(--dbm-black);
	--lt-paper: var(--dbm-white);
	--lt-ease: cubic-bezier(.2, .8, .2, 1);
	--lt-dur-feedback: 180ms;
	--lt-dur-reveal: 500ms;
	--lt-dur-hero: 900ms;
	--lt-dur-page: 200ms;
	--lt-dur-count: 650ms;
	--lt-rise: 28px;
	--lt-stagger: 80ms;
	--lt-stagger-word: 65ms;
	--lt-radius-card: 22px;
	--lt-radius-pill: 999px;
	--lt-shadow-1: 0 1px 2px rgba(0, 0, 0, .06), 0 2px 6px rgba(0, 0, 0, .05);
	--lt-shadow-2: 0 2px 4px rgba(0, 0, 0, .05), 0 10px 24px rgba(0, 0, 0, .08), 0 24px 48px -16px rgba(0, 0, 0, .12);
	--lt-shadow-3: 0 4px 8px rgba(0, 0, 0, .06), 0 18px 36px rgba(0, 0, 0, .12), 0 40px 72px -24px rgba(0, 0, 0, .18);
	--lt-glass-bg: rgba(255, 255, 255, .72);
	--lt-glass-strong: rgba(255, 255, 255, .92);
	--lt-glass-border: rgba(0, 0, 0, .08);
	--lt-blur: 14px;
	--lt-glow: radial-gradient(42rem 28rem at 78% 38%, rgba(126, 217, 87, .26), transparent 62%), radial-gradient(30rem 22rem at 96% 82%, rgba(56, 182, 255, .14), transparent 60%);
	--lt-tap: 44px;
	--lt-hero-size: clamp(2.75rem, 1.1rem + 6.7vw, 6.25rem); /* up to 100px */
}

@media (max-width: 760px) {
	:root { --lt-rise: 14px; --lt-stagger: 40ms; --lt-stagger-word: 33ms; } /* half distance and stagger on phones */
}

/* Dark mode removed in 1.2.0: the brand is shown in its own colours whatever the device setting. */