/*
 * SKNZ Megamenu: opmaak.
 *
 * Maten, kleuren en beweging komen uit het goedgekeurde ontwerp (_output/megamenu/megamenu-sknz.html).
 * Alles staat onder #sknz-mm: met een id winnen deze regels van de knop- en linkstijlen van OceanWP
 * en de Elementor-kit, die op elke button en link van de site zitten.
 *
 * Computer vanaf 1100 px: zwarte balk, witte kop met logo, servicemenu en zes groepen, panelen.
 * Daaronder: wisselende beloftes, kleine kop met tasje en menuknop, lade van rechts.
 *
 * Geen onderstreping in het menu, ook niet voor de pagina waar je bent (die is vet). Bij aanwijzen
 * een tikje dikker met een omlijning van de letter; een zwaardere letter is breder en laat het
 * woord groeien.
 */

/* De oude kop van OceanWP/Elementor (header 884), alleen als de plugin bovenaan staat. */
body.sknz-mm-aan #site-header { display: none !important; }

/* Ruimte voor de beheerdersbalk, voor de plakkende kop. */
body.admin-bar { --sknz-mm-boven: 32px; }
@media (max-width: 782px) { body.admin-bar { --sknz-mm-boven: 46px; } }
@media (max-width: 600px) { body.admin-bar { --sknz-mm-boven: 0px; } }

/* Lade of winkelwagen open: de zwevende chatknop gaat even weg (die lag over de lade en over de
   knoppen onderin de wagen). De pagina staat stil via het script, niet met overflow: hidden, want
   dan verliest de plakkende kop zijn plek en schuift hij weg zodra de lade opengaat. */
html.sknz-mm-vast #aichatbot-knop, html.sknz-mm-vast #cmplz-manage-consent { display: none !important; }

/* Cookiemelding (Complianz): in het midden in plaats van rechtsonder, waar hij over de chat, de lade en de
   winkelwagen lag. Het zwevende tabje "Beheer toestemming" gaat weg zodra het script in de footer een link
   "Cookie-instellingen" heeft gezet (naast Cookiebeleid), zoals bij Sociaal Werk Meierijstad. */
body.sknz-mm-aan .cmplz-cookiebanner.cmplz-bottom-right {
	top: 50% !important; left: 50% !important; right: auto !important; bottom: auto !important;
	transform: translate(-50%, -50%) !important; max-height: calc(100vh - 32px) !important;
}
@media (max-width: 768px) {
	body.sknz-mm-aan .cmplz-cookiebanner.cmplz-bottom-right { width: calc(100% - 32px) !important; box-sizing: border-box !important; }
}
html.sknz-mm-cookie-voet #cmplz-manage-consent { display: none !important; }

/* Het zwevende beoordelingenblokje (Customer Reviews) lag over de lade, het paneel en knoppen. De beoordeling
   staat nu in de zwarte balk (Tim, 13 nov); het blokje blijft in de pagina, want het script leest er het aantal uit. */
body.sknz-mm-aan #cr_floatingtrustbadge { display: none !important; }

/* Nieuwsbrief-pop-up (Flodesk): z-index 1040 lag onder de plakkende kop, dus op een kleine telefoon viel het
   kruisje eronder en kwam je er niet meer vanaf. Nu erboven (onder de cookiemelding), op de telefoon kleiner en
   zonder foto. Het kruisje van Flodesk was een lijntekening van 10 px: nu een zwarte ronde knop met een witte X. */
/* Flodesk legt een wit waas (42%) over de pagina: een wit vlak op een witgemaakte pagina viel weg (Tim). Nu de
   donkere sluier van het menu en de winkelwagen. */
body.sknz-mm-aan [data-ff-type="popup"] [data-ff-el="modal"] { z-index: 99000 !important; background-color: rgba(17, 17, 17, 0.28) !important; }
body.sknz-mm-aan [data-ff-type="popup"] [data-ff-el="modal-close"] {
	top: 10px !important; right: 10px !important; display: grid !important; place-items: center !important;
	width: 44px !important; height: 44px !important; padding: 0 !important; border: 0 !important; border-radius: 50% !important;
	color: #ffffff !important; background: #111111 !important; opacity: 1 !important; cursor: pointer !important;
}
body.sknz-mm-aan [data-ff-type="popup"] [data-ff-el="modal-close"]:hover { background: #333333 !important; }
body.sknz-mm-aan [data-ff-type="popup"] [data-ff-el="modal-close"]:focus-visible { outline: 2px solid #111111 !important; outline-offset: 3px !important; }
body.sknz-mm-aan [data-ff-type="popup"] [data-ff-el="modal-close"] svg { width: 16px !important; height: 16px !important; }
@media (max-width: 767.98px) {
	body.sknz-mm-aan [data-ff-type="popup"] [class*="__left"] { display: none !important; }
	body.sknz-mm-aan [data-ff-type="popup"] [data-ff-el="modal-dialog"] { max-width: 340px !important; margin-left: auto !important; margin-right: auto !important; }
	body.sknz-mm-aan [data-ff-type="popup"] [class*="__title"], body.sknz-mm-aan [data-ff-type="popup"] [class*="__title"] * { font-size: 30px !important; line-height: 1.15 !important; }
}
body.sknz-mm-aan:has([data-ff-type="popup"] [data-ff-el="modal"].fd-is-open) #aichatbot-knop { display: none !important; }

#sknz-mm {
	display: contents;
	--mm-zwart: #111111;
	--mm-tekst: #1c1c1c;
	--mm-zacht: #666966;
	--mm-mint: #aecfbc;
	--mm-mint-diep: #9dc3ad;
	--mm-mint-zacht: #f2f7f4;
	--mm-op-mint: #1e1e1e;
	--mm-salie: #3d6a54;
	--mm-lijn: #eaeaea;
	--mm-scrim: rgba(17, 17, 17, 0.28);
	--mm-ease: cubic-bezier(0.2, 0.7, 0.3, 1);
	--mm-usp-h: 30px;
	--mm-letter: Quicksand, "Segoe UI", system-ui, sans-serif;
}
@media (min-width: 1100px) { #sknz-mm { --mm-usp-h: 38px; } }

/* ---------- terugzetten wat thema en kit op alles zetten ---------- */
#sknz-mm, #sknz-mm *, #sknz-mm *::before, #sknz-mm *::after { box-sizing: border-box; }
#sknz-mm .sknz-mm-kopblok, #sknz-mm .sknz-mm-lade, #sknz-mm .sknz-mm-wagen {
	font-family: var(--mm-letter); font-size: 16px; font-weight: 400; line-height: 1.4; letter-spacing: normal;
	text-transform: none; color: var(--mm-tekst); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-align: left;
}
/* :where() houdt deze terugzetregels zo licht als het id alleen. Zonder dat woog "#sknz-mm a:visited"
   zwaarder dan ".sknz-mm-knop" en werd de tekst van een bezochte knop (Afrekenen) donker op zwart. */
#sknz-mm :where(a, a:hover, a:focus, a:active, a:visited) { color: inherit; text-decoration: none; box-shadow: none; }
#sknz-mm :where(button) {
	font: inherit; color: inherit; background: none; border: 0; border-radius: 0; box-shadow: none; padding: 0; margin: 0;
	min-height: 0; min-width: 0; width: auto; height: auto; text-transform: none; letter-spacing: inherit; line-height: inherit;
	text-align: left; text-decoration: none; cursor: pointer; -webkit-appearance: none; appearance: none;
}
#sknz-mm :where(button:hover, button:focus, button:active) { color: inherit; background: none; border: 0; box-shadow: none; text-decoration: none; }
#sknz-mm :where(ul, li) { list-style: none; margin: 0; padding: 0; }
#sknz-mm :where(li)::before, #sknz-mm :where(li)::marker { content: none; }
#sknz-mm :where(p) { margin: 0; padding: 0; font-size: inherit; line-height: inherit; color: inherit; }
#sknz-mm :where(img) { max-width: 100%; border: 0; border-radius: 0; box-shadow: none; }
#sknz-mm [hidden] { display: none !important; }
#sknz-mm :focus { outline: none; }
#sknz-mm :focus-visible { outline: 2px solid var(--mm-zwart); outline-offset: 2px; }
#sknz-mm .sknz-mm-usp :focus-visible { outline-color: #ffffff; }

#sknz-mm .sknz-mm-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
#sknz-mm .sknz-mm-ic { display: block; width: 20px; height: 20px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
#sknz-mm .sknz-mm-sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
#sknz-mm .sknz-mm-skip { position: absolute; left: 12px; top: -60px; z-index: 2; padding: 10px 16px; font-weight: 600; color: #ffffff; background: var(--mm-zwart); }
#sknz-mm .sknz-mm-skip:focus { top: 8px; color: #ffffff; }

/* ---------- gedeeld ---------- */
#sknz-mm .sknz-mm-naam { transition: -webkit-text-stroke-width 0.1s; }
#sknz-mm .sknz-mm-knop {
	display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px; font-size: 14.5px; font-weight: 600;
	letter-spacing: 0.01em; line-height: 1.3; color: #ffffff; background: var(--mm-zwart); transition: background 0.15s;
}
#sknz-mm .sknz-mm-knop:hover, #sknz-mm .sknz-mm-knop:focus { color: #ffffff; background: #333333; }
#sknz-mm .sknz-mm-knop .sknz-mm-ic { width: 18px; height: 18px; }
#sknz-mm .sknz-mm-knop.sknz-mm-knop-groen, #sknz-mm .sknz-mm-knop.sknz-mm-knop-groen:focus { color: var(--mm-op-mint); background: var(--mm-mint); }
#sknz-mm .sknz-mm-knop.sknz-mm-knop-groen:hover { color: var(--mm-op-mint); background: var(--mm-mint-diep); }
#sknz-mm .sknz-mm-knop.sknz-mm-knop-licht, #sknz-mm .sknz-mm-knop.sknz-mm-knop-licht:focus { color: var(--mm-tekst); background: var(--mm-mint-zacht); }
#sknz-mm .sknz-mm-knop.sknz-mm-knop-licht:hover { color: var(--mm-tekst); background: var(--mm-mint); }
#sknz-mm .sknz-mm-tegel {
	display: grid; place-items: center; padding: 0 12px; font-weight: 600; line-height: 1.25; text-align: center;
	background: var(--mm-mint-zacht); transition: background 0.15s;
}
#sknz-mm .sknz-mm-tegel:hover { background: var(--mm-mint); }
#sknz-mm .sknz-mm-tegel.is-hier .sknz-mm-naam { font-weight: 700; }
#sknz-mm .sknz-mm-tas { position: relative; display: inline-flex; }
#sknz-mm .sknz-mm-tas-aantal {
	position: absolute; top: -7px; right: -10px; display: grid; place-items: center; min-width: 18px; height: 18px; padding: 0 4px;
	border-radius: 9px; font-size: 11px; font-weight: 700; line-height: 1; font-variant-numeric: tabular-nums;
	color: var(--mm-op-mint); background: var(--mm-mint);
}
#sknz-mm .sknz-mm-tas-aantal.is-nieuw { animation: sknz-mm-pop 0.35s ease; }
@keyframes sknz-mm-pop { 50% { transform: scale(1.3); } }
#sknz-mm .sknz-mm-logo { display: block; flex: none; }
#sknz-mm .sknz-mm-logo img { display: block; width: 100%; height: 100%; object-fit: contain; }
#sknz-mm .sknz-mm-logo-tekst { display: grid; place-items: center; width: 100%; height: 100%; font-weight: 600; letter-spacing: 0.06em; border: 1.4px solid var(--mm-tekst); border-radius: 50%; }

/* ---------- de kop (beide formaten) ---------- */
#sknz-mm .sknz-mm-kopblok {
	position: -webkit-sticky; position: sticky; top: calc(var(--sknz-mm-boven, 0px) - var(--mm-usp-h)); z-index: 9000;
	display: block; margin: 0; padding: 0; background: #ffffff;
}
#sknz-mm .sknz-mm-usp { position: relative; height: var(--mm-usp-h); color: #ffffff; background: var(--mm-zwart); }
#sknz-mm .sknz-mm-kop { position: relative; background: #ffffff; border-bottom: 1px solid var(--mm-lijn); }
#sknz-mm .sknz-mm-usp .sknz-mm-ic { width: 16px; height: 16px; stroke-width: 2.2; color: var(--mm-mint); }
#sknz-mm .sknz-mm-usp .sknz-mm-sterren { display: inline-flex; gap: 1px; }
#sknz-mm .sknz-mm-usp .sknz-mm-sterren .sknz-mm-ic { width: 13px; height: 13px; fill: currentColor; stroke: none; }

/* ---------- telefoon en tablet ---------- */
@media (max-width: 1099.98px) {
	#sknz-mm .sknz-mm-usp .sknz-mm-binnen { height: 100%; }
	#sknz-mm .sknz-mm-beloftes { position: relative; height: 100%; font-size: 12.5px; font-weight: 500; }
	#sknz-mm .sknz-mm-beloftes li {
		position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; gap: 7px; padding: 0 12px;
		white-space: nowrap; opacity: 0; transition: opacity 0.5s;
	}
	#sknz-mm .sknz-mm-beloftes li.is-aan { opacity: 1; }
	#sknz-mm .sknz-mm-usp-rechts, #sknz-mm .sknz-mm-kop-rechts, #sknz-mm .sknz-mm-scrim { display: none; }

	#sknz-mm .sknz-mm-kop-in { display: flex; align-items: center; height: 64px; padding: 0 6px 0 14px; }
	#sknz-mm .sknz-mm-logo { width: 48px; height: 48px; }
	#sknz-mm .sknz-mm-t-iconen { display: flex; margin-left: auto; }
	#sknz-mm .sknz-mm-t-ic { display: grid; place-items: center; width: 44px; height: 44px; color: var(--mm-tekst); }
	#sknz-mm .sknz-mm-t-ic .sknz-mm-ic { width: 23px; height: 23px; }
	#sknz-mm .sknz-mm-strepen { display: flex; flex-direction: column; gap: 5px; }
	#sknz-mm .sknz-mm-strepen span { display: block; width: 22px; height: 1.6px; background: currentColor; transition: transform 0.35s var(--mm-ease), opacity 0.35s; }
	#sknz-mm .sknz-mm-hamb[aria-expanded="true"] .sknz-mm-strepen span:nth-child(1) { transform: translateY(6.6px) rotate(45deg); }
	#sknz-mm .sknz-mm-hamb[aria-expanded="true"] .sknz-mm-strepen span:nth-child(2) { opacity: 0; }
	#sknz-mm .sknz-mm-hamb[aria-expanded="true"] .sknz-mm-strepen span:nth-child(3) { transform: translateY(-6.6px) rotate(-45deg); }

	/* Lade: schuift van rechts in over een sluier, de regels komen één voor één in beeld. */
	#sknz-mm .sknz-mm-lade-sluier {
		position: fixed; left: 0; right: 0; top: var(--sknz-mm-lade-top, 94px); bottom: 0; z-index: 8990;
		background: var(--mm-scrim); opacity: 0; visibility: hidden; transition: opacity 0.45s var(--mm-ease), visibility 0.45s;
	}
	#sknz-mm.is-lade .sknz-mm-lade-sluier { opacity: 1; visibility: visible; }
	#sknz-mm .sknz-mm-lade {
		position: fixed; right: 0; top: var(--sknz-mm-lade-top, 94px); bottom: 0; z-index: 8995; display: flex; flex-direction: column;
		width: min(92%, 440px); background: #ffffff; transform: translateX(100%); visibility: hidden;
		transition: transform 0.55s var(--mm-ease), visibility 0.55s;
	}
	#sknz-mm.is-lade .sknz-mm-lade { transform: none; visibility: visible; }
	#sknz-mm .sknz-mm-lagen { position: relative; flex: 1; min-height: 0; overflow: hidden; }
	#sknz-mm .sknz-mm-laag {
		position: absolute; inset: 0; overflow-y: auto; overscroll-behavior: contain; padding: 0 20px 24px; background: #ffffff;
		transform: translateX(100%); visibility: hidden; transition: transform 0.45s var(--mm-ease), visibility 0s linear 0.45s;
	}
	#sknz-mm .sknz-mm-laag.is-actief { transform: none; visibility: visible; transition: transform 0.45s var(--mm-ease); }
	#sknz-mm .sknz-mm-laag.sknz-mm-hoofd { transform: none; visibility: visible; padding-top: 8px; transition: transform 0.45s var(--mm-ease); }
	#sknz-mm .sknz-mm-lagen.is-dieper .sknz-mm-laag.sknz-mm-hoofd { transform: translateX(-30%); visibility: hidden; transition: transform 0.45s var(--mm-ease), visibility 0s linear 0.45s; }
	#sknz-mm .sknz-mm-tv { opacity: 0; transform: translateX(28px); transition: opacity 0.5s var(--mm-ease), transform 0.5s var(--mm-ease); }
	#sknz-mm .sknz-mm-laag.is-in .sknz-mm-tv { opacity: 1; transform: none; transition-delay: calc(120ms + var(--i, 0) * 45ms); }

	#sknz-mm .sknz-mm-t-rij { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; min-height: 50px; font-size: 18px; font-weight: 500; line-height: 1.25; }
	#sknz-mm .sknz-mm-t-rij > .sknz-mm-ic, #sknz-mm .sknz-mm-t-rij-r .sknz-mm-ic { width: 18px; height: 18px; color: var(--mm-zacht); }
	#sknz-mm .sknz-mm-t-rij-r { display: inline-flex; align-items: center; gap: 10px; }
	#sknz-mm .sknz-mm-hier { font-size: 12.5px; font-weight: 600; color: var(--mm-salie); white-space: nowrap; }
	#sknz-mm .sknz-mm-t-klein { margin-top: 14px; }
	#sknz-mm .sknz-mm-t-klein .sknz-mm-t-rij { min-height: 44px; font-size: 15.5px; }
	#sknz-mm .sknz-mm-t-paneelkop {
		position: sticky; top: 0; z-index: 1; display: flex; align-items: center; gap: 12px; min-height: 54px;
		margin: 0 -20px 2px; padding: 0 20px 0 6px; background: #ffffff;
	}
	#sknz-mm .sknz-mm-terug { display: inline-flex; align-items: center; gap: 2px; min-height: 44px; padding: 0 10px 0 4px; font-size: 14.5px; font-weight: 600; color: var(--mm-zacht); }
	#sknz-mm .sknz-mm-terug .sknz-mm-ic { width: 20px; height: 20px; }
	#sknz-mm .sknz-mm-t-titel { font-size: 19px; font-weight: 700; }
	#sknz-mm .sknz-mm-t-kolomkop { margin: 22px 0 2px; font-size: 17px; font-weight: 700; line-height: 1.3; }
	#sknz-mm .sknz-mm-t-kolomkop-los { margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--mm-lijn); }
	#sknz-mm .sknz-mm-t-sub .sknz-mm-t-rij { min-height: 44px; font-size: 16px; }
	#sknz-mm .sknz-mm-t-sub .sknz-mm-t-rij.is-hier .sknz-mm-naam, #sknz-mm .sknz-mm-t-alles { font-weight: 700; }
	#sknz-mm .sknz-mm-t-tegels { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 8px; }
	#sknz-mm .sknz-mm-t-tegels .sknz-mm-tegel { height: 56px; font-size: 15px; }
	#sknz-mm .sknz-mm-lade-voet { flex: none; padding: 14px 20px 18px; background: #ffffff; border-top: 1px solid var(--mm-lijn); }
	#sknz-mm .sknz-mm-lade-voet .sknz-mm-knop { width: 100%; justify-content: center; min-height: 48px; font-size: 15.5px; }
	#sknz-mm .sknz-mm-t-iconen .sknz-mm-tas { margin: 0; }
}
@media (max-width: 1099.98px) and (hover: hover) {
	#sknz-mm .sknz-mm-t-rij:hover .sknz-mm-naam, #sknz-mm .sknz-mm-terug:hover span { -webkit-text-stroke: 0.35px currentColor; }
}

/* ---------- computer ---------- */
@media (min-width: 1100px) {
	#sknz-mm .sknz-mm-t-iconen, #sknz-mm .sknz-mm-lade, #sknz-mm .sknz-mm-lade-sluier { display: none; }
	#sknz-mm .sknz-mm-binnen { max-width: 1280px; margin: 0 auto; padding: 0 40px; }

	#sknz-mm .sknz-mm-usp .sknz-mm-binnen { display: flex; align-items: center; justify-content: space-between; gap: 24px; height: 100%; font-size: 13px; font-weight: 500; letter-spacing: 0.01em; }
	/* Vast, zonder wisselen (Tim: wisselen op de computer leidt af). Past er niet alles naast Mijn account en
	   Winkelwagen (tussen 1100 en 1280 breed), dan valt de laatste belofte weg: hij loopt door naar een tweede
	   regel die buiten de balk valt. */
	#sknz-mm .sknz-mm-beloftes { display: flex; flex-wrap: wrap; flex: 1; column-gap: 24px; row-gap: 0; min-width: 0; height: var(--mm-usp-h); overflow: hidden; }
	#sknz-mm .sknz-mm-beloftes li { height: var(--mm-usp-h); }
	#sknz-mm .sknz-mm-beloftes li { display: flex; align-items: center; gap: 8px; white-space: nowrap; }
	#sknz-mm .sknz-mm-usp-rechts { display: flex; gap: 26px; flex: none; }
	#sknz-mm .sknz-mm-usp-rechts a { display: inline-flex; align-items: center; gap: 8px; padding: 4px 0; color: #ffffff; }
	#sknz-mm .sknz-mm-usp-rechts a:hover > span:last-child { -webkit-text-stroke: 0.35px currentColor; }
	#sknz-mm .sknz-mm-usp .sknz-mm-usp-rechts .sknz-mm-ic { width: 18px; height: 18px; stroke-width: 1.6; color: #ffffff; }
	#sknz-mm .sknz-mm-usp .sknz-mm-tas { margin-right: 8px; }

	#sknz-mm .sknz-mm-kop-in { display: flex; align-items: center; justify-content: space-between; }
	#sknz-mm .sknz-mm-logo { width: 84px; height: 84px; margin: 14px 0; }
	#sknz-mm .sknz-mm-kop-rechts { display: flex; flex-direction: column; align-items: flex-end; align-self: stretch; justify-content: space-between; padding-top: 12px; }
	#sknz-mm .sknz-mm-service ul { display: flex; gap: 22px; font-size: 14px; font-weight: 500; }
	#sknz-mm .sknz-mm-slink { display: inline-flex; align-items: center; padding: 4px 0; }
	#sknz-mm .sknz-mm-slink:hover .sknz-mm-naam { -webkit-text-stroke: 0.35px currentColor; }
	#sknz-mm .sknz-mm-slink.is-hier .sknz-mm-naam { font-weight: 700; }

	/* Balk: de lijst, de knoppen en de li's staan niet "positioned", zodat een paneel de hele kop breed wordt. */
	#sknz-mm .sknz-mm-balk { display: flex; margin-right: -13px; }
	#sknz-mm .sknz-mm-balk-item { display: inline-flex; align-items: center; gap: 7px; padding: 12px 13px 20px; font-size: 18.5px; font-weight: 500; line-height: 1.4; }
	#sknz-mm .sknz-mm-balk-item:hover .sknz-mm-naam { -webkit-text-stroke: 0.35px currentColor; }
	#sknz-mm .sknz-mm-balk-item .sknz-mm-ic { width: 15px; height: 15px; color: var(--mm-zacht); transition: transform 0.15s; }
	#sknz-mm .sknz-mm-balk-item[aria-expanded="true"] .sknz-mm-ic { transform: rotate(180deg); }
	#sknz-mm .sknz-mm-balk-item.is-sectie .sknz-mm-naam { font-weight: 700; }

	#sknz-mm .sknz-mm-paneel {
		position: absolute; left: 0; right: 0; top: 100%; z-index: 2; padding: 30px 0 34px; background: #ffffff;
		max-height: calc(100vh - var(--sknz-mm-paneel-top, 160px)); overflow-y: auto; overscroll-behavior: contain;
	}
	#sknz-mm .sknz-mm-paneel-in { display: grid; grid-template-columns: 215px minmax(0, 1fr) 262px; align-items: stretch; }
	#sknz-mm .sknz-mm-paneel-in > div { min-width: 0; }
	#sknz-mm .sknz-mm-p-links { padding-right: 28px; }
	#sknz-mm .sknz-mm-p-links .sknz-mm-mlink { padding: 6px 0; font-size: 16.5px; }
	#sknz-mm .sknz-mm-p-midden {
		display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 28px; align-content: start;
		padding: 0 32px; border-left: 1px solid var(--mm-lijn); border-right: 1px solid var(--mm-lijn);
	}
	#sknz-mm .sknz-mm-p-rechts { padding-left: 32px; }
	#sknz-mm .sknz-mm-kolomkop, #sknz-mm .sknz-mm-advies-kop { font-size: 17.5px; font-weight: 700; line-height: 1.3; color: var(--mm-tekst); }
	#sknz-mm .sknz-mm-kolom .sknz-mm-kolomkop { margin-bottom: 10px; }
	#sknz-mm .sknz-mm-mlink { display: inline-block; padding: 5px 0; font-size: 15.5px; font-weight: 500; line-height: 1.3; }
	#sknz-mm .sknz-mm-mlink:hover .sknz-mm-naam, #sknz-mm .sknz-mm-kolomkop a:hover { -webkit-text-stroke: 0.35px currentColor; }
	#sknz-mm .sknz-mm-mlink.is-hier .sknz-mm-naam { font-weight: 700; }
	#sknz-mm .sknz-mm-alles { display: inline-flex; align-items: center; gap: 7px; margin-top: 14px; font-size: 15px; font-weight: 700; white-space: nowrap; }
	#sknz-mm .sknz-mm-alles .sknz-mm-ic { width: 16px; height: 16px; color: var(--mm-salie); transition: transform 0.15s; }
	#sknz-mm .sknz-mm-alles:hover .sknz-mm-ic { transform: translateX(3px); }
	#sknz-mm .sknz-mm-p-links .sknz-mm-alles { display: flex; margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--mm-lijn); font-size: 16px; }
	#sknz-mm .sknz-mm-p-links .sknz-mm-alles:first-child { margin-top: 6px; padding-top: 0; border-top: 0; }
	#sknz-mm .sknz-mm-advies-tekst { margin-top: 8px; font-size: 15px; }
	#sknz-mm .sknz-mm-advies-acties { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; margin-top: 18px; }

	#sknz-mm .sknz-mm-paneel-merken .sknz-mm-tegels { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; margin-top: 12px; }
	#sknz-mm .sknz-mm-paneel-merken .sknz-mm-tegel { height: 74px; font-size: 16.5px; }
	#sknz-mm .sknz-mm-paneel-merken .sknz-mm-kolomkop-los { margin-top: 28px; padding-top: 24px; border-top: 1px solid var(--mm-lijn); }
	#sknz-mm .sknz-mm-az { columns: 6; column-gap: 40px; margin-top: 8px; }
	#sknz-mm .sknz-mm-az li { break-inside: avoid; }

	/* Uitkomen: het paneel komt in beeld en de delen schuiven één voor één van rechts in, alleen als
	   het menu dicht was; wisselen tussen groepen gaat meteen. */
	#sknz-mm .sknz-mm-paneel.is-in { animation: sknz-mm-paneel-in 0.35s var(--mm-ease); }
	#sknz-mm .sknz-mm-paneel.is-in .sknz-mm-dv { animation: sknz-mm-van-rechts 0.5s var(--mm-ease) both; animation-delay: calc(80ms + var(--i, 0) * 45ms); }

	#sknz-mm .sknz-mm-scrim {
		position: fixed; inset: 0; z-index: 8980; background: var(--mm-scrim); opacity: 0; pointer-events: none;
		transition: opacity 0.45s var(--mm-ease);
	}
	#sknz-mm.is-paneel .sknz-mm-scrim { opacity: 1; pointer-events: auto; }
}
@media (min-width: 1100px) and (max-width: 1279.98px) {
	#sknz-mm .sknz-mm-paneel-in { grid-template-columns: 190px minmax(0, 1fr) 224px; }
	#sknz-mm .sknz-mm-p-links { padding-right: 22px; }
	#sknz-mm .sknz-mm-p-midden { column-gap: 22px; padding: 0 24px; }
	#sknz-mm .sknz-mm-p-rechts { padding-left: 24px; }
	#sknz-mm .sknz-mm-az { columns: 5; column-gap: 32px; }
}
@keyframes sknz-mm-paneel-in { from { opacity: 0; transform: translateY(-6px); } }
@keyframes sknz-mm-van-rechts { from { opacity: 0; transform: translateX(24px); } }

/* ---------- winkelwagen: schuift van rechts in, op dezelfde manier ---------- */
#sknz-mm .sknz-mm-wagen-sluier {
	position: fixed; inset: 0; z-index: 100000; background: var(--mm-scrim); opacity: 0; visibility: hidden;
	transition: opacity 0.45s var(--mm-ease), visibility 0.45s;
}
#sknz-mm.is-wagen .sknz-mm-wagen-sluier { opacity: 1; visibility: visible; }
#sknz-mm .sknz-mm-wagen {
	position: fixed; top: 0; right: 0; bottom: 0; z-index: 100001; display: flex; flex-direction: column;
	width: min(92vw, 420px); background: #ffffff; transform: translateX(100%); visibility: hidden;
	transition: transform 0.55s var(--mm-ease), visibility 0.55s;
}
#sknz-mm.is-wagen .sknz-mm-wagen { transform: none; visibility: visible; }
#sknz-mm .sknz-mm-wagen-kop { flex: none; display: flex; align-items: center; justify-content: space-between; padding: 20px 18px 12px 28px; }
#sknz-mm .sknz-mm-wagen-titel { font-size: 21px; font-weight: 700; line-height: 1.3; }
#sknz-mm .sknz-mm-wagen-titel span { margin-left: 10px; font-size: 14px; font-weight: 500; color: var(--mm-zacht); }
#sknz-mm .sknz-mm-wagen-sluit { position: relative; flex: none; width: 44px; height: 44px; }
#sknz-mm .sknz-mm-wagen-sluit::before, #sknz-mm .sknz-mm-wagen-sluit::after {
	content: ""; position: absolute; left: 12px; right: 12px; top: 50%; height: 1.6px; background: currentColor;
	transition: transform 0.4s var(--mm-ease);
}
#sknz-mm .sknz-mm-wagen-sluit::before { transform: rotate(45deg); }
#sknz-mm .sknz-mm-wagen-sluit::after { transform: rotate(-45deg); }
#sknz-mm .sknz-mm-wagen-sluit:hover::before { transform: rotate(135deg); }
#sknz-mm .sknz-mm-wagen-sluit:hover::after { transform: rotate(45deg); }
#sknz-mm .sknz-mm-wagen-gratis { flex: none; margin: 0 28px; padding-bottom: 18px; border-bottom: 1px solid var(--mm-lijn); font-size: 14px; }
#sknz-mm .sknz-mm-wagen-gratis b { font-weight: 700; }
#sknz-mm .sknz-mm-wagen-balk { height: 4px; margin-top: 10px; background: var(--mm-lijn); }
#sknz-mm .sknz-mm-wagen-balk span { display: block; width: 0; height: 100%; background: var(--mm-mint); transition: width 0.4s var(--mm-ease); }
#sknz-mm .sknz-mm-wagen-fout { flex: none; margin: 12px 28px 0; font-size: 13.5px; color: #9b2a2a; }
#sknz-mm .sknz-mm-wagen-lijst { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 0 28px; }
#sknz-mm .sknz-mm-wagen-regel { display: grid; grid-template-columns: 76px minmax(0, 1fr) auto; gap: 16px; align-items: start; padding: 18px 0; border-bottom: 1px solid var(--mm-lijn); transition: opacity 0.2s; }
#sknz-mm .sknz-mm-wagen-regel.is-bezig { opacity: 0.55; }
#sknz-mm .sknz-mm-wagen-regel > div { min-width: 0; }
#sknz-mm .sknz-mm-wagen-foto { display: block; width: 76px; height: 76px; }
#sknz-mm .sknz-mm-wagen-foto img { display: block; width: 76px; height: 76px; object-fit: contain; }
#sknz-mm .sknz-mm-wagen-naam { font-size: 14.5px; font-weight: 500; line-height: 1.35; }
#sknz-mm .sknz-mm-wagen-naam a:hover { -webkit-text-stroke: 0.35px currentColor; }
#sknz-mm .sknz-mm-wagen-variant { margin-top: 2px; font-size: 13px; color: var(--mm-zacht); }
#sknz-mm .sknz-mm-wagen-acties { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 16px; margin-top: 10px; }
#sknz-mm .sknz-mm-stapper { display: inline-flex; align-items: center; background: var(--mm-mint-zacht); }
#sknz-mm .sknz-mm-stapper button { width: 34px; height: 34px; font-size: 17px; line-height: 1; text-align: center; }
#sknz-mm .sknz-mm-stapper button:disabled { cursor: default; opacity: 0.35; }
#sknz-mm .sknz-mm-stapper span { min-width: 20px; font-size: 14px; font-weight: 600; text-align: center; font-variant-numeric: tabular-nums; }
#sknz-mm .sknz-mm-wagen-weg { font-size: 13px; color: var(--mm-zacht); }
#sknz-mm .sknz-mm-wagen-weg:hover, #sknz-mm .sknz-mm-stapper button:not(:disabled):hover { -webkit-text-stroke: 0.35px currentColor; color: var(--mm-tekst); }
#sknz-mm .sknz-mm-wagen-prijs { font-size: 15px; font-weight: 600; white-space: nowrap; font-variant-numeric: tabular-nums; color: var(--mm-tekst); }
#sknz-mm .sknz-mm-wagen-leeg { padding: 28px 0; font-size: 15px; }
#sknz-mm .sknz-mm-wagen-voet { flex: none; padding: 18px 28px 24px; border-top: 1px solid var(--mm-lijn); }
#sknz-mm .sknz-mm-wagen-sub { display: flex; justify-content: space-between; font-size: 17px; font-weight: 700; font-variant-numeric: tabular-nums; }
#sknz-mm .sknz-mm-wagen-klein { margin-top: 4px; font-size: 13px; color: var(--mm-zacht); }
#sknz-mm .sknz-mm-wagen-knoppen { display: grid; gap: 10px; margin-top: 16px; }
#sknz-mm .sknz-mm-wagen-knoppen .sknz-mm-knop { justify-content: center; min-height: 48px; font-size: 15px; }
#sknz-mm .sknz-mm-wagen-advies { display: inline-flex; align-items: center; gap: 8px; margin-top: 16px; font-size: 14px; font-weight: 600; }
#sknz-mm .sknz-mm-wagen-advies .sknz-mm-ic { width: 18px; height: 18px; }
#sknz-mm .sknz-mm-wagen-advies:hover span { -webkit-text-stroke: 0.35px currentColor; }
#sknz-mm .sknz-mm-wv { opacity: 0; transform: translateX(28px); transition: opacity 0.5s var(--mm-ease), transform 0.5s var(--mm-ease); }
#sknz-mm.is-wagen .sknz-mm-wv { opacity: 1; transform: none; transition-delay: calc(160ms + var(--i, 0) * 60ms); }
#sknz-mm.is-wagen .sknz-mm-wv.is-stil { transition-delay: 0s; }
@media (max-width: 1099.98px) {
	#sknz-mm .sknz-mm-wagen-kop { padding-left: 20px; padding-right: 10px; }
	#sknz-mm .sknz-mm-wagen-gratis { margin: 0 20px; }
	#sknz-mm .sknz-mm-wagen-lijst { padding: 0 20px; }
	#sknz-mm .sknz-mm-wagen-voet { padding: 16px 20px 20px; }
	#sknz-mm .sknz-mm-wagen-fout { margin: 12px 20px 0; }
}

@media (prefers-reduced-motion: reduce) {
	#sknz-mm *, #sknz-mm *::before, #sknz-mm *::after { transition: none !important; animation: none !important; }
	#sknz-mm .sknz-mm-tv, #sknz-mm .sknz-mm-wv { opacity: 1; transform: none; }
}