/* De homepage ([mbg_home]). */

/* Kop met vier foto's; op de telefoon de tekst eerst en twee foto's eronder. */
.mbg-home .mbg-home__kop { position: relative; }
.mbg-home .mbg-home__kop-binnen { max-width: 1360px; padding-block: 56px 40px; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 32px; }
.mbg-home .mbg-home__fotos { flex: 1 1 260px; min-width: 0; max-width: 300px; display: flex; flex-direction: column; gap: 28px; }
.mbg-home .mbg-home__fotos .mbg-lijst-foto { border-width: 7px; box-shadow: 0 10px 24px rgba(36, 49, 25, .2); }
.mbg-home .mbg-home__fotos .is-1 { width: 100%; height: 190px; transform: rotate(-5deg); }
.mbg-home .mbg-home__fotos .is-2 { width: 86%; height: 160px; margin-left: 14%; transform: rotate(3deg); }
.mbg-home .mbg-home__fotos .is-3 { width: 92%; height: 170px; margin-left: 8%; transform: rotate(5deg); }
.mbg-home .mbg-home__fotos .is-4 { width: 100%; height: 190px; transform: rotate(-3deg); }
.mbg-home .mbg-home__tekst { flex: 2 1 420px; min-width: 0; max-width: 560px; display: flex; flex-direction: column; align-items: center; gap: 16px; text-align: center; }
.mbg-home .mbg-home__acties { justify-content: center; margin-top: 8px; }
.mbg-home .mbg-home__golf { display: block; height: 64px; }

/* Onze groepen: kaarten op een breed scherm, rijen op de telefoon. */
.mbg-home .mbg-home__groepen { padding-block: 32px 64px; display: flex; flex-direction: column; gap: 24px; }
.mbg-home .mbg-home__sectiekop { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 12px 32px; }
.mbg-home .mbg-home__sectiekop > .mbg-stapel { flex: 1 1 520px; min-width: 0; gap: 10px; }
.mbg-home .mbg-home__sectiekop .mbg-tekst { max-width: 680px; }
.mbg-home .mbg-home__groeplijst { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.mbg-home .mbg-home__groeplijst > li { min-width: 0; }
body .mbg-home .mbg-home__groep { position: relative; display: flex; flex-direction: column; height: 100%; overflow: hidden; border: 1px solid var(--mbg-rand); border-radius: 12px; background: #fff; color: var(--mbg-donker); text-decoration: none; }
body .mbg-home .mbg-home__groep:hover { border-color: var(--mbg-rand3); color: var(--mbg-donker); }
.mbg-home .mbg-home__groepbeeld { position: relative; display: block; }
.mbg-home .mbg-home__groepfoto { width: 100%; height: 210px; object-fit: cover; background: var(--mbg-creme); }
.mbg-home .mbg-home__badge { position: absolute; right: 16px; bottom: -22px; width: 82px; height: 82px; object-fit: contain; filter: drop-shadow(0 4px 8px rgba(0, 0, 0, .25)); }
.mbg-home .mbg-home__groeptekst { padding: 16px 18px 18px; display: flex; flex-direction: column; gap: 2px; }
.mbg-home .mbg-home__groeptekst strong { font-family: var(--mbg-font-kop); font-weight: 500; font-size: 26px; line-height: 1.1; color: var(--mbg-bordeaux); }
.mbg-home .mbg-home__groeptekst span { font-size: 15px; color: var(--mbg-tekst2); }

/* Eerstvolgend evenement */
.mbg-home .mbg-home__event-binnen { padding-block: 48px; display: flex; flex-wrap: wrap; align-items: center; gap: 24px 48px; }
.mbg-home .mbg-home__event-tekst { flex: 2 1 480px; min-width: 0; }
.mbg-home .mbg-home__event-knoppen { flex: 1 1 280px; min-width: 0; }
.mbg-home .mbg-home__event-kaart { display: flex; align-items: center; gap: 16px; }
.mbg-home .mbg-home__event-wat { display: flex; flex-direction: column; gap: 2px; font-size: 16px; line-height: 1.5; }
.mbg-home .mbg-home__event-wat strong { font-family: var(--mbg-font-slab); font-weight: 600; font-size: 20px; }
body .mbg-home .mbg-home__event-wat a { color: #fff; text-decoration: none; }
body .mbg-home .mbg-home__event-wat a:hover { text-decoration: underline; color: #fff; }

/* Laatste nieuws */
.mbg-home .mbg-home__nieuws { display: flex; flex-direction: column; gap: 24px; }
.mbg-home .mbg-home__nieuwslijst { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.mbg-home .mbg-home__nieuwslijst > li { min-width: 0; }
body .mbg-home .mbg-home__bericht { display: flex; flex-direction: column; gap: 12px; color: var(--mbg-donker); text-decoration: none; }
body .mbg-home .mbg-home__bericht:hover strong { color: var(--mbg-bordeaux); }
.mbg-home .mbg-home__bericht img, .mbg-home .mbg-home__geenfoto { width: 100%; height: 220px; object-fit: cover; border-radius: 10px; }
.mbg-home .mbg-home__geenfoto { display: flex; align-items: center; justify-content: center; background: var(--mbg-creme); }
.mbg-home .mbg-home__geenfoto img.mbg-home__geenfoto-logo { width: 72px; height: auto; border-radius: 0; opacity: .7; }
.mbg-home .mbg-home__berichttekst { display: flex; flex-direction: column; gap: 6px; }
.mbg-home .mbg-home__berichttekst strong { font-family: var(--mbg-font-slab); font-weight: 600; font-size: 19px; line-height: 1.3; }

/* Over de MBG */
.mbg-home .mbg-home__over-binnen { padding-block: 64px; display: flex; flex-wrap: wrap; align-items: flex-start; gap: 40px 56px; }
.mbg-home .mbg-home__over-tekst { flex: 3 1 480px; min-width: 0; align-items: flex-start; }
.mbg-home .mbg-home__feiten { flex: 2 1 340px; min-width: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.mbg-home .mbg-home__feiten li { padding: 18px; border-radius: 10px; background: #fff; }
.mbg-home .mbg-home__feiten strong { display: block; font-family: var(--mbg-font-kop); font-weight: 500; font-size: 32px; line-height: 1; color: var(--mbg-blauw); }
.mbg-home .mbg-home__feiten span { font-size: 15px; color: var(--mbg-tekst2); }

@media (max-width: 1100px) {
	.mbg-home .mbg-home__groeplijst, .mbg-home .mbg-home__nieuwslijst { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
	.mbg-home .mbg-home__kop-binnen { padding-block: 28px 8px; display: block; }
	.mbg-home .mbg-home__tekst { max-width: none; align-items: stretch; gap: 14px; text-align: left; }
	.mbg-home .mbg-home__tekst .mbg-h1 { font-size: 36px; }
	.mbg-home .mbg-home__acties { margin-top: 4px; }
	.mbg-home .mbg-home__fotos-mobiel { position: relative; height: 210px; margin: 6px calc(-1 * var(--mbg-goot)) 0; }
	.mbg-home .mbg-home__fotos-mobiel .mbg-lijst-foto { position: absolute; border-width: 6px; box-shadow: 0 10px 24px rgba(36, 49, 25, .2); }
	.mbg-home .mbg-home__fotos-mobiel .is-1 { left: 18px; top: 10px; width: 58%; height: 150px; transform: rotate(-4deg); }
	.mbg-home .mbg-home__fotos-mobiel .is-2 { right: 18px; top: 46px; width: 50%; height: 130px; transform: rotate(4deg); }
	.mbg-home .mbg-home__golf { height: 32px; margin-top: -20px; }

	.mbg-home .mbg-home__groepen { padding-block: 20px 36px; gap: 14px; }
	.mbg-home .mbg-home__groeplijst { grid-template-columns: 1fr; gap: 8px; }
	body .mbg-home .mbg-home__groep { flex-direction: row; align-items: center; gap: 12px; padding: 8px 12px 8px 8px; }
	.mbg-home .mbg-home__groepbeeld { flex: none; width: 76px; height: 64px; }
	.mbg-home .mbg-home__groepfoto { width: 64px; height: 64px; border-radius: 8px; }
	.mbg-home .mbg-home__badge { right: 0; bottom: -4px; width: 34px; height: 34px; filter: drop-shadow(0 2px 4px rgba(0, 0, 0, .3)); }
	.mbg-home .mbg-home__groeptekst { flex: 1 1 auto; min-width: 0; padding: 0; }
	.mbg-home .mbg-home__groeptekst strong { font-family: var(--mbg-font-slab); font-weight: 600; font-size: 18px; }
	.mbg-home .mbg-home__groeptekst span { font-size: 14px; }
	.mbg-home .mbg-home__pijl { flex: none; color: var(--mbg-blauw); }

	.mbg-home .mbg-home__event-binnen { padding-block: 28px 30px; gap: 14px; }
	.mbg-home .mbg-home__event-tekst, .mbg-home .mbg-home__event-knoppen { flex-basis: 100%; }
	.mbg-home .mbg-home__event-wat strong { font-size: 19px; }
	.mbg-home .mbg-home__event-wat { font-size: 15px; }

	.mbg-home .mbg-home__nieuws { gap: 14px; }
	.mbg-home .mbg-home__nieuwslijst { grid-template-columns: 1fr; gap: 0; }
	.mbg-home .mbg-home__nieuwslijst > li { border-bottom: 1px solid var(--mbg-rand2); }
	body .mbg-home .mbg-home__bericht { flex-direction: row; align-items: center; gap: 14px; padding-block: 12px; }
	.mbg-home .mbg-home__bericht img, .mbg-home .mbg-home__geenfoto { flex: none; width: 96px; height: 72px; border-radius: 8px; }
	.mbg-home .mbg-home__geenfoto img.mbg-home__geenfoto-logo { width: 40px; height: auto; }
	.mbg-home .mbg-home__berichttekst { gap: 2px; min-width: 0; }
	.mbg-home .mbg-home__berichttekst .mbg-klein { font-size: 13px; }
	.mbg-home .mbg-home__berichttekst strong { font-size: 16px; }

	.mbg-home .mbg-home__over-binnen { padding-block: 32px 36px; flex-direction: column; align-items: stretch; gap: 14px; }
	.mbg-home .mbg-home__over-tekst { display: contents; }
	.mbg-home .mbg-home__feiten { flex: none; gap: 10px; margin-top: 4px; }
	.mbg-home .mbg-home__feiten li { padding: 14px; }
	.mbg-home .mbg-home__feiten strong { font-size: 28px; }
	.mbg-home .mbg-home__feiten span { font-size: 14px; }
	.mbg-home .mbg-home__meer { order: 3; align-self: flex-start; }
}
