/* Diensten "Voor wie?" card (spec §4.11). */
.diensten-grid { display: grid; gap: calc(var(--spacing) * 6); }
@media (min-width: 48rem) { .diensten-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 64rem) { .diensten-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.diensten-card {
	scroll-margin-top: calc(var(--header-h) + 1.5rem); /* live scroll-mt-24 sat under the 116/136px header; clear it */
	overflow: hidden;
	border: 1px solid var(--color-gray-100);
	border-radius: var(--radius-2xl);
	background-color: var(--color-white);
	box-shadow: var(--shadow-sm);
	transition: all var(--duration-base) var(--ease-default);
}
/* Plan fix 6: the lift works (transform, not the `translate` property the reveal uses, so the two never collide). */
.diensten-card:hover { box-shadow: var(--shadow-xl); transform: translateY(-0.25rem); }
@media (prefers-reduced-motion: reduce) { .diensten-card:hover { transform: none; } }
.diensten-card__media { position: relative; overflow: hidden; }
.diensten-card__img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; transition: transform var(--duration-image) var(--ease-default); }
.diensten-card:hover .diensten-card__img { transform: scale(1.05); }
.diensten-card__body { padding: calc(var(--spacing) * 6); }
.diensten-card__title {
	margin-bottom: calc(var(--spacing) * 3);
	font-size: var(--text-xl);
	line-height: var(--text-xl-lh);
	font-weight: var(--font-weight-bold);
	color: var(--color-brand-dark);
	transition: color var(--duration-fast) var(--ease-default);
}
.diensten-card:hover .diensten-card__title { color: var(--color-brand-orange); }
.diensten-card__text {
	margin-bottom: calc(var(--spacing) * 4);
	font-size: var(--text-sm);
	line-height: var(--text-sm-lh);
	color: var(--color-gray-600);
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.diensten-card__for { margin-bottom: calc(var(--spacing) * 5); padding: calc(var(--spacing) * 4); border-radius: var(--radius-xl); background-color: var(--color-gray-50); }
.diensten-card__for-label {
	margin-bottom: calc(var(--spacing) * 1);
	font-size: var(--text-xs);
	line-height: var(--text-xs-lh);
	font-weight: var(--font-weight-medium);
	color: var(--color-gray-500);
	text-transform: uppercase;
	letter-spacing: var(--tracking-wide);
}
.diensten-card__for-text {
	font-size: var(--text-sm);
	line-height: var(--text-sm-lh);
	color: var(--color-gray-700);
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.diensten-card__meta {
	display: flex;
	align-items: center;
	gap: calc(var(--spacing) * 4);
	margin-bottom: calc(var(--spacing) * 5);
	padding-bottom: calc(var(--spacing) * 5);
	border-bottom: 1px solid var(--color-gray-100);
	font-size: var(--text-sm);
	line-height: var(--text-sm-lh);
	color: var(--color-gray-500);
}
.diensten-card__meta-item { display: flex; align-items: center; gap: calc(var(--spacing) * 1.5); }
.diensten-card__meta-item .icon { color: var(--color-brand-orange); }
/* "Meer over <traject>" (per-intent pages plan): between the meta rule and the intake button, mb 16. */
.diensten-card__more { margin-bottom: calc(var(--spacing) * 4); }