.mfb-cta {
	background: var(--mfb-section-bg, var(--mfb-color-forest));
	color: var(--mfb-section-text, var(--mfb-color-paper));
}

.mfb-cta__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1.25rem;
	padding-block: clamp(4.5rem, 2rem + 8vw, 10rem);
	text-align: center;
}

/* Parallax reveal, enabled by cta.js: the section clips its content while it slides into place. */
.mfb-cta.is-parallax {
	overflow: hidden;
}

.mfb-cta.is-parallax .mfb-cta__inner {
	will-change: transform;
}

/* Illustration flush with the top of the section, as in the design. */
.mfb-cta__inner--illustrated {
	padding-top: 0;
}

.mfb-cta__image {
	width: min(100%, 74rem);
	height: auto;
	margin-bottom: 1.25rem;
}

/* Phones: the illustration stays large, edge to edge, cropped around the centre pieces. */
@media (max-width: 47.999em) {
	.mfb-cta__image {
		width: 100vw;
		max-width: none;
		aspect-ratio: 3 / 2;
		margin-inline: calc(50% - 50vw);
		object-fit: cover;
		max-height: 36rem;
		object-position: 55% 50%;
	}
}

.mfb-cta__title {
	color: var(--mfb-section-heading, inherit);
}

.mfb-cta__text {
	max-width: 60ch;
}