/* ==========================================================================
   PREMIUM PARTYTENT — DESIGNSYSTEEM 2026
   ==========================================================================

   Zo zit het ontwerp in elkaar. Lees dit voordat je iets wijzigt; de meeste
   aanpassingen hoeven maar op één plek te gebeuren.

   ---------------------------------------------------------------------------
   1. KLEUR
   ---------------------------------------------------------------------------
   Basis blijft zwart/goud uit het logo (--pp-gold, --pp-gold-2, --pp-cream).
   Nieuw is --cx-paper: een warme crème voor "feiten"-secties. Ritme van de
   pagina: donker (sfeer) → crème (feiten) → donker. Puur wit gebruiken we
   nooit als vlak; dat leest als een gat in de pagina.

   ---------------------------------------------------------------------------
   2. HET GOUDEN VLAK  (.cx-blok + .cx-blok__vlak)
   ---------------------------------------------------------------------------
   Het handelsmerk van dit ontwerp: achter een beeld of kaart ligt een gouden
   vlak dat --cx-off naar rechtsonder uitsteekt (9px desktop, 7px mobiel).

   REGELS:
   - Het vlak zit ALTIJD om precies één beeld of één kaart. Nooit om een blok
     waar ook losse tekst in staat, anders loopt het goud achter je tekst door.
   - Het element met .cx-blok moet zelf een border-radius hebben: het vlak erft
     die met `border-radius: inherit`. Vergeet je dat, dan krijg je een
     rechthoek achter een afgeronde kaart.
   - Kinderen die zelf absoluut gepositioneerd zijn (stickers, vlaggetjes)
     krijgen `data-los`, anders duwt de stapelregel ze in de flow.
   - Voor losse elementen (badge, overzichtspaneel) mag het ook met
     box-shadow: 9px 9px 0 goud — zelfde effect, minder markup.

   ---------------------------------------------------------------------------
   3. TYPOGRAFIE
   ---------------------------------------------------------------------------
   Montserrat voor alles, Caveat voor de handgeschreven accenten (.cx-hand).
   - Koppen (.cx-h2, .cx-paginakop) staan in KAPITALEN met het accentwoord in
     een gouden vlak (.cx-mark). Eén accentwoord per kop, meestal het laatste.
   - Elke sectie opent met dezelfde opbouw: handgeschreven regel → kop →
     optionele zin. Gebruik cx_kop() zodat dat ritme overal gelijk is.
   - De handgeschreven regel staat 1.6rem boven de kop: de rotatie eet een
     deel van die ruimte op, vandaar meer dan je zou verwachten.

   ---------------------------------------------------------------------------
   4. KNOPPEN
   ---------------------------------------------------------------------------
   - .cx-btn--goud   hoofdactie: gouden pill, harde zwarte schaduw, pijl naar
                     rechtsboven (via ::after, volgt de tekstkleur).
   - .cx-btn--lijn   tweede keus: zelfde vorm, gouden rand op een derde
                     dekking, witte letters, geen schaduw.
   - .cx-btn--zwart  voor lichte secties.
   - .cx-link        derde niveau: geen knop maar een tekstlink in kapitalen
                     met pijl naar rechts. Gebruik deze naast een hoofdknop.
   Regel: per blok één hoofdactie. Een knop die niets kan doen tonen we niet;
   dan komt er een zin die uitlegt wat er eerst moet gebeuren.

   ---------------------------------------------------------------------------
   5. SECTIES EN RASTERS
   ---------------------------------------------------------------------------
   .cx-sec (donker) / .cx-sec--donker (paneel) / .cx-sec--licht (crème).
   .cx-wrap is de container (max --container, 1340px voor de pakketten).
   Rasters altijd met minmax(0,1fr) en min-width:0 op de kinderen: anders
   duwt lange inhoud de kolom breder dan het scherm.

   ---------------------------------------------------------------------------
   6. MOBIEL
   ---------------------------------------------------------------------------
   De meeste bezoekers komen op hun telefoon. Vaste afspraken:
   - Productkaarten blijven twee naast elkaar, ook op 375px.
   - In de hero staat de tekst boven het beeld.
   - Knoppen over de volle breedte, terug-links eronder.
   - Nooit horizontale overloop: controleer met
     document.documentElement.scrollWidth - clientWidth === 0.

   ---------------------------------------------------------------------------
   7. WAT NIET VAN ONS IS
   ---------------------------------------------------------------------------
   De funnel (.pp-bk-*), de checkout (WooCommerce) en de galerij (.pp-gallery)
   houden hun oorspronkelijke markup, omdat daar JavaScript aan hangt die
   rekent, valideert en verstuurt. Wij zetten daar alleen een nieuwe laag
   overheen. Let op: eigen display-waarden kunnen het hidden-attribuut
   overrulen dat die scripts gebruiken — vandaar .cx-funnel [hidden].
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Caveat:wght@600;700&display=swap');

/* ==========================================================================
   Vormtaal "cx". Volledig los van de live stylesheet: alles begint
   met .cx- of staat binnen .cx-page, zodat de rest van de site niets merkt.
   ========================================================================== */
.cx-page {
	--cx-ink: #100F0E;
	--cx-ink-2: #1A1917;
	--cx-paper: #F2ECDF;      /* warm crème, geen steriel wit */
	--cx-paper-2: #E7DFCD;
	--cx-goud: var(--pp-gold);
	--cx-goud-2: var(--pp-gold-2);
	--cx-off: 9px;            /* hoeveel het vlak achter een blok uitsteekt */
}

/* ---- bouwsteen 1: het verschoven vlak ---------------------------------- */
.cx-blok { position: relative; }
.cx-blok > .cx-blok__vlak { position: absolute; inset: 0; z-index: 0; border-radius: inherit;
	transform: translate(var(--cx-off), var(--cx-off));
	background: linear-gradient(150deg, var(--cx-goud-2), var(--cx-goud) 55%, var(--pp-gold-deep)); }
.cx-blok > *:not(.cx-blok__vlak):not([data-los]) { position: relative; z-index: 1; }

/* ---- bouwsteen 2: handgeschreven tagline ------------------------------- */
.cx-hand { display: block; font-family: 'Caveat', 'Segoe Script', cursive; font-weight: 700;
	font-size: clamp(1.15rem, 1.8vw, 1.5rem); line-height: 1; color: var(--cx-goud-2);
	transform: rotate(-2.5deg); margin-bottom: 1.6rem; }

/* ---- bouwsteen 3: kop met gemarkeerd accentwoord ----------------------- */
.cx-h2 { font-size: clamp(1.85rem, 1.2rem + 2.6vw, 3rem); font-weight: 800; text-transform: uppercase;
	letter-spacing: -.01em; line-height: 1.05; margin: 0; overflow-wrap: break-word; }
.cx-mark { display: inline-block; padding: .04em .32em .12em; border-radius: 4px;
	background: linear-gradient(140deg, var(--cx-goud-2), var(--cx-goud)); color: #14130F;
	box-shadow: 4px 4px 0 rgba(0,0,0,.5); }
.cx-kop { max-width: 720px; margin-bottom: clamp(2rem, 4vw, 3rem); }
.cx-kop--mid { margin-inline: auto; text-align: center; }
.cx-kop--mid .cx-hand { transform: rotate(-2.5deg) translateX(0); }
.cx-h2 + p, .cx-h2 + .cx-kop__tekst, .cx-kop__tekst { margin-top: 1.4rem; }
.cx-kop__tekst { margin-bottom: 0; color: var(--pp-muted); font-size: var(--fs-16); max-width: 58ch; }
.cx-kop--mid .cx-kop__tekst { margin-inline: auto; }

/* ---- bouwsteen 4: knoppen met harde schaduw ---------------------------- */
.cx-btn { display: inline-flex; align-items: center; gap: .55rem; padding: .9rem 1.7rem;
	border-radius: 999px; font-weight: 800; font-size: var(--fs-15, .95rem); letter-spacing: .01em;
	border: 2px solid #14130F; text-decoration: none; cursor: pointer;
	transition: transform .12s var(--ease), box-shadow .12s var(--ease); }
.cx-btn--goud { background: linear-gradient(140deg, var(--cx-goud-2), var(--cx-goud)); color: #14130F;
	box-shadow: 5px 5px 0 #14130F; }
/* pijl naar rechtsboven, als masker zodat hij altijd de tekstkleur volgt */
.cx-btn--goud::after, .cx-btn--zwart::after, .cx-btn--lijn::after { content: ''; flex: none; width: .78em; height: .78em;
	background: currentColor; transition: transform .12s var(--ease);
	-webkit-mask: 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.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17 17 7'/%3E%3Cpath d='M8 7h9v9'/%3E%3C/svg%3E") center/contain no-repeat; mask: 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.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17 17 7'/%3E%3Cpath d='M8 7h9v9'/%3E%3C/svg%3E") center/contain no-repeat; }
.cx-btn--goud:hover::after, .cx-btn--zwart:hover::after, .cx-btn--lijn:hover::after { transform: translate(1px,-1px); }
.cx-btn--goud:hover { transform: translate(3px,3px); box-shadow: 2px 2px 0 #14130F; color: #14130F; }
.cx-btn--lijn { background: transparent; color: rgba(246,243,234,.85); border-color: rgba(196,154,84,.34);
	box-shadow: none; }
.cx-btn--lijn:hover { background: rgba(196,154,84,.1); border-color: rgba(196,154,84,.7); color: var(--cx-goud-2); }
.cx-btn--zwart { background: #14130F; color: var(--cx-goud-2); box-shadow: 5px 5px 0 var(--cx-goud); }
.cx-btn--zwart:hover { transform: translate(3px,3px); box-shadow: 2px 2px 0 var(--cx-goud); color: var(--cx-goud-2); }
.cx-cta-rij { display: flex; gap: 1.4rem 1rem; flex-wrap: wrap; align-items: center; }
/* tweede actie: geen knop maar een tekstlink onder de hoofdknop */
.cx-acties { display: flex; align-items: center; gap: .8rem 1.6rem; flex-wrap: wrap; }
.cx-link { display: inline-flex; align-items: center; gap: .5rem; font-size: .82rem; font-weight: 800;
	letter-spacing: .09em; text-transform: uppercase; color: rgba(246,243,234,.78); text-decoration: none;
	padding-bottom: 3px; border-bottom: 1px solid transparent; transition: color .15s, border-color .15s; }
.cx-link::after { content: ''; flex: none; width: .95em; height: .95em; background: currentColor;
	transition: transform .14s var(--ease);
	-webkit-mask: 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.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h15'/%3E%3Cpath d='M13 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat; mask: 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.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h15'/%3E%3Cpath d='M13 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat; }
.cx-link:hover { color: var(--cx-goud-2); border-bottom-color: rgba(196,154,84,.5); }
.cx-link:hover::after { transform: translateX(3px); }
.cx-sec--licht .cx-link { color: #46413A; }
.cx-sec--licht .cx-link:hover { color: #14130F; border-bottom-color: var(--cx-goud); }

/* ---- secties ----------------------------------------------------------- */
.cx-sec { padding-block: clamp(3.5rem, 7vw, 6rem); position: relative; }
.cx-sec--licht { background: var(--cx-paper); color: #14130F; }
.cx-sec--licht .cx-kop__tekst { color: #5A544A; }
.cx-sec--licht .cx-hand { color: var(--pp-gold-deep); }
.cx-sec--licht .cx-mark { box-shadow: 4px 4px 0 #14130F; }
.cx-sec--donker { background: linear-gradient(180deg, rgba(26,25,23,.94), rgba(20,19,17,.94)); }
.cx-wrap { max-width: var(--container); margin-inline: auto; padding-inline: clamp(1rem, 4vw, 2rem); }

/* ==========================================================================
   2. hero
   ========================================================================== */
.cx-hero { padding-block: clamp(1.8rem, 4vw, 3.4rem); }
.cx-hero__grid { display: grid; grid-template-columns: minmax(0,1.04fr) minmax(0,.96fr);
	gap: clamp(1.6rem, 4vw, 3.4rem); align-items: center; }
.cx-hero__label { display: flex; align-items: center; gap: .7rem; flex-wrap: wrap; margin-bottom: 1.5rem; }
.cx-pill { display: inline-flex; align-items: center; gap: .5rem; color: rgba(246,243,234,.86);
	font-size: .68rem; font-weight: 700; letter-spacing: .15em; text-transform: uppercase;
	padding: .36rem .95rem; border-radius: 999px; border: 1px solid rgba(246,243,234,.45); }
.cx-hero__label .cx-hand { margin: 0; font-size: clamp(1.05rem, 1.6vw, 1.3rem); color: rgba(229,201,131,.85); transform: rotate(-3deg); }
/* de zoekterm zit nu in de pill: die is meteen de H1 */
h1.cx-pill { margin: 0; font-size: .7rem; font-weight: 700; letter-spacing: .15em; line-height: 1.3; }
.cx-hero__display { margin: 0; font-size: clamp(2.45rem, 1.4rem + 3.4vw, 3.3rem); font-weight: 800;
	line-height: 1.14; letter-spacing: -.015em; text-transform: uppercase; max-width: 15ch; }
.cx-hero__display .cx-mark { margin-right: .06em; }
.cx-hero__sub { color: var(--pp-muted); margin: 1.4rem 0 2rem; max-width: 48ch; font-size: var(--fs-15,.95rem); }
.cx-hero__trust { list-style: none; margin: 2rem 0 0; padding: 1.4rem 0 0; display: flex;
	align-items: center; gap: .7rem 1.6rem; flex-wrap: wrap;
	border-top: 1px solid var(--pp-line-soft); font-size: .76rem; color: var(--pp-muted); }
.cx-hero__trust li { display: flex; align-items: center; gap: .45rem; }
.cx-hero__trust li > span:first-child { display: grid; place-content: center; width: 22px; height: 22px;
	border-radius: 7px; background: rgba(196,154,84,.16); color: var(--cx-goud-2); flex: none; }
.cx-hero__trust svg { width: 13px; height: 13px; }
.cx-hero__trust b { color: rgba(246,243,234,.92); font-weight: 700; }

.cx-beeld { position: relative; }
.cx-beeld__kader { position: relative; z-index: 1; border-radius: 30px; overflow: hidden;
	border: 3px solid rgba(20,19,17,.9); box-shadow: 0 24px 60px rgba(0,0,0,.55); }
.cx-beeld__kader video, .cx-beeld__kader img { display: block; width: 100%; aspect-ratio: 9/10; object-fit: cover; }
.cx-beeld .cx-blok__vlak { border-radius: 34px; }

.cx-st { position: absolute; z-index: 3; font-weight: 800; line-height: 1.15; text-align: center;
	box-shadow: 0 10px 26px rgba(0,0,0,.45); text-decoration: none; }
.cx-st--wit { background: #fff; color: #14130F; }
.cx-st--reviews { border-radius: 16px; padding: 1.1rem 1.4rem 1.2rem; min-width: 136px; display: block;
	border: 1px solid rgba(20,19,17,.5);
	box-shadow: 5px 6px 0 var(--cx-goud), 10px 14px 26px rgba(0,0,0,.5); }
.cx-st__groot { display: block; font-size: var(--fs-18); line-height: 1.05; white-space: nowrap; }
.cx-st__klein { display: block; font-size: .62rem; letter-spacing: .12em; text-transform: uppercase; opacity: .85; margin-top: .2rem; }
.cx-st__g { display: block; font: 800 .72rem/1 'Montserrat', system-ui, sans-serif; }
.cx-st__g span:nth-child(1){color:#4285f4} .cx-st__g span:nth-child(2){color:#ea4335}
.cx-st__g span:nth-child(3){color:#fbbc05} .cx-st__g span:nth-child(4){color:#4285f4}
.cx-st__g span:nth-child(5){color:#34a853} .cx-st__g span:nth-child(6){color:#ea4335}
.cx-st__sterren { display: block; color: #f5a623; font-size: .72rem; letter-spacing: .1em; margin: .3rem 0 .15rem; }
.cx-st--wit .cx-st__klein { opacity: .6; }
.cx-st--lb { top: -24px; left: -30px; transform: rotate(-5deg) skewY(-1deg); }
.cx-st--wit:hover { transform: rotate(-5deg) skewY(-1deg) scale(1.03); }

/* ==========================================================================
   3. logobalk
   ========================================================================== */
.cx-logos { padding-block: 3.2rem; border-block: 1px solid var(--pp-line-soft); }
.cx-logos__label { text-align: center; font-size: .68rem; letter-spacing: .18em; text-transform: uppercase;
	color: var(--pp-muted); margin: 0 0 1.2rem; }
.cx-logos__rij { display: flex; align-items: center; justify-content: center; gap: clamp(1.8rem, 5vw, 4rem); flex-wrap: wrap; }
.cx-logos__rij img { height: clamp(48px, 5.5vw, 76px); width: auto; opacity: .95; transition: opacity .2s, transform .2s; }
.cx-logos__rij img:hover { opacity: 1; transform: scale(1.05); }

/* ==========================================================================
   4. de korte versie (licht)
   ========================================================================== */
.cx-tldr { display: grid; grid-template-columns: minmax(0,1.05fr) minmax(0,.95fr); gap: clamp(2rem,5vw,4rem); align-items: center; }
.cx-tldr__badge { display: inline-block; background: #14130F; color: var(--cx-goud-2); font-size: .64rem;
	font-weight: 800; letter-spacing: .22em; padding: .3rem .7rem; border-radius: 4px; margin-bottom: .9rem; }
h2.cx-tldr__lead { font-size: clamp(1.15rem, .9rem + 1vw, 1.55rem); font-weight: 800; line-height: 1.3;
	color: #14130F; margin: 0 0 1.1rem; letter-spacing: -.01em; }
.cx-tldr__lead em { font-style: normal; background: linear-gradient(140deg, var(--cx-goud-2), var(--cx-goud));
	padding: .02em .25em; border-radius: 3px; }
.cx-tldr__tekst { color: #5A544A; font-size: var(--fs-15, .95rem); margin: 0; max-width: 52ch; }
.cx-specs { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); grid-auto-rows: 1fr; gap: 1.1rem; }
.cx-spec { position: relative; padding: 1.15rem 1.2rem 1.3rem; border: 2px solid #14130F; border-radius: 6px;
	box-shadow: 7px 7px 0 #14130F; min-width: 0; }
.cx-spec:nth-child(1) { background: #fff; transform: rotate(-1.2deg); }
.cx-spec:nth-child(2) { background: linear-gradient(140deg, var(--cx-goud-2), var(--cx-goud)); transform: rotate(1deg); }
.cx-spec:nth-child(3) { background: #14130F; box-shadow: 7px 7px 0 var(--cx-goud); transform: rotate(.8deg); }
.cx-spec:nth-child(4) { background: #fff; transform: rotate(-.6deg); }
.cx-spec__label { display: block; font-family: 'Caveat','Segoe Script',cursive; font-size: 1.1rem; font-weight: 700;
	line-height: 1; margin-bottom: .45rem; color: var(--pp-gold-deep); }
.cx-spec:nth-child(2) .cx-spec__label { color: #6B4E18; }
.cx-spec:nth-child(3) .cx-spec__label { color: var(--cx-goud-2); }
.cx-spec__waarde { display: block; font-size: clamp(1.35rem, 1rem + 1.4vw, 1.9rem); font-weight: 800;
	line-height: 1; color: #14130F; letter-spacing: -.02em; }
.cx-spec:nth-child(3) .cx-spec__waarde { color: #fff; }
.cx-spec__waarde small { font-size: .58em; font-weight: 800; letter-spacing: .02em; }
.cx-spec__oud { font-size: .8rem; color: #8A8378; text-decoration: line-through; font-weight: 700; margin-left: .35rem; }
.cx-spec__extra { display: block; margin-top: .3rem; font-size: .7rem; font-weight: 600; color: #6B6459; }
.cx-spec:nth-child(3) .cx-spec__extra { color: rgba(246,243,234,.6); }
.cx-spec__vlag { position: absolute; top: -12px; right: -10px; background: #14130F; color: var(--cx-goud-2);
	font-size: .58rem; font-weight: 800; letter-spacing: .1em; padding: .28rem .6rem; border-radius: 999px;
	border: 2px solid var(--cx-goud); }

/* ==========================================================================
   5. formaten
   ========================================================================== */
.cx-form { display: grid; grid-template-columns: minmax(0,.85fr) minmax(0,1.15fr); gap: clamp(1.6rem,4vw,3rem); align-items: center; }
.cx-form__foto { border-radius: 20px; overflow: hidden; border: 3px solid rgba(20,19,17,.9); }
.cx-form__foto img { width: 100%; aspect-ratio: 3/4; object-fit: cover; }
.cx-form .cx-blok__vlak { border-radius: 24px; }
.cx-maten { display: grid; gap: .55rem; }
.cx-maat { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 1rem;
	padding: .95rem 1.15rem; border: 1px solid var(--pp-line); border-radius: 12px; text-decoration: none;
	background: rgba(46,44,40,.55); transition: border-color .15s, transform .15s, background .15s; }
.cx-maat:hover { border-color: var(--cx-goud); background: rgba(196,154,84,.1); transform: translateX(4px); }
.cx-maat__naam { font-weight: 800; color: var(--pp-white); font-size: var(--fs-16); }
.cx-maat__meta { display: block; font-weight: 400; font-size: .74rem; color: var(--pp-muted); margin-top: .12rem; }
.cx-maat__pers { font-size: .74rem; font-weight: 700; color: var(--cx-goud-2); white-space: nowrap; }
.cx-props { display: flex; gap: .55rem; flex-wrap: wrap; margin-top: 1.4rem; }
.cx-props span { font-size: .7rem; font-weight: 700; letter-spacing: .04em; padding: .32rem .8rem;
	border-radius: 999px; border: 1px solid var(--pp-line); color: var(--pp-muted); }

/* ==========================================================================
   6. pakketten
   ========================================================================== */
.cx-pak-wrap { max-width: 1340px; }
.cx-pak { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 2rem; align-items: stretch; }
.cx-pakkaart { display: flex; }
.cx-pakkaart { border-radius: 16px; width: 100%; }
.cx-pakkaart .cx-blok__vlak { border-radius: 18px; background: linear-gradient(150deg, rgba(196,154,84,.5), rgba(156,120,56,.35)); }
.cx-pakkaart--top .cx-blok__vlak { background: linear-gradient(150deg, var(--cx-goud-2), var(--cx-goud) 55%, var(--pp-gold-deep)); }
.cx-pakkaart__in { background: var(--pp-surface-2); border: 2px solid rgba(20,19,17,.9); border-radius: 16px;
	padding: 2rem 1.9rem 2.1rem; display: flex; flex-direction: column; height: 100%; min-width: 0; }
.cx-pakkaart--top .cx-pakkaart__in { border-color: var(--cx-goud); }
.cx-pakkaart__vlag { position: absolute; top: -13px; left: 1.3rem; z-index: 2;
	background: linear-gradient(140deg, var(--cx-goud-2), var(--cx-goud)); color: #14130F;
	font-size: .6rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase;
	padding: .3rem .8rem; border-radius: 999px; border: 2px solid #14130F; transform: rotate(-2deg); }
.cx-pakkaart__tier { font-family: 'Caveat','Segoe Script',cursive; font-size: 1.35rem; font-weight: 700;
	color: var(--cx-goud-2); line-height: 1; }
.cx-pakkaart__naam { font-size: var(--fs-28); font-weight: 800; margin: .35rem 0 .6rem; text-transform: uppercase; letter-spacing: -.015em; }
.cx-pakkaart__desc { font-size: .92rem; line-height: 1.55; color: var(--pp-muted); margin: 0 0 1.3rem; }
.cx-pakkaart__prijs { display: flex; align-items: baseline; gap: .5rem; margin-bottom: 1.1rem;
	padding-bottom: 1.1rem; border-bottom: 1px solid var(--pp-line-soft); }
.cx-pakkaart__prijs b { font-size: clamp(2rem,1.5rem+1.6vw,2.6rem); font-weight: 800; letter-spacing: -.02em; line-height: 1; }
.cx-pakkaart__prijs s { color: var(--pp-muted); font-size: 1rem; opacity: .7; }
.cx-pakkaart__prijs em { font-style: normal; font-size: .78rem; color: var(--pp-muted); margin-left: auto; }
.cx-feats { list-style: none; margin: 0 0 1.7rem; padding: 0; display: grid; gap: .62rem; flex: 1; }
.cx-feats li { display: grid; grid-template-columns: 22px minmax(0,1fr); gap: .7rem; align-items: start;
	font-size: .94rem; line-height: 1.45; color: var(--pp-white); }
.cx-feats li[data-uit] { color: rgba(207,201,192,.42); text-decoration: line-through;
	text-decoration-color: rgba(207,201,192,.3); }
.cx-feats i { font-style: normal; font-weight: 800; font-size: 1rem; color: var(--cx-goud-2); line-height: 1.35; }
.cx-feats li[data-uit] i { color: rgba(207,201,192,.3); text-decoration: none; }
.cx-pakkaart__in .cx-btn { justify-content: center; padding: .95rem 1.4rem; font-size: 1rem; }
.cx-pak__voet { text-align: center; margin-top: 2.4rem; font-size: .82rem; color: var(--pp-muted); }

/* ==========================================================================
   7. usp's
   ========================================================================== */
.cx-usps { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 1.2rem; }
.cx-usp { border: 1px solid var(--pp-line); border-radius: 14px; padding: 1.4rem 1.3rem; min-width: 0;
	background: rgba(46,44,40,.55); transition: transform .18s var(--ease), border-color .18s; }
.cx-usp:hover { transform: translateY(-4px); border-color: var(--cx-goud); }
.cx-usp__icoon { display: grid; place-content: center; width: 42px; height: 42px; border-radius: 12px;
	background: linear-gradient(140deg, var(--cx-goud-2), var(--cx-goud)); color: #14130F; margin-bottom: .9rem; }
.cx-usp__icoon svg { width: 21px; height: 21px; }
.cx-usp h3 { font-size: var(--fs-16); font-weight: 800; margin: 0 0 .35rem; }
.cx-usp p { font-size: .82rem; color: var(--pp-muted); margin: 0; }

/* ==========================================================================
   8. stappen (licht)
   ========================================================================== */
.cx-stappen { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); grid-auto-rows: 1fr; gap: 1.3rem;
	align-items: stretch; padding-bottom: 1.6rem; }
.cx-stap { position: relative; background: #fff; border: 2px solid #14130F; border-radius: 18px;
	padding: 1.4rem 1.35rem 1.5rem; box-shadow: 8px 8px 0 #14130F; min-width: 0;
	transition: transform .16s var(--ease), box-shadow .16s var(--ease); }
.cx-stap:nth-child(even) { top: 1.6rem; }
.cx-stap:hover { transform: translate(4px,4px); box-shadow: 4px 4px 0 #14130F; }
.cx-stap__nr { display: block; font-size: 2.4rem; font-weight: 800; line-height: 1; letter-spacing: -.03em;
	color: rgba(196,154,84,.5); margin-bottom: .6rem; }
.cx-stap__punt { position: absolute; top: 1.5rem; right: 1.35rem; width: 11px; height: 11px; border-radius: 50%;
	background: linear-gradient(140deg, var(--cx-goud-2), var(--cx-goud)); border: 1px solid #14130F; }
.cx-stap h3 { font-size: var(--fs-16); font-weight: 800; color: #14130F; margin: 0 0 .35rem; }
.cx-stap p { font-size: .82rem; color: #5A544A; margin: 0; }
.cx-stappen__voet { display: flex; align-items: center; justify-content: center; gap: 1.2rem;
	flex-wrap: wrap; margin-top: 2.6rem; }
.cx-stappen__voet span { font-size: .78rem; color: #5A544A; font-weight: 600; }

/* ==========================================================================
   9. reviews
   ========================================================================== */
.cx-reviews__in { margin-top: 1rem; }

/* ==========================================================================
   10. evenementen
   ========================================================================== */
.cx-even { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,.85fr); gap: clamp(1.6rem,4vw,3rem); align-items: center; }
.cx-even__lijst { list-style: none; margin: 0 0 1.8rem; padding: 0; display: grid; gap: .6rem; }
.cx-even__lijst li { display: grid; grid-template-columns: 34px minmax(0,1fr); gap: .8rem; align-items: center;
	padding: .7rem .9rem; border-radius: 12px; border: 1px solid var(--pp-line-soft); background: rgba(46,44,40,.45);
	font-size: .88rem; font-weight: 600; }
.cx-even__ico { display: grid; place-content: center; width: 34px; height: 34px; border-radius: 10px;
	background: rgba(196,154,84,.16); color: var(--cx-goud-2); }
.cx-even__ico svg { width: 17px; height: 17px; }
.cx-even__beeld { border-radius: 20px; overflow: hidden; border: 3px solid rgba(20,19,17,.9); }
.cx-even__beeld img, .cx-even__beeld video { width: 100%; aspect-ratio: 3/4; object-fit: cover; }
.cx-even .cx-blok__vlak { border-radius: 24px; }

/* ==========================================================================
   11. accessoires
   ========================================================================== */
.cx-acc { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 1.2rem; }
/* Zelfde opbouw als op de live site: groot productvlak, naam en prijs
   gecentreerd, knop onderin. Alleen de kleuren volgen de nieuwe vormtaal. */
.cx-acckaart { display: flex; flex-direction: column; border: 2px solid rgba(20,19,17,.9); border-radius: 16px;
	overflow: hidden; background: linear-gradient(180deg, rgba(58,55,50,.75), rgba(38,36,33,.9));
	text-decoration: none; min-width: 0; text-align: center;
	transition: transform .18s var(--ease), border-color .18s, box-shadow .18s var(--ease); }
.cx-acckaart:hover { transform: translateY(-5px); border-color: var(--cx-goud);
	box-shadow: 0 14px 34px rgba(0,0,0,.5); }
.cx-acckaart__foto { aspect-ratio: 1; flex: none; display: flex; align-items: center; justify-content: center;
	padding: 1.2rem; overflow: hidden;
	background: radial-gradient(60% 55% at 50% 45%, rgba(196,154,84,.18), transparent 70%); }
.cx-acckaart__foto img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }
.cx-acckaart__in { padding: 1.1rem 1rem 1.2rem; display: flex; flex-direction: column; gap: .55rem;
	flex: 1; border-top: 1px solid var(--pp-line-soft); }
/* twee regels ruimte voor de naam, zodat prijs en knop overal gelijk liggen */
.cx-acckaart__naam { font-size: .92rem; font-weight: 800; color: var(--pp-white); line-height: 1.3;
	min-height: 2.6em; display: flex; align-items: center; justify-content: center; }
.cx-acckaart__prijs { font-size: .95rem; font-weight: 800; color: var(--cx-goud-2); }
.cx-acckaart__prijs small { font-size: .78rem; font-weight: 400; color: var(--pp-muted); margin-left: .2rem; }
.cx-acckaart__knop { margin-top: auto; padding: .62rem 1rem; border: 1px solid var(--pp-line);
	border-radius: 999px; font-size: .84rem; font-weight: 700; color: var(--pp-white);
	transition: background .18s, border-color .18s; }
.cx-acckaart:hover .cx-acckaart__knop { background: linear-gradient(140deg, var(--cx-goud-2), var(--cx-goud));
	border-color: var(--cx-goud); color: #14130F; }

/* ==========================================================================
   12. galerij
   ========================================================================== */
/* de galerij gebruikt de coverflow van de live site (.pp-gallery) */

/* ==========================================================================
   13. over ons
   ========================================================================== */
.cx-over { display: grid; grid-template-columns: minmax(0,.8fr) minmax(0,1.2fr); gap: clamp(1.6rem,4vw,3.2rem); align-items: center; }
.cx-over__foto { border-radius: 20px; overflow: hidden; border: 3px solid rgba(20,19,17,.9); }
.cx-over__foto img { width: 100%; aspect-ratio: 3/4; object-fit: cover; }
.cx-over .cx-blok__vlak { border-radius: 24px; }
.cx-over__tekst { color: var(--pp-muted); font-size: var(--fs-15,.95rem); }
.cx-over__tekst strong { color: var(--pp-white); }
.cx-over__wie { display: flex; align-items: center; gap: .6rem; margin: 1.2rem 0 1.6rem; font-size: .8rem; }
.cx-over__wie b { color: var(--pp-white); }
.cx-over__wie span { color: var(--pp-muted); }
.cx-stats { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: .9rem; margin-top: 1.8rem; }
.cx-stat { border-top: 2px solid var(--cx-goud); padding-top: .7rem; min-width: 0; }
.cx-stat b { display: block; font-size: clamp(1.2rem,1rem+.8vw,1.6rem); font-weight: 800; line-height: 1; }
.cx-stat span { display: block; font-size: .68rem; color: var(--pp-muted); margin-top: .3rem; }

/* ==========================================================================
   14. faq (licht)
   ========================================================================== */
.cx-faq { display: grid; grid-template-columns: minmax(0,.72fr) minmax(0,1.28fr); gap: clamp(1.8rem,4vw,3.2rem); align-items: start; }
.cx-faq__lijst { border: 2px solid #14130F; border-radius: 18px; overflow: hidden; box-shadow: 9px 9px 0 #14130F; background: #fff; }
.cx-faq details { border-bottom: 2px solid #14130F; }
.cx-faq details:last-child { border-bottom: 0; }
.cx-faq summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem;
	padding: 1.05rem 1.3rem; cursor: pointer; list-style: none; font-weight: 800; font-size: .95rem; color: #14130F; }
.cx-faq summary::-webkit-details-marker { display: none; }
.cx-faq summary::after { content: '+'; flex: none; width: 30px; height: 30px; border-radius: 50%;
	border: 2px solid #14130F; display: grid; place-content: center; font-size: 1.05rem; font-weight: 700;
	line-height: 1; transition: background .15s, color .15s; }
.cx-faq details[open] summary::after { content: '×'; background: linear-gradient(140deg, var(--cx-goud-2), var(--cx-goud)); }
.cx-faq details[open] summary { padding-bottom: .3rem; }
.cx-faq__a { padding: 0 1.3rem 1.15rem; font-size: .88rem; color: #5A544A; }
.cx-faq__a a { color: var(--pp-gold-deep); text-decoration: underline; }
.cx-faq__zij .cx-hand { color: var(--pp-gold-deep); }
.cx-faq__zij .cx-h2 { color: #14130F; }
.cx-faq__zij p { color: #5A544A; font-size: .92rem; margin-bottom: 1.6rem; }
.cx-faq__wa { display: inline-flex; align-items: center; gap: .5rem; font-weight: 800; font-size: .85rem;
	color: #14130F; text-decoration: none; border-bottom: 2px solid var(--cx-goud); padding-bottom: 2px; }
.cx-faq__wa:hover { color: var(--pp-gold-deep); }
.cx-faq__tel { display: block; margin-top: 1rem; font-size: .8rem; color: #5A544A; }
.cx-faq__tel a { color: #14130F; font-weight: 800; }

/* ==========================================================================
   15. slot-cta
   ========================================================================== */
.cx-slot { text-align: center; }
.cx-slot h2 { font-size: clamp(2rem,1.3rem+3vw,3.4rem); text-transform: uppercase; font-weight: 800;
	line-height: 1.08; margin: 0 auto; max-width: 21ch; }
.cx-slot p { color: var(--pp-muted); margin: 1.4rem auto 2rem; max-width: 44ch; }
.cx-acties--mid { justify-content: center; }

/* ==========================================================================
   mobiel
   ========================================================================== */
@media (max-width: 1023px) {
	.cx-usps, .cx-acc, .cx-stappen { grid-template-columns: repeat(2, minmax(0,1fr)); }
	.cx-pak { grid-template-columns: minmax(0,1fr); gap: 2rem; }
	.cx-stap:nth-child(even) { top: 0; }
	.cx-stappen { padding-bottom: 0; }
}
@media (max-width: 899px) {
	.cx-page { --cx-off: 7px; }
	.cx-hero__grid, .cx-tldr, .cx-form, .cx-even, .cx-over, .cx-faq { grid-template-columns: minmax(0,1fr); }
	.cx-hero__grid > *, .cx-tldr > *, .cx-form > *, .cx-even > *, .cx-over > *, .cx-faq > * { min-width: 0; }
	.cx-beeld { margin-top: 2rem; }
	.cx-hero__display { max-width: none; line-height: 1.1; }
	.cx-beeld__kader video, .cx-beeld__kader img { aspect-ratio: 1/1; }
	.cx-st--lb { left: -10px; } .cx-st--rm { right: -10px; } .cx-st--lo { left: -8px; }
	.cx-st--reviews { min-width: 116px; padding: .85rem 1rem .95rem; box-shadow: 4px 5px 0 var(--cx-goud), 8px 12px 20px rgba(0,0,0,.45); }
	.cx-form__wrap { order: 2; margin-top: 1.6rem; }
	.cx-even__beeld { order: -1; }
	.cx-stats { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 767px) {
	/* logo's in een net raster van drie in plaats van een rafelige rij */
	.cx-logos__rij { display: grid; grid-template-columns: repeat(3, minmax(0,1fr));
		gap: .7rem .35rem; place-items: center; }
	.cx-logos__rij img { height: clamp(48px, 15vw, 60px); max-width: 100%; }
}
@media (max-width: 599px) {
	.cx-usps, .cx-stappen, .cx-specs { grid-template-columns: minmax(0,1fr); }
	.cx-acc { grid-template-columns: repeat(2, minmax(0,1fr)); gap: .8rem; }
	.cx-acckaart__foto { padding: .7rem; }
	.cx-acckaart__in { padding: .8rem .7rem .9rem; gap: .4rem; }
	.cx-acckaart__naam { font-size: .8rem; min-height: 3.2em; }
	.cx-acckaart__prijs { font-size: .86rem; }
	.cx-acckaart__prijs small { display: block; margin: .1rem 0 0; }
	.cx-acckaart__knop { padding: .5rem .6rem; font-size: .76rem; }
	.cx-spec { transform: none !important; }
	.cx-faq__lijst { box-shadow: 6px 6px 0 #14130F; }
}
@media (prefers-reduced-motion: reduce) {
	.cx-btn, .cx-stap, .cx-usp, .cx-acckaart { transition: none; }
}


/* ==========================================================================
   Header (header-club.php)
   ========================================================================== */
/* ---- gedeelde tokens: ook de page en de footer lezen hieruit ---- */
:root {
	--cx-ink: #100F0E;
	--cx-paper: #F2ECDF;
	--cx-goud: var(--pp-gold);
	--cx-goud-2: var(--pp-gold-2);
	--cx-off: 9px;
}

/* ================= topbalk ================= */
.cxh-top { background: #0B0A09; border-bottom: 1px solid rgba(196,154,84,.22); }
.cxh-top__in { max-width: var(--container); margin-inline: auto; padding: .5rem clamp(1rem,4vw,2rem);
	display: flex; align-items: center; justify-content: center; gap: .6rem; text-align: center; }
.cxh-top__punt { width: 6px; height: 6px; border-radius: 50%; flex: none;
	background: linear-gradient(140deg, var(--cx-goud-2), var(--cx-goud)); }
.cxh-top p { margin: 0; font-size: .7rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
	color: rgba(246,243,234,.82); }

/* ================= header ================= */
.cxh { position: sticky; top: 0; z-index: 200; background: rgba(16,15,14,.92);
	backdrop-filter: saturate(140%) blur(12px); -webkit-backdrop-filter: saturate(140%) blur(12px);
	border-bottom: 1px solid rgba(196,154,84,.18); }
.cxh__in { max-width: var(--container); margin-inline: auto; padding: .7rem clamp(1rem,4vw,2rem);
	display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 1.4rem; }
.cxh__logo { flex: none; display: block; }
.cxh__logo img { height: 46px; width: auto; }

.cxh__nav { justify-self: center; }
.cxh__nav ul { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 1.6rem; }
.cxh__nav a { position: relative; font-size: .72rem; font-weight: 800; letter-spacing: .13em;
	text-transform: uppercase; color: rgba(246,243,234,.8); text-decoration: none; padding: .35rem 0;
	transition: color .15s; }
.cxh__nav a::after { content: ''; position: absolute; left: 0; right: 100%; bottom: 0; height: 2px;
	background: linear-gradient(90deg, var(--cx-goud-2), var(--cx-goud)); transition: right .18s var(--ease); }
.cxh__nav a:hover { color: var(--pp-white); }
.cxh__nav a:hover::after { right: 0; }

.cxh__cta { display: inline-flex; align-items: center; gap: .5rem; justify-self: end;
	padding: .62rem 1.3rem; border-radius: 999px; border: 2px solid #14130F;
	background: linear-gradient(140deg, var(--cx-goud-2), var(--cx-goud)); color: #14130F;
	font-size: .82rem; font-weight: 800; text-decoration: none; box-shadow: 4px 4px 0 #14130F;
	transition: transform .12s var(--ease), box-shadow .12s var(--ease); }
.cxh__cta::after, .cxh__cta-mob::after { content: ''; flex: none; width: .78em; height: .78em;
	background: currentColor;
	-webkit-mask: var(--cxh-pijl) center/contain no-repeat; mask: var(--cxh-pijl) center/contain no-repeat; }
.cxh__cta:hover { transform: translate(2px,2px); box-shadow: 2px 2px 0 #14130F; color: #14130F; }

.cxh__mob { display: none; grid-column: 2 / -1; justify-self: end; align-items: center; gap: .7rem; }
.cxh__burger { width: 44px; height: 40px; display: grid; place-content: center; gap: 5px;
	background: transparent; border: 1px solid rgba(196,154,84,.4); border-radius: 12px; cursor: pointer; padding: 0; }
.cxh__burger span { display: block; width: 20px; height: 2px; border-radius: 2px; background: var(--cx-goud-2); }

@media (max-width: 979px) {
	.cxh__nav, .cxh__cta { display: none; }
	.cxh__in { grid-template-columns: auto 1fr; }
	.cxh__mob { display: flex; }
	.cxh__logo img { height: 40px; }
	.cxh__cta-mob { display: inline-flex; align-items: center; gap: .45rem; padding: .55rem 1.05rem; border-radius: 999px;
		border: 2px solid #14130F; background: linear-gradient(140deg, var(--cx-goud-2), var(--cx-goud));
		color: #14130F; font-size: .8rem; font-weight: 800; text-decoration: none; box-shadow: 3px 3px 0 #14130F; }
}

/* ==========================================================================
   Footer (footer-club.php)
   ========================================================================== */
.cxf { position: relative; background: linear-gradient(180deg, #131211, #0B0A09); border-top: 1px solid rgba(196,154,84,.2); }
.cxf__wrap { max-width: var(--container); margin-inline: auto; padding-inline: clamp(1rem,4vw,2rem); }
.cxf a { text-decoration: none; }

/* ---- contactband: het signature-vlak, nu als afsluiter ---- */
.cxf__band { padding-block: clamp(2.6rem,5vw,4rem); }
.cxf__kaart { position: relative; border-radius: 20px; }
.cxf__kaart-vlak { position: absolute; inset: 0; z-index: 0; border-radius: 22px;
	transform: translate(var(--cx-off,9px), var(--cx-off,9px));
	background: linear-gradient(150deg, var(--cx-goud-2), var(--cx-goud) 55%, var(--pp-gold-deep)); }
.cxf__kaart-in { position: relative; z-index: 1; border: 2px solid rgba(20,19,17,.9); border-radius: 20px;
	background: linear-gradient(160deg, rgba(58,55,50,.85), rgba(30,28,26,.95));
	padding: clamp(1.8rem,4vw,2.8rem); display: flex; align-items: center; justify-content: space-between;
	gap: 1.6rem; flex-wrap: wrap; }
.cxf__hand { display: block; font-family: 'Caveat','Segoe Script',cursive; font-weight: 700;
	font-size: clamp(1.15rem,1.8vw,1.5rem); line-height: 1; color: var(--cx-goud-2);
	transform: rotate(-2.5deg); margin-bottom: .9rem; }
.cxf__titel { margin: 0; font-size: clamp(1.5rem,1.1rem+1.6vw,2.2rem); font-weight: 800;
	text-transform: uppercase; letter-spacing: -.01em; line-height: 1.1; }
.cxf__sub { margin: .8rem 0 0; color: var(--pp-muted); font-size: .92rem; max-width: 46ch; }
.cxf__acties { display: flex; align-items: center; gap: .8rem 1.5rem; flex-wrap: wrap; }
.cxf__btn { display: inline-flex; align-items: center; gap: .55rem; padding: .9rem 1.7rem; border-radius: 999px;
	border: 2px solid #14130F; background: linear-gradient(140deg, var(--cx-goud-2), var(--cx-goud));
	color: #14130F; font-weight: 800; font-size: .95rem; box-shadow: 5px 5px 0 #14130F;
	transition: transform .12s var(--ease), box-shadow .12s var(--ease); }
.cxf__btn:hover { transform: translate(3px,3px); box-shadow: 2px 2px 0 #14130F; color: #14130F; }
.cxf__btn svg { width: 17px; height: 17px; }
.cxf__link { display: inline-flex; align-items: center; gap: .5rem; font-size: .82rem; font-weight: 800;
	letter-spacing: .09em; text-transform: uppercase; color: rgba(246,243,234,.78);
	padding-bottom: 3px; border-bottom: 1px solid transparent; transition: color .15s, border-color .15s; }
.cxf__link:hover { color: var(--cx-goud-2); border-bottom-color: rgba(196,154,84,.5); }
.cxf__link svg { width: 15px; height: 15px; }

/* ---- kolommen ---- */
.cxf__grid { display: grid; grid-template-columns: minmax(0,1.5fr) repeat(3, minmax(0,1fr));
	gap: clamp(1.6rem,4vw,3rem); padding-bottom: clamp(2rem,4vw,3rem);
	border-top: 1px solid rgba(196,154,84,.16); padding-top: clamp(2rem,4vw,3rem); }
.cxf__logo img { height: 66px; width: auto; }
.cxf__about { margin: 1.1rem 0 1.3rem; color: var(--pp-muted); font-size: .86rem; max-width: 40ch; }
.cxf__socials { display: flex; gap: .6rem; }
.cxf__socials a { display: grid; place-content: center; width: 38px; height: 38px; border-radius: 12px;
	border: 1px solid rgba(196,154,84,.32); color: var(--cx-goud-2); transition: background .15s, border-color .15s; }
.cxf__socials a:hover { background: rgba(196,154,84,.14); border-color: var(--cx-goud); }
.cxf__socials svg { width: 17px; height: 17px; }

.cxf__kop { margin: 0 0 1rem; font-size: .7rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase;
	color: var(--pp-white); display: flex; align-items: center; gap: .55rem; }
.cxf__kop::before { content: ''; width: 16px; height: 2px; border-radius: 2px;
	background: linear-gradient(90deg, var(--cx-goud-2), var(--cx-goud)); }
.cxf__col ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .55rem; }
.cxf__col a, .cxf__col span { font-size: .86rem; color: var(--pp-muted); }
.cxf__col a:hover { color: var(--cx-goud-2); }
.cxf__data li { display: grid; grid-template-columns: 26px minmax(0,1fr); gap: .5rem; align-items: center; }
.cxf__ico { display: grid; place-content: center; width: 26px; height: 26px; border-radius: 8px;
	background: rgba(196,154,84,.14); color: var(--cx-goud-2); }
.cxf__ico svg { width: 13px; height: 13px; }
.cxf__data strong { color: rgba(246,243,234,.9); font-weight: 700; }

/* ---- onderbalk ---- */
.cxf__bar { border-top: 1px solid rgba(196,154,84,.16); }
.cxf__bar-in { max-width: var(--container); margin-inline: auto; padding: 1.1rem clamp(1rem,4vw,2rem);
	display: flex; align-items: center; justify-content: space-between; gap: .6rem 1.5rem; flex-wrap: wrap; }
.cxf__bar p { margin: 0; font-size: .74rem; color: rgba(207,201,192,.6); }
.cxf__bar a { color: var(--cx-goud-2); }

@media (max-width: 899px) {
	.cxf__grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
	.cxf__grid > *:first-child { grid-column: 1 / -1; }
	.cxf__kaart-in { flex-direction: column; align-items: flex-start; }
	.cxf__bar-in { justify-content: center; text-align: center; }
}
@media (max-width: 519px) {
	.cxf__grid { grid-template-columns: minmax(0,1fr); }
}


/* ==========================================================================
   Extra bouwstenen voor de losse pagina's
   ========================================================================== */
.cx-usps--3 { grid-template-columns: repeat(3, minmax(0,1fr)); }
.cx-specs--4 { grid-template-columns: repeat(4, minmax(0,1fr)); }
.cx-punch { margin: 1.4rem 0 1.8rem; font-family: 'Caveat','Segoe Script',cursive; font-weight: 700;
	font-size: clamp(1.3rem,1.9vw,1.65rem); line-height: 1.1; color: var(--cx-goud-2); transform: rotate(-1.5deg); }
.cx-loc { display: inline-flex; align-items: center; gap: .7rem; margin: 1.6rem 0 0;
	padding: .7rem 1.1rem; border-radius: 14px; border: 1px solid var(--pp-line); background: rgba(46,44,40,.5); }
.cx-loc__ico { display: grid; place-content: center; width: 34px; height: 34px; border-radius: 10px;
	background: rgba(196,154,84,.16); color: var(--cx-goud-2); flex: none; }
.cx-loc__ico svg { width: 16px; height: 16px; }
.cx-loc b { display: block; font-size: .88rem; color: var(--pp-white); }
.cx-loc span span { display: block; font-size: .74rem; color: var(--pp-muted); }
/* beeld dat niet bijgesneden mag worden (kaart, plattegrond) */
.cx-even__beeld--vrij img { aspect-ratio: auto; height: auto; object-fit: contain; background: rgba(255,255,255,.04); }
.cx-hero h1.cx-h2 { margin: 0 0 0; }

@media (max-width: 1023px) {
	.cx-usps--3 { grid-template-columns: repeat(2, minmax(0,1fr)); }
	.cx-specs--4 { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 599px) {
	.cx-usps--3, .cx-specs--4 { grid-template-columns: minmax(0,1fr); }
}

/* ---- kop van een subpagina: rustiger dan de homepage-hero ---- */
.cx-paginahero { padding-block: clamp(2.2rem, 4vw, 3.4rem); }
.cx-kruimel { display: flex; align-items: center; gap: .5rem; margin-bottom: 1.1rem;
	font-size: .72rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--pp-muted); }
.cx-kruimel a { color: var(--pp-muted); text-decoration: none; }
.cx-kruimel a:hover { color: var(--cx-goud-2); }
.cx-kruimel span[aria-hidden] { color: rgba(196,154,84,.55); }
.cx-paginakop { max-width: min(100%, 28ch); }
@media (max-width: 599px) { .cx-paginakop { max-width: 100%; } }
.cx-paginahero .cx-kop__tekst { margin-top: 1.3rem; }


/* ==========================================================================
   Contact
   ========================================================================== */
.cx-contact { display: grid; grid-template-columns: minmax(0,1.25fr) minmax(0,.75fr); gap: clamp(1.6rem,4vw,3rem); align-items: start; }
.cx-contact__form { border-radius: 18px; }
.cx-kaart { position: relative; z-index: 1; border: 2px solid rgba(20,19,17,.9); border-radius: 18px;
	background: var(--pp-surface-2); padding: clamp(1.5rem,3vw,2.2rem); }
.cx-h3 { font-size: var(--fs-28); font-weight: 800; text-transform: uppercase; letter-spacing: -.01em;
	line-height: 1.1; margin: 0; }
.cx-kaart .cx-kop__tekst { margin-top: .9rem; }
.cx-formulier { margin-top: 1.6rem; }
/* het FluentForms-formulier in de nieuwe stijl zetten */
.cx-formulier .ff-el-input--label label { font-size: .8rem; font-weight: 700; letter-spacing: .04em; color: var(--pp-white); }
.cx-formulier input[type=text], .cx-formulier input[type=email], .cx-formulier input[type=tel],
.cx-formulier textarea, .cx-formulier select {
	width: 100%; background: rgba(20,19,17,.5); border: 1px solid var(--pp-line); border-radius: 12px;
	padding: .8rem 1rem; color: var(--pp-white); font: inherit; font-size: .92rem; }
.cx-formulier input:focus, .cx-formulier textarea:focus, .cx-formulier select:focus {
	outline: none; border-color: var(--cx-goud); box-shadow: 0 0 0 3px rgba(196,154,84,.16); }
.cx-formulier .ff-btn-submit, .cx-formulier button[type=submit] {
	display: inline-flex; align-items: center; gap: .55rem; padding: .9rem 1.7rem; border-radius: 999px;
	border: 2px solid #14130F; background: linear-gradient(140deg, var(--cx-goud-2), var(--cx-goud));
	color: #14130F !important; font-weight: 800; font-size: .95rem; box-shadow: 5px 5px 0 #14130F; cursor: pointer;
	transition: transform .12s var(--ease), box-shadow .12s var(--ease); }
.cx-formulier .ff-btn-submit:hover, .cx-formulier button[type=submit]:hover {
	transform: translate(3px,3px); box-shadow: 2px 2px 0 #14130F; }

.cx-contact__lead { color: var(--pp-muted); font-size: var(--fs-15,.95rem); margin: 0 0 1.4rem; }
.cx-contact__wa { margin-bottom: 2rem; }
.cx-kop__label { margin: 0 0 1rem; font-size: .7rem; font-weight: 800; letter-spacing: .16em;
	text-transform: uppercase; color: var(--pp-white); display: flex; align-items: center; gap: .55rem; }
.cx-kop__label::before { content: ''; width: 16px; height: 2px; border-radius: 2px;
	background: linear-gradient(90deg, var(--cx-goud-2), var(--cx-goud)); }
.cx-gegevens { list-style: none; margin: 0 0 1.6rem; padding: 0; display: grid; gap: .8rem; }
.cx-gegevens li { display: grid; grid-template-columns: 34px minmax(0,1fr); gap: .8rem; align-items: center; }
.cx-gegevens__ico { display: grid; place-content: center; width: 34px; height: 34px; border-radius: 10px;
	background: rgba(196,154,84,.14); color: var(--cx-goud-2); }
.cx-gegevens__ico svg { width: 16px; height: 16px; }
.cx-gegevens__label { display: block; font-size: .68rem; letter-spacing: .1em; text-transform: uppercase; color: var(--pp-muted); }
.cx-gegevens a, .cx-gegevens__waarde { font-size: .88rem; color: var(--pp-white); overflow-wrap: anywhere; }
.cx-gegevens a:hover { color: var(--cx-goud-2); }
.cx-promo { display: inline-block; margin: 0; padding: .55rem 1.1rem; border-radius: 999px;
	border: 1px dashed rgba(196,154,84,.55); background: rgba(196,154,84,.08);
	font-size: .78rem; font-weight: 700; color: var(--cx-goud-2); }

@media (max-width: 899px) {
	.cx-contact { grid-template-columns: minmax(0,1fr); }
	.cx-contact > * { min-width: 0; }
	.cx-contact__zij { order: -1; }
}


/* ==========================================================================
   FAQ-pagina (alle vragen, per onderwerp)
   ========================================================================== */
.cx-faq__zij--sticky { position: sticky; top: 90px; }
.cx-faq__intro { color: #5A544A; font-size: .92rem; margin: 0 0 1.8rem; }
.cx-kop__label--donker { color: #14130F; }
.cx-sprong { list-style: none; margin: 0 0 1.8rem; padding: 0; display: grid; gap: .3rem; }
.cx-sprong a { display: block; padding: .5rem .8rem; border-radius: 10px; font-size: .86rem; font-weight: 700;
	color: #46413A; text-decoration: none; transition: background .15s, color .15s; }
.cx-sprong a:hover { background: rgba(196,154,84,.16); color: #14130F; }
.cx-faq__groepen { display: grid; gap: 2.4rem; min-width: 0; }
.cx-faq__groepkop { margin: 0 0 1rem; font-size: var(--fs-22); font-weight: 800; text-transform: uppercase;
	letter-spacing: -.01em; color: #14130F; display: flex; align-items: center; gap: .7rem; }
.cx-faq__groepkop::before { content: ''; width: 22px; height: 3px; border-radius: 3px; flex: none;
	background: linear-gradient(90deg, var(--cx-goud-2), var(--cx-goud)); }
.cx-faq__a p:last-child, .cx-faq__a ul:last-child { margin-bottom: 0; }
.cx-faq__a ul { margin: .6rem 0; padding-left: 1.1rem; }
.cx-faq__a li { margin-bottom: .3rem; }
.cx-faq__slot { margin: 0; font-size: .9rem; color: #5A544A; }
.cx-faq__slot a { color: var(--pp-gold-deep); font-weight: 700; text-decoration: underline; }

@media (max-width: 899px) {
	.cx-faq__zij--sticky { position: static; }
	.cx-sprong { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 519px) {
	.cx-sprong { grid-template-columns: minmax(0,1fr); }
}


/* ==========================================================================
   Productpagina
   ========================================================================== */
.cx-pdp { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: clamp(1.6rem,4vw,3rem);
	align-items: start; margin-top: 1.8rem; }
.cx-pdp__kader { border-radius: 20px; }
.cx-pdp__hoofd { position: relative; z-index: 1; border-radius: 20px; overflow: hidden;
	border: 2px solid rgba(20,19,17,.9);
	background: linear-gradient(165deg, #FBF7EE, var(--cx-paper) 60%, var(--cx-paper-2)); }
.cx-pdp__hoofd img { width: 100%; height: 100%; aspect-ratio: 1; object-fit: cover; display: block; }
.cx-pdp__thumbs { position: relative; z-index: 1; display: flex; gap: .6rem; margin-top: .9rem; flex-wrap: wrap; }
.cx-pdp__thumbs button { width: 68px; height: 68px; padding: 0; border-radius: 12px; cursor: pointer;
	overflow: hidden; border: 1px solid var(--pp-line); background: var(--cx-paper); }
.cx-pdp__thumbs button.is-active { border-color: var(--cx-goud); }
.cx-pdp__thumbs img { width: 100%; height: 100%; object-fit: cover; display: block; }

.cx-pdp__info .cx-h2 { margin: .3rem 0 0; }
.cx-pdp__kort { color: var(--pp-muted); font-size: var(--fs-15,.95rem); margin: 1.2rem 0 0; }
.cx-pdp__kort p:last-child { margin-bottom: 0; }
.cx-pdp__prijs { display: flex; align-items: baseline; gap: .6rem; flex-wrap: wrap; margin: 1.6rem 0 .5rem;
	padding-top: 1.4rem; border-top: 1px solid var(--pp-line-soft); }
.cx-pdp__bedrag { font-size: clamp(1.9rem,1.4rem+1.6vw,2.5rem); font-weight: 800; letter-spacing: -.02em;
	line-height: 1; color: var(--cx-goud-2); }
.cx-pdp__per { font-size: .8rem; color: var(--pp-muted); }
.cx-pdp__note { font-size: .82rem; color: var(--pp-muted); margin: 0 0 1.6rem; max-width: 44ch; }
.cx-pdp__note strong { color: var(--pp-white); }
.cx-pdp__info .cx-hero__trust { margin-top: 1.8rem; }

.cx-pdp__detail { display: grid; grid-template-columns: minmax(0,1.35fr) minmax(0,.65fr); gap: clamp(1.6rem,4vw,3rem); align-items: start; }
.cx-prose { color: #46413A; font-size: .95rem; }
.cx-prose h2, .cx-prose h3 { color: #14130F; font-size: var(--fs-22); margin: 1.6rem 0 .6rem; }
.cx-prose ul { padding-left: 1.1rem; }
.cx-prose a { color: var(--pp-gold-deep); text-decoration: underline; }
.cx-speckaart { background: #fff; border: 2px solid #14130F; border-radius: 18px; box-shadow: 7px 7px 0 #14130F;
	padding: 1.4rem 1.5rem 1.6rem; min-width: 0; }
.cx-speclijst { margin: 0; display: grid; gap: .1rem; }
.cx-speclijst > div { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 1rem;
	padding: .6rem 0; border-bottom: 1px solid rgba(20,19,17,.1); }
.cx-speclijst > div:last-child { border-bottom: 0; }
.cx-speclijst dt { font-size: .8rem; font-weight: 700; color: #5A544A; margin: 0; }
.cx-speclijst dd { font-size: .84rem; font-weight: 700; color: #14130F; margin: 0; }

/* pakketten als rijen */
.cx-pkg { display: grid; gap: .8rem; }
.cx-pkg__rij { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 1.2rem; align-items: center;
	padding: 1.15rem 1.4rem; border-radius: 16px; border: 1px solid var(--pp-line); text-decoration: none;
	background: rgba(46,44,40,.55); transition: border-color .15s, transform .15s, background .15s; }
.cx-pkg__rij:hover { border-color: var(--cx-goud); background: rgba(196,154,84,.1); transform: translateX(4px); }
.cx-pkg__rij.is-top { border-color: rgba(196,154,84,.6); background: rgba(196,154,84,.08); }
.cx-pkg__naam { display: flex; align-items: center; gap: .7rem; flex-wrap: wrap; font-size: var(--fs-18);
	font-weight: 800; color: var(--pp-white); }
.cx-pkg__vlag { font-size: .6rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase;
	padding: .22rem .6rem; border-radius: 999px; color: #14130F;
	background: linear-gradient(140deg, var(--cx-goud-2), var(--cx-goud)); }
.cx-pkg__tekst { display: block; margin-top: .25rem; font-size: .84rem; color: var(--pp-muted); }
.cx-pkg__prijs { text-align: right; white-space: nowrap; }
.cx-pkg__prijs b { display: block; font-size: var(--fs-22); font-weight: 800; color: var(--cx-goud-2); line-height: 1; }
.cx-pkg__prijs span { font-size: .7rem; color: var(--pp-muted); }

@media (max-width: 899px) {
	.cx-pdp, .cx-pdp__detail { grid-template-columns: minmax(0,1fr); }
	.cx-pdp > *, .cx-pdp__detail > * { min-width: 0; }
	.cx-pkg__rij { grid-template-columns: minmax(0,1fr); gap: .6rem; }
	.cx-pkg__prijs { text-align: left; }
}


/* ==========================================================================
   Categorie-overzicht: zelfde kaart als op de homepage, ruimer raster
   ========================================================================== */
.cx-acc--hub { grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); }
.cx-acckaart__foto { position: relative; }
/* de bestaande productbadge (bv. "Populair") op de kaart houden */
.cx-acckaart__foto .pp-product__badge, .cx-acckaart__foto [class*="badge"] { position: absolute; top: .6rem; left: .6rem; z-index: 2; }


/* ==========================================================================
   Stadspagina
   ========================================================================== */
.cx-stad { display: grid; grid-template-columns: minmax(0,1.35fr) minmax(0,.65fr); gap: clamp(1.6rem,4vw,3rem); align-items: start; }
.cx-stad__omliggend { margin-top: 2rem; padding: 1.2rem 1.4rem; border-radius: 16px;
	border: 2px solid #14130F; background: #fff; box-shadow: 6px 6px 0 #14130F; }
.cx-stad__omliggend h3 { margin: 0 0 .5rem; font-size: .78rem; font-weight: 800; letter-spacing: .12em;
	text-transform: uppercase; color: #14130F; }
.cx-stad__omliggend p { margin: 0; font-size: .88rem; color: #5A544A; }
.cx-stad__fotos { display: grid; gap: 1.6rem; }
.cx-stad__foto { border-radius: 18px; }
.cx-stad__kader { position: relative; z-index: 1; border-radius: 18px; overflow: hidden;
	border: 2px solid rgba(20,19,17,.9); }
.cx-stad__kader img { width: 100%; aspect-ratio: 4/5; object-fit: cover; display: block; }

/* plaatsen in de buurt */
.cx-chips { display: flex; flex-wrap: wrap; gap: .55rem; }
.cx-chip { padding: .5rem 1rem; border-radius: 999px; border: 1px solid var(--pp-line);
	background: rgba(46,44,40,.55); font-size: .82rem; font-weight: 700; color: var(--pp-white);
	text-decoration: none; transition: border-color .15s, background .15s; }
.cx-chip:hover { border-color: var(--cx-goud); background: rgba(196,154,84,.12); color: var(--cx-goud-2); }
.cx-chips__voet { display: flex; gap: 1.5rem; flex-wrap: wrap; margin: 1.8rem 0 0; }

@media (max-width: 899px) {
	.cx-stad { grid-template-columns: minmax(0,1fr); }
	.cx-stad > * { min-width: 0; }
	.cx-stad__fotos { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 519px) {
	.cx-stad__fotos { grid-template-columns: minmax(0,1fr); }
}


/* ==========================================================================
   Locatie-overzicht
   ========================================================================== */
.cx-specs--3 { grid-template-columns: repeat(3, minmax(0,1fr)); }
.cx-regios { display: grid; gap: clamp(1.8rem,3vw,2.6rem); }
.cx-regio { padding-bottom: clamp(1.6rem,3vw,2.2rem); border-bottom: 1px solid var(--pp-line-soft); }
.cx-regio:last-child { border-bottom: 0; padding-bottom: 0; }
.cx-regio__kop { display: flex; align-items: center; gap: .8rem; margin: 0 0 .5rem;
	font-size: var(--fs-22); font-weight: 800; text-transform: uppercase; letter-spacing: -.01em; }
.cx-regio__kop a { color: var(--pp-white); text-decoration: none; border-bottom: 2px solid transparent; }
.cx-regio__kop a:hover { color: var(--cx-goud-2); border-bottom-color: var(--cx-goud); }
.cx-regio__aantal { display: grid; place-content: center; min-width: 26px; height: 22px; padding: 0 .45rem;
	border-radius: 999px; background: rgba(196,154,84,.16); color: var(--cx-goud-2);
	font-size: .68rem; font-weight: 800; letter-spacing: 0; }
.cx-regio__tekst { margin: 0 0 1.1rem; font-size: .88rem; color: var(--pp-muted); max-width: 70ch; }

@media (max-width: 899px) { .cx-specs--3 { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 599px) { .cx-specs--3 { grid-template-columns: minmax(0,1fr); } }


/* ==========================================================================
   B2B
   ========================================================================== */
.cx-gebruik { display: flex; flex-wrap: wrap; gap: .7rem; }
.cx-gebruik__item { display: inline-flex; align-items: center; gap: .7rem; padding: .7rem 1.1rem;
	border-radius: 14px; border: 1px solid var(--pp-line-soft); background: rgba(46,44,40,.5);
	font-size: .88rem; font-weight: 600; color: var(--pp-white); }
.cx-showcase { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 1.6rem; }
.cx-showcase__item { margin: 0; }
.cx-showcase__wrap { display: block; border-radius: 18px; }
.cx-showcase__kader { display: block; position: relative; z-index: 1; border-radius: 18px; overflow: hidden;
	border: 2px solid rgba(20,19,17,.9); }
.cx-showcase__kader img { width: 100%; aspect-ratio: 4/3; object-fit: cover; display: block; }
.cx-showcase figcaption { margin-top: 1.1rem; font-size: .84rem; color: var(--pp-muted); }

@media (max-width: 899px) {
	.cx-showcase { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 599px) {
	.cx-showcase { grid-template-columns: minmax(0,1fr); }
}


/* ==========================================================================
   Funnel — de markup is gelijk aan live (pp-bk-*), alleen de opmaak is nieuw.
   ========================================================================== */
/* De funnel toont en verbergt regels met het hidden-attribuut. Een eigen
   display-waarde wint daarvan, dus dat expliciet terugzetten. */
.cx-funnel [hidden] { display: none !important; }
.cxh--kaal { position: static; }
.cxh__in--kaal { display: flex; align-items: center; justify-content: space-between; gap: 1.4rem; }
.cxh__kaal-links { display: flex; align-items: center; gap: 1.2rem; }
.cxh__terug { display: inline-flex; align-items: center; gap: .35rem; font-size: .78rem; font-weight: 700;
	letter-spacing: .06em; text-transform: uppercase; color: var(--pp-muted); text-decoration: none; }
.cxh__terug:hover { color: var(--cx-goud-2); }
.cxh__usps { list-style: none; margin: 0; padding: 0; display: flex; gap: 1.4rem; flex-wrap: wrap;
	font-size: .76rem; color: var(--pp-muted); }
.cxh__usps strong { color: var(--pp-white); }
.cxh__sterren { color: var(--cx-goud-2); letter-spacing: .06em; }
@media (max-width: 767px) { .cxh__usps li:not(:first-child) { display: none; } }

.cx-funnel .pp-bk__grid { display: grid; grid-template-columns: minmax(0,1.5fr) minmax(0,.5fr);
	gap: clamp(1.4rem,3vw,2.4rem); align-items: start; }
.cx-funnel .pp-bk__steps { display: grid; gap: 1.2rem; min-width: 0; }

/* stapkaart */
.cx-funnel .pp-bk-step { background: var(--pp-surface-2); border: 2px solid rgba(20,19,17,.9);
	border-radius: 18px; overflow: hidden; }
.cx-funnel .pp-bk-step__head { display: flex; align-items: center; gap: .9rem; padding: 1.1rem 1.4rem; }
/* Het stapnummer staat al in de balk bovenaan; in de kaart zou het dubbelop zijn. */
.cx-funnel .pp-bk-step__num { display: none; }
.cx-funnel .pp-bk-step__title { margin: 0; font-size: var(--fs-18); font-weight: 800; text-transform: uppercase;
	letter-spacing: -.01em; }
.cx-funnel .pp-bk-step__hint { margin: .25rem 0 0; font-size: .8rem; color: var(--pp-muted); }
.cx-funnel .pp-bk-step__opt { font-size: .7rem; font-weight: 700; color: var(--pp-muted); text-transform: none; letter-spacing: 0; }
.cx-funnel .pp-bk-step__lock { color: var(--pp-muted); opacity: .6; }
.cx-funnel .pp-bk-step__body { padding: 1.3rem 1.4rem 1.4rem; }
.cx-funnel .pp-bk-step.is-open { border-color: rgba(196,154,84,.4); }
.cx-funnel .pp-bk-step.is-open .pp-bk-step__head { border-bottom: 1px solid var(--pp-line-soft); }

/* pakketten */
.cx-funnel .pp-bk-pkgs { display: grid; grid-template-columns: minmax(0,1fr); gap: .9rem; margin-top: 0; }
.cx-funnel .pp-bk-pkg { position: relative; padding: 1.3rem 1.5rem; border-radius: 16px; cursor: pointer;
	border: 2px solid rgba(20,19,17,.9); background: rgba(20,19,17,.35);
	display: grid; grid-template-columns: minmax(0,1fr) auto; column-gap: 1.5rem; align-items: start;
	transition: border-color .15s, background .15s, transform .15s; }
.cx-funnel .pp-bk-pkg:hover { transform: translateX(3px); }
/* Uitgelicht pakket even breed als de rest: het accent zit in rand en label. */
.cx-funnel .pp-bk-pkg.is-featured,
.cx-funnel .pp-bk-pkg.is-featured:hover { transform: none; }
.cx-funnel .pp-bk-pkg.is-featured:hover { transform: translateX(3px); }
.cx-funnel .pp-bk-pkg.is-featured { border-color: rgba(196,154,84,.55); }
.cx-funnel .pp-bk-pkg:hover { border-color: rgba(196,154,84,.7); }
.cx-funnel .pp-bk-pkg.is-selected { border-color: var(--cx-goud); background: rgba(196,154,84,.12); }
.cx-funnel .pp-bk-pkg__flag { position: absolute; top: -11px; left: 1.3rem; z-index: 2; padding: .22rem .7rem; border-radius: 999px;
	background: linear-gradient(140deg, var(--cx-goud-2), var(--cx-goud)); color: #14130F; border: 2px solid #14130F;
	font-size: .58rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.cx-funnel .pp-bk-pkg__radio { position: absolute; top: auto; bottom: 1.3rem; right: 1.5rem; left: auto;
	width: 22px; height: 22px; border-radius: 50%; border: 2px solid var(--pp-line); }
.cx-funnel .pp-bk-pkg.is-selected .pp-bk-pkg__radio { border-color: var(--cx-goud); background: radial-gradient(circle, var(--cx-goud) 45%, transparent 46%); }
.cx-funnel .pp-bk-pkg__name { grid-column: 1; grid-row: 1; font-weight: 800; font-size: var(--fs-22);
	text-transform: uppercase; letter-spacing: -.01em; line-height: 1.15; }
.cx-funnel .pp-bk-pkg__price { grid-column: 2; grid-row: 1 / span 2; text-align: right; white-space: nowrap;
	font-size: clamp(1.5rem,1.2rem+1vw,2rem); font-weight: 800; color: var(--cx-goud-2); line-height: 1.1; }
.cx-funnel .pp-bk-pkg__price s { display: block; color: var(--pp-muted); font-size: .82rem; font-weight: 400; opacity: .7; }
.cx-funnel .pp-bk-pkg__desc { grid-column: 1; grid-row: 2; margin-top: .4rem; font-size: .86rem; color: var(--pp-muted); }
.cx-funnel .pp-bk-pkg__details { grid-column: 1; grid-row: 3; margin-top: .8rem; font-size: .8rem; color: var(--pp-muted); }
.cx-funnel .pp-bk-pkg__details summary { cursor: pointer; color: var(--cx-goud-2); font-weight: 600; }
.cx-funnel .pp-bk-pkg__details ul { margin: .5rem 0 0; padding-left: 1.1rem; }

/* tenten + extra's */
.cx-funnel .pp-bk-tents, .cx-funnel .pp-bk-extras { display: grid;
	grid-template-columns: repeat(auto-fill, minmax(150px,1fr)); gap: .8rem; }
.cx-funnel .pp-bk-tent, .cx-funnel .pp-bk-extra { position: relative; padding: .8rem; border-radius: 14px;
	border: 1px solid var(--pp-line); background: rgba(20,19,17,.35); cursor: pointer; text-align: center;
	color: var(--pp-white); font: inherit; transition: border-color .15s, background .15s; }
.cx-funnel .pp-bk-tent:hover, .cx-funnel .pp-bk-extra:hover { border-color: rgba(196,154,84,.7); }
.cx-funnel .pp-bk-tent.is-selected, .cx-funnel .pp-bk-extra.is-selected {
	border-color: var(--cx-goud); background: rgba(196,154,84,.12); }
.cx-funnel .pp-bk-extra__media { display: block; background: none; margin-bottom: .7rem; }
.cx-funnel .pp-bk-extra__media img { width: 100%; aspect-ratio: 4/3; object-fit: contain; display: block; }
.cx-funnel .pp-bk-tent__size, .cx-funnel .pp-bk-extra__name { display: block; font-size: .84rem; font-weight: 800; }
.cx-funnel .pp-bk-tent__price, .cx-funnel .pp-bk-extra__price { display: block; margin-top: .2rem; font-size: .8rem;
	font-weight: 700; color: var(--cx-goud-2); }
.cx-funnel .pp-bk-extra__price s { color: var(--pp-muted); font-weight: 400; opacity: .7; }
.cx-funnel .pp-bk-extra__per { color: var(--pp-muted); font-weight: 400; font-size: .7rem; }
.cx-funnel .pp-bk-extra__tip { display: inline-block; margin-left: .3rem; padding: .1rem .4rem; border-radius: 999px;
	background: linear-gradient(140deg, var(--cx-goud-2), var(--cx-goud)); color: #14130F;
	font-size: .55rem; font-weight: 800; letter-spacing: .08em; }
.cx-funnel .pp-bk-tent__check, .cx-funnel .pp-bk-extra__check { position: absolute; top: .6rem; right: .6rem;
	width: 20px; height: 20px; border-radius: 50%; border: 2px solid var(--pp-line); background: rgba(20,19,17,.6); }
.cx-funnel .pp-bk-tent.is-selected .pp-bk-tent__check,
.cx-funnel .pp-bk-extra.is-selected .pp-bk-extra__check { border-color: var(--cx-goud);
	background: linear-gradient(140deg, var(--cx-goud-2), var(--cx-goud)); }
.cx-funnel .pp-bk-extra__qty { display: inline-flex; align-items: center; gap: .5rem; margin-top: .6rem; }
.cx-funnel .pp-bk-qty__btn { width: 26px; height: 26px; border-radius: 8px; border: 1px solid var(--pp-line);
	background: rgba(20,19,17,.5); color: var(--pp-white); cursor: pointer; font-weight: 800; }
.cx-funnel .pp-bk-extra__num { display: block; margin-top: .6rem; font-size: .72rem; color: var(--pp-muted); }
.cx-funnel .pp-bk-extra__num input { width: 100%; margin-top: .25rem; padding: .45rem .6rem; border-radius: 8px;
	border: 1px solid var(--pp-line); background: rgba(20,19,17,.6); color: var(--pp-white); text-align: center; font: inherit; }

/* formulier */
.cx-funnel .pp-bk-notice { display: flex; align-items: center; gap: .8rem; padding: .9rem 1.1rem; margin-bottom: 1.2rem;
	border-radius: 14px; border: 1px dashed rgba(196,154,84,.5); background: rgba(196,154,84,.08); font-size: .84rem; }
.cx-funnel .pp-bk-notice__icon { color: var(--cx-goud-2); flex: none; }
.cx-funnel .pp-bk-fieldset { border: 0; padding: 0; margin: 0 0 1.4rem; }
.cx-funnel .pp-bk-fieldset legend { padding: 0; font-size: .72rem; font-weight: 800; letter-spacing: .14em;
	text-transform: uppercase; color: var(--pp-white); }
.cx-funnel .pp-bk-fieldset__note { margin: .35rem 0 .9rem; font-size: .76rem; color: var(--pp-muted); }
.cx-funnel .pp-bk-form__row { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: .8rem; }
.cx-funnel .pp-bk-form__row--pchn { grid-template-columns: minmax(0,2fr) minmax(0,1fr); }
.cx-funnel .pp-bk-field { display: block; margin-bottom: .8rem; }
.cx-funnel .pp-bk-field > span { display: block; margin-bottom: .3rem; font-size: .76rem; font-weight: 700; color: var(--pp-muted); }
.cx-funnel .pp-bk-field input, .cx-funnel .pp-bk-field select { width: 100%; padding: .75rem .95rem; border-radius: 12px;
	border: 1px solid var(--pp-line); background: rgba(20,19,17,.5); color: var(--pp-white); font: inherit; font-size: .9rem; }
.cx-funnel .pp-bk-field input:focus, .cx-funnel .pp-bk-field select:focus { outline: none;
	border-color: var(--cx-goud); box-shadow: 0 0 0 3px rgba(196,154,84,.16); }
.cx-funnel .pp-bk-address-status { margin: 0 0 .8rem; font-size: .78rem; color: var(--cx-goud-2); }

/* samenvatting */
.cx-funnel .pp-bk-summary { position: sticky; top: 20px; min-width: 0; }
.cx-funnel .pp-bk-summary__inner { border: 2px solid rgba(20,19,17,.9); border-radius: 18px;
	background: linear-gradient(170deg, rgba(58,55,50,.92), rgba(26,25,23,.97)); padding: 1.5rem 1.5rem 1.7rem;
	box-shadow: 9px 9px 0 var(--cx-goud), 14px 18px 34px rgba(0,0,0,.5); }
.cx-funnel .pp-bk-summary__title { margin: 0 0 1rem; font-size: var(--fs-18); font-weight: 800; text-transform: uppercase; }
.cx-funnel .pp-bk-summary__empty { font-size: .84rem; color: var(--pp-muted); margin: 0; }
.cx-funnel .pp-bk-summary__lines { display: grid; gap: .5rem; font-size: .84rem; }
.cx-funnel .pp-bk-summary__meta { display: grid; gap: .45rem; font-size: .82rem; color: var(--pp-muted); }
/* pas een scheidingslijn zodra er echt regels staan */
.cx-funnel .pp-bk-summary__meta:has(.pp-bk-summary__row:not([hidden])) { margin-top: 1rem; padding-top: 1rem;
	border-top: 1px solid var(--pp-line-soft); }
.cx-funnel .pp-bk-summary__row { display: flex; justify-content: space-between; gap: 1rem; }
.cx-funnel .pp-bk-summary__row--discount { color: var(--pp-ok); }
.cx-funnel .pp-bk-summary__total { display: flex; justify-content: space-between; align-items: baseline;
	margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--pp-line-soft); font-weight: 800; }
.cx-funnel .pp-bk-summary__amount { font-size: clamp(1.5rem,1.2rem+1vw,2rem); color: var(--cx-goud-2); letter-spacing: -.02em; }
.cx-funnel .pp-bk-summary__vat { margin: .2rem 0 1.2rem; font-size: .72rem; color: var(--pp-muted); text-align: right; }
.cx-funnel .pp-bk-calc, .cx-funnel .pp-bk-submit { display: flex; width: 100%; justify-content: center;
	align-items: center; gap: .5rem; padding: .9rem 1.4rem; border-radius: 999px; border: 2px solid #14130F;
	font-weight: 800; font-size: .92rem; cursor: pointer; margin-bottom: .7rem; }
.cx-funnel .pp-bk-calc { background: transparent; border-color: rgba(196,154,84,.34); color: rgba(246,243,234,.85); }
.cx-funnel .pp-bk-calc:hover { background: rgba(196,154,84,.1); border-color: rgba(196,154,84,.7); color: var(--cx-goud-2); }
.cx-funnel .pp-bk-submit { background: linear-gradient(140deg, var(--cx-goud-2), var(--cx-goud)); color: #14130F;
	box-shadow: 5px 5px 0 #14130F; }
.cx-funnel .pp-bk-submit:hover:not(:disabled) { transform: translate(3px,3px); box-shadow: 2px 2px 0 #14130F; }
.cx-funnel .pp-bk-submit:disabled { opacity: .45; cursor: not-allowed; box-shadow: 3px 3px 0 rgba(20,19,17,.6); }
.cx-funnel .pp-bk-summary__reassure { font-size: .74rem; color: var(--pp-muted); text-align: center;
	margin: .9rem 0 0; line-height: 1.5; }
.cx-funnel .pp-bk-summary__reassure strong { color: var(--cx-goud-2); }
.cx-funnel .pp-bk-summary__empty { font-size: .84rem; color: var(--pp-muted); margin: 0; }

@media (max-width: 1023px) {
	.cx-funnel .pp-bk__grid { grid-template-columns: minmax(0,1fr); }
	.cx-funnel .pp-bk-summary { position: static; }
}
@media (max-width: 599px) {
	.cx-funnel .pp-bk-form__row { grid-template-columns: minmax(0,1fr); }
	.cx-funnel .pp-bk-form__row--pchn { grid-template-columns: minmax(0,2fr) minmax(0,1fr); }
	.cx-funnel .pp-bk-tents, .cx-funnel .pp-bk-extras { grid-template-columns: repeat(2, minmax(0,1fr)); }
}


/* ---- stappenbalk boven de funnel ---- */
.cx-stapper { list-style: none; display: flex; align-items: center; gap: .4rem; margin: 0 0 1rem; padding: 0;
	flex-wrap: wrap; }
.cx-stapper__item { flex: 1 1 auto; min-width: 0; }
.cx-stapper__item + .cx-stapper__item { position: relative; }
.cx-stapper__knop { display: flex; align-items: center; gap: .6rem; width: 100%; padding: .6rem .5rem;
	background: none; border: 0; border-bottom: 2px solid var(--pp-line-soft); cursor: pointer;
	color: var(--pp-muted); font: inherit; font-size: .74rem; font-weight: 800; letter-spacing: .08em;
	text-transform: uppercase; text-align: left; transition: color .15s, border-color .15s; }
.cx-stapper__bol { display: grid; place-content: center; width: 26px; height: 26px; flex: none;
	border-radius: 50%; border: 2px solid var(--pp-line); font-size: .74rem; }
.cx-stapper__naam { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cx-stapper__item.is-actief .cx-stapper__knop { color: var(--pp-white); border-bottom-color: var(--cx-goud); }
.cx-stapper__item.is-actief .cx-stapper__bol { border-color: var(--cx-goud); color: #14130F;
	background: linear-gradient(140deg, var(--cx-goud-2), var(--cx-goud)); }
.cx-stapper__item.is-klaar .cx-stapper__knop { color: rgba(246,243,234,.75); border-bottom-color: rgba(196,154,84,.5); }
.cx-stapper__item.is-klaar .cx-stapper__bol { border-color: var(--cx-goud); color: var(--cx-goud-2); font-size: 0; }
.cx-stapper__item.is-klaar .cx-stapper__bol::after { content: '✓'; font-size: .8rem; }
.cx-stapper__item.is-vergrendeld .cx-stapper__knop { opacity: .55; }

/* geruststellingsbalk */
.cx-gerust { list-style: none; display: flex; flex-wrap: wrap; gap: .5rem 1.6rem; margin: 0 0 1.8rem; padding: .8rem 1.2rem;
	border-radius: 999px; background: rgba(196,154,84,.1); border: 1px solid rgba(196,154,84,.28);
	font-size: .76rem; font-weight: 700; color: var(--cx-goud-2); justify-content: center; }
.cx-gerust li { display: flex; align-items: center; gap: .4rem; }
.cx-gerust li::before { content: '✓'; font-weight: 800; }
.cx-gerust__score::before { content: none; }
.cx-gerust__sterren { color: var(--cx-goud-2); letter-spacing: .04em; font-size: .72rem; }
.cx-gerust__score strong { color: var(--pp-white); }

@media (max-width: 767px) {
	.cx-stapper__naam { display: none; }
	.cx-stapper__knop { justify-content: center; padding: .5rem .2rem; }
	.cx-gerust { border-radius: 16px; justify-content: flex-start; }
}

@media (max-width: 599px) {
	.cx-funnel .pp-bk-pkg { grid-template-columns: minmax(0,1fr); }
	.cx-funnel .pp-bk-pkg__price { grid-column: 1; grid-row: 2; text-align: left; margin-top: .3rem; }
	.cx-funnel .pp-bk-pkg__price s { display: inline; margin-right: .4rem; }
	.cx-funnel .pp-bk-pkg__desc { grid-row: 3; }
	.cx-funnel .pp-bk-pkg__details { grid-row: 4; }
}


/* ---- één stap tegelijk ---- */
.cx-funnel .pp-bk-step { display: none; }
.cx-funnel .pp-bk-step.cx-actueel { display: block; }
.cx-funnel .pp-bk-step.cx-actueel { border-color: rgba(196,154,84,.4); }
.cx-stapnav { display: flex; align-items: center; justify-content: space-between; gap: 1rem;
	margin-top: 1.6rem; padding-top: 1.3rem; border-top: 1px solid var(--pp-line-soft); }
.cx-stapnav__door { display: inline-flex; align-items: center; gap: .5rem; padding: .85rem 1.7rem;
	border-radius: 999px; border: 2px solid #14130F; background: linear-gradient(140deg, var(--cx-goud-2), var(--cx-goud));
	color: #14130F; font: inherit; font-weight: 800; font-size: .95rem; cursor: pointer;
	box-shadow: 5px 5px 0 #14130F; transition: transform .12s var(--ease), box-shadow .12s var(--ease); }
.cx-stapnav__door:hover:not(:disabled) { transform: translate(3px,3px); box-shadow: 2px 2px 0 #14130F; }
.cx-stapnav__door:disabled { opacity: .45; cursor: not-allowed; box-shadow: 3px 3px 0 rgba(20,19,17,.6); }
.cx-stapnav__terug { background: none; border: 0; padding: .4rem 0; color: var(--pp-muted); cursor: pointer;
	font: inherit; font-size: .82rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.cx-stapnav__terug:hover { color: var(--cx-goud-2); }
.cx-stapnav__hint { font-size: .8rem; color: var(--pp-muted); }
.cx-stapper__knop:disabled { cursor: not-allowed; }


/* ---- tentmaten als rijen ---- */
.cx-funnel .pp-bk-tents { grid-template-columns: minmax(0,1fr); gap: .7rem; }
.cx-funnel .pp-bk-tent { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center;
	column-gap: 1.2rem; padding: 1rem 1.3rem; text-align: left; border-radius: 14px; }
.cx-funnel .pp-bk-tent__size { grid-column: 1; grid-row: 1; font-size: var(--fs-18); font-weight: 800; }
.cx-funnel .pp-bk-tent__gasten { grid-column: 1; grid-row: 2; margin-top: .2rem; font-size: .88rem;
	font-weight: 600; color: var(--cx-goud-2); }
.cx-funnel .pp-bk-tent__price { grid-column: 2; grid-row: 1 / span 2; margin-top: 0; font-size: var(--fs-18);
	white-space: nowrap; padding-right: 2rem; }
.cx-funnel .pp-bk-tent__check { top: 50%; right: 1.2rem; transform: translateY(-50%); }

/* knop die nog niet kan: gedempt, maar wel klikbaar (brengt je naar de stap) */
.cx-funnel .pp-bk-calc.cx-wacht { opacity: .6; border-style: dashed; }
.cx-funnel .pp-bk-calc.cx-wacht:hover { opacity: 1; }

/* rustige uitleg in het overzicht zolang er nog geen knop nodig is */
.cx-funnel .cx-overzicht-hint { margin: 0 0 .2rem; font-size: .78rem; color: var(--pp-muted); text-align: center; }
.cx-funnel [hidden] { display: none !important; }


/* ==========================================================================
   Footer van de funnel: rustig afsluiten, niets om op weg te klikken
   ========================================================================== */
.cxf-kaal { border-top: 1px solid rgba(196,154,84,.2); background: #0B0A09; margin-top: clamp(3rem,6vw,5rem); }
.cxf-kaal__in { max-width: var(--container); margin-inline: auto; padding: 1.6rem clamp(1rem,4vw,2rem);
	display: grid; gap: .8rem; justify-items: center; text-align: center; }
.cxf-kaal__links { display: flex; flex-wrap: wrap; justify-content: center; gap: .4rem 1.4rem; }
.cxf-kaal__links a { font-size: .78rem; color: var(--pp-muted); text-decoration: none; }
.cxf-kaal__links a:hover { color: var(--cx-goud-2); }
.cxf-kaal__copy { margin: 0; font-size: .72rem; color: rgba(207,201,192,.55); }
/* geen zwevende WhatsApp-knop tijdens het boeken */
.cx-funnel ~ .ppt-wa-float, body:has(.cx-funnel) .ppt-wa-float { display: none; }


/* ==========================================================================
   Funnel op mobiel — de meeste bezoekers komen hier op hun telefoon binnen
   ========================================================================== */
@media (max-width: 899px) {
	/* gouden vlak achter het overzicht subtieler */
	.cx-funnel .pp-bk-summary__inner { box-shadow: 5px 5px 0 var(--cx-goud), 10px 14px 24px rgba(0,0,0,.45);
		padding: 1.2rem 1.2rem 1.4rem; }
	.cx-funnel .pp-bk-summary { margin-top: 1.4rem; }
}

@media (max-width: 599px) {
	.cx-funnel .pp-bk-step__head { padding: 1rem 1.1rem; }
	.cx-funnel .pp-bk-step__body { padding: 1.1rem 1.1rem 1.2rem; }

	/* pakketkaart: naam, prijs, tekst, dan het rondje rechtsonder */
	.cx-funnel .pp-bk-pkg { padding: 1.1rem 1.2rem 3.2rem; }
	.cx-funnel .pp-bk-pkg__name { font-size: var(--fs-18); }
	.cx-funnel .pp-bk-pkg__price { font-size: 1.5rem; }
	.cx-funnel .pp-bk-pkg__radio { bottom: 1.1rem; right: 1.2rem; }
	.cx-funnel .pp-bk-pkg__flag { left: 1.1rem; }

	/* tentmaten: maat en personen links, prijs rechts */
	.cx-funnel .pp-bk-tent { padding: .9rem 3rem .9rem 1.1rem; }
	.cx-funnel .pp-bk-tent__size { font-size: var(--fs-16); }
	.cx-funnel .pp-bk-tent__price { font-size: var(--fs-16); padding-right: 0; }
	.cx-funnel .pp-bk-tent__check { right: .9rem; }

	/* extra's twee naast elkaar */
	.cx-funnel .pp-bk-extras { grid-template-columns: repeat(2, minmax(0,1fr)); gap: .7rem; }

	/* knoprij onder de stap */
	.cx-stapnav { flex-wrap: wrap; gap: .8rem; }
	.cx-stapnav__door { width: 100%; justify-content: center; order: -1; }
	.cx-stapnav__terug { width: 100%; text-align: center; }

	/* stappenbalk compact: alleen bollen, actieve stap met naam */
	.cx-stapper { gap: .2rem; }
	.cx-stapper__item.is-actief .cx-stapper__naam { display: block; font-size: .62rem; }
	.cx-stapper__item.is-actief { flex: 2 1 auto; }
}


/* ---- kop en funnel dichter op elkaar ---- */
.cx-funnel .cx-paginahero { padding-block: clamp(1.8rem,3vw,2.6rem) clamp(1rem,2vw,1.4rem); }
.cx-funnel .pp-bk { padding-block: 0 clamp(2.5rem,5vw,4rem); }
.cx-funnel .cx-stapper { margin-top: .4rem; }


/* ==========================================================================
   Checkout (/boeking-afronden/)
   ========================================================================== */
.cx-stapper--klaar .cx-stapper__knop { cursor: default; }
.cx-ck__body { margin-top: 1.6rem; }
.cx-checkout .woocommerce { display: block; }
.cx-checkout form.checkout { display: grid; grid-template-columns: minmax(0,1.25fr) minmax(0,.75fr);
	gap: clamp(1.4rem,3vw,2.4rem); align-items: start; }
.cx-checkout #customer_details { min-width: 0; }
.cx-checkout #customer_details, .cx-checkout .woocommerce-checkout-review-order {
	background: var(--pp-surface-2); border: 2px solid rgba(20,19,17,.9); border-radius: 18px;
	padding: clamp(1.3rem,3vw,1.9rem); }
.cx-checkout #order_review { position: sticky; top: 20px; background: var(--pp-surface-2);
	border: 2px solid rgba(20,19,17,.9); border-radius: 18px; padding: clamp(1.3rem,3vw,1.9rem);
	box-shadow: 9px 9px 0 var(--cx-goud), 14px 18px 34px rgba(0,0,0,.5); }
.cx-checkout #order_review_heading { margin: 0 0 1.1rem; padding-bottom: .9rem;
	border-bottom: 1px solid var(--pp-line-soft); }
.cx-checkout .woocommerce-checkout-review-order { background: none; border: 0; padding: 0; }
.cx-checkout h3, .cx-checkout .woocommerce-billing-fields h3 { font-size: var(--fs-18); font-weight: 800;
	text-transform: uppercase; letter-spacing: -.01em; margin: 0 0 1.1rem; }
.cx-checkout label { font-size: .76rem; font-weight: 700; color: var(--pp-muted); }
.cx-checkout .form-row { margin-bottom: .9rem; }
.cx-checkout input[type=text], .cx-checkout input[type=email], .cx-checkout input[type=tel],
.cx-checkout textarea, .cx-checkout select, .cx-checkout .select2-selection {
	width: 100%; padding: .75rem .95rem; border-radius: 12px; border: 1px solid var(--pp-line);
	background: rgba(20,19,17,.5); color: var(--pp-white); font: inherit; font-size: .9rem; }
.cx-checkout input:focus, .cx-checkout textarea:focus, .cx-checkout select:focus {
	outline: none; border-color: var(--cx-goud); box-shadow: 0 0 0 3px rgba(196,154,84,.16); }
.cx-checkout table.shop_table { width: 100%; border-collapse: collapse; font-size: .88rem; }
.cx-checkout table.shop_table th, .cx-checkout table.shop_table td { padding: .55rem 0; text-align: left;
	border-bottom: 1px solid var(--pp-line-soft); }
.cx-checkout table.shop_table tfoot .order-total th, .cx-checkout table.shop_table tfoot .order-total td {
	border-bottom: 0; padding-top: 1rem; font-size: var(--fs-18); font-weight: 800; color: var(--cx-goud-2); }
.cx-checkout #place_order, .cx-checkout .button.alt {
	display: block; width: 100%; margin-top: 1.2rem; padding: 1rem 1.6rem; border-radius: 999px;
	border: 2px solid #14130F; background: linear-gradient(140deg, var(--cx-goud-2), var(--cx-goud));
	color: #14130F !important; font: inherit; font-weight: 800; font-size: 1rem; cursor: pointer;
	box-shadow: 5px 5px 0 #14130F; transition: transform .12s var(--ease), box-shadow .12s var(--ease); }
.cx-checkout #place_order:hover { transform: translate(3px,3px); box-shadow: 2px 2px 0 #14130F; }
.cx-checkout .woocommerce-privacy-policy-text, .cx-checkout .woocommerce-terms-and-conditions-wrapper {
	font-size: .78rem; color: var(--pp-muted); }
.cx-checkout .woocommerce-info, .cx-checkout .woocommerce-error, .cx-checkout .woocommerce-message {
	border-radius: 14px; border: 1px solid var(--pp-line); background: rgba(196,154,84,.08);
	padding: .9rem 1.1rem; font-size: .86rem; list-style: none; margin: 0 0 1.2rem; }
/* WooCommerce zet in zo'n melding zijn eigen knop ('Bekijk winkelwagen'), die
   standaard wit is. Hem meteen in de vormtaal trekken, anders springt er een
   witte blok uit een verder zwart/gouden pagina. */
.cx-checkout .woocommerce-info .button, .cx-checkout .woocommerce-error .button,
.cx-checkout .woocommerce-message .button, .cx-checkout .wc-forward {
	display: inline-flex; align-items: center; gap: .4rem; padding: .5rem 1.1rem; border-radius: 999px;
	border: 1px solid var(--cx-goud); background: transparent; color: var(--cx-goud-2) !important;
	font: inherit; font-weight: 700; font-size: .82rem; text-decoration: none; cursor: pointer;
	box-shadow: none; transition: background .15s var(--ease), color .15s var(--ease); }
.cx-checkout .woocommerce-message .button:hover, .cx-checkout .wc-forward:hover {
	background: var(--cx-goud); color: #14130F !important; }

@media (max-width: 1023px) {
	.cx-checkout form.checkout { grid-template-columns: minmax(0,1fr); }
	.cx-checkout #order_review { position: static;
		box-shadow: 5px 5px 0 var(--cx-goud), 10px 14px 24px rgba(0,0,0,.45); }
}

/* ==========================================================================
   Bevestiging (thankyou.php)
   ========================================================================== */
.cx-bevestiging .pp-thanks { max-width: 720px; margin-inline: auto; text-align: center; }
.cx-bevestiging .pp-thanks__title { font-size: clamp(1.9rem,1.3rem+2.4vw,2.8rem); font-weight: 800;
	text-transform: uppercase; letter-spacing: -.015em; line-height: 1.1; margin: 0 0 1rem; }
.cx-bevestiging .pp-thanks__lead { color: var(--pp-muted); font-size: var(--fs-16); margin: 0 auto 2rem; max-width: 52ch; }
.cx-bevestiging .pp-thanks__lead strong { color: var(--pp-white); }
.cx-bevestiging .pp-thanks__card { position: relative; text-align: left; border: 2px solid rgba(20,19,17,.9);
	border-radius: 18px; background: var(--pp-surface-2); padding: clamp(1.3rem,3vw,1.8rem);
	box-shadow: 9px 9px 0 var(--cx-goud), 14px 18px 34px rgba(0,0,0,.5); margin-bottom: 2.6rem; }
.cx-bevestiging .pp-thanks__card-head { display: flex; align-items: baseline; justify-content: space-between;
	gap: 1rem; margin-bottom: 1rem; padding-bottom: .9rem; border-bottom: 1px solid var(--pp-line-soft);
	font-size: .74rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.cx-bevestiging .pp-thanks__ordernr { color: var(--cx-goud-2); }
.cx-bevestiging .pp-thanks__rows { margin: 0; display: grid; gap: .5rem; font-size: .9rem; }
.cx-bevestiging .pp-thanks__rows > div { display: flex; justify-content: space-between; gap: 1rem; }
.cx-bevestiging .pp-thanks__rows dt { color: var(--pp-muted); margin: 0; }
.cx-bevestiging .pp-thanks__rows dd { margin: 0; text-align: right; }
.cx-bevestiging .pp-thanks__total { margin-top: .6rem; padding-top: .8rem; border-top: 1px solid var(--pp-line-soft);
	font-weight: 800; font-size: var(--fs-18); }
.cx-bevestiging .pp-thanks__total dd { color: var(--cx-goud-2); }
.cx-bevestiging .pp-thanks__note { margin: 1.1rem 0 0; font-size: .78rem; color: var(--pp-muted); }
.cx-bevestiging .pp-thanks__steps { display: grid; grid-template-columns: repeat(3, minmax(0,1fr));
	gap: 1.1rem; text-align: left; margin-bottom: 2.4rem; }
.cx-bevestiging .pp-thanks__steps > * { border: 1px solid var(--pp-line); border-radius: 16px;
	background: rgba(46,44,40,.55); padding: 1.2rem 1.2rem 1.3rem; }
.cx-bevestiging .pp-thanks__step-ico { display: grid; place-content: center; width: 38px; height: 38px;
	border-radius: 12px; background: linear-gradient(140deg, var(--cx-goud-2), var(--cx-goud));
	color: #14130F; margin-bottom: .8rem; }
.cx-bevestiging .pp-thanks__step-ico svg { width: 19px; height: 19px; }
.cx-bevestiging .pp-thanks__steps h3 { font-size: var(--fs-16); font-weight: 800; margin: 0 0 .3rem; }
.cx-bevestiging .pp-thanks__steps p { font-size: .84rem; color: var(--pp-muted); margin: 0; }
.cx-bevestiging .pp-thanks__contact-btns { display: flex; justify-content: center; gap: .8rem 1.2rem;
	flex-wrap: wrap; margin: 1rem 0 1.4rem; }
.cx-bevestiging .pp-thanks__home { font-size: .82rem; font-weight: 800; letter-spacing: .08em;
	text-transform: uppercase; color: var(--pp-muted); text-decoration: none; }
.cx-bevestiging .pp-thanks__home:hover { color: var(--cx-goud-2); }

@media (max-width: 767px) {
	.cx-bevestiging .pp-thanks__steps { grid-template-columns: minmax(0,1fr); }
	.cx-bevestiging .pp-thanks__card { box-shadow: 5px 5px 0 var(--cx-goud), 10px 14px 24px rgba(0,0,0,.45); }
}


/* ==========================================================================
   Blog
   ========================================================================== */
.cx-chips--tabs { margin-bottom: 2rem; }
.cx-chip.is-actief { border-color: var(--cx-goud); background: linear-gradient(140deg, var(--cx-goud-2), var(--cx-goud)); color: #14130F; }
.cx-posts { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 1.6rem; }
.cx-post { display: flex; flex-direction: column; border: 2px solid rgba(20,19,17,.9); border-radius: 18px;
	overflow: hidden; background: rgba(46,44,40,.55); text-decoration: none; min-width: 0;
	transition: transform .18s var(--ease), border-color .18s, box-shadow .18s var(--ease); }
.cx-post:hover { transform: translateY(-5px); border-color: var(--cx-goud); box-shadow: 0 14px 34px rgba(0,0,0,.5); }
.cx-post__beeld { position: relative; display: block; background: rgba(255,255,255,.04); }
.cx-post__beeld img { width: 100%; aspect-ratio: 3/2; object-fit: cover; display: block; }
.cx-post__cat { position: absolute; top: .8rem; left: .8rem; padding: .28rem .8rem; border-radius: 999px;
	background: linear-gradient(140deg, var(--cx-goud-2), var(--cx-goud)); color: #14130F; border: 2px solid #14130F;
	font-size: .6rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.cx-post__in { display: flex; flex-direction: column; gap: .5rem; padding: 1.2rem 1.3rem 1.4rem; flex: 1; }
.cx-post__titel { font-size: var(--fs-18); font-weight: 800; color: var(--pp-white); line-height: 1.25; }
.cx-post__meta { margin-top: auto; font-size: .76rem; color: var(--pp-muted); }

.cx-paginatie { margin-top: 2.6rem; }
.cx-paginatie .nav-links { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem; }
.cx-paginatie .page-numbers { display: grid; place-content: center; min-width: 42px; height: 42px; padding: 0 .8rem;
	border-radius: 999px; border: 1px solid var(--pp-line); color: var(--pp-white); text-decoration: none;
	font-size: .86rem; font-weight: 700; }
.cx-paginatie .page-numbers:hover { border-color: var(--cx-goud); color: var(--cx-goud-2); }
.cx-paginatie .page-numbers.current { background: linear-gradient(140deg, var(--cx-goud-2), var(--cx-goud));
	color: #14130F; border-color: #14130F; }
.cx-paginatie .screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

/* brede prose op lichte achtergrond (voorwaarden, privacy) */
.cx-prose--breed { max-width: 78ch; margin-inline: auto; }
.cx-prose--breed h2, .cx-prose--breed h3 { text-transform: none; letter-spacing: 0; }

@media (max-width: 899px) { .cx-posts { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 599px) { .cx-posts { grid-template-columns: minmax(0,1fr); } }


/* ==========================================================================
   Blogartikel
   ========================================================================== */
.cx-postkop { position: relative; padding-block: clamp(3rem,7vw,5.5rem); overflow: hidden; }
.cx-postkop__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.cx-postkop__waas { position: absolute; inset: 0; z-index: 1;
	background: linear-gradient(180deg, rgba(16,15,14,.72), rgba(16,15,14,.93)); }
.cx-postkop__in { position: relative; z-index: 2; }
.cx-postkop__cat { display: inline-block; margin-bottom: .9rem; padding: .3rem .9rem; border-radius: 999px;
	background: linear-gradient(140deg, var(--cx-goud-2), var(--cx-goud)); color: #14130F;
	font-size: .62rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.cx-postkop h1 { font-size: clamp(1.9rem,1.3rem+2.6vw,3rem); font-weight: 800; text-transform: uppercase;
	letter-spacing: -.015em; line-height: 1.1; margin: 0 0 1.1rem; max-width: 22ch; }
.cx-postkop .cx-kruimel { margin: 0; }

.cx-postauteur { display: flex; align-items: center; gap: .7rem; padding-block: 1.2rem;
	font-size: .82rem; color: var(--pp-muted); border-bottom: 1px solid var(--pp-line-soft); }
.cx-postauteur strong { color: var(--pp-white); }
.cx-postauteur__ico { display: grid; place-content: center; width: 34px; height: 34px; border-radius: 50%;
	background: rgba(196,154,84,.16); color: var(--cx-goud-2); flex: none; }

.cx-postbody { padding-block: clamp(2rem,4vw,3rem); }
.cx-post__grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,.34fr); gap: clamp(1.6rem,4vw,3rem); align-items: start; }
.cx-post__hoofd { min-width: 0; }
.cx-post__prose { color: var(--pp-muted); font-size: var(--fs-16); }
.cx-post__prose h2, .cx-post__prose h3 { color: var(--pp-white); margin-top: 2rem; }
.cx-post__prose a { color: var(--cx-goud-2); text-decoration: underline; }
.cx-post__prose img { border-radius: 14px; }

.cx-tldr { border-left: 3px solid var(--cx-goud); border-radius: 0 14px 14px 0;
	background: rgba(196,154,84,.08); padding: 1.1rem 1.3rem; margin-bottom: 1.8rem; }
.cx-tldr__label { display: block; margin-bottom: .35rem; font-size: .66rem; font-weight: 800;
	letter-spacing: .14em; text-transform: uppercase; color: var(--cx-goud-2); }
.cx-tldr__tekst { margin: 0; font-size: .95rem; color: var(--pp-white); }

.cx-toc { border: 1px solid var(--pp-line); border-radius: 14px; background: rgba(46,44,40,.5);
	padding: .9rem 1.1rem; margin-bottom: 1.8rem; }
.cx-toc summary { display: flex; align-items: center; justify-content: space-between; cursor: pointer;
	list-style: none; font-size: .74rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.cx-toc summary::-webkit-details-marker { display: none; }
.cx-toc__pijl { width: 8px; height: 8px; border-right: 2px solid var(--cx-goud-2);
	border-bottom: 2px solid var(--cx-goud-2); transform: rotate(45deg); transition: transform .2s; }
.cx-toc[open] .cx-toc__pijl { transform: rotate(-135deg); }
.cx-toc ol { list-style: none; margin: .9rem 0 0; padding: 0; display: grid; gap: .4rem; }
.cx-toc a { display: flex; gap: .5rem; font-size: .84rem; color: var(--pp-muted); text-decoration: none; }
.cx-toc a:hover { color: var(--cx-goud-2); }
.cx-toc__nr { color: var(--cx-goud-2); font-weight: 800; flex: none; }
.cx-toc__item--n3 { padding-left: 1rem; }
.cx-toc--vast { position: sticky; top: 90px; }
.cx-toc--inline { display: block; }
@media (min-width: 900px) { .cx-toc--inline { display: none; } }

.cx-bloglocaties { margin-top: 2.4rem; padding-top: 1.6rem; border-top: 1px solid var(--pp-line-soft); }
.cx-bloglocaties__titel { display: block; margin-bottom: .9rem; font-size: .78rem; font-weight: 800;
	letter-spacing: .12em; text-transform: uppercase; }
.cx-chip--alle { border-color: var(--cx-goud); color: var(--cx-goud-2); }

.cx-postnav { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 1rem; margin-top: 2.4rem; }
.cx-postnav__link { display: grid; gap: .3rem; padding: 1.1rem 1.3rem; border-radius: 16px;
	border: 1px solid var(--pp-line); background: rgba(46,44,40,.5); text-decoration: none;
	transition: border-color .15s, background .15s; }
.cx-postnav__link:hover { border-color: var(--cx-goud); background: rgba(196,154,84,.1); }
.cx-postnav__link--next { text-align: right; }
.cx-postnav__richting { font-size: .68rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--cx-goud-2); }
.cx-postnav__titel { font-size: .9rem; font-weight: 700; color: var(--pp-white); }

.cx-post__zij { display: grid; gap: 1.4rem; min-width: 0; }
.cx-post__cta { border: 2px solid rgba(20,19,17,.9); border-radius: 18px; background: var(--pp-surface-2);
	padding: 1.4rem 1.4rem 1.6rem; text-align: center; box-shadow: 7px 7px 0 var(--cx-goud); }
.cx-post__cta-logo { margin: 0 auto .8rem; }
.cx-post__cta strong { display: block; margin-bottom: .5rem; font-size: var(--fs-16); }
.cx-post__cta p { font-size: .84rem; color: var(--pp-muted); margin: 0 0 1.1rem; }

@media (max-width: 899px) {
	.cx-post__grid { grid-template-columns: minmax(0,1fr); }
	.cx-toc--vast { display: none; }
	.cx-postnav { grid-template-columns: minmax(0,1fr); }
	.cx-postnav__link--next { text-align: left; }
	.cx-post__cta { box-shadow: 5px 5px 0 var(--cx-goud); }
}


/* ==========================================================================
   Events en drankspellen
   ========================================================================== */
.cx-eventfilters { margin-bottom: 2rem; }
.cx-eventfilters .cx-chip { cursor: pointer; font: inherit; font-size: .82rem; font-weight: 700; }
.cx-events, .cx-spellen { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 1.6rem; }
.cx-event, .cx-spel { display: flex; flex-direction: column; border: 2px solid rgba(20,19,17,.9);
	border-radius: 18px; overflow: hidden; background: rgba(46,44,40,.55); text-decoration: none; min-width: 0;
	transition: transform .18s var(--ease), border-color .18s, box-shadow .18s var(--ease); }
.cx-event:hover, .cx-spel:hover { transform: translateY(-5px); border-color: var(--cx-goud); box-shadow: 0 14px 34px rgba(0,0,0,.5); }
.cx-event__beeld, .cx-spel__beeld { position: relative; display: block; }
.cx-event__beeld img, .cx-spel__beeld img { width: 100%; aspect-ratio: 4/3; object-fit: cover; display: block; }
.cx-event__badge, .cx-event__fotos { position: absolute; top: .8rem; padding: .28rem .8rem; border-radius: 999px;
	font-size: .6rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.cx-event__badge { left: .8rem; background: linear-gradient(140deg, var(--cx-goud-2), var(--cx-goud));
	color: #14130F; border: 2px solid #14130F; }
.cx-event__fotos { right: .8rem; background: rgba(20,19,17,.9); color: var(--cx-goud-2); border: 1px solid rgba(214,170,94,.5); }
.cx-event__titel, .cx-spel__titel { display: block; padding: 1rem 1.2rem 0; font-size: var(--fs-18);
	font-weight: 800; color: var(--pp-white); line-height: 1.25; }
.cx-event__link, .cx-spel__cta { display: block; padding: .8rem 1.2rem 1.2rem; margin-top: auto;
	font-size: .82rem; font-weight: 800; letter-spacing: .06em; color: var(--cx-goud-2); text-decoration: none; }
.cx-spel__in, .cx-spel__tekst { padding: 0 1.2rem; font-size: .86rem; color: var(--pp-muted); }

@media (max-width: 899px) { .cx-events, .cx-spellen { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 599px) { .cx-events, .cx-spellen { grid-template-columns: minmax(0,1fr); } }
