/**
 * Archiefpagina-styling (§7). Bouwt voort op de custom properties die
 * frontend.css al op .dn-toepassingen zet; hier alleen de archief-specifieke
 * onderdelen (breadcrumbs, header, beschrijving, subkoppen).
 */

.dn-toepassingen-archief {
	max-width: 900px;
	margin: 2em auto;
	padding: 0 1em;
}

.dn-toepassingen-archief__breadcrumbs {
	font-size: 0.9em;
	color: var(--dn-toep-meta);
	margin-bottom: 1.5em;
}

.dn-toepassingen-archief__breadcrumbs a {
	color: var(--dn-toep-meta);
}

.dn-toepassingen-archief__breadcrumbs span[aria-hidden] {
	margin: 0 0.4em;
}

.dn-toepassingen-archief__header {
	display: flex;
	align-items: center;
	gap: 1em;
	margin-bottom: 1.5em;
}

.dn-toepassingen-archief__header .dn-toepassingen__icon {
	color: var(--dn-toep-accent);
}

.dn-toepassingen-archief__header .dn-toepassingen__icon svg,
.dn-toepassingen-archief__header .dn-toepassingen__icon-image {
	width: 48px;
	height: 48px;
}

.dn-toepassingen-archief__titel {
	color: var(--dn-toep-titel);
	margin: 0 0 0.2em;
}

.dn-toepassingen-archief__intro {
	color: var(--dn-toep-meta);
	margin: 0;
}

.dn-toepassingen-archief__beschrijving {
	color: var(--dn-toep-tekst);
	line-height: 1.6;
	margin-bottom: 2em;
}

.dn-toepassingen-archief__subkop {
	color: var(--dn-toep-titel);
	margin: 2em 0 1em;
}

.dn-toepassingen-archief__related {
	margin-top: 0;
}