/*
 * Blok: Tekst met afbeelding (template-parts/tekst-afbeelding.php).
 * Foto met een vlak in de onderwerpkleur erachter; op smalle schermen staat de foto boven de tekst.
 */

.blok-tekst-afbeelding__raster { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 56px; align-items: center; }
.blok-tekst-afbeelding.is-links .blok-tekst-afbeelding__media { order: -1; }
.blok-tekst-afbeelding.is-zonder-afbeelding .blok-tekst-afbeelding__raster { grid-template-columns: minmax(0, 780px); }
.blok-tekst-afbeelding__tekst { min-width: 0; }
.blok-tekst-afbeelding .blok__kop { margin-bottom: 14px; }

.blok-tekst-afbeelding__media { position: relative; margin: 0 18px 18px 0; }
.blok-tekst-afbeelding.is-links .blok-tekst-afbeelding__media { margin: 0 0 18px 18px; }
.blok-tekst-afbeelding__media::before { position: absolute; z-index: 0; inset: 18px -18px -18px 18px; content: ""; background: var(--blok-tint-sterk); border-radius: 20px; }
.blok-tekst-afbeelding.is-links .blok-tekst-afbeelding__media::before { inset: 18px 18px -18px -18px; }
.blok-tekst-afbeelding__img { position: relative; z-index: 1; display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; background: #EEE8E1; border-radius: 18px; box-shadow: 0 10px 28px rgba(70, 45, 20, .12); }

@media (max-width: 900px) {
	.blok-tekst-afbeelding__raster { grid-template-columns: minmax(0, 1fr); gap: 34px; }
	.blok-tekst-afbeelding .blok-tekst-afbeelding__media { order: -1; max-width: 620px; }
}

@media (max-width: 500px) {
	.blok-tekst-afbeelding__media, .blok-tekst-afbeelding.is-links .blok-tekst-afbeelding__media { margin: 0 12px 12px 0; }
	.blok-tekst-afbeelding__media::before, .blok-tekst-afbeelding.is-links .blok-tekst-afbeelding__media::before { inset: 12px -12px -12px 12px; }
}