/**
 * Design tokens harvested from the Breakdance global settings of the CDP site.
 */

:root {
	/* Brand palette. The only two brand blues are navy and light blue; every other
	   blue on the site must be a tint of one of them. */
	--cdp-white: #ffffff;
	--cdp-navy: #001d4f;
	--cdp-light-blue: #627d99;
	--cdp-brand-orange: #f7941d;
	--cdp-orange: #ff9639;
	/* Light blue at 22% and 15% over white. */
	--cdp-pale-blue: #dde2e9;
	--cdp-card-blue: #e7ecf0;
	--cdp-health-green: #48c78e;

	/* Neutrals */
	--cdp-page-bg: #f9fafb;
	--cdp-section-bg: #f8f9fb;
	--cdp-body-text: #374151;
	--cdp-heading-text: #111827;
	--cdp-hairline: #d1d5db;
	--cdp-hover-wash: #d1d5db40;

	/* Typography */
	--cdp-font-body: "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	--cdp-font-heading: "Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	--cdp-font-size: 18px;
	/* A percentage resolves once and inherits as a length, matching the source design. */
	--cdp-line-height: 150%;
	--cdp-heading-line-height: 110%;
	/* The source specifies -2%/-6%; em is the portable equivalent. */
	--cdp-letter-spacing: -0.02em;
	--cdp-heading-letter-spacing: -0.06em;
	--cdp-font-ratio: 1.25;
	--cdp-h1: 80px;
	--cdp-h2: 56px;
	--cdp-h3: 32px;
	--cdp-h4: calc(var(--cdp-h3) / var(--cdp-font-ratio));
	--cdp-h5: calc(var(--cdp-h4) / var(--cdp-font-ratio));
	--cdp-h6: calc(var(--cdp-h5) / var(--cdp-font-ratio));

	/* Layout */
	--cdp-container: 1120px;
	--cdp-section-padding-block: 100px;
	--cdp-section-padding-inline: 20px;
	--cdp-column-gap: 32px;

	/* Controls */
	--cdp-radius: 3px;
	--cdp-button-padding: 14px 24px;
	--cdp-button-padding-sm: 8px 16px;
	--cdp-transition: 300ms;

	/* Header */
	--cdp-header-inline-padding: 80px;
	--cdp-header-z: 200;
}

@media (max-width: 1023px) {
	:root {
		--cdp-h1: 56px;
		--cdp-h2: 40px;
		--cdp-h3: 28px;
	}
}

@media (max-width: 767px) {
	:root {
		--cdp-h1: 40px;
		--cdp-h2: 32px;
		--cdp-h3: 24px;
		--cdp-section-padding-block: 60px;
	}
}