/* Block: DD — Uitgelicht */

.dd-spotlight {
	padding: 80px 0 20px;
}

.dd-spotlight__panel {
	background: var(--dd-paper-card);
	border: 1px solid var(--dd-line);
	border-radius: var(--dd-radius-panel);
	padding: 56px;
}

/* Intro grid: eyebrow + serif title left, paragraph right */
.dd-spotlight__head {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 56px;
	margin-bottom: 44px;
}

.dd-spotlight__title.dd-h2 {
	margin: 0;
	font-size: 38px;
	line-height: 1.1;
}

.dd-spotlight__intro {
	font-size: 17px;
	line-height: 1.7;
	color: var(--dd-body);
	margin: 0;
	align-self: end;
}

/* Step cards */
.dd-spotlight__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 16px;
}

.dd-spotlight--cols-2 .dd-spotlight__grid {
	grid-template-columns: repeat(2, 1fr);
}

.dd-spotlight--cols-3 .dd-spotlight__grid {
	grid-template-columns: repeat(3, 1fr);
}

.dd-spotlight__step {
	background: var(--dd-paper);
	border: 1px solid var(--dd-line);
	border-radius: var(--dd-radius-card);
	padding: 24px;
}

.dd-spotlight__step-label {
	font-family: var(--dd-mono);
	font-size: 11px;
	letter-spacing: 0.1em;
	color: var(--dd-terracotta);
	margin-bottom: 12px;
}

.dd-spotlight__step-title {
	font-family: var(--dd-serif);
	font-weight: 400;
	font-size: 20px;
	line-height: 1.15;
	margin: 0 0 8px;
}

.dd-spotlight__step-title em,
.dd-spotlight__step-title .dd-accent {
	font-style: italic;
	color: var(--dd-terracotta);
}

.dd-spotlight__step-body {
	font-size: 14px;
	line-height: 1.6;
	color: var(--dd-body);
	margin: 0;
}

@media (max-width: 900px) {
	.dd-spotlight {
		padding: 56px 0 20px;
	}

	.dd-spotlight__panel {
		padding: 36px;
	}

	.dd-spotlight__head {
		grid-template-columns: 1fr;
		gap: 20px;
		margin-bottom: 32px;
	}

	.dd-spotlight__grid,
	.dd-spotlight--cols-3 .dd-spotlight__grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 600px) {
	.dd-spotlight__panel {
		padding: 28px;
	}

	.dd-spotlight__grid,
	.dd-spotlight--cols-2 .dd-spotlight__grid,
	.dd-spotlight--cols-3 .dd-spotlight__grid {
		grid-template-columns: 1fr;
	}
}
