/**
 * Blok "mediatext" — afwisselende beeld + tekst secties (Over / Showroom / Zakelijk).
 * Varianten:
 *   .th-mediatext--wit    witte sectie, kop 40px
 *   .th-mediatext--grijs  full-bleed grijze band (#f5f5f5), kop 32px
 *   .th-mediatext--beeld-links  beeld links i.p.v. rechts
 * Gouden "seal"-badges (Hengelo/Ootmarsum) overhangen de beeldhoeken.
 */
.th-mediatext { background: #fff; color: var(--th-dark); }
.th-mediatext--grijs { background: #f5f5f5; }
.th-mediatext__inner {
	display: grid;
	grid-template-columns: 527fr 563fr;
	gap: 88px;
	align-items: center;
	padding-block: clamp(40px, 6vw, 64px);
}
.th-mediatext--grijs .th-mediatext__inner { padding-block: clamp(44px, 7vw, 80px); }
/* Beeld links: media vóór de tekst plaatsen; beeld krijgt de bredere kolom (zoals design). */
.th-mediatext--beeld-links .th-mediatext__inner { grid-template-columns: 563fr 527fr; }
.th-mediatext--beeld-links .th-mediatext__media { order: -1; }

.th-mediatext__title {
	font-family: var(--th-font-heading); font-weight: 600;
	font-size: clamp(28px, 1.5rem + 1.6vw, 40px); line-height: 1.2; color: var(--th-dark);
	margin: 0 0 22px;
}
.th-mediatext--grijs .th-mediatext__title { font-size: clamp(24px, 1.35rem + 1vw, 32px); }
.th-mediatext__body p { font-family: var(--th-font-body); font-size: 15px; line-height: 1.75; margin: 0 0 16px; color: var(--th-dark); }
.th-mediatext__body p:last-child { margin-bottom: 0; }
/* Inline links in de body (bv. e-mailadres) — goud + onderstreept zodat ze duidelijk klikbaar zijn. */
.th-mediatext__body a { color: var(--th-gold); font-weight: 600; text-decoration: underline; text-underline-offset: 2px; word-break: break-word; transition: color .2s ease; }
.th-mediatext__body a:hover,
.th-mediatext__body a:focus-visible { color: var(--th-dark); }
.th-mediatext__text .th-btn { margin-top: 26px; }
.th-mediatext__cta { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 26px; }
.th-mediatext__cta .th-btn { margin-top: 0; }

.th-mediatext__media { position: relative; }
.th-mediatext__media img { display: block; width: 100%; height: auto; border-radius: 4px; }
.th-mediatext__media[data-empty] { min-height: 380px; border-radius: 4px; background: linear-gradient(120deg, #efe9df, #d9d2c6); }

/* Gouden seal-badges op het beeld */
.th-mediatext__badges { position: absolute; inset: 0; pointer-events: none; }
.th-mediatext__badge {
	position: absolute; width: 128px; height: 128px;
	display: flex; align-items: center; justify-content: center;
	color: #fff;
	filter: drop-shadow(0 6px 14px rgba(0,0,0,.18));
}
.th-mediatext__badge .th-seal { position: absolute; inset: 0; width: 100%; height: 100%; }
.th-mediatext__badge-label { position: relative; display: inline-flex; align-items: center; gap: 5px; font-family: var(--th-font-heading); font-weight: 600; font-size: 15px; line-height: 1; }
.th-mediatext__badge-label svg { width: 13px; height: 13px; flex: 0 0 auto; }
.th-mediatext__badge:nth-child(1) { top: -18px; left: -18px; }
.th-mediatext__badge:nth-child(2) { bottom: -18px; right: -18px; }

@media (max-width: 981px) {
	.th-mediatext__inner,
	.th-mediatext--beeld-links .th-mediatext__inner { grid-template-columns: 1fr; gap: 32px; }
	.th-mediatext--beeld-links .th-mediatext__media { order: 0; }
	/* Badges niet buiten de sectie laten steken op smal scherm (anders horizontale overloop). */
	.th-mediatext { overflow-x: clip; }
	.th-mediatext__badge { width: 104px; height: 104px; }
}