/* ==========================================================================
   Single service: overview, deliverables, steps strip
   ========================================================================== */

.service-overview__grid {
	display: grid;
	grid-template-columns: minmax(0, 3fr) minmax(0, 9fr);
	gap: var(--space-5);
}

.service-overview__tags {
	margin-top: var(--space-4);
	font-family: var(--font-display);
	font-style: italic;
	color: var(--text-secondary);
}

.service-overview__lead {
	max-width: 28ch;
	font-size: var(--fs-statement);
	font-weight: 300;
	line-height: 1.18;
}

.service-overview__prose {
	max-width: 62ch;
	margin-top: var(--space-6);
	margin-left: auto;
	margin-right: clamp(0rem, 6vw, 6rem);
}

/* Deliverables ----------------------------------------------------------- */
.deliverables__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	border-top: 1px solid var(--border-strong);
}

.deliverable {
	display: grid;
	grid-template-columns: 3.5rem minmax(0, 1fr);
	column-gap: var(--space-3);
	row-gap: var(--space-2);
	padding: clamp(2rem, 3.5vw, 3rem) clamp(1rem, 3vw, 3rem) clamp(2rem, 3.5vw, 3rem) 0;
	border-bottom: 1px solid var(--border-strong);
}

.deliverable:nth-child(even) {
	padding-left: clamp(1rem, 3vw, 3rem);
	border-left: 1px solid var(--border-strong);
}

.deliverable__num {
	grid-row: span 2;
	font-family: var(--font-display);
	font-style: italic;
	color: var(--ace-gold);
	font-size: var(--fs-h4);
	line-height: 1.2;
}

.deliverable__title {
	font-size: var(--fs-h3);
	font-weight: 350;
}

.deliverable__text {
	max-width: 44ch;
	color: var(--text-secondary);
	font-size: var(--fs-small);
}

/* Steps strip ------------------------------------------------------------ */
.steps-strip__list {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	counter-reset: steps;
}

.steps-strip__item {
	display: flex;
	flex-direction: column;
	gap: var(--space-3);
	padding: var(--space-5) var(--space-4) var(--space-4) 0;
	border-top: var(--hairline-inverse);
}

.steps-strip__item + .steps-strip__item {
	padding-left: var(--space-4);
	border-left: var(--hairline-inverse);
}

.steps-strip__num {
	font-family: var(--font-display);
	font-style: italic;
	font-size: clamp(2.5rem, 2rem + 2vw, 4rem);
	font-weight: 200;
	line-height: 1;
	color: var(--ace-gold);
}

.steps-strip__title {
	font-size: var(--fs-h3);
	font-weight: 350;
}

.steps-strip__text {
	font-size: var(--fs-small);
	color: var(--text-inverse-muted);
}