/*
 * Intro. Figma 186:387 (Home): 140px below the hero; olive heading in the
 * left half, its cap top 8px below the text's; Body A text in the right
 * half (980px, 900 wide); facts 80px under the text, in two columns
 * (980px and 1450px), each with a 1px olive bar and the text 40px after it.
 */

.intro {
	row-gap: var(--space-40);
	align-items: start;
	padding-block: var(--space-140);
}

.intro__heading {
	margin-top: clamp(4px, 0.4167vw, 8px);
	color: var(--color-olive);
	font-size: var(--fs-100);
	font-weight: var(--fw-text);
	line-height: var(--lh-subheadline);
	letter-spacing: var(--ls-subheadline);
	text-box: trim-both cap alphabetic;
}

.intro__line {
	display: block;
}

.intro__line--light {
	font-weight: var(--fw-extralight);
}

.intro__text {
	color: var(--color-forest-a);
	font-size: var(--fs-35);
	line-height: var(--lh-body);
	text-box: trim-both cap alphabetic;
}

.intro__text p + p {
	margin-top: 1em;
}

/* Wellness (257:915): a lead paragraph in Text, the rest in Regular. */
.intro--lead .intro__text p + p {
	font-weight: var(--fw-regular);
}

.intro__facts {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	column-gap: var(--gutter);
	margin: var(--space-80) 0 0;
}

.intro__fact {
	padding-left: calc(var(--space-40) - var(--stroke-hairline));
	border-left: var(--stroke-hairline) solid currentColor;
	color: var(--color-olive);
}

.intro__fact dt,
.intro__fact dd {
	margin: 0;
}
