/*
 * Blok: Praktische informatie (template-parts/praktische-info.php).
 * Gegevens naast elkaar (zo veel als passen), elk met een icoon in de onderwerpkleur.
 */

.blok-praktische-info__kaart { border-top: 6px solid var(--blok-accent); }
.blok-praktische-info .blok__kop { margin-bottom: 8px; }
.blok-praktische-info__lijst { display: grid; grid-template-columns: repeat(var(--kolommen, 3), minmax(0, 1fr)); gap: 0 32px; margin: 0; }
.blok-praktische-info__item { position: relative; min-width: 0; min-height: 86px; padding: 20px 0 18px 64px; border-bottom: 1px solid #EFE8E0; }
.blok-praktische-info__item .blok-icoon { position: absolute; top: 18px; left: 0; }
.blok-praktische-info__item dt { margin: 0 0 2px; color: var(--blok-zacht); font-size: 16px; font-weight: 700; line-height: 1.4; }
.blok-praktische-info__item dd { margin: 0; color: var(--swo-color-heading); font-size: 18px; font-weight: 700; line-height: 1.5; overflow-wrap: anywhere; }
.blok-praktische-info__item dd a { color: var(--swo-color-heading); text-decoration: underline; text-decoration-color: var(--blok-accent); text-decoration-thickness: 2px; text-underline-offset: 3px; }

@media (max-width: 1060px) {
	.blok-praktische-info__lijst { grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); }
}

@media (max-width: 700px) {
	.blok-praktische-info__lijst { grid-template-columns: minmax(0, 1fr); }
	.blok-praktische-info__item { min-height: 0; padding: 16px 0 14px 64px; }
	.blok-praktische-info__item .blok-icoon { top: 14px; }
}