/* ==========================================================================
   De Printkamer · home.css — home-blokken (Flexible Content) en campagnes.
   Ontwerp: 1440 (desktop) en 390 (mobiel); tablet 768–1279 in dezelfde stijl.
   ========================================================================== */

/* Desktop/mobiel-varianten van blokteksten */
@media (min-width: 768px) { .alleen-mobiel-blok { display: none !important; } }
@media (max-width: 767px) { .alleen-groot-blok { display: none !important; } }

.blok { position: relative; }
.blok.is-creme + .blok.is-creme { padding-top: 0; }
.blok__tekst { color: var(--kleur-grijs); max-width: 560px; }
.eyebrow--inkt { color: var(--kleur-inkt); }

/* Tekstlink met pijl ("Bekijk alle modellen →") */
.tekstlink { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font: 600 var(--fs-knop)/1 var(--font-tekst); text-decoration: underline; text-underline-offset: .2em; white-space: nowrap; }
.tekstlink .icoon { width: 18px; height: 18px; transition: transform var(--snel) var(--ease); }
.tekstlink:hover .icoon { transform: translateX(3px); }

/* Decoratie (campagne): inline SVG, absoluut achter de inhoud, nooit klikbaar. */
.decor-laag { position: absolute; inset: 0; pointer-events: none; z-index: 0; }
.decor { position: absolute; display: block; width: 72px; height: 72px; color: var(--kleur-wit); --icoon-accent: currentColor; }
.decor .icoon { width: 100%; height: 100%; }
@media (max-width: 767px) { .decor { width: 52px; height: 52px; } }

/* ==========================================================================
   Hero
   ========================================================================== */
.blok--hero { padding-top: 24px; }
.hero-kaart {
	position: relative; display: flex; align-items: center; gap: 40px;
	padding: 72px 64px 72px 72px; border-radius: 40px; overflow: hidden;
	background: var(--hero-kleur, var(--kleur-lavendel));
}
.hero-kaart--lavendel { --hero-kleur: var(--kleur-lavendel); }
.hero-kaart--limoen { --hero-kleur: var(--kleur-limoen); }
.hero-kaart--boter { --hero-kleur: var(--kleur-boter); }
.hero-kaart--roze { --hero-kleur: var(--kleur-roze); }
.hero-kaart--perzik { --hero-kleur: var(--kleur-perzik); }
.hero-kaart--inkt { --hero-kleur: var(--kleur-inkt); }
.hero-kaart > :not(.decor-laag) { position: relative; z-index: 1; }
.hero-kaart__tekst { flex: 0 0 576px; display: flex; flex-direction: column; align-items: flex-start; gap: 26px; }
.hero-label { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px 8px 10px; border-radius: var(--radius-rond); background: var(--kleur-wit); font-size: var(--fs-klein); line-height: 1.45; }
.hero-label__stip { display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; background: var(--kleur-limoen); flex: none; }
.hero-label__stip .icoon { width: 14px; height: 14px; --icoon-accent: var(--kleur-limoen); }
.hero-kaart__titel { max-width: 576px; }
.hero-kaart__intro { max-width: 500px; }
.hero-kaart__knoppen { display: flex; flex-wrap: wrap; gap: 12px; }
.hero-kaart__checks { display: flex; flex-wrap: wrap; gap: 8px 14px; padding-top: 6px; font-size: var(--fs-klein); line-height: 1.45; }
.hero-kaart__checks li { display: flex; align-items: center; gap: 6px; }
.hero-kaart__checks .vink-rond .icoon { width: 14px; height: 14px; }

.hero-beeld { position: relative; flex: 0 1 560px; min-width: 0; height: 520px; margin-inline: auto; } /* breed scherm: beeld in het midden van de rechterhelft */
.hero-beeld__ring { position: absolute; left: 40px; top: 0; width: 520px; height: 520px; border-radius: 50%; border: 2px dashed rgba(255, 255, 255, .8); }
.hero-beeld__vorm { position: absolute; left: 70px; top: 30px; width: 460px; height: 460px; border-radius: 50%; background: var(--kleur-limoen); }
.hero-beeld__foto { position: absolute; left: 100px; top: 60px; width: 400px; height: 400px; object-fit: contain; filter: drop-shadow(0 24px 24px rgba(46, 46, 64, .22)); }
.hero-product {
	position: absolute; display: flex; align-items: center; gap: 12px; padding: 10px;
	border-radius: 20px; background: var(--kleur-wit); box-shadow: var(--schaduw-kaart); color: var(--kleur-inkt);
}
.hero-product--boven { left: 265px; top: 60px; }
.hero-product--onder { left: -10px; top: 340px; }
.hero-product__foto { width: 56px; height: 56px; flex: none; display: grid; place-items: center; border-radius: 14px; background: var(--kleur-lavendel-licht); overflow: hidden; }
.hero-product__foto img { width: 100%; height: 100%; object-fit: contain; }
.hero-product__tekst { display: grid; gap: 2px; white-space: nowrap; }
.hero-product__naam { font: 600 14px/1.45 var(--font-tekst); text-decoration: none; }
.hero-product__naam::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.hero-product__prijs { font: 600 19px/1.2 var(--font-display); }
.hero-product__plus { position: relative; z-index: 1; }
.hero-product__plus .icoon { --icoon-accent: var(--kleur-limoen); }
.hero-sticker {
	position: absolute; left: 409px; top: 411px; width: 112px; height: 112px;
	display: flex; flex-direction: column; align-items: center; justify-content: center;
	border-radius: 50%; background: var(--kleur-roze); transform: rotate(-8deg); text-align: center;
}
.hero-sticker__klein { font-size: 14px; line-height: 1.45; }
.hero-sticker__groot { font: 600 34px/1.2 var(--font-display); letter-spacing: -0.005em; white-space: nowrap; }
.hero-kaart--roze .hero-sticker { background: var(--kleur-wit); }

/* Hero-decoratie (desktop): midden boven, rechtsboven, linksonder */
.decor-laag--hero .decor--midden { left: 51%; top: 38px; transform: rotate(-8deg); }
.decor-laag--hero .decor--rechts { right: 30px; top: 24px; transform: rotate(10deg); }
.decor-laag--hero .decor--links { left: 30px; bottom: 16px; transform: rotate(-12deg); }

/* Black Friday: donkere hero, limoen knoppen en sticker */
.hero-kaart.is-donker { color: var(--kleur-wit); }
.hero-kaart.is-donker .h1 { color: var(--kleur-wit); }
.hero-kaart.is-donker .hero-label { background: var(--kleur-limoen); color: var(--kleur-inkt); }
.hero-kaart.is-donker .hero-label__stip { background: transparent; }
.hero-kaart.is-donker .hero-label__stip .icoon { --icoon-accent: var(--kleur-limoen); }
.hero-kaart.is-donker .hero-sticker { background: var(--kleur-limoen); color: var(--kleur-inkt); }
.hero-kaart.is-donker .decor { color: var(--kleur-limoen); }
.hero-kaart.is-donker .hero-beeld__ring { border-color: rgba(255, 255, 255, .7); }

@media (min-width: 1024px) and (max-width: 1279px) {
	.hero-kaart { gap: 24px; padding: 56px 40px 56px 48px; }
	.hero-kaart__tekst { flex: 1 1 auto; min-width: 0; }
	.hero-beeld { flex: none; width: 528px; zoom: .78; }
}
@media (max-width: 1023px) {
	.hero-kaart { flex-direction: column; align-items: stretch; gap: 32px; padding: 48px 40px; }
	.hero-kaart__tekst { flex: none; }
	.hero-beeld { flex: none; width: 528px; max-width: 100%; margin-inline: auto; }
	.decor-laag--hero .decor--midden { left: auto; right: 30px; top: 46%; }
}
@media (min-width: 768px) and (max-width: 1023px) {
	.hero-beeld { zoom: .82; }
}
@media (max-width: 767px) {
	.blok--hero { padding-top: 12px; }
	.hero-kaart { gap: 20px; padding: 28px 20px 24px; border-radius: 28px; }
	.hero-kaart__tekst { gap: 20px; }
	.hero-label { gap: 8px; padding: 6px 12px 6px 6px; font-size: 13px; }
	.hero-label__stip { width: 22px; height: 22px; }
	.hero-label__stip .icoon { width: 13px; height: 13px; }
	.hero-kaart__knoppen { flex-direction: column; gap: 10px; width: 100%; }
	.hero-kaart__knoppen .knop { width: 100%; padding-left: 28px; }
	.hero-kaart__checks { flex-direction: column; gap: 8px; padding-top: 0; }
	.hero-kaart__checks li { gap: 8px; }
	.hero-kaart__checks .vink-rond .icoon { width: 11px; height: 11px; }
	.hero-beeld { width: 100%; height: 270px; margin-top: 0; }
	.hero-beeld__ring { display: none; }
	.hero-beeld__vorm { left: 50%; top: 8px; width: 240px; height: 240px; transform: translateX(-50%); }
	.hero-beeld__foto { left: 50%; top: 24px; width: 214px; height: 207px; transform: translateX(-50%); filter: drop-shadow(0 16px 16px rgba(46, 46, 64, .2)); }
	.hero-product--boven:not(.is-enige) { display: none; }
	.hero-product { left: 0; top: 206px; gap: 10px; padding: 8px; border-radius: 16px; box-shadow: 0 10px 24px rgba(46, 46, 64, .14); }
	.hero-product__foto { width: 44px; height: 44px; border-radius: 10px; }
	.hero-product__tekst { gap: 0; }
	.hero-product__naam { font-size: 12px; }
	.hero-product__prijs { font-size: 16px; }
	.hero-product__plus { width: 44px; height: 44px; margin: -6px -6px -6px 0; background: none; }
	.hero-product__plus::before { content: ""; position: absolute; inset: 6px; border-radius: 50%; background: var(--kleur-inkt); z-index: -1; }
	.hero-product__plus .icoon { width: 16px; height: 16px; }
	.hero-sticker { left: auto; right: 4px; top: 13px; width: 78px; height: 78px; transform: rotate(8deg); }
	.hero-sticker__klein { font-size: 12px; }
	.hero-sticker__groot { font-size: 24px; line-height: 1.22; }
	.decor-laag--hero .decor--midden { display: none; }
	.decor-laag--hero .decor--rechts { right: 14px; top: 14px; }
	.decor-laag--hero .decor--links { left: auto; right: 18px; bottom: auto; top: 505px; }
}

/* ==========================================================================
   USP's
   ========================================================================== */
.blok--usps { padding-top: 28px; }
.usps { display: flex; justify-content: center; gap: 24px 64px; padding: 8px; }
.usp { display: flex; align-items: center; gap: 14px; }
.usp__icoon { display: grid; place-items: center; width: 48px; height: 48px; flex: none; border-radius: 50%; background: var(--kleur-limoen); }
.usp__icoon .icoon { --icoon-accent: var(--kleur-limoen); }
.usp__tekst { display: grid; gap: 2px; }
.usp__titel { font: 500 17px/1.25 var(--font-display); letter-spacing: -0.002em; }
.usp__sub { font-size: var(--fs-klein); line-height: 1.45; color: var(--kleur-grijs); }
@media (max-width: 1279px) {
	.usps { display: grid; grid-template-columns: repeat(2, max-content); justify-content: center; gap: 24px 64px; }
}
@media (max-width: 767px) {
	.blok--usps { padding-top: 24px; }
	.usps { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding: 0; }
	.usp { flex-direction: column; gap: 8px; padding: 14px 12px; border: 1px solid var(--kleur-lijn); border-radius: 18px; background: var(--kleur-wit); text-align: center; }
	.usp__icoon { width: 36px; height: 36px; }
	.usp__icoon .icoon { width: 20px; height: 20px; }
	.usp__tekst { gap: 0; }
	.usp__titel { font: 600 14px/1 var(--font-tekst); padding-bottom: 2px; }
	.usp__sub { font-size: 12px; }
}

/* ==========================================================================
   Categorieën
   ========================================================================== */
.cat-tegels { display: grid; grid-template-columns: repeat(var(--n, 6), minmax(0, 1fr)); gap: 16px; } /* --n = aantal tegels (max 6) */
.cat-tegel {
	display: flex; flex-direction: column; align-items: center; gap: 12px; height: 100%;
	padding: 16px 16px 20px; border-radius: var(--radius-kaart); background: var(--cat-kleur, var(--kleur-lavendel));
	text-decoration: none; text-align: center; transition: transform var(--snel) var(--ease);
}
.cat-tegel:hover { transform: translateY(-4px); }
.cat-tegel__foto { position: relative; display: block; width: 100%; height: 150px; border-radius: var(--radius-rond); background: rgba(255, 255, 255, .45); overflow: hidden; }
.cat-tegel__foto img { position: absolute; inset: 26px 28px; width: calc(100% - 56px); height: calc(100% - 52px); object-fit: contain; }
.cat-tegel__naam { font: 500 19px/1.25 var(--font-display); letter-spacing: -0.002em; }
.cat-tegel__aantal { margin-top: -2px; font-size: var(--fs-klein); line-height: 1.45; color: var(--kleur-grijs); }
.cat-tegels__knop { margin-top: 24px; }
@media (max-width: 1279px) { .cat-tegels { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 767px) {
	.blok--categorieen .sectie-kop { margin-bottom: 24px; }
	.blok--categorieen .sectie-kop__tekst { gap: 10px; }
	.cat-tegels { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
	.cat-tegel { gap: 10px; padding: 12px 16px 16px; }
	.cat-tegel__aantal { margin-top: 0; }
}

/* ==========================================================================
   Ticker (doorlopende band; pauzeert bij hover/focus; stil bij reduced motion)
   ========================================================================== */
.blok--ticker { overflow: hidden; padding-block: 16px; background: var(--kleur-limoen); }
.ticker__spoor { display: flex; width: max-content; animation: dpk-ticker 60s linear infinite; }
.blok--ticker:hover .ticker__spoor, .blok--ticker:focus-within .ticker__spoor, .blok--ticker.is-gepauzeerd .ticker__spoor { animation-play-state: paused; }
.ticker__rij { display: flex; align-items: center; flex: none; }
.ticker__rij li { display: flex; align-items: center; gap: 28px; padding-right: 28px; font: 600 22px/1.2 var(--font-display); letter-spacing: -0.005em; white-space: nowrap; }
.ticker__rij .icoon { width: 18px; height: 18px; --icoon-accent: var(--kleur-limoen); }
@keyframes dpk-ticker { to { transform: translateX(-16.6667%); } }
@media (prefers-reduced-motion: reduce) { .ticker__spoor { animation: none; } }
@media (max-width: 767px) {
	.blok--ticker { padding-block: 12px; }
	.ticker__rij li { gap: 20px; padding-right: 20px; font-size: 17px; line-height: 1.22; letter-spacing: -0.004em; }
	.ticker__rij .icoon { width: 14px; height: 14px; }
}

/* ==========================================================================
   Uitgelichte modellen / Populair
   ========================================================================== */
.blok--uitgelicht .sectie-kop { margin-bottom: 36px; }
.blok--uitgelicht .sectie-kop__tekst { max-width: 680px; }
.filtertabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 36px; }
.filtertabs .chip { position: relative; min-height: 37px; padding: 0 19px; }
.filtertabs .chip::after { content: ""; position: absolute; left: 0; right: 0; top: -4px; bottom: -4px; }
.producten-raster { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 36px 20px; }
.producten-raster > li[hidden] { display: none; }
.producten-leeg { color: var(--kleur-grijs); text-align: center; }
.verzendtip { display: flex; align-items: center; justify-content: center; gap: 10px; width: fit-content; max-width: 100%; min-height: 48px; margin: 36px auto 0; padding: 12px 20px; border-radius: var(--radius-rond); background: var(--kleur-limoen-licht); font-size: var(--fs-klein); line-height: 1.45; }
.verzendtip .icoon { width: 18px; height: 18px; flex: none; }
.uitgelicht__knop { margin-top: 20px; }
@media (max-width: 1279px) { .producten-raster { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px 16px; } }
@media (max-width: 767px) {
	.blok--uitgelicht .sectie-kop { margin-bottom: 20px; }
	.blok--uitgelicht .sectie-kop__tekst { gap: 10px; }
	.filtertabs { margin-bottom: 20px; }
	.filtertabs .chip { min-height: 34px; padding: 0 15px; font-size: 14px; }
	.filtertabs .chip::after { top: -5px; bottom: -5px; }
	.producten-raster { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
	.producten-raster > li.buiten-mobiel { display: none; }
	.verzendtip { justify-content: flex-start; width: 100%; margin-top: 20px; padding: 12px; border-radius: 16px; }
	.verzendtip .icoon { width: 20px; height: 20px; }
}

/* ==========================================================================
   Draak, ei of allebei?
   ========================================================================== */
.blok--draak-ei .sectie-kop { margin-bottom: 32px; }
.blok--draak-ei .blok__tekst { max-width: 600px; }
.draak-ei { position: relative; display: flex; }
.draak-ei__optie {
	flex: 1 1 0; display: flex; flex-direction: column; align-items: center; gap: 18px;
	padding: 48px 56px 52px; text-align: center;
}
.draak-ei__optie--lavendel { background: var(--kleur-lavendel); border-radius: 40px 0 0 40px; }
.draak-ei__optie--limoen { background: var(--kleur-limoen); border-radius: 0 40px 40px 0; }
.draak-ei:not(.draak-ei--twee) .draak-ei__optie { border-radius: 40px; }
.draak-ei__beeld { position: relative; width: 420px; max-width: 100%; height: 250px; }
.draak-ei__vlak { position: absolute; left: 50%; top: 0; width: 250px; height: 250px; border-radius: 50%; background: rgba(255, 255, 255, .45); transform: translateX(-50%); }
.draak-ei__schaduw { position: absolute; left: 50%; top: 236px; width: 266px; height: 14px; border-radius: 50%; background: radial-gradient(closest-side, rgba(47, 47, 64, .18), rgba(47, 47, 64, 0)); transform: translateX(-50%); }
.draak-ei__beeld img { position: absolute; left: 20px; right: 20px; bottom: 8px; width: calc(100% - 40px); height: 220px; object-fit: contain; object-position: center bottom; }
.draak-ei__kop { display: grid; gap: 6px; }
.draak-ei__titel { font: 600 36px/1.08 var(--font-display); letter-spacing: -0.015em; }
.draak-ei__prijs { display: flex; align-items: baseline; gap: 8px; }
.draak-ei__prijs span { color: var(--kleur-grijs); }
.draak-ei__prijs strong { font: 600 30px/1.2 var(--font-display); letter-spacing: -0.005em; }
.draak-ei__kenmerken { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.draak-ei__kenmerken li { display: flex; align-items: center; gap: 6px; padding: 8px 14px 8px 10px; border-radius: var(--radius-rond); background: var(--kleur-wit); font-size: var(--fs-klein); line-height: 1.45; }
.draak-ei__kenmerken .icoon { width: 14px; height: 14px; }
.draak-ei__knop { margin-top: 6px; }
.draak-ei__plus {
	position: absolute; left: 50%; top: 150px; z-index: 1; width: 84px; height: 84px;
	display: grid; place-items: center; border: 6px solid var(--kleur-creme); border-radius: 50%;
	background: var(--kleur-inkt); color: var(--kleur-limoen); font: 600 28px/1 var(--font-display);
	transform: translateX(-50%);
}
.draak-ei__plus--of { font: 600 22px/1 var(--font-tekst); }
.draak-ei__set { margin-top: 32px; text-align: center; font-weight: 600; }
@media (max-width: 1023px) {
	.draak-ei { flex-direction: column; align-items: center; }
	.draak-ei__optie { width: 100%; padding: 20px 20px 24px; border-radius: 28px !important; gap: 14px; }
	.draak-ei__plus { position: static; width: 46px; height: 46px; margin: 16px 0; border: 0; font-size: 22px; transform: none; }
	.draak-ei__beeld { width: 310px; height: 190px; }
	.draak-ei__vlak { width: 165px; height: 165px; top: 0; }
	.draak-ei__schaduw { top: 180px; width: 200px; height: 10px; }
	.draak-ei__beeld img { height: 175px; left: 0; right: 0; width: 100%; }
}
@media (max-width: 767px) {
	.blok--draak-ei .sectie-kop { margin-bottom: 20px; }
	.blok--draak-ei .sectie-kop__tekst { gap: 10px; }
	.draak-ei__titel { font-size: 26px; }
	.draak-ei__prijs strong { font-size: 24px; }
	.draak-ei__prijs span { font-size: 14px; }
	.draak-ei__kenmerken { gap: 6px; }
	.draak-ei__kenmerken li { padding: 4px 10px 4px 8px; font-size: 13px; }
	.draak-ei__kenmerken .icoon { width: 12px; height: 12px; }
	.draak-ei__knop { width: 100%; padding-left: 28px; }
	.draak-ei__set { margin-top: 24px; font-size: 14px; }
}

/* ==========================================================================
   Cadeaus per budget
   ========================================================================== */
.blok--cadeaus { background: var(--kleur-roze); }
.cadeaus { display: flex; align-items: center; gap: 64px; }
.cadeaus__tekst { flex: 0 0 420px; display: flex; flex-direction: column; align-items: flex-start; gap: 18px; }
.cadeaus__icoon { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: var(--kleur-wit); }
.cadeaus__icoon .icoon { width: 26px; height: 26px; }
.cadeaus__intro { max-width: 400px; }
.cadeaus__knop.alleen-groot-blok { margin-top: 6px; }
.budgetten { flex: 1 1 auto; display: flex; gap: 16px; }
.budgetten li { flex: 1 1 0; display: flex; }
.budget {
	display: flex; flex-direction: column; gap: 6px; width: 100%; padding: 28px 24px 24px;
	border-radius: 28px; background: var(--kleur-wit); text-decoration: none; transition: transform var(--snel) var(--ease);
}
.budget:hover { transform: translateY(-4px); }
.budget__label { color: var(--kleur-grijs); }
.budget__bedrag { font: 600 34px/1.08 var(--font-display); letter-spacing: -0.015em; }
.budget__onder { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 46px; }
.budget__sub { font-size: var(--fs-klein); line-height: 1.45; color: var(--kleur-grijs); }
.budget__pijl { display: grid; place-items: center; width: 40px; height: 40px; flex: none; border-radius: 50%; background: var(--kleur-roze); }
.budget__pijl .icoon { width: 18px; height: 18px; }
.budget--donker { background: var(--kleur-inkt); color: var(--kleur-wit); }
.budget--donker .budget__label { color: var(--kleur-limoen); }
.budget--donker .budget__sub { color: var(--kleur-wit); }
.budget--donker .budget__pijl { background: var(--kleur-limoen); color: var(--kleur-inkt); }
@media (max-width: 1279px) {
	.cadeaus { flex-direction: column; align-items: stretch; gap: 40px; }
	.cadeaus__tekst { flex: none; }
}
@media (max-width: 767px) {
	.cadeaus { gap: 20px; }
	.cadeaus__tekst { gap: 14px; }
	.cadeaus__icoon { width: 48px; height: 48px; margin-bottom: 6px; }
	.cadeaus__icoon .icoon { width: 22px; height: 22px; }
	.budgetten { flex-direction: column; gap: 12px; }
	.budget { display: grid; grid-template-columns: 1fr auto; gap: 0 12px; padding: 20px; border-radius: 24px; }
	.budget > * { grid-column: 1; }
	.budget__label { font-size: 14px; line-height: 1.45; }
	.budget__bedrag { font-size: 24px; line-height: 1.22; }
	.budget__onder { display: contents; }
	.budget__sub { grid-column: 1; }
	.budget__pijl { grid-column: 2; grid-row: 1 / span 3; align-self: center; }
	.cadeaus__knop.alleen-mobiel-blok { margin-top: 8px; }
}

/* ==========================================================================
   Seizoensblok (campagne)
   ========================================================================== */
.seizoen {
	position: relative; display: flex; align-items: center; gap: 56px; padding: 56px;
	border-radius: 40px; background: var(--sb-kleur, var(--kleur-perzik));
}
.seizoen > :not(.decor-laag) { position: relative; z-index: 1; }
.seizoen__foto { position: relative; flex: 0 0 560px; height: 460px; border-radius: 28px; background: var(--sb-licht, var(--kleur-perzik-licht)); overflow: hidden; }
.seizoen__cirkel { position: absolute; left: 50%; top: 70px; width: 360px; height: 360px; border-radius: 50%; background: var(--sb-kleur); transform: translateX(-50%); }
.seizoen__schaduw { position: absolute; left: 50%; top: 412px; width: 300px; height: 14px; border-radius: 50%; background: radial-gradient(closest-side, rgba(47, 47, 64, .16), rgba(47, 47, 64, 0)); transform: translateX(-50%); }
.seizoen__schaduw { display: none; }
/* Beeld in het midden van de cirkel (zelfde hoogte en middelpunt). */
.seizoen__beeld { position: absolute; left: 10%; top: 70px; width: 80%; height: 360px; object-fit: contain; object-position: center; }
.seizoen__label { position: absolute; left: 24px; top: 24px; z-index: 2; display: flex; align-items: center; gap: 6px; padding: 8px 14px 8px 12px; border-radius: var(--radius-rond); background: var(--kleur-wit); color: var(--kleur-inkt); font: 600 13px/1.2 var(--font-tekst); }
.seizoen__label .icoon { width: 16px; height: 16px; }
.seizoen__tekst { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 18px; }
.seizoen__eyebrow { display: flex; align-items: center; gap: 8px; color: var(--kleur-inkt); }
.seizoen__eyebrow .icoon { width: 16px; height: 16px; }
.seizoen .h2 { max-width: 520px; }
.seizoen__intro { max-width: 500px; }
.seizoen-product { position: relative; display: flex; align-items: center; gap: 16px; width: 100%; padding: 12px; border-radius: 22px; background: var(--kleur-wit); color: var(--kleur-inkt); }
.seizoen-product__foto { display: grid; place-items: center; width: 72px; height: 72px; flex: none; border-radius: 16px; background: var(--kaart-kleur, var(--kleur-boter)); overflow: hidden; }
.seizoen-product__foto img { width: 52px; height: 52px; object-fit: contain; }
.seizoen-product__tekst { flex: 1 1 auto; min-width: 0; display: grid; gap: 2px; }
.seizoen-product__naam { font: 500 19px/1.25 var(--font-display); letter-spacing: -0.002em; text-decoration: none; }
.seizoen-product__naam::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.seizoen-product__prijs { font-size: var(--fs-klein); line-height: 1.45; color: var(--kleur-grijs); }
.seizoen-product__knop, .seizoen-product__rond { position: relative; z-index: 1; }
.seizoen-product__knop { min-height: 44px; padding: 12px 18px; font-size: 15px; }
.seizoen-product__rond { display: none !important; }
.seizoen-producten { display: grid; gap: 10px; width: 100%; }
/* Meerdere producten: compacte kaartjes in twee kolommen, met een rond winkelwagenknopje. */
.seizoen-producten--meer { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.seizoen-producten--meer .seizoen-product { gap: 12px; padding: 8px 10px 8px 8px; border-radius: 18px; }
.seizoen-producten--meer .seizoen-product__foto { width: 56px; height: 56px; border-radius: 13px; }
.seizoen-producten--meer .seizoen-product__foto img { width: 44px; height: 44px; }
.seizoen-producten--meer .seizoen-product__naam { font-size: 16px; }
.seizoen-producten--meer .seizoen-product__knop { display: none; }
.seizoen-producten--meer .seizoen-product__rond { display: grid !important; }
.seizoen-producten--meer .seizoen-product__rond { flex: none; }
.seizoen-producten--meer .seizoen-product__rond .icoon { --icoon-accent: var(--kleur-limoen); }
@media (max-width: 1279px) { .seizoen-producten--meer { grid-template-columns: minmax(0, 1fr); } }
.seizoen__knoppen { display: flex; flex-wrap: wrap; gap: 12px; padding-top: 6px; }

/* Decoratie: buiten (wit) rechtsboven en rechtsonder; in het fotovlak in de campagnekleur. */
.decor-laag--blok .decor--boven { right: 20px; top: 18px; transform: rotate(-12deg); }
.decor-laag--blok .decor--onder { right: 33px; bottom: 20px; transform: rotate(10deg); }
.decor-laag--foto { z-index: 0; }
.decor-laag--foto .decor { color: var(--sb-decor); }
.decor-laag--foto .decor--rechts { right: 18px; top: 17px; transform: rotate(-10deg); }
.decor-laag--foto .decor--links { left: 24px; bottom: 24px; transform: rotate(12deg); }
.seizoen--herfst .decor-laag--foto .decor--links { bottom: auto; top: 83px; left: 32px; }

/* Black Friday: donker met limoen */
.seizoen.is-donker { color: var(--kleur-wit); }
.seizoen.is-donker .h2, .seizoen.is-donker .seizoen__eyebrow { color: var(--kleur-wit); }
.seizoen.is-donker .seizoen__foto { background: rgba(255, 255, 255, .06); }
.seizoen.is-donker .seizoen__cirkel { background: var(--kleur-limoen); }
.seizoen.is-donker .decor-laag--blok .decor { color: var(--kleur-limoen); }
.seizoen.is-donker .seizoen__eyebrow .icoon { --icoon-accent: var(--kleur-limoen); }

@media (max-width: 1279px) {
	.seizoen { flex-direction: column; align-items: stretch; gap: 40px; padding: 40px; }
	.seizoen__foto { flex: none; width: 100%; max-width: 640px; margin-inline: auto; }
}
@media (max-width: 767px) {
	.seizoen { gap: 16px; padding: 14px 14px 24px; border-radius: 28px; }
	.decor-laag--blok { display: none; }
	.seizoen__foto { height: 250px; border-radius: 20px; }
	.seizoen__cirkel { top: 24px; width: 220px; height: 220px; }
	.seizoen__schaduw { top: 220px; width: 190px; height: 10px; }
	.seizoen__beeld { left: 5%; width: 90%; top: 24px; height: 220px; }
	.seizoen__label { left: 12px; top: 12px; padding: 6px 10px 6px 8px; font-size: 12px; }
	.seizoen__label .icoon { width: 14px; height: 14px; }
	.decor-laag--foto .decor--rechts { right: 6px; top: 14px; }
	.seizoen--herfst .decor-laag--foto .decor--links, .decor-laag--foto .decor--links { left: 14px; top: 52px; bottom: auto; }
	.seizoen__tekst { gap: 10px; padding: 0 6px; }
	.seizoen-product { margin-top: 6px; gap: 12px; padding: 8px 8px 8px 8px; border-radius: 18px; }
	.seizoen-product__foto { width: 52px; height: 52px; border-radius: 12px; }
	.seizoen-product__foto img { width: 40px; height: 40px; }
	.seizoen-product__naam { font: 600 15px/1 var(--font-tekst); }
	.seizoen-product__prijs { font-size: 14px; }
	.seizoen-product__knop { display: none !important; }
	.seizoen-product__rond { display: grid !important; width: 44px; height: 44px; margin-right: 6px; }
	.seizoen-product__rond .icoon { --icoon-accent: var(--kleur-limoen); }
	.seizoen__knoppen { flex-direction: column; gap: 10px; width: 100%; padding-top: 6px; }
	.seizoen__knoppen .knop { width: 100%; padding-left: 28px; padding-right: 28px; }
	.seizoen:not(.is-donker) .seizoen__knop-1 { background: var(--kleur-inkt); color: var(--kleur-wit); }
	.seizoen:not(.is-donker) .seizoen__knop-2 { border-color: transparent; background: var(--kleur-wit); }
	.seizoen.is-donker .seizoen-product__rond { background: var(--kleur-inkt); }
}

/* ==========================================================================
   TikTok
   ========================================================================== */
.tiktok__volg { padding: 14px 22px 14px 18px; gap: 8px; min-height: 46px; }
.tiktok__volg .knop__icoon, .tiktok__volg-mobiel .knop__icoon { --icoon-accent: var(--kleur-limoen); }
.tiktok__volg-mobiel { display: none; }
.tiktok-raster { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.tiktok-kaart { position: relative; }
.tiktok-kaart__knop { position: relative; display: block; width: 100%; height: 420px; border-radius: 24px; overflow: hidden; background: var(--kleur-inkt); text-align: left; }
.tiktok-kaart__knop::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 180px; background: linear-gradient(rgba(47, 47, 64, 0), rgba(47, 47, 64, .75)); }
.tiktok-kaart__cover { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .35s var(--ease); }
.tiktok-kaart__knop:hover .tiktok-kaart__cover { transform: scale(1.04); }
.tiktok-kaart__speel { position: absolute; left: 50%; top: 50%; z-index: 1; display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: var(--kleur-wit); color: var(--kleur-inkt); transform: translate(-50%, -50%); transition: transform var(--snel) var(--ease); }
.tiktok-kaart__knop:hover .tiktok-kaart__speel { transform: translate(-50%, -50%) scale(1.08); }
.tiktok-kaart__speel .icoon { width: 20px; height: 20px; }
.tiktok-kaart__bijschrift { position: absolute; left: 16px; right: 16px; bottom: 16px; z-index: 1; display: flex; align-items: center; gap: 6px; color: var(--kleur-wit); font: 600 14px/1.25 var(--font-tekst); }
.tiktok-kaart__bijschrift .icoon { width: 18px; height: 18px; flex: none; --icoon-accent: transparent; }
.tiktok-kaart__label { position: absolute; left: 14px; top: 14px; z-index: 2; display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px 6px 8px; border-radius: var(--radius-rond); background: var(--kleur-wit); font: 600 13px/1.2 var(--font-tekst); text-decoration: none; }
.tiktok-kaart__label::before { content: ""; position: absolute; inset: -8px -4px; }
.tiktok-kaart__label .icoon { width: 16px; height: 16px; }
@media (max-width: 1279px) { .tiktok-raster { grid-template-columns: repeat(2, 1fr); } .tiktok-kaart__knop { height: 460px; } }
@media (max-width: 767px) {
	.blok--tiktok .sectie-kop { margin-bottom: 24px; }
	.blok--tiktok .sectie-kop__tekst { gap: 10px; }
	.tiktok__volg { display: none; }
	.tiktok__volg-mobiel { display: inline-flex; margin-top: 20px; padding-left: 28px; padding-right: 28px; }
	.tiktok-raster { gap: 12px; }
	.tiktok-kaart__knop { height: 250px; border-radius: 20px; }
	.tiktok-kaart__knop::after { height: 120px; }
	.tiktok-kaart__label { display: none; }
	.tiktok-kaart__bijschrift { left: 12px; right: 12px; bottom: 14px; font-size: 13px; }
	.tiktok-kaart__bijschrift .icoon { display: none; }
	.tiktok-kaart__speel { width: 44px; height: 44px; }
	.tiktok-kaart__speel .icoon { width: 18px; height: 18px; }
}

/* TikTok-speler: desktop staand venster over gedimde pagina, mobiel schermvullend */
.tiktok-speler { align-items: center; justify-content: center; }
.tiktok-speler .overlay__achtergrond { background: rgba(47, 47, 64, .6); }
.tiktok-speler__paneel {
	width: min(405px, calc(100vw - 32px)); height: min(720px, calc(100dvh - 120px)); aspect-ratio: 9 / 16;
	border-radius: 24px; background: #1b1b26; box-shadow: none; overflow: visible;
	opacity: 0; transform: scale(.97); transition: opacity .25s var(--ease), transform .25s var(--ease);
}
.tiktok-speler.is-open .tiktok-speler__paneel { opacity: 1; transform: none; }
.tiktok-slide { position: absolute; inset: 0; border-radius: inherit; overflow: hidden; color: var(--kleur-wit); }
.tiktok-slide__media { position: absolute; inset: 0; background: #1b1b26; }
.tiktok-slide__media img, .tiktok-slide__media video, .tiktok-slide__media iframe { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border: 0; }
.tiktok-slide__media::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(rgba(27, 27, 38, .45), rgba(27, 27, 38, 0) 22%, rgba(27, 27, 38, 0) 60%, rgba(27, 27, 38, .6)); }
.tiktok-slide.is-speelt .tiktok-slide__media::after { display: none; }
.tiktok-slide__kop { position: absolute; left: 16px; right: 64px; top: 30px; z-index: 1; display: flex; align-items: center; gap: 10px; }
.tiktok-slide__avatar { display: grid; place-items: center; width: 36px; height: 36px; flex: none; border-radius: 50%; background: var(--kleur-lavendel); color: var(--kleur-inkt); }
.tiktok-slide__avatar .icoon { width: 20px; height: 20px; }
.tiktok-slide__naam { display: grid; font-size: 14px; line-height: 1.2; }
.tiktok-slide__naam strong { font: 600 15px/1.2 var(--font-tekst); }
.tiktok-slide__naam span { opacity: .85; }
.tiktok-slide__onder { position: absolute; left: 16px; right: 16px; bottom: 16px; z-index: 1; display: grid; gap: 14px; }
.tiktok-slide__tekst { font-size: 15px; line-height: 1.6; text-shadow: 0 1px 6px rgba(0, 0, 0, .25); }
.tiktok-product { display: flex; align-items: center; gap: 12px; padding: 10px 10px 10px 10px; border-radius: 16px; background: var(--kleur-wit); color: var(--kleur-inkt); text-decoration: none; }
.tiktok-product__foto { display: grid; place-items: center; width: 56px; height: 56px; flex: none; border-radius: 12px; background: var(--kaart-kleur, var(--kleur-lavendel-licht)); overflow: hidden; }
.tiktok-product__foto img { width: 48px; height: 48px; object-fit: contain; }
.tiktok-product__tekst { flex: 1 1 auto; display: grid; font-size: 15px; line-height: 1.3; }
.tiktok-product__tekst strong { font: 600 19px/1.2 var(--font-display); }
.tiktok-product .rond .icoon { --icoon-accent: var(--kleur-limoen); }
.tiktok-speler__voortgang { position: absolute; left: 16px; right: 16px; top: 14px; z-index: 2; display: flex; gap: 4px; }
.tiktok-speler__voortgang span { flex: 1; height: 3px; border-radius: 2px; background: rgba(255, 255, 255, .35); }
.tiktok-speler__voortgang span.is-actief { background: var(--kleur-wit); }
.tiktok-speler__sluiten { position: fixed; right: 40px; top: 40px; z-index: 3; width: 48px; height: 48px; background: rgba(255, 255, 255, .2); color: var(--kleur-wit); backdrop-filter: blur(4px); }
.tiktok-speler__sluiten:hover { background: rgba(255, 255, 255, .32); }
.tiktok-speler__nav { position: absolute; top: 50%; z-index: 3; width: 56px; height: 56px; margin-top: -28px; background: var(--kleur-wit); color: var(--kleur-inkt); }
.tiktok-speler__nav:hover { background: var(--kleur-lavendel-licht); }
.tiktok-speler__nav--vorige { left: -104px; }
.tiktok-speler__nav--volgende { right: -104px; }
.tiktok-speler__nav[disabled] { opacity: .45; cursor: default; }
.icoon--draai { transform: rotate(180deg); }
.tiktok-speler__meer { position: absolute; left: 50%; bottom: -66px; z-index: 3; display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 10px 20px 10px 16px; border-radius: var(--radius-rond); background: rgba(255, 255, 255, .2); color: var(--kleur-wit); font: 600 15px/1 var(--font-tekst); text-decoration: none; white-space: nowrap; transform: translateX(-50%); backdrop-filter: blur(4px); }
.tiktok-speler__meer:hover { background: rgba(255, 255, 255, .32); }
.tiktok-speler__meer .icoon, .tiktok-speler__swipe .icoon { width: 18px; height: 18px; --icoon-accent: var(--kleur-limoen); }
.tiktok-speler__swipe { display: none; }
@media (max-width: 767px), (max-height: 640px) {
	.tiktok-speler__paneel { width: 100%; height: 100%; max-height: none; aspect-ratio: auto; border-radius: 0; transform: none; }
	.tiktok-speler__sluiten { position: absolute; right: 16px; top: 28px; width: 44px; height: 44px; }
	.tiktok-speler__nav { display: none; }
	.tiktok-speler__meer { display: none; }
	.tiktok-slide__kop { top: 30px; left: 20px; }
	.tiktok-speler__voortgang { left: 20px; right: 20px; top: 14px; }
	.tiktok-slide__onder { left: 20px; right: 20px; bottom: 56px; }
	.tiktok-speler__swipe { position: absolute; left: 0; right: 0; bottom: 14px; z-index: 2; display: flex; align-items: center; justify-content: center; gap: 6px; color: var(--kleur-wit); font-size: 13px; }
	.tiktok-speler__swipe a { color: inherit; text-decoration: none; }
}

/* ==========================================================================
   Reviews
   ========================================================================== */
.blok--reviews { background: var(--kleur-wit); }
.sterren { display: inline-flex; gap: 3px; }
.sterren .icoon { width: 20px; height: 20px; color: var(--kleur-inkt); --icoon-accent: transparent; }
.sterren .icoon.is-vol { --icoon-accent: var(--kleur-limoen); }
.review-score { display: flex; align-items: center; gap: 20px; padding: 24px 28px; border-radius: 24px; background: var(--kleur-lavendel-licht); }
.review-score__getal { font: 600 44px/1.08 var(--font-display); letter-spacing: -0.015em; }
.review-score__tekst { display: grid; gap: 4px; font-size: var(--fs-klein); line-height: 1.45; color: var(--kleur-grijs); }
.review-score__link { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; font: 600 15px/1 var(--font-tekst); text-decoration: none; }
.review-score__link .icoon { width: 16px; height: 16px; }
.reviews-slider { --slider-per: 3; --slider-gap: 24px; --slider-item: calc((100% - 2 * 24px) / 3); }
.review { display: flex; flex-direction: column; gap: 16px; padding: 32px; border: 1px solid var(--kleur-lijn); border-radius: 24px; background: var(--kleur-creme); }
.review__kop { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.review .sterren .icoon { width: 18px; height: 18px; }
.review__geverifieerd { display: inline-flex; align-items: center; gap: 4px; font-size: var(--fs-klein); line-height: 1.45; color: var(--kleur-grijs); }
.review__geverifieerd .icoon { width: 14px; height: 14px; }
.review__tekst { margin: 0; }
.review__naam { font: 600 15px/1 var(--font-tekst); }
.review__product { display: flex; align-items: center; gap: 10px; margin-top: auto; padding: 8px 12px 8px 8px; border-radius: 14px; background: var(--kleur-wit); font-size: var(--fs-klein); line-height: 1.45; text-decoration: none; }
.review__foto { display: grid; place-items: center; width: 40px; height: 40px; flex: none; border-radius: 10px; background: var(--kaart-kleur); overflow: hidden; }
.review__foto img { width: 36px; height: 36px; object-fit: contain; }
@media (max-width: 1279px) {
	.blok--reviews .sectie-kop { flex-direction: column; align-items: flex-start; }
	.reviews-slider { --slider-per: 2; --slider-item: calc((100% - 24px) / 2); }
}
@media (max-width: 767px) {
	.blok--reviews .blok__tekst { display: none; }
	.review-score { display: grid; justify-items: start; gap: 8px; width: 100%; padding: 28px; }
	.review-score__tekst { gap: 6px; }
	.review-score__link { min-height: 32px; }
	.reviews-slider { --slider-per: 1; --slider-gap: 16px; --slider-item: 100%; }
	.review { padding: 24px; }
}

/* ==========================================================================
   Laag voor laag / Over ons
   ========================================================================== */
.blok--laag-voor-laag { background: var(--kleur-lavendel-licht); }
.stappen { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; align-items: start; }
.stap { display: flex; align-items: flex-start; gap: 20px; padding: 28px; border-radius: 24px; background: var(--kleur-wit); }
.stap__icoon { display: grid; place-items: center; width: 64px; height: 64px; flex: none; border-radius: 50%; background: var(--kleur-lavendel); }
.stap__icoon .icoon { width: 28px; height: 28px; }
.stap__icoon--limoen { background: var(--kleur-limoen); }
.stap__icoon--perzik { background: var(--kleur-perzik); --icoon-accent: var(--kleur-perzik); }
.stap__icoon--roze { background: var(--kleur-roze); }
.stap__icoon--boter { background: var(--kleur-boter); }
.stap__tekst { display: grid; gap: 6px; }
.stap__titel { font: 500 19px/1.25 var(--font-display); letter-spacing: -0.002em; }
.stap__sub { font-size: var(--fs-klein); line-height: 1.45; color: var(--kleur-grijs); }
.laag__knop { margin-top: 20px; padding-left: 28px; }
@media (max-width: 1279px) { .stappen { grid-template-columns: 1fr; gap: 12px; } }
@media (max-width: 767px) {
	.blok--laag-voor-laag .sectie-kop { margin-bottom: 24px; }
	.blok--laag-voor-laag .sectie-kop__tekst { gap: 10px; }
	.stap { align-items: center; gap: 14px; padding: 16px; border-radius: 20px; }
	.stap__icoon { width: 52px; height: 52px; }
	.stap__icoon .icoon { width: 24px; height: 24px; }
	.stap__tekst { gap: 2px; }
	.stap__titel { font: 600 17px/1.25 var(--font-tekst); }
}

/* ==========================================================================
   FAQ
   ========================================================================== */
.faq { display: grid; grid-template-columns: 400px 1fr; gap: 80px; align-items: start; }
.faq__intro { display: grid; gap: 16px; }
.faq__intro .blok__tekst { max-width: 380px; }
.contactkaart { display: flex; align-items: center; gap: 14px; max-width: 380px; margin-top: 12px; padding: 18px; border-radius: 24px; background: var(--kleur-lavendel); }
.contactkaart__icoon { display: grid; place-items: center; width: 48px; height: 48px; flex: none; border-radius: 50%; background: var(--kleur-wit); }
.contactkaart__icoon .icoon { width: 22px; height: 22px; }
.contactkaart__tekst { display: grid; gap: 2px; }
.contactkaart__titel { font: 500 19px/1.25 var(--font-display); }
.contactkaart__regel { font-size: var(--fs-klein); line-height: 1.45; }
.contactkaart__regel a { text-decoration: none; }
.contactkaart__regel a:hover { text-decoration: underline; }
.faq__vragen { display: grid; gap: 12px; }
.faq-vraag { border: 1px solid var(--kleur-lijn); border-radius: 20px; background: var(--kleur-wit); }
.faq-vraag__kop { margin: 0; font: inherit; }
.faq-vraag__knop { padding: 23px 25px; font: 500 19px/1.25 var(--font-display); }
.faq-vraag__knop:focus-visible { border-radius: 20px; }
.faq-vraag__toggle { position: relative; display: grid; place-items: center; width: 32px; height: 32px; flex: none; border-radius: 50%; background: var(--kleur-lavendel-licht); transition: background-color var(--snel) var(--ease); }
.faq-vraag .accordeon__vraag .icoon { width: 16px; height: 16px; transform: none; }
.faq-vraag__min { display: none; }
.faq-vraag__knop[aria-expanded="true"] .faq-vraag__toggle { background: var(--kleur-limoen); }
.faq-vraag__knop[aria-expanded="true"] .faq-vraag__plus { display: none; }
.faq-vraag__knop[aria-expanded="true"] .faq-vraag__min { display: block; }
.faq-vraag .accordeon__antwoord > div > * { padding: 0 25px 23px; }
.faq-vraag__knop[aria-expanded="true"] { padding-bottom: 10px; }
@media (max-width: 1023px) { .faq { grid-template-columns: 1fr; gap: 32px; } }
@media (max-width: 767px) {
	.faq { gap: 24px; }
	.faq__intro { display: contents; }
	.faq__intro > .eyebrow { margin-bottom: -14px; }
	.faq__intro .blok__tekst { display: none; }
	.faq__vragen { order: 2; gap: 12px; }
	.contactkaart { order: 3; max-width: none; margin-top: 0; padding: 14px 16px; border-radius: 20px; }
	.contactkaart__icoon { width: 44px; height: 44px; }
	.contactkaart__icoon .icoon { width: 20px; height: 20px; }
	.contactkaart__titel { font: 600 15px/1.3 var(--font-tekst); }
	.faq-vraag { border-radius: 16px; }
	.faq-vraag__knop { padding: 18px 20px; font: 600 15px/1.35 var(--font-tekst); }
	.faq-vraag__toggle { width: 30px; height: 30px; }
	.faq-vraag .accordeon__antwoord > div > * { padding: 0 20px 18px; font-size: 14px; line-height: 1.55; }
	.faq-vraag__knop[aria-expanded="true"] { padding-bottom: 8px; }
}

/* ==========================================================================
   SEO-tekst & nieuwsbrief
   ========================================================================== */
.seo-nb { display: grid; gap: 20px; }
.seo-nb--twee { grid-template-columns: 1fr 1fr; }
.seo-tekst { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; padding: 40px; border: 1px solid var(--kleur-lijn); border-radius: 28px; }
.seo-tekst__inhoud { color: var(--kleur-grijs); }
.seo-tekst__meer { display: none; }
.seo-tekst.is-open .seo-tekst__meer { display: block; }
.seo-tekst__knop { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; margin-block: -12px; font: 600 15px/1 var(--font-tekst); text-decoration: underline; text-underline-offset: .2em; }
.seo-tekst__knop .icoon { width: 16px; height: 16px; transition: transform var(--snel) var(--ease); }
.seo-tekst__knop[aria-expanded="true"] .icoon { transform: rotate(180deg); }
@media (min-width: 768px) { .seo-tekst:not(.heeft-meer) .seo-tekst__knop { display: none; } }
.nb-kaart { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 16px; padding: 40px; border-radius: 28px; background: var(--kleur-limoen); }
.nb-kaart__sticker { position: absolute; right: 24px; top: 17px; display: grid; place-items: center; width: 84px; height: 84px; border-radius: 50%; background: var(--kleur-inkt); color: var(--kleur-limoen); font: 600 24px/1 var(--font-display); transform: rotate(-8deg); }
.nb-kaart__titel { max-width: 420px; font: 600 30px/1.2 var(--font-display); letter-spacing: -0.005em; }
.nb-form { width: 100%; }
.nb-form__rij { display: flex; align-items: center; gap: 8px; padding: 6px 6px 6px 20px; border-radius: var(--radius-rond); background: var(--kleur-wit); }
.nb-form__rij:focus-within { box-shadow: 0 0 0 2px var(--kleur-inkt); }
.nb-form__veld { flex: 1 1 auto; min-width: 0; min-height: 44px; padding: 0; border: 0; background: none; font-size: 16px; outline: none; }
.nb-form__veld::placeholder { color: var(--kleur-grijs); opacity: 1; }
.nb-form__veld:focus-visible { box-shadow: none; }
.nb-form__knop { flex: none; }
.nb-form .veld__fout { margin-top: 8px; }
.nb-kaart__regel { display: flex; align-items: center; gap: 6px; font-size: 13px; line-height: 1.35; }
.nb-kaart__regel::before { content: ""; width: 16px; height: 16px; flex: none; background: currentColor; -webkit-mask: var(--hartje) center/contain no-repeat; mask: var(--hartje) center/contain no-repeat; }
.nb-kaart { --hartje: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linejoin='round'%3E%3Cpath d='M12 20s-7-4.4-7-10a4 4 0 0 1 7-2.6A4 4 0 0 1 19 10c0 5.6-7 10-7 10z'/%3E%3C/svg%3E"); }
.nb-kaart.is-gelukt { gap: 14px; }
.nb-code { display: flex; align-items: center; gap: 10px; width: 100%; padding: 8px 8px 8px 20px; border: 2px dashed var(--kleur-inkt); border-radius: 18px; background: var(--kleur-wit); }
.nb-code__waarde { flex: 1 1 auto; font: 600 22px/1.2 var(--font-display); letter-spacing: .06em; }
@media (max-width: 1023px) { .seo-nb--twee { grid-template-columns: 1fr; } }
@media (max-width: 767px) {
	.seo-nb { gap: 16px; }
	.nb-kaart { order: -1; gap: 14px; padding: 24px 22px 28px; border-radius: 24px; }
	.nb-kaart__sticker { right: 14px; top: 14px; width: 64px; height: 64px; font-size: 19px; }
	.nb-kaart__titel { max-width: 260px; font-size: 24px; }
	.nb-kaart__tekst { font-size: 16px; }
	.nb-form__rij { flex-direction: column; align-items: stretch; gap: 14px; padding: 0; background: none; }
	.nb-form__rij:focus-within { box-shadow: none; }
	.nb-form__veld { min-height: 56px; padding: 0 22px; border-radius: var(--radius-rond); background: var(--kleur-wit); }
	.nb-form__veld:focus { box-shadow: 0 0 0 2px var(--kleur-inkt); }
	.nb-form__knop { width: 100%; padding-left: 28px; }
	.nb-kaart__regel { align-items: flex-start; font-size: 12px; }
	.seo-tekst { gap: 12px; padding: 22px 22px 18px; border-radius: 24px; }
	.seo-tekst .h3 { font-size: 19px; line-height: 1.3; }
	.seo-tekst__inhoud { font-size: 14px; line-height: 1.6; }
	.seo-tekst:not(.is-open) .seo-tekst__inhoud > p:first-child { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
	.seo-tekst:not(.is-open) .seo-tekst__inhoud > :not(:first-child) { display: none; }
}

.blok .sectie-kop__tekst { max-width: 680px; }
.faq-vraag:has(.faq-vraag__knop[aria-expanded="true"]) .accordeon__antwoord { grid-template-rows: 1fr; }
.nb-succes { display: grid; gap: 14px; width: 100%; }
.nb-succes .nb-kaart__titel { margin-bottom: 2px; }
.draak-ei__optie { min-width: 0; }
@media (min-width: 1024px) and (max-width: 1279px) { .draak-ei__optie { padding: 40px 32px 44px; } }
@media (min-width: 1280px) and (max-width: 1439px) {
	.cadeaus { gap: 40px; }
	.cadeaus__tekst { flex-basis: 380px; }
	.budget { padding-inline: 20px; }
	.budget__bedrag { font-size: 30px; white-space: nowrap; }
	.hero-kaart { padding-left: 56px; padding-right: 40px; gap: 24px; }
	.hero-kaart__tekst { flex: 1 1 auto; min-width: 0; }
	.hero-beeld { flex: none; width: 528px; zoom: .9; }
	.seizoen { gap: 40px; padding: 48px; }
	.seizoen__foto { flex-basis: 500px; }
}
.hero-kaart--limoen .hero-beeld__vorm { background: var(--kleur-limoen-licht); }
.hero-kaart--limoen .hero-kaart__checks .vink-rond { background: var(--kleur-wit); }

/* Tegel "Alle modellen" (vult een oneven raster aan). */
.cat-tegel--alle { box-shadow: inset 0 0 0 1px var(--kleur-lijn); }
.cat-tegel--alle:hover { box-shadow: inset 0 0 0 1px var(--kleur-inkt); }
.cat-tegel--alle .cat-tegel__icoon { display: grid; place-items: center; width: 72px; height: 72px; margin: auto; border-radius: 50%; background: var(--kleur-inkt); }
.cat-tegel--alle .cat-tegel__icoon .icoon { width: 32px; height: 32px; color: var(--kleur-wit); --icoon-accent: var(--kleur-limoen); }