.content-section {
	padding-top: clamp(12rem, 9rem + 5vw, 16rem);
	padding-bottom: var(--space-l);
}

.content-container {
	max-width: 100rem;
}

.content-header {
	margin-bottom: var(--space-l);
}

.content-title {
	display: inline-block;
	font-size: calc(var(--h1) * 0.85);
	font-weight: 900;
	line-height: 1.05;
	text-transform: uppercase;
	background-image: linear-gradient(to right, var(--gold-dark), var(--gold));
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

.content-row {
	display: grid;
	grid-template-columns: repeat(12, 1fr);
	gap: var(--space-m) var(--space-l);
	margin-bottom: var(--space-l);
}

.content-row:last-child {
	margin-bottom: 0;
}

.content-column {
	grid-column: span var(--span, 12);
	color: var(--bw-100);
	font-size: var(--text-m);
	line-height: var(--lh-base);
}

.content-column > * + * {
	margin-top: var(--space-s);
}

.content-column :is(h1, h2, h3, h4, h5, h6) {
	color: var(--gold-light);
	font-size: var(--h4);
	font-weight: 600;
	line-height: 1.2;
	text-transform: uppercase;
	letter-spacing: 0.02em;
}

.content-column > :is(h1, h2, h3, h4, h5, h6):not(:first-child) {
	margin-top: var(--space-m);
}

.content-column p {
	max-width: 70ch;
}

.content-column a {
	color: var(--gold);
	text-decoration: underline;
	text-underline-offset: 3px;
	transition: color 0.2s;
}

.content-column a:hover {
	color: var(--gold-light);
}

.content-column :is(ul, ol) {
	padding-left: 2.2rem !important;
	margin-top: var(--space-xs);
}

.content-column li {
	margin-bottom: 0.4rem;
}

@media (max-width: 992px) {
	.content-column {
		grid-column: 1 / -1;
	}
	.content-column + .content-column {
		margin-top: var(--space-m);
	}
}
