/* ==========================================================================
   Single service: overview, scope lists, results, FAQ, related + prev/next.
   ========================================================================== */
.section--tight-top { padding-block-start: clamp(3.5rem, 2rem + 4vw, 7rem); }

/* Overview: large intro text | gold line | direction. */
.overview__inner { display: grid; gap: var(--s-5); }
.overview__text {
	max-width: 58ch;
	color: var(--c-ink);
	font-size: var(--fs-lead);
	line-height: 1.55;
}
.overview__text > * + * { margin-block-start: 1em; }
.overview__aside {
	display: grid;
	gap: var(--s-1);
	align-content: start;
	padding-inline-start: var(--s-3);
	border-inline-start: 1px solid var(--c-gold);
}
.overview__label { color: var(--c-slate); font-size: var(--fs-xs); }
.overview__direction {
	font-family: var(--font-display);
	font-size: clamp(1.625rem, 1.3rem + 1vw, 2.25rem);
	font-weight: 500;
	line-height: 1.15;
}
.overview__desc { max-width: 42ch; margin-block-end: var(--s-1); color: var(--c-slate); font-size: var(--fs-small); line-height: 1.65; }
@media (min-width: 1024px) {
	.overview__inner { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 0; }
	.overview__text { padding-inline-end: clamp(2rem, 4vw, 5rem); }
	.overview__aside { padding-inline-start: clamp(2rem, 3vw, 3.5rem); padding-block: 0.5rem; }
}

/* Scope: two lists, each item marked with the line in miniature. */
.scope__inner { display: grid; gap: var(--s-8) var(--gap); }
@media (min-width: 1024px) {
	.scope__inner { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(3rem, 6vw, 8rem); }
	.scope--single .scope__inner { grid-template-columns: minmax(0, 8fr); }
}
.scope__title {
	margin-block-end: var(--s-4);
	font-size: clamp(2rem, 1.6rem + 1.4vw, 3rem);
}
.scope__col--situations .scope__list li { color: var(--c-slate); }

/* Results: deliverables in two columns, serif, on hairlines. */
.results__inner { display: grid; gap: var(--s-5); }
.results__title { max-width: 10em; }
.results__list {
	display: grid;
	gap: 0 var(--gap);
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr));
	align-content: start;
}
.results__item {
	padding-block: var(--s-3);
	border-block-start: 1px solid var(--line-light);
	font-family: var(--font-display);
	font-size: clamp(1.375rem, 1.2rem + 0.6vw, 1.75rem);
	font-weight: 500;
	line-height: 1.25;
}
@media (min-width: 1024px) {
	.results__inner { grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: var(--gap); align-items: start; }
}

/* FAQ: title left, accordion right. */
.faq__inner { display: grid; gap: var(--s-5); }
.faq__title { max-width: 9em; }
@media (min-width: 1024px) {
	.faq__inner { grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: var(--gap); align-items: start; }
}

/* Previous / next service. */
.service-nav {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--gap);
	margin-block-start: clamp(3rem, 2rem + 3vw, 5rem);
}
.service-nav__link {
	position: relative;
	display: grid;
	gap: 0.5rem;
	align-content: start;
	min-height: 44px;
	padding-inline: var(--s-3);
	color: var(--c-ink);
	text-decoration: none;
}
.service-nav__link--next { text-align: end; justify-items: end; }
.service-nav__link::before {
	content: "";
	position: absolute;
	inset-block: 0;
	inset-inline-start: 0;
	width: 1px;
	background: var(--c-gold-deep);
	transform: scaleY(0);
	transition: transform var(--dur) var(--ease-out);
}
.service-nav__link--next::before { inset-inline: auto 0; }
.service-nav__link:hover::before,
.service-nav__link:focus-visible::before { transform: scaleY(1); }
.service-nav__label {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	color: var(--c-slate);
	font-size: var(--fs-xs);
	font-weight: 600;
}
.service-nav__label .icon { width: 1rem; height: 1rem; }
.service-nav__link--next .service-nav__label { flex-direction: row-reverse; }
.service-nav__title {
	font-family: var(--font-display);
	font-size: clamp(1.375rem, 1.2rem + 0.6vw, 1.875rem);
	font-weight: 500;
	line-height: 1.2;
	transition: color var(--dur) var(--ease-out);
}
.service-nav__link:hover .service-nav__title { color: var(--c-gold-deep); }
@media (max-width: 767px) {
	.service-nav { grid-template-columns: minmax(0, 1fr); gap: var(--s-4); }
	.service-nav__link--empty { display: none; }
	.service-nav__link--next { text-align: start; justify-items: start; }
	.service-nav__link--next::before { inset-inline: 0 auto; }
	.service-nav__link--next .service-nav__label { flex-direction: row; }
}