/**
 * Drive — a hero photo, two photo rows either side of a pull quote.
 *
 * From the design: a 1526px hero, and rows of three 486 × 437.39 photos that
 * span the same width (486 × 3 + 34 × 2 = 1526).
 */

.rth-drive {
	flex: 1;
	min-width: 0;
}

.drive {
	width: min(1526px, 100% - 40px);
	margin-inline: auto;
	padding-block: var(--space-xl) var(--space-2xl);
}

/* Intro */
.drive__title {
	margin-bottom: var(--space-sm);
}

.drive__subtitle {
	margin: 0;
	font-family: var(--font-display); /* Lexend */
	font-weight: 600;
	font-size: calc(clamp(1.75rem, 3.28vw, 3.9375rem) * var(--fs-scale)); /* 63px */
	line-height: 1.222; /* 77 / 63 */
	letter-spacing: 0;
	text-align: center;
	color: black;
}

/* Photos */
.drive__hero {
	margin: var(--space-xl) 0 0;
}

.drive__hero-img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 1526 / 813.3;
	object-fit: cover;
	border-radius: 20px;
}

.drive__row {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 34px;
	margin-top: var(--space-xl);
}

.drive__photo {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 486 / 437.39;
	object-fit: cover;
	border-radius: 16px;
}

/* Lead */
.drive__lead {
	margin: var(--space-xl) 0 0;
	font-family: var(--font-mono); /* JetBrains Mono */
	font-weight: 700;
	font-size: calc(clamp(1.25rem, 1.51vw, 1.8125rem) * var(--fs-scale)); /* 29px */
	line-height: 2.655; /* 77 / 29 */
	letter-spacing: 0;
	text-align: center;
	color: black;
}

/* Pull quote */
.drive__quote {
	width: min(1180px, 100%);
	margin: var(--space-lg) auto 0;
	padding: var(--space-lg);
	background: var(--color-mint);
	border-left: 6px solid var(--color-olive);
	border-radius: 0 16px 16px 0;
	/* GeneratePress italicises every blockquote; the design sets this one upright. */
	font-style: normal;
}

.drive__quote > :first-child {
	margin-top: 0;
}

.drive__quote > :last-child {
	margin-bottom: 0;
}

/* Contact line */
.drive__contact {
	margin: 150px 0 0;
	font-family: var(--font-mono); /* JetBrains Mono */
	font-weight: 700;
	font-size: calc(clamp(1.125rem, 1.25vw, 1.5rem) * var(--fs-scale)); /* 24px */
	line-height: 1.333; /* 32 / 24 */
	letter-spacing: 0;
	text-align: center;
	color: black;
}

.drive__contact-email {
	color: var(--color-olive);
}

@media (max-width: 800px) {
	.drive__row {
		grid-template-columns: 1fr;
		gap: var(--space-md);
		margin-top: var(--space-lg);
	}

	.drive__contact {
		margin-top: var(--space-2xl);
	}
}