.wrap {
	width: min(100% - var(--gutter) * 2, var(--wrap));
	margin-inline: auto;
}

.wrap--wide {
	width: calc(100% - var(--gutter) * 2);
	max-width: none;
}

.section {
	padding-block: var(--section);
}

.section--tight {
	padding-block: calc(var(--section) * .6);
}

.section--navy {
	background: var(--navy);
}

.section--ink {
	background: var(--ink);
}

.grid {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	column-gap: clamp(12px, 1.6vw, 24px);
}

.rule {
	display: block;
	height: 1px;
	background: var(--line);
	transform-origin: left center;
}

.rule--dashed {
	background: repeating-linear-gradient(to right, var(--line-2) 0 4px, transparent 4px 8px);
}

/* Section head: index numeral, label, opener, link */

.head {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	column-gap: clamp(12px, 1.6vw, 24px);
	align-items: end;
	row-gap: 20px;
	margin-bottom: clamp(32px, 4.5vw, 64px);
}

.head__index {
	grid-column: 1 / span 2;
	align-self: start;
	display: flex;
	gap: 10px;
	align-items: baseline;
	padding-top: .5em;
}

.head__index .aside {
	font-size: 1.05rem;
}

.head__title {
	grid-column: 3 / span 7;
}

.head__more {
	grid-column: 10 / -1;
	justify-self: end;
	padding-bottom: .4em;
}

@media (max-width: 800px) {
	.head__index,
	.head__title,
	.head__more {
		grid-column: 1 / -1;
		justify-self: start;
	}

	.head__index {
		padding-top: 0;
	}
}

/* Two-part text block: narrow label column, reading column */

.split {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	column-gap: clamp(12px, 1.6vw, 24px);
	row-gap: 28px;
}

.split__side {
	grid-column: 1 / span 2;
}

.split__main {
	grid-column: 3 / span 8;
}

.split__main--cols {
	columns: 2;
	column-gap: clamp(24px, 3vw, 48px);
}

.split__main--cols > * {
	break-inside: avoid;
}

@media (max-width: 800px) {
	.split__side,
	.split__main {
		grid-column: 1 / -1;
	}

	.split__main--cols {
		columns: 1;
	}
}

/* Horizontal row that runs off the right edge */

.scroller {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: clamp(220px, 23vw, 300px);
	gap: clamp(12px, 1.4vw, 20px);
	overflow-x: auto;
	scroll-snap-type: x proximity;
	scroll-padding-inline: max(var(--gutter), (100vw - var(--wrap)) / 2);
	padding-inline: max(var(--gutter), (100vw - var(--wrap)) / 2);
	padding-bottom: 8px;
	scrollbar-width: none;
}

.scroller::-webkit-scrollbar {
	display: none;
}

.scroller > * {
	scroll-snap-align: start;
}

.scroller--wide {
	grid-auto-columns: clamp(280px, 34vw, 460px);
}

.scroller-nav {
	display: flex;
	gap: 8px;
}

.scroller-nav button {
	width: 44px;
	height: 44px;
	border: 1px solid var(--line-2);
	border-radius: var(--radius);
	display: grid;
	place-items: center;
	transition: border-color var(--fast) ease, color var(--fast) ease;
}

.scroller-nav button:hover {
	border-color: var(--gold);
	color: var(--gold);
}

.scroller-nav button[aria-disabled="true"] {
	opacity: .35;
	cursor: default;
}

@media (hover: none) {
	.scroller-nav {
		display: none;
	}
}

.stack > * + * {
	margin-top: var(--stack, 24px);
}

.cluster {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--cluster, 16px 24px);
}