/*
 * Ada design tokens — extracted from Figma "ADA Website" Dev Handover 30/07/2026.
 * Palette: Main Colours. Type: Urbanist only.
 */

:root {
	/* Brand colours (Figma "Main Colours"). */
	--ada-red: #B50B0B;
	--ada-red-dark: #990422;
	--ada-black: #111111;
	--ada-grey-dark: #3E4447;
	--ada-grey: #BDC3C7;
	--ada-grey-light: #ECF0F1;
	--ada-grey-lightest: #F5F7F7;
	--ada-white: #FFFFFF;

	/* Warm tints used by gradient sections. */
	--ada-warm-tint: #F6F2EC;
	--ada-warm-ink: #2F2A26;

	/* Role tokens. */
	--ada-bg: var(--ada-white);
	--ada-ink: var(--ada-black);
	--ada-muted: #5C6366;             /* Dark grey walked down for AA on white. */
	--ada-line: #E4E8EA;              /* Hairlines. */
	--ada-accent: var(--ada-red);
	--ada-btn: var(--ada-red-dark);
	--ada-btn-ink: var(--ada-white);
	--ada-eyebrow: var(--ada-red);

	/* Dark-surface roles. */
	--ada-dark-bg: #161616;
	--ada-dark-card: #1D1D1D;
	--ada-dark-ink: var(--ada-white);
	--ada-dark-muted: #C9CDCF;

	/* Type scale — desktop (Figma text styles). */
	--fs-h1: 54px; --fw-h1: 600; --lh-h1: 1.18;
	--fs-h2: 40px; --fw-h2: 500; --lh-h2: 1.22;
	--fs-h3: 32px; --fw-h3: 400; --lh-h3: 1.25;
	--fs-h4: 26px; --fw-h4: 500; --lh-h4: 1.3;
	--fs-h5: 21px; --fw-h5: 500; --lh-h5: 1.35;
	--fs-body-lg: 18px;
	--fs-body: 16px;
	--fs-body-sm: 14px;
	--fs-caption: 13px;

	/* Layout. */
	--container: 1180px;
	--container-wide: 1240px;
	--gutter: clamp(20px, 4vw, 44px);
	--section-pad: clamp(56px, 8vw, 110px);
	--radius: 10px;
	--radius-lg: 16px;
	--shadow-card: 0 10px 40px rgba(17, 17, 17, 0.08);

	/* Motion. */
	--ease-out: cubic-bezier(0.22, 1, 0.36, 1);
	--dur: 0.6s;
}

/* Mobile scale (Figma "Text Hierarchy Mobile"). */
@media (max-width: 767px) {
	:root {
		--fs-h1: 40px;
		--fs-h2: 32px;
		--fs-h3: 26px;
		--fs-h4: 21px;
		--fs-h5: 18px;
	}
}