/**
 * workchoc.css — gescopede aanpassingen voor Workshops + Chocolade op maat
 * zodat LOCAL 1:1 de LIVE-referentie volgt. Auto-enqueued via de
 * assets/css/*.css-glob in functions.php (na fleur-child).
 *
 * W4: roze quote-band en de 3-foto galerij als losse secties (galerij op wit).
 */

/* ============================ W4 — Workshops quote + galerij ============= */

/* De roze quote-band bevat nu enkel de quote: geen extra onderruimte meer. */
.fleur-page--workshop .fleur-ws-quote__text {
	margin-bottom: 0;
}

/* Galerij als eigen sectie op witte (cream) achtergrond, onder de quote. */
.fleur-ws-gallery {
	background: var(--fleur-cream);
	padding: 56px 0 72px;
}
.fleur-ws-gallery__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
	max-width: 1280px;
	margin-inline: auto;
}
.fleur-ws-gallery__photo {
	aspect-ratio: 1 / 1;
	border-radius: 5px;
	overflow: hidden;
}
.fleur-ws-gallery__photo img,
.fleur-ws-gallery__photo .fleur-media-ph {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* =====================================================================
   MOBIEL (≤981px) — Workshops galerij.
   De galerij-grid staat hier (niet gescoped op .fleur-page--workshop), dus
   houden we de mobiele regels ook hier. Op tablet/mobiel 2 kolommen; de
   1-koloms fallback voor kleine telefoons staat gescoped in qa-workshops.css
   (601px-breakpoint, hogere specificiteit → wint). Raakt niets ≥982px.
   ===================================================================== */
@media (max-width: 981px) {
	.fleur-ws-gallery { padding: 40px 0 56px; }
	.fleur-ws-gallery__grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 16px;
	}
}