@font-face{font-family:"Bricolage";src:url(/fonts/bricolage-grotesque-latin-800-normal.woff2) format("woff2");font-weight:800;font-display:swap}
@font-face{font-family:"Bricolage";src:url(/fonts/bricolage-grotesque-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"DM Sans";src:url(/fonts/dm-sans-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"DM Sans";src:url(/fonts/dm-sans-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap}

:root{
  --ink:#17122B; --ink2:#2A2346; --paper:#FFF8EC; --paper2:#F6EBD6; --wit:#fff;
  --lime:#C8F542; --pink:#FF4F8B; --pink-d:#E0306E; --blue:#5B6CFF; --yellow:#FFD23F;
  --tekst:#17122B; --zacht:#4B4566;
  --rand:3px solid var(--ink); --schaduw:6px 6px 0 var(--ink); --schaduw-k:4px 4px 0 var(--ink);
  --r:18px; --kop:"Bricolage",system-ui,sans-serif; --body:"DM Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;overflow-x:clip}
body{margin:0;background:var(--paper);color:var(--tekst);font:400 17px/1.6 var(--body);overflow-x:clip}
img,svg{display:block;max-width:100%}
a{color:inherit;text-underline-offset:3px;text-decoration-thickness:2px}
a:hover{text-decoration-color:var(--pink)}
:focus-visible{outline:3px solid var(--blue);outline-offset:3px;border-radius:6px}
h1,h2,h3{font-family:var(--kop);font-weight:800;line-height:1.05;letter-spacing:-.02em;margin:0 0 .5em}
p{margin:0 0 1em}
.wrap{width:min(1180px,100% - 32px);margin-inline:auto}
.smal{width:min(800px,100% - 32px)}
.sr,.verstopt{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:8px;z-index:100;background:var(--ink);color:#fff;padding:10px 16px;border-radius:10px}
.skip:focus{left:16px}
.ic{width:1.15em;height:1.15em;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;flex:none;display:inline-block;vertical-align:-.18em}

/* topbalk + kop */
.topbalk{background:var(--ink);color:#fff;font-size:14px}
.topbalk .wrap{display:flex;gap:24px;justify-content:flex-end;padding:7px 0}
.topbalk span,.topbalk a{display:inline-flex;gap:7px;align-items:center;text-decoration:none}
.topbalk .ic{color:var(--lime)}
.kop{position:sticky;top:0;z-index:50;background:var(--paper);border-bottom:var(--rand)}
.kop-in{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:76px}
.logo{display:inline-flex;align-items:center;gap:10px;text-decoration:none}
.logo-mon{width:52px;height:46px;transition:transform .3s}
.logo:hover .logo-mon{transform:rotate(-8deg) scale(1.06)}
.woord{font:800 27px/1 var(--kop);letter-spacing:-.04em}
.woord b{color:var(--pink);font-weight:800}
.hoofdmenu{display:flex;align-items:center;gap:14px}
.hoofdmenu .knop{white-space:nowrap}
.hoofdmenu ul{display:flex;gap:4px;list-style:none;margin:0;padding:0}
.hoofdmenu ul a{display:block;white-space:nowrap;padding:9px 12px;border-radius:999px;font-weight:600;text-decoration:none;border:2px solid transparent}
.hoofdmenu ul a:hover{border-color:var(--ink);background:var(--wit)}
.hoofdmenu ul a[aria-current]{background:var(--lime);border-color:var(--ink)}
.menuknop{display:none;width:48px;height:48px;border:var(--rand);border-radius:14px;background:var(--lime);box-shadow:var(--schaduw-k);cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:5px}
.menuknop span:not(.sr){display:block;width:22px;height:3px;background:var(--ink);border-radius:2px;transition:.25s}
.menuknop[aria-expanded="true"] span:nth-child(1){transform:translateY(8px) rotate(45deg)}
.menuknop[aria-expanded="true"] span:nth-child(2){opacity:0}
.menuknop[aria-expanded="true"] span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}

/* knoppen */
.knoppen{display:flex;flex-wrap:wrap;gap:14px;margin:26px 0}
.knoppen.midden{justify-content:center}
.knop{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:12px 24px;border:var(--rand);border-radius:999px;font:700 17px/1.1 var(--body);text-decoration:none;box-shadow:var(--schaduw-k);transition:transform .15s,box-shadow .15s;cursor:pointer;color:var(--ink)}
.knop:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--ink)}
.knop:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--ink)}
.knop .ic{transition:transform .2s}.knop:hover .ic{transform:translateX(3px)}
.knop.klein{min-height:44px;padding:8px 18px;font-size:15px}
.knop.groot{min-height:60px;padding:14px 32px;font-size:19px;width:100%}
.knop-roze{background:var(--pink);color:#fff}
.knop-lime{background:var(--lime)}
.knop-wit{background:var(--wit)}
.knop-ink{background:var(--ink);color:#fff;box-shadow:4px 4px 0 var(--pink)}
.knop-ink:hover{box-shadow:6px 6px 0 var(--pink)}

/* held */
.held{padding:56px 0 64px;position:relative;overflow:hidden;background:
  radial-gradient(circle at 1px 1px,rgba(23,18,43,.13) 1.5px,transparent 0) 0 0/26px 26px}
.held-in{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center}
.held h1{font-size:clamp(40px,6vw,74px)}
.intro{font-size:clamp(18px,1.6vw,21px);color:var(--zacht);max-width:40em}
.gek{position:relative;display:inline-block;color:var(--pink)}
.krabbel{position:absolute;left:-4%;right:-4%;bottom:-.1em;height:.3em;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 20' preserveAspectRatio='none'%3E%3Cpath d='M2 14C40 4 70 18 100 9s70 6 96-4' fill='none' stroke='%23C8F542' stroke-width='7' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center/100% 100%;z-index:-1}
.held .gek{animation:wiebel 3.2s ease-in-out infinite;transform-origin:50% 80%}
@keyframes wiebel{0%,70%,100%{transform:rotate(0)}75%{transform:rotate(-6deg)}80%{transform:rotate(5deg)}85%{transform:rotate(-3deg)}90%{transform:rotate(2deg)}}
.sticker{display:inline-block;background:var(--yellow);border:var(--rand);border-radius:10px;padding:6px 14px;font:700 15px var(--body);box-shadow:var(--schaduw-k);margin-bottom:20px}
.draai-l{transform:rotate(-2.5deg)}.draai-r{transform:rotate(2deg)}
.chips{display:flex;flex-wrap:wrap;gap:10px;list-style:none;padding:0;margin:0}
.chips li{display:inline-flex;align-items:center;gap:8px;background:var(--wit);border:2px solid var(--ink);border-radius:999px;padding:6px 14px;font-weight:600;font-size:15px}
.chips .ic{color:var(--pink)}
.held-beeld{position:relative}
.held-fig{width:100%;height:auto;overflow:visible}
.zweef{animation:zweef 4s ease-in-out infinite}
@keyframes zweef{50%{transform:translateY(-10px)}}
.druppel{animation:drup 2.6s ease-in infinite}
@keyframes drup{0%,40%{transform:translateY(0);opacity:1}90%{transform:translateY(40px);opacity:0}100%{opacity:0}}
.sterren path{transform-box:fill-box;transform-origin:center;animation:twinkel 2.4s ease-in-out infinite}
.sterren .s2{animation-delay:.6s}.sterren .s3{animation-delay:1.2s}
@keyframes twinkel{50%{transform:scale(.6) rotate(30deg)}}
.tool{transform-box:fill-box;transform-origin:0 100%;animation:draai 3s ease-in-out infinite}
@keyframes draai{50%{transform:rotate(-14deg)}}
.pupil{transition:transform .08s linear}
.praatwolk{position:absolute;top:-6px;right:0;background:var(--wit);border:var(--rand);border-radius:18px 18px 18px 4px;padding:10px 14px;font:600 14px/1.3 var(--body);box-shadow:var(--schaduw-k);transform:rotate(4deg)}

/* strook */
.strook{background:var(--lime);border-block:var(--rand);overflow:hidden;padding:13px 0;transform:rotate(-1.2deg);margin:-6px -20px;position:relative;z-index:2}
.strook.roze{background:var(--pink);color:#fff}
.strook-in{display:flex;gap:26px;width:max-content;animation:loop 38s linear infinite;font:800 clamp(18px,2vw,24px)/1 var(--kop);white-space:nowrap}
.strook i{font-style:normal}
@keyframes loop{to{transform:translateX(-33.333%)}}

/* secties */
.sectie{padding:clamp(56px,8vw,96px) 0}
.kleur-ink{background:var(--ink);color:#fff}
.kleur-ink .klein-tekst{color:#cfc9e6}
.kleur-lime{background:var(--lime);border-block:var(--rand)}
.label{display:inline-block;font:700 14px/1 var(--body);letter-spacing:.08em;text-transform:uppercase;background:var(--ink);color:var(--lime);padding:7px 12px;border-radius:8px;margin-bottom:16px}
.label.lime{background:var(--lime);color:var(--ink)}
.kop2{font-size:clamp(32px,4.4vw,52px)}
.lead{font-size:19px;color:var(--zacht);max-width:44em}
.kleur-lime .lead{color:var(--ink2)}
.sectie-kop{display:flex;justify-content:space-between;align-items:end;gap:20px;flex-wrap:wrap;margin-bottom:30px}
.klein-tekst{font-size:15px;color:var(--zacht);margin-top:24px}
.kleur-ink a:not(.knop){color:var(--lime)}

/* probleemknoppen */
.problemen{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:26px}
.prob{display:flex;align-items:center;justify-content:center;text-align:center;min-height:76px;padding:12px;border:var(--rand);border-radius:16px;font:800 19px/1.15 var(--kop);text-decoration:none;box-shadow:var(--schaduw-k);transition:transform .15s,box-shadow .15s,background .15s;background:var(--wit)}
.prob:nth-child(odd){transform:rotate(-1deg)}.prob:nth-child(even){transform:rotate(1deg)}
.prob:hover{transform:rotate(0) translate(-2px,-3px) scale(1.03);box-shadow:var(--schaduw)}
.prob.p0:hover{background:var(--lime)}.prob.p1:hover{background:var(--yellow)}.prob.p2:hover{background:var(--pink);color:#fff}.prob.p3:hover{background:var(--blue);color:#fff}

/* prijskaarten */
.pkaarten{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.pkaart{background:var(--paper);color:var(--ink);border:var(--rand);border-radius:var(--r);padding:22px;display:flex;flex-direction:column;box-shadow:6px 6px 0 var(--lime);transition:transform .2s}
.pkaart:hover{transform:translateY(-4px) rotate(-1deg)}
.pkaart:nth-child(4n+2){box-shadow:6px 6px 0 var(--pink)}.pkaart:nth-child(4n+3){box-shadow:6px 6px 0 var(--yellow)}.pkaart:nth-child(4n+4){box-shadow:6px 6px 0 var(--blue)}
.pk-ic{width:52px;height:52px;border:var(--rand);border-radius:14px;display:grid;place-items:center;background:var(--lime);margin-bottom:14px}
.pkaart:nth-child(4n+2) .pk-ic{background:var(--pink);color:#fff}.pkaart:nth-child(4n+3) .pk-ic{background:var(--yellow)}.pkaart:nth-child(4n+4) .pk-ic{background:var(--blue);color:#fff}
.pk-ic .ic{width:26px;height:26px}
.pkaart h3{font-size:22px;margin-bottom:6px}
.pkaart p{font-size:15px;color:var(--zacht);flex:1}
.pk-voet{display:flex;justify-content:space-between;align-items:center;gap:8px;border-top:2px dashed var(--ink);padding-top:12px;margin-top:4px}
.duur{font-size:13px;display:inline-flex;gap:5px;align-items:center;color:var(--zacht)}
.pk-voet strong{font:800 19px var(--kop);white-space:nowrap}

/* stappen */
.stappen{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;list-style:none;padding:0;margin:30px 0 0}
.stap{position:relative;background:var(--wit);border:var(--rand);border-radius:var(--r);padding:30px 24px 24px;box-shadow:var(--schaduw)}
.stap.s1{transform:rotate(-1.5deg)}.stap.s3{transform:rotate(1.5deg)}
.nr{position:absolute;top:-24px;left:20px;width:52px;height:52px;border:var(--rand);border-radius:50%;display:grid;place-items:center;font:800 26px var(--kop);background:var(--yellow)}
.s2 .nr{background:var(--lime)}.s3 .nr{background:var(--pink);color:#fff}
.stap h3{font-size:24px;margin-top:12px}.stap p{color:var(--zacht);margin:0}

/* kopen */
.koop{display:grid;grid-template-columns:1.1fr .9fr;gap:44px;align-items:center}
.koop-tegels{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.ktegel{aspect-ratio:1.2;display:flex;flex-direction:column;justify-content:space-between;padding:20px;border:var(--rand);border-radius:var(--r);background:var(--paper);box-shadow:var(--schaduw);text-decoration:none;font:800 21px/1.1 var(--kop);transition:transform .2s}
.ktegel .ic{width:46px;height:46px;stroke-width:1.8}
.ktegel.k1{background:var(--pink);color:#fff;transform:rotate(2deg)}.ktegel.k2{background:var(--yellow);transform:rotate(-2deg)}.ktegel.k3{background:var(--blue);color:#fff}
.ktegel:hover{transform:rotate(0) scale(1.04)}

/* waarom */
.waarom{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:30px}
.wkaart{background:var(--lime);border:var(--rand);border-radius:var(--r);padding:24px;box-shadow:var(--schaduw)}
.wkaart.roze{background:var(--pink);color:#fff}.wkaart.geel{background:var(--yellow)}.wkaart.blauw{background:var(--blue);color:#fff}
.groot{display:block;font:800 72px/1 var(--kop);letter-spacing:-.04em}
.wkaart h3{font-size:22px;margin:4px 0 10px}.wkaart p{margin:0;font-size:15.5px}

/* faq */
.faq{margin-top:26px;display:grid;gap:12px}
.faq details{background:var(--wit);border:var(--rand);border-radius:16px;box-shadow:var(--schaduw-k)}
.faq summary{list-style:none;cursor:pointer;padding:18px 22px;font:800 20px/1.2 var(--kop);display:flex;justify-content:space-between;gap:16px;align-items:center}
.faq summary::-webkit-details-marker{display:none}
.faq summary span{flex:none;width:34px;height:34px;border:2px solid var(--ink);border-radius:50%;display:grid;place-items:center;font-size:22px;background:var(--lime);transition:transform .25s}
.faq details[open] summary span{transform:rotate(45deg);background:var(--pink);color:#fff}
.faq details p{padding:0 22px 20px;margin:0;color:var(--zacht)}

/* bezoek */
.bezoek-s{background:var(--paper2);border-top:var(--rand)}
.bezoek{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:center}
.gegevens{list-style:none;padding:0;margin:20px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:18px}
.gegevens li{display:flex;gap:12px;align-items:flex-start;font-size:15.5px}
.gegevens .ic{width:42px;height:42px;padding:9px;border:2px solid var(--ink);border-radius:12px;background:var(--wit);color:var(--pink)}
.gegevens b{font-size:17px}
.kaartje{position:relative;display:block;border:var(--rand);border-radius:var(--r);overflow:hidden;box-shadow:var(--schaduw);transform:rotate(1.5deg);transition:transform .25s}
.kaartje:hover{transform:rotate(0)}
.kaartje svg{width:100%;height:auto}
.kaartje .speld{animation:zweef 2.4s ease-in-out infinite}
.kaart-label{position:absolute;left:16px;bottom:16px;background:var(--ink);color:#fff;font-weight:700;padding:8px 14px;border-radius:999px}

/* paginakop */
.paginakop{padding:48px 0 60px;background:radial-gradient(circle at 1px 1px,rgba(23,18,43,.13) 1.5px,transparent 0) 0 0/26px 26px}
.paginakop.kop-lime{background-color:var(--lime)}.paginakop.kop-roze{background-color:#FFD6E5}
.paginakop h1{font-size:clamp(40px,6vw,72px);margin-top:10px}
.paginakop.midden{text-align:center}.paginakop.midden .intro{margin-inline:auto}
.kruimel{font-size:14px;color:var(--zacht)}

/* tabbladen + tabel */
.tabbladen{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:26px}
.tabbladen button{display:inline-flex;gap:8px;align-items:center;min-height:48px;padding:10px 20px;border:var(--rand);border-radius:999px;background:var(--wit);font:700 16px var(--body);color:var(--ink);cursor:pointer}
.tabbladen button[aria-selected="true"]{background:var(--ink);color:var(--lime);box-shadow:4px 4px 0 var(--pink)}
.tabel-wrap{border:var(--rand);border-radius:var(--r);overflow:hidden;box-shadow:var(--schaduw);background:var(--wit)}
.ptabel{width:100%;border-collapse:collapse}
.ptabel caption{text-align:left;padding:18px 22px;font:800 22px var(--kop);background:var(--lime);border-bottom:var(--rand)}
.ptabel thead th{text-align:left;font-size:13px;text-transform:uppercase;letter-spacing:.06em;padding:12px 22px;border-bottom:2px solid var(--ink)}
.ptabel td,.ptabel tbody th{padding:16px 22px;border-bottom:1px dashed rgba(23,18,43,.35);text-align:left;vertical-align:middle}
.ptabel tbody tr:last-child>*{border-bottom:0}
.ptabel tbody tr:hover{background:var(--paper)}
.ptabel tbody th b{display:block;font-size:17px}.ptabel tbody th span{font-weight:400;font-size:14.5px;color:var(--zacht)}
.ptabel td strong{font:800 19px var(--kop);white-space:nowrap}
.mac-blok{border:var(--rand);border-radius:var(--r);padding:30px;background:var(--wit);box-shadow:var(--schaduw)}
.mac-blok h2{font-size:30px}

/* categorieën + voordelen */
.cats{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:26px}
.cat{display:flex;flex-direction:column;padding:24px;border:var(--rand);border-radius:var(--r);background:var(--wit);box-shadow:var(--schaduw);text-decoration:none;transition:transform .2s}
.cat:hover{transform:translate(-3px,-4px) rotate(-.8deg)}
.cat-ic{width:62px;height:62px;border:var(--rand);border-radius:16px;display:grid;place-items:center;background:var(--lime);margin-bottom:16px}
.cat.c1 .cat-ic{background:var(--pink);color:#fff}.cat.c2 .cat-ic{background:var(--yellow)}.cat.c3 .cat-ic{background:var(--blue);color:#fff}
.cat-ic .ic{width:32px;height:32px}
.cat h3{font-size:24px;margin-bottom:8px}.cat p{color:var(--zacht);flex:1;font-size:15.5px}
.meer{font-weight:700;display:inline-flex;gap:6px;align-items:center;color:var(--pink-d)}
.voordelen{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:26px}
.voordeel{border:2px solid var(--lime);border-radius:var(--r);padding:22px}
.voordeel .ic{width:34px;height:34px;color:var(--lime);margin-bottom:12px}
.voordeel h3{font-size:20px}.voordeel p{margin:0;color:#cfc9e6;font-size:15.5px}
.tekstblok h2{font-size:clamp(28px,3.4vw,40px);margin-top:1.2em}
.tekstblok h2:first-child{margin-top:0}
.tekstblok p{font-size:18px}

/* formulier */
.contact{display:grid;grid-template-columns:1.4fr .8fr;gap:36px;align-items:start}
.formulier{background:var(--wit);border:var(--rand);border-radius:22px;padding:clamp(20px,3vw,34px);box-shadow:var(--schaduw)}
fieldset{border:0;padding:0;margin:0 0 20px}
legend,.veld label{font:800 19px var(--kop);margin-bottom:10px;display:block}
.opt{font:400 14px var(--body);color:var(--zacht)}
.keuzes{display:flex;flex-wrap:wrap;gap:10px}
.keuze input{position:absolute;opacity:0;width:1px;height:1px}
.keuze span{display:inline-block;padding:10px 16px;border:2px solid var(--ink);border-radius:999px;cursor:pointer;font-weight:600;background:var(--paper);transition:.15s}
.keuze input:checked+span{background:var(--lime);box-shadow:3px 3px 0 var(--ink);transform:translate(-1px,-1px)}
.keuze input:focus-visible+span{outline:3px solid var(--blue);outline-offset:2px}
.veld{margin-bottom:18px}
.veld input,.veld textarea{width:100%;font:400 17px var(--body);padding:13px 15px;border:2px solid var(--ink);border-radius:12px;background:var(--paper);color:var(--ink)}
.veld input:focus,.veld textarea:focus{outline:0;border-color:var(--blue);box-shadow:0 0 0 3px rgba(91,108,255,.3);background:#fff}
.twee{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.akkoord{display:flex;gap:10px;align-items:flex-start;margin:6px 0 22px;font-size:15.5px}
.akkoord input{width:20px;height:20px;accent-color:var(--pink);margin-top:3px;flex:none}
.contact-zij{display:grid;gap:22px}
.zijkaart{background:var(--ink);color:#fff;border:var(--rand);border-radius:var(--r);padding:24px;box-shadow:6px 6px 0 var(--pink)}
.zijkaart.geel{background:var(--yellow);color:var(--ink);box-shadow:var(--schaduw)}
.zijkaart h2{font-size:24px}.zijkaart.geel p{margin:0}
.regel{display:flex;gap:14px;align-items:center;padding:12px 0;border-top:1px solid rgba(255,255,255,.15);text-decoration:none;margin:0}
.regel .ic{width:40px;height:40px;padding:9px;border-radius:12px;background:var(--lime);color:var(--ink)}
.regel span{display:flex;flex-direction:column;font-size:15px;color:#d8d3ee}.regel b{color:#fff;font-size:16.5px}
a.regel:hover b{text-decoration:underline}

/* bedankt + 404 */
.bedankt-fig{width:140px;margin:0 auto 18px;animation:wiebel 2.4s infinite}
.mega404{font:800 clamp(110px,20vw,200px)/1 var(--kop);display:flex;justify-content:center;align-items:center;gap:10px;margin:0;letter-spacing:-.05em}
.mega404 span{width:.9em}.mega404 svg{width:100%;animation:wiebel 2.4s infinite}

/* voet */
.voet{background:var(--ink);color:#d8d3ee;padding:60px 0 0;font-size:15.5px}
.voet-in{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:36px}
.voet h2{color:#fff;font-size:20px}
.voet a{color:#fff}
.voet .woord{color:#fff}
.voet .logo-mon rect{stroke:var(--lime)}
.ls{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.voet .knoppen{margin:10px 0 0}
.voet .knop-lime{color:var(--ink)}
.voet-onder{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;border-top:1px solid rgba(255,255,255,.15);margin-top:44px;padding:20px 0 90px;font-size:13.5px;color:#a59fc2}
.zweefknop{position:fixed;right:18px;bottom:18px;z-index:60;width:60px;height:60px;border-radius:50%;background:#25D366;color:#fff;border:var(--rand);display:grid;place-items:center;box-shadow:var(--schaduw-k);transition:transform .2s}
.zweefknop:hover{transform:scale(1.08) rotate(-8deg)}
.zweefknop .ic{width:30px;height:30px}

/* onthullen bij scrollen */
.js .ont{opacity:0;translate:0 26px;transition:opacity .6s,translate .6s}
.js .ont.zien{opacity:1;translate:0 0}

/* responsief */
@media (max-width:1080px){
  .pkaarten,.waarom,.voordelen{grid-template-columns:repeat(2,1fr)}
  .voet-in{grid-template-columns:1fr 1fr}
}
@media (max-width:940px){
  .topbalk .vb{display:none}
  .menuknop{display:flex}
  .hoofdmenu{position:fixed;inset:calc(76px + 34px) 0 auto 0;flex-direction:column;align-items:stretch;gap:14px;background:var(--paper);border-bottom:var(--rand);padding:18px 16px 24px;transform:translateY(-120%);visibility:hidden;transition:transform .3s,visibility .3s;z-index:40}
  .hoofdmenu.open{transform:none;visibility:visible}
  .hoofdmenu ul{flex-direction:column}
  .hoofdmenu ul a{font-size:20px;padding:12px 16px;border-color:var(--ink);background:var(--wit)}
  .held-in,.koop,.bezoek,.contact{grid-template-columns:minmax(0,1fr)}
  .koop-tegels{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ktegel{aspect-ratio:auto;min-height:130px}
  .held-beeld{max-width:460px;margin-inline:auto;width:100%}
  .problemen{grid-template-columns:repeat(2,1fr)}
  .stappen,.cats{grid-template-columns:1fr}
  .stappen{gap:40px}
}
@media (max-width:600px){
  body{font-size:16px}
  .topbalk .wrap{justify-content:space-between;gap:10px;font-size:13px}
  .kop-in{min-height:68px}
  .hoofdmenu{inset:calc(68px + 32px) 0 auto 0}
  .woord{font-size:23px}.logo-mon{width:44px;height:39px}
  .held{padding-top:34px}
  .knoppen .knop{flex:1 1 100%}
  .pkaarten,.waarom,.voordelen,.gegevens,.twee,.voet-in{grid-template-columns:1fr}
  .prob{font-size:17px;min-height:66px}
  .praatwolk{font-size:12.5px;top:-14px}
  .ptabel thead{display:none}
  .ptabel,.ptabel tbody,.ptabel tr,.ptabel td,.ptabel tbody th{display:block}
  .ptabel tr{padding:14px 18px;border-bottom:1px dashed rgba(23,18,43,.35)}
  .ptabel tbody th,.ptabel td{padding:0;border:0}
  .ptabel td{display:flex;justify-content:space-between;padding-top:6px}
  .ptabel td::before{content:attr(data-l);color:var(--zacht);font-size:14px}
  .ptabel caption{padding:14px 18px;font-size:19px}
  .groot{font-size:58px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .js .ont{opacity:1;translate:none}
}

/* service aan huis + game-pc */
.kleur-blauw{background:var(--blue);color:#fff;border-block:var(--rand)}
.kleur-blauw .label{background:var(--yellow);color:var(--ink)}
.meer-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px;margin-top:28px}
.meerkaart{display:flex;flex-direction:column;background:var(--paper);color:var(--ink);border:var(--rand);border-radius:22px;padding:28px;box-shadow:var(--schaduw);text-decoration:none;transform:rotate(-1deg);transition:transform .2s}
.meerkaart.roze{background:var(--pink);color:#fff;transform:rotate(1deg)}
.meerkaart:hover{transform:rotate(0) translateY(-4px)}
.meerkaart h3{font-size:30px}.meerkaart p{flex:1}
.meerkaart.roze .meer{color:#fff}
.mk-ic{width:58px;height:58px;border:var(--rand);border-radius:16px;display:grid;place-items:center;background:var(--lime);color:var(--ink);margin-bottom:16px}
.mk-ic .ic{width:30px;height:30px}
.paginakop.kop-blauw{background-color:#D9DDFF}
.paginakop.kop-donker{background:var(--ink) radial-gradient(circle at 1px 1px,rgba(255,255,255,.12) 1.5px,transparent 0) 0 0/26px 26px;color:#fff}
.kop-donker .intro,.kop-donker .kruimel{color:#cfc9e6}
.kop-donker .chips li{background:transparent;border-color:var(--lime);color:#fff}
.kop-donker .chips .ic{color:var(--lime)}
.kop-donker .knop-lime{color:var(--ink);box-shadow:4px 4px 0 var(--pink)}
.game-kop{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:40px;align-items:center}
.game-fig{width:100%;max-width:340px;margin-inline:auto;overflow:visible}
.fan{animation:spin 1.6s linear infinite}.fan.f1{animation-duration:1.1s}.fan.f2{animation-duration:2s}
@keyframes spin{to{transform:rotate(360deg)}}
.tarieven{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:26px}
.tarief{background:var(--lime);color:var(--ink);border:var(--rand);border-radius:var(--r);padding:24px;box-shadow:6px 6px 0 #fff}
.tarief.roze{background:var(--pink);color:#fff}.tarief.geel{background:var(--yellow)}
.tarief h3{font-size:22px;margin:6px 0}.tarief p{margin:0}
.tarief .groot{font-size:clamp(44px,5vw,60px)}
.niveaus{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:26px}
.niveau{border:var(--rand);border-radius:var(--r);padding:26px;background:var(--wit);box-shadow:var(--schaduw);border-top-width:14px}
.niveau.lime{border-top-color:var(--lime)}.niveau.roze{border-top-color:var(--pink)}.niveau.geel{border-top-color:var(--yellow)}
.niveau h3{font-size:30px;margin-bottom:4px}.res{font-weight:700;color:var(--pink-d)}
.niveau .meer{text-decoration:none}
@media (max-width:940px){
  .menuknop{display:flex}
  .hoofdmenu{position:fixed;inset:calc(76px + 34px) 0 auto 0;flex-direction:column;align-items:stretch;gap:14px;background:var(--paper);border-bottom:var(--rand);padding:18px 16px 24px;transform:translateY(-120%);visibility:hidden;transition:transform .3s,visibility .3s;z-index:40}
  .hoofdmenu.open{transform:none;visibility:visible}
  .hoofdmenu ul{flex-direction:column}
  .hoofdmenu ul a{font-size:20px;padding:12px 16px;border-color:var(--ink);background:var(--wit)}
}
@media (max-width:940px){
  .meer-grid,.tarieven,.niveaus,.game-kop{grid-template-columns:minmax(0,1fr)}
  .game-beeld{max-width:260px;margin-inline:auto}
}
@media (max-width:600px){.hoofdmenu{inset:calc(68px + 32px) 0 auto 0}}
.meer-grid.drie{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:0}
.meerkaart.blauw{background:var(--blue);color:#fff;transform:rotate(.5deg)}
.meerkaart.blauw .meer{color:#fff}
@media (max-width:940px){.meer-grid.drie{grid-template-columns:minmax(0,1fr)}}

/* ===== afspraakformulier ===== */
.paginakop.kort{padding:36px 0 40px}
.boek-s{padding-top:40px}
.bk-stappen{display:flex;gap:8px;list-style:none;margin:0 0 26px;padding:0}
.bk-stappen li{flex:1;display:flex;align-items:center;gap:10px;padding:10px 14px;border:2px solid var(--ink);border-radius:999px;background:var(--wit);font-weight:700;font-size:15px;color:var(--zacht)}
.bk-stappen li span{flex:none;width:28px;height:28px;border-radius:50%;border:2px solid var(--ink);display:grid;place-items:center;font:800 14px var(--kop);background:var(--paper)}
.bk-stappen li.nu{background:var(--ink);color:#fff;box-shadow:4px 4px 0 var(--pink)}
.bk-stappen li.nu span{background:var(--lime);color:var(--ink)}
.bk-stappen li.klaar{background:var(--lime);color:var(--ink)}
.bk-stappen li.klaar span{background:var(--ink);color:var(--lime)}
.bk-in{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:28px;align-items:start}
.bk-hoofd{background:var(--wit);border:var(--rand);border-radius:22px;padding:clamp(18px,3vw,30px);box-shadow:var(--schaduw);min-width:0}
.bk-kop{display:flex;align-items:center;gap:12px;margin-bottom:18px}
.bk-kop h2{font-size:clamp(26px,3vw,34px);margin:0;outline:0}
.bk-terug{flex:none;width:40px;height:40px;border:2px solid var(--ink);border-radius:50%;background:var(--paper);font:800 24px/1 var(--kop);cursor:pointer;color:var(--ink)}
.bk-terug:hover{background:var(--lime)}
.bk-raster{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.bk-raster.drie{grid-template-columns:repeat(3,minmax(0,1fr))}
.bk-raster.twee{grid-template-columns:repeat(2,minmax(0,1fr))}
.bk-kaart{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:4px;text-align:left;padding:16px;border:2px solid var(--ink);border-radius:16px;background:var(--paper);color:var(--ink);font:inherit;cursor:pointer;transition:transform .15s,box-shadow .15s,background .15s;animation:bkIn .35s both;animation-delay:calc(var(--i) * 35ms)}
@keyframes bkIn{from{opacity:0;transform:translateY(8px)}}
.bk-kaart:hover{transform:translate(-2px,-2px);box-shadow:4px 4px 0 var(--ink);background:#fff}
.bk-kaart[aria-pressed="true"]{background:var(--lime);box-shadow:4px 4px 0 var(--ink)}
.bk-kaart b{font:800 18px/1.15 var(--kop)}
.bk-kaart small{font-size:14px;color:var(--zacht);line-height:1.35}
.bk-ic{width:46px;height:46px;flex:none;border:2px solid var(--ink);border-radius:13px;display:grid;place-items:center;background:var(--wit);margin-bottom:6px}
.bk-ic .ic{width:24px;height:24px}
.bk-raster .bk-kaart:nth-child(4n+1) .bk-ic{background:var(--lime)}
.bk-raster .bk-kaart:nth-child(4n+2) .bk-ic{background:var(--pink);color:#fff}
.bk-raster .bk-kaart:nth-child(4n+3) .bk-ic{background:var(--yellow)}
.bk-raster .bk-kaart:nth-child(4n+4) .bk-ic{background:var(--blue);color:#fff}
.bk-kaart[aria-pressed="true"] .bk-ic{background:var(--wit);color:var(--ink)}
.bk-tag{font-style:normal;font-size:12.5px;font-weight:700;background:var(--ink);color:var(--lime);padding:3px 9px;border-radius:999px;margin-top:6px}
.bk-raster.twee .bk-kaart{display:grid;grid-template-columns:46px minmax(0,1fr) auto;column-gap:12px;row-gap:2px;align-items:center;padding-right:48px}
.bk-raster.twee .bk-kaart .bk-ic{grid-row:1/4;margin:0}
.bk-raster.twee .bk-kaart b{grid-column:2}
.bk-raster.twee .bk-kaart small{grid-column:2/4}
.bk-duur{grid-column:2;font-size:13px;color:var(--zacht);display:inline-flex;gap:5px;align-items:center}
.bk-prijs{font:800 19px var(--kop);white-space:nowrap;margin-top:4px}
.bk-raster.twee .bk-prijs{grid-column:3;grid-row:1;margin:0;text-align:right}
.bk-prijs i{font:600 13px var(--body);font-style:normal;color:var(--zacht)}
.bk-prijs.zacht{font:600 14px var(--body);color:var(--zacht)}
.bk-vink{position:absolute;top:12px;right:12px;width:26px;height:26px;border:2px solid var(--ink);border-radius:50%;display:grid;place-items:center;background:var(--wit);color:transparent}
.bk-vink .ic{width:16px;height:16px}
.bk-kaart[aria-pressed="true"] .bk-vink{background:var(--ink);color:var(--lime)}
.bk-raster.twee .bk-vink{top:50%;transform:translateY(-50%)}
.bk-vrij{margin-top:22px;padding-top:18px;border-top:2px dashed var(--ink)}
.bk-vrij label{font-weight:700;display:block;margin-bottom:8px}
.bk-rij{display:flex;gap:10px}
.bk-rij input{flex:1;min-width:0}
.bk-gekozen{display:flex;align-items:center;gap:14px;padding:12px 14px;border:2px solid var(--ink);border-radius:16px;background:var(--paper);margin-bottom:12px}
.bk-gekozen .bk-ic{margin:0;background:var(--lime)}
.bk-gekozen div{flex:1;min-width:0}
.bk-gekozen b{display:block;font:800 18px var(--kop)}
.bk-gekozen small{color:var(--zacht)}
.bk-link{background:none;border:0;font:700 15px var(--body);color:var(--pink-d);text-decoration:underline;cursor:pointer;padding:6px}
.bk-uitleg{color:var(--zacht);font-size:15.5px;margin:6px 0 14px}
.bk-nav{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:24px;padding-top:20px;border-top:2px dashed var(--ink)}
.bk-nav .knop[disabled]{opacity:.45;cursor:not-allowed;transform:none;box-shadow:none}
.bk-blok{margin-bottom:26px}
.bk-blok h3{display:flex;align-items:center;gap:10px;font-size:22px;margin-bottom:14px}
.bk-blok h3 .nr{width:32px;height:32px;border:2px solid var(--ink);border-radius:50%;display:grid;place-items:center;font-size:16px;background:var(--yellow);flex:none}
.bk-pillen{display:flex;flex-wrap:wrap;gap:8px}
.bk-pillen.tijden{margin-top:12px;padding-top:12px;border-top:1px dashed rgba(23,18,43,.3)}
.bk-pil{min-width:70px;padding:8px 12px;border:2px solid var(--ink);border-radius:12px;background:var(--paper);font:700 15px var(--body);color:var(--ink);cursor:pointer;line-height:1.2}
.bk-pil small{display:block;font-weight:400;font-size:12.5px;color:var(--zacht)}
.bk-pil:hover{background:#fff}
.bk-pil[aria-pressed="true"]{background:var(--ink);color:var(--lime);box-shadow:3px 3px 0 var(--pink)}
.bk-pil[aria-pressed="true"] small{color:#cfc9e6}
.bk-seg{display:inline-flex;border:2px solid var(--ink);border-radius:999px;overflow:hidden;margin-bottom:14px}
.bk-seg button{padding:8px 18px;border:0;background:var(--wit);font:700 15px var(--body);cursor:pointer;color:var(--ink)}
.bk-seg button[aria-pressed="true"]{background:var(--lime)}
.bk-velden{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 14px;margin-bottom:12px}
.bk-velden.adres{grid-template-columns:1.3fr 1fr 1fr}
.bk-veld{display:flex;flex-direction:column;gap:5px;font-weight:700;font-size:15px;min-width:0}
.bk-veld.vol{grid-column:1/-1}
.bk-veld input,.bk-veld select,.bk-veld textarea,.bk-rij input{font:400 16.5px var(--body);padding:12px 14px;border:2px solid var(--ink);border-radius:12px;background:var(--paper);color:var(--ink);width:100%}
.bk-veld input:focus,.bk-veld select:focus,.bk-veld textarea:focus,.bk-rij input:focus{outline:0;border-color:var(--blue);box-shadow:0 0 0 3px rgba(91,108,255,.3);background:#fff}
.bk-veld input.auto{background:#EEFBD0;border-color:#5f8a00}
.bk-adres{border:2px dashed var(--ink);border-radius:16px;padding:14px 16px 4px;margin:4px 0 14px;background:#FFFDF8}
.bk-sublabel{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-weight:700;margin:0 0 10px}
.bk-sublabel .ic{color:var(--pink)}
.bk-adresstatus{font-size:14.5px;color:var(--zacht);margin:-2px 0 12px;min-height:1.4em}
.bk-adresstatus span{display:inline-flex;gap:6px;align-items:center}
.bk-adresstatus .ja{color:#3d6b00;font-weight:700}
.bk-adresstatus .nee{color:var(--pink-d);font-weight:600}
.bk-adresstatus .zoekt::before{content:"";width:14px;height:14px;border:2px solid var(--zacht);border-top-color:transparent;border-radius:50%;animation:spin .8s linear infinite}
.bk-noot{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:14px;background:var(--paper2);font-size:15px;margin:8px 0 14px}
.bk-noot .ic{color:var(--pink);margin-top:2px}
.bk-fout{padding:12px 14px;border:2px solid var(--pink-d);border-radius:12px;background:#FFE3EC;font-size:15px}
.bk-overzicht{position:sticky;top:100px;background:var(--ink);color:#fff;border:var(--rand);border-radius:22px;padding:22px;box-shadow:6px 6px 0 var(--pink)}
.bk-overzicht h2{font-size:24px;color:var(--lime)}
.bk-leeg{color:#cfc9e6;font-size:15px}
.ov-app{display:flex;gap:12px;align-items:center;padding-bottom:14px;margin-bottom:10px;border-bottom:1px solid rgba(255,255,255,.18)}
.ov-app .bk-ic{margin:0;background:var(--lime);color:var(--ink)}
.ov-app b{display:block;font:800 18px/1.2 var(--kop)}
.ov-app small{color:#cfc9e6}
.ov-rij{display:flex;justify-content:space-between;gap:10px;padding:6px 0;font-size:15px}
.ov-rij b{white-space:nowrap}
.ov-rij.zacht{color:#cfc9e6}
.ov-totaal{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-top:10px;padding-top:12px;border-top:2px dashed var(--lime);font:800 20px var(--kop)}
.ov-totaal b{font-size:28px;color:var(--lime);text-align:right}
.ov-totaal small{font:400 13px var(--body);color:#cfc9e6}
.ov-noot,.ov-wanneer{display:flex;gap:8px;align-items:flex-start;font-size:14px;color:#d8d3ee;margin:12px 0 0}
.ov-noot .ic,.ov-wanneer .ic{color:var(--lime);margin-top:2px}
.bk-overzicht a{color:var(--lime)}
.bk-mbalk{display:none}
.bk-klaar{text-align:center;padding:20px 0}
.bk-klaar-fig{width:120px;margin:0 auto 14px;animation:wiebel 2.4s infinite}
.bk-klaar h3{font-size:32px}
.bk-code{display:inline-block;font:800 24px var(--kop);letter-spacing:.06em;background:var(--lime);border:var(--rand);border-radius:12px;padding:6px 16px;box-shadow:var(--schaduw-k)}
.afspraak-cta{display:flex;gap:12px;align-items:center;padding:14px 16px;margin-bottom:22px;border:2px solid var(--ink);border-radius:16px;background:var(--lime);text-decoration:none;box-shadow:var(--schaduw-k);transition:transform .15s}
.afspraak-cta:hover{transform:translate(-2px,-2px)}
.afspraak-cta span{flex:1;font-size:15.5px}
.afspraak-cta .ic{width:24px;height:24px}
@media (max-width:1080px){
  .bk-in{grid-template-columns:minmax(0,1fr)}
  .bk-overzicht{position:static}
  .bk-raster{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:700px){
  .bk-stappen li{font-size:0;justify-content:center;padding:6px}
  .bk-stappen li.nu{font-size:14px}
  .bk-raster{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bk-raster.drie,.bk-raster.twee,.bk-velden{grid-template-columns:minmax(0,1fr)}
  .bk-velden.adres{grid-template-columns:1.3fr 1fr 1fr;gap:8px}
  .bk-kaart{padding:12px}
  .bk-kaart b{font-size:16.5px}
  .bk-hoofd{padding:16px;border-radius:18px}
  .bk-mbalk{display:block;position:sticky;bottom:12px;margin-top:14px;text-align:center;background:var(--ink);color:#fff;border-radius:999px;padding:10px 16px;font-size:15px;box-shadow:4px 4px 0 var(--pink);z-index:5;width:calc(100% - 84px)}
  .bk-mbalk b{color:var(--lime)}
}
@media (max-width:700px){
  .bk-velden.adres{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .bk-velden.adres .bk-veld:first-child{grid-column:1/-1}
  .bk-raster.twee .bk-prijs{grid-column:2;grid-row:auto;text-align:left;margin-top:2px}
  .bk-raster.twee .bk-kaart small{grid-column:2}
}

/* ===== Rustiger (14-11-2026): minder kleuren, geen scheve kaarten, zachte schaduwen, geen bewegende strook ===== */
:root{
  --rand:1.5px solid rgba(23,18,43,.14);
  --schaduw:0 1px 2px rgba(23,18,43,.06),0 12px 32px -16px rgba(23,18,43,.22);
  --schaduw-k:0 1px 2px rgba(23,18,43,.08);
  --paper:#FBF8F2; --paper2:#F3EEE4; --zacht:#5A556F;
}
body{background:var(--paper)}
.held,.paginakop{background:var(--paper)!important;background-image:none!important}
.paginakop.kop-lime,.paginakop.kop-roze,.paginakop.kop-blauw{background:var(--paper2)!important}
.paginakop.kop-donker{background:var(--ink)!important}
.held{padding:64px 0 72px}
.held h1,.paginakop h1{letter-spacing:-.025em}
.held .gek,.bedankt-fig,.mega404 svg,.bk-klaar-fig{animation:none!important}
.krabbel{height:.22em;opacity:.9}
.draai-l,.draai-r,.prob,.stap.s1,.stap.s3,.ktegel,.meerkaart,.meerkaart.roze,.meerkaart.blauw,.kaartje,.wkaart{transform:none!important}
.topbalk{background:var(--paper2);color:var(--ink);border-bottom:1px solid rgba(23,18,43,.08)}
.topbalk .ic{color:var(--ink);opacity:.6}
.kop{background:rgba(251,248,242,.92);backdrop-filter:saturate(1.4) blur(8px);border-bottom:1px solid rgba(23,18,43,.1)}
.logo-mon{width:40px;height:40px}
.logo:hover .logo-mon{transform:none}
.woord{font-size:24px;letter-spacing:-.03em;font-weight:800}
.woord b{color:var(--ink);font-weight:800;opacity:.55}
.hoofdmenu ul a{border:0;border-radius:10px}
.hoofdmenu ul a:hover{background:var(--paper2)}
.hoofdmenu ul a[aria-current]{background:transparent;box-shadow:inset 0 -2px 0 var(--lime-d,#7FA51A);border-radius:0}

/* knoppen: plat, één accentkleur */
.knop{border:1.5px solid transparent;box-shadow:none;font-weight:700}
.knop:hover{transform:translateY(-1px);box-shadow:0 6px 16px -8px rgba(23,18,43,.45)}
.knop:active{transform:none;box-shadow:none}
.knop-roze{background:var(--ink);color:#fff}
.knop-roze:hover{background:#2A2346}
.knop-lime{background:var(--lime);color:var(--ink)}
.knop-wit{background:#fff;border-color:rgba(23,18,43,.18)}
.knop-ink{background:var(--ink);color:#fff;box-shadow:none}
.knop-ink:hover{box-shadow:0 6px 16px -8px rgba(23,18,43,.45)}
.kop-donker .knop-lime{box-shadow:none}

/* labels en chips */
.label,.label.lime{background:transparent;color:var(--zacht);padding:0;border-radius:0;letter-spacing:.1em;font-size:13px;margin-bottom:12px}
.kleur-ink .label,.kleur-ink .label.lime,.kop-donker .label{color:var(--lime)}
.chips li{border:1px solid rgba(23,18,43,.14);background:#fff;font-weight:600}
.chips .ic{color:#5f8a00}
.sticker{display:none}

/* stille beloftes-rij (vervangt de bewegende strook) */
.beloftes{border-block:1px solid rgba(23,18,43,.1);background:#fff}
.beloftes ul{list-style:none;margin:0;padding:16px 0;display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 24px;font-weight:600;font-size:15.5px}
.beloftes li{display:inline-flex;align-items:center;gap:8px}
.beloftes .ic{color:#5f8a00}
.strook{display:none}

/* secties */
.sectie{padding:clamp(56px,7vw,88px) 0}
.kop2{font-size:clamp(30px,3.6vw,44px)}
.kleur-lime{background:var(--paper2);border-block:0}
.kleur-blauw{background:var(--paper2);color:var(--ink);border-block:0}
.kleur-blauw .label{background:transparent;color:var(--zacht)}
.bezoek-s{border-top:0}

/* kaarten: wit, dunne rand, zachte schaduw, geen kleurvlakken */
.prob,.pkaart,.stap,.ktegel,.wkaart,.cat,.meerkaart,.faq details,.formulier,.tabel-wrap,.mac-blok,.niveau,.tarief,.zijkaart.geel,.kaartje,.bk-hoofd{border:var(--rand)!important;box-shadow:var(--schaduw)!important;background:#fff}
.prob{font-size:17px;min-height:64px;background:#fff}
.prob:hover{transform:translateY(-2px)!important;background:#fff!important;color:var(--ink)!important;border-color:var(--ink)!important}
.pkaart,.pkaart:nth-child(n){box-shadow:var(--schaduw)!important}
.pkaart:hover,.cat:hover,.ktegel:hover,.meerkaart:hover{transform:translateY(-3px)!important}
.pk-ic,.pkaart:nth-child(n) .pk-ic,.cat-ic,.cat.c1 .cat-ic,.cat.c2 .cat-ic,.cat.c3 .cat-ic,.mk-ic{background:var(--paper2)!important;color:var(--ink)!important;border:0!important;border-radius:12px}
.pk-voet{border-top:1px solid rgba(23,18,43,.1)}
.kleur-ink .pkaart{border-color:transparent!important}
.nr,.s2 .nr,.s3 .nr{background:var(--lime);color:var(--ink);border:0;width:44px;height:44px;font-size:20px;top:-20px}
.stap{padding-top:34px}
.ktegel,.ktegel.k1,.ktegel.k2,.ktegel.k3{background:#fff!important;color:var(--ink)!important;font-size:19px}
.ktegel .ic{width:36px;height:36px;color:var(--ink)}
.wkaart,.wkaart.roze,.wkaart.geel,.wkaart.blauw{background:#fff!important;color:var(--ink)!important}
.wkaart .groot{color:var(--ink);font-size:56px}
.wkaart .groot::after{content:"";display:block;width:36px;height:5px;border-radius:3px;background:var(--lime);margin-top:10px}
.wkaart p{color:var(--zacht)}
.meerkaart,.meerkaart.roze,.meerkaart.blauw{background:#fff!important;color:var(--ink)!important}
.meerkaart.roze .meer,.meerkaart.blauw .meer,.meer{color:var(--ink)}
.meer{text-decoration:underline;text-decoration-color:var(--lime);text-decoration-thickness:3px;text-underline-offset:5px}
.niveau{border-top-width:1.5px!important}
.niveau.lime,.niveau.roze,.niveau.geel{border-top-color:rgba(23,18,43,.14)}
.niveau h3::before{content:"";display:block;width:36px;height:5px;border-radius:3px;background:var(--lime);margin-bottom:14px}
.res{color:var(--zacht)}
.tarief,.tarief.roze,.tarief.geel{background:#fff!important;color:var(--ink)!important}
.tarief .groot{color:var(--ink)}
.zijkaart{box-shadow:none}
.zijkaart.geel{background:var(--paper2)!important}
.faq summary span,.faq details[open] summary span{background:var(--paper2);color:var(--ink);border:0}
.faq details[open] summary span{background:var(--lime)}
.ptabel caption{background:var(--paper2);border-bottom:1px solid rgba(23,18,43,.1)}
.ptabel thead th{border-bottom:1px solid rgba(23,18,43,.14)}
.ptabel td,.ptabel tbody th{border-bottom:1px solid rgba(23,18,43,.08)}
.tabbladen button{border:1px solid rgba(23,18,43,.18)}
.tabbladen button[aria-selected="true"]{background:var(--ink);color:#fff;box-shadow:none}
.voordeel{border:1px solid rgba(255,255,255,.14)}
.gegevens .ic{border:0;background:#fff;color:var(--ink)}
.kaart-label{background:var(--ink)}
.zweefknop{border:0;box-shadow:0 8px 20px -8px rgba(0,0,0,.4);width:56px;height:56px}
.zweefknop:hover{transform:scale(1.05)}
.afspraak-cta{border:1px solid rgba(23,18,43,.14);box-shadow:none;background:var(--paper2)}
.keuze span{border:1px solid rgba(23,18,43,.2)}
.keuze input:checked+span{box-shadow:none;transform:none}
.veld input,.veld textarea{border:1px solid rgba(23,18,43,.2);background:#fff}

/* voet */
.voet .logo-mon rect{stroke:none}
.voet .woord b{color:#fff}

/* afspraakformulier rustiger */
.bk-stappen li{border:1px solid rgba(23,18,43,.14)}
.bk-stappen li.nu{box-shadow:none}
.bk-kaart{border:1px solid rgba(23,18,43,.16);background:#fff;animation:none}
.bk-kaart:hover{box-shadow:0 6px 16px -10px rgba(23,18,43,.4);transform:translateY(-1px)}
.bk-kaart[aria-pressed="true"]{background:#F3FADF;border-color:#7FA51A;box-shadow:none}
.bk-raster .bk-kaart:nth-child(n) .bk-ic,.bk-ic{background:var(--paper2)!important;color:var(--ink)!important;border:0}
.bk-overzicht{box-shadow:var(--schaduw);border:0}
.bk-pil,.bk-seg,.bk-gekozen,.bk-terug,.bk-veld input,.bk-veld select,.bk-veld textarea,.bk-rij input{border-width:1px!important;border-color:rgba(23,18,43,.2)!important}
.bk-pil[aria-pressed="true"]{box-shadow:none}
.bk-adres{border:1px dashed rgba(23,18,43,.25)}
.bk-blok h3 .nr{background:var(--lime);border:0}
.bk-mbalk{box-shadow:0 8px 20px -8px rgba(0,0,0,.4)}

/* animaties: alleen nog rustig infaden */
.zweef,.druppel,.sterren path,.tool,.kaartje .speld{animation:none!important}
.fan{animation-duration:6s!important}
.js .ont{translate:0 12px}
@media (max-width:940px){.beloftes ul{justify-content:flex-start}}
.held .chips{display:none}

/* ===== Stijl zoals thephonelab.nl (14-11-2026): rood/geel/crème, vierkante hoeken, logo in het midden ===== */
@font-face{font-family:"Outfit";src:url(/fonts/outfit-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Outfit";src:url(/fonts/outfit-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Outfit";src:url(/fonts/outfit-latin-700-normal.woff2) format("woff2");font-weight:700;font-display:swap}
:root{
  --rood:#E72329; --rood-d:#C8161C; --geel:#FFC700; --geel-d:#F0B800; --creme:#FCFBF7; --grijs:#F4F4F4; --tekst:#353439; --zwart:#0A0A0A;
  --ink:#1E1D22; --paper:#FCFBF7; --paper2:#F4F4F4; --zacht:#5F5E66; --lime:#FFC700; --pink:#E72329; --pink-d:#E72329;
  --kop:"Outfit","Helvetica Neue",Helvetica,Arial,sans-serif; --body:"Outfit","Helvetica Neue",Helvetica,Arial,sans-serif;
  --rand:0; --r:0px;
  --schaduw:0 0 5px rgba(10,10,10,.12),0 6px 18px -10px rgba(10,10,10,.18);
  --schaduw-k:0 0 5px rgba(10,10,10,.2);
}
body{background:var(--creme);color:var(--tekst);font:400 16px/1.55 var(--body)}
h1,h2,h3{font-family:var(--kop);font-weight:700;letter-spacing:0;color:var(--zwart)}
.kleur-ink h2,.kleur-ink h3:not(.pkaart h3),.paginakop.kop-donker h1{color:#fff}
a:hover{text-decoration-color:var(--rood)}

/* rode USP-balk */
.topbalk{background:var(--rood)!important;color:#fff!important;border:0!important;font-size:14px}
.topbalk .wrap{justify-content:space-between;padding:8px 0}
.topbalk span{gap:6px}
.topbalk b{font-weight:700}
.topbalk .ic{color:#fff!important;opacity:1!important;width:16px;height:16px;stroke-width:3}
.topbalk a{color:#fff}

/* kop: menu links en rechts, logo in het midden */
.kop{background:#fff!important;backdrop-filter:none!important;border-bottom:0!important;box-shadow:0 2px 6px rgba(10,10,10,.06)}
.kop-in{display:grid!important;grid-template-columns:1fr auto 1fr;align-items:center;min-height:84px;gap:24px}
.kop-in>.logo{grid-column:2;grid-row:1;justify-self:center}
.hoofdmenu{display:contents}
.hoofdmenu ul{display:flex;gap:6px;grid-row:1}
.hoofdmenu ul.links{grid-column:1;justify-self:end}
.hoofdmenu ul.rechts{grid-column:3;justify-self:start}
.hoofdmenu>.knop{grid-column:3;grid-row:1;justify-self:end}
.hoofdmenu ul a{font:600 17px var(--kop);color:var(--tekst);padding:8px 14px;border-radius:0!important;background:transparent!important;box-shadow:none!important}
.hoofdmenu ul a:hover{color:var(--rood)}
.hoofdmenu ul a[aria-current]{color:var(--rood);box-shadow:inset 0 -3px 0 var(--rood)!important}
.logo{flex-direction:column;gap:4px}
.logo-mon{width:46px;height:46px}
.woord{font:700 19px/1 var(--kop);letter-spacing:.02em;color:var(--zwart)}
.woord b{color:var(--rood)!important;opacity:1!important;font-weight:700}
.voet .woord{color:var(--zwart)}
.voet .woord b{color:var(--rood)!important}

/* knoppen: geel, vierkant, hoofdletters */
.knop{border-radius:0!important;border:0!important;box-shadow:var(--schaduw-k)!important;font:700 13.5px/1.1 var(--kop)!important;text-transform:uppercase;letter-spacing:.04em;min-height:56px;padding:14px 28px}
.knop.klein{min-height:42px;padding:10px 18px;font-size:12.5px!important}
.knop:hover{transform:none!important;filter:brightness(.96)}
.knop .ic{display:none}
.knop-roze,.knop-lime,.knop-ink{background:var(--geel)!important;color:var(--zwart)!important}
.knop-wit{background:#fff!important;color:var(--zwart)!important}
.zweefknop .ic,.afspraak-cta .ic{display:inline-block}

/* hero: rood vlak, witte titel, gele en witte knop */
.held{background:var(--rood)!important;color:#fff;padding:56px 0 64px}
.held h1{color:#fff;font-size:clamp(34px,4.4vw,52px);line-height:1.1}
.held .gek{color:var(--geel)}
.krabbel{display:none}
.held .intro{color:rgba(255,255,255,.92)}
.held .label{color:#fff!important;opacity:.85}
.held .knoppen{gap:0}
.held .knoppen .knop{min-width:220px}
.held-fig{filter:drop-shadow(0 18px 30px rgba(0,0,0,.25))}

/* paginakoppen */
.paginakop,.paginakop.kop-lime,.paginakop.kop-roze,.paginakop.kop-blauw{background:var(--rood)!important;color:#fff}
.paginakop h1{color:#fff;font-size:clamp(32px,4vw,48px)}
.paginakop .gek{color:var(--geel)}
.paginakop .intro,.paginakop .kruimel,.paginakop .kruimel a{color:rgba(255,255,255,.9)}
.paginakop .intro a{color:#fff}
.paginakop.kop-donker{background:var(--zwart)!important}

/* USP-rij met rode bolletjes */
.beloftes{background:var(--creme);border:0;border-bottom:1px solid #ebe8df}
.beloftes ul{padding:22px 0;font-weight:400;font-size:15px;color:var(--zwart)}
.beloftes .ic{width:24px;height:24px;padding:5px;border-radius:50%;background:var(--rood);color:#fff!important;stroke-width:3}

/* secties */
.label,.label.lime{color:var(--rood)!important;font-weight:700;letter-spacing:.06em}
.kleur-ink{background:var(--rood);color:#fff}
.kleur-ink .label{color:#fff!important;opacity:.85}
.kleur-ink .klein-tekst,.kleur-ink .klein-tekst a{color:#fff}
.kleur-lime,.kleur-blauw{background:var(--grijs)!important}
.bezoek-s{background:#fff}
.kop2{font-size:clamp(28px,3vw,38px)}

/* kaarten: wit, vierkant, zacht schaduwtje */
.prob,.pkaart,.stap,.ktegel,.wkaart,.cat,.meerkaart,.faq details,.formulier,.tabel-wrap,.mac-blok,.niveau,.tarief,.zijkaart.geel,.kaartje,.bk-hoofd,.afspraak-cta,.bk-overzicht{border-radius:0!important;border:0!important;box-shadow:var(--schaduw)!important}
.pk-ic,.cat-ic,.mk-ic,.bk-ic,.gegevens .ic,.regel .ic{border-radius:0!important;background:transparent!important;color:var(--zwart)!important;width:auto!important;height:auto!important;padding:0!important}
.pk-ic .ic,.cat-ic .ic,.mk-ic .ic{width:28px;height:28px;stroke-width:1.6}
.pkaart h3,.cat h3,.meerkaart h3{font-size:20px}
.meer,.meerkaart .meer,.meerkaart.roze .meer,.meerkaart.blauw .meer{color:var(--rood)!important;text-decoration:none;font-weight:700}
.meer::after{content:" ›"}
.meer .ic{display:none}
.pk-voet strong,.ptabel td strong,.bk-prijs,.ov-totaal b{color:var(--rood)}
.kleur-ink .pk-voet strong{color:var(--rood)}
.prob{font:600 16px var(--kop)}
.prob:hover{border:0!important;color:var(--rood)!important}
.nr,.s2 .nr,.s3 .nr,.bk-blok h3 .nr{background:var(--rood)!important;color:#fff!important;border-radius:50%}
.wkaart .groot{color:var(--rood);font-weight:700}
.wkaart .groot::after,.niveau h3::before{background:var(--geel)}
.tarief .groot{color:var(--rood)}
.ktegel .ic{color:var(--rood)}
.voordeel{border:1px solid rgba(255,255,255,.35);border-radius:0}
.voordeel .ic{color:var(--geel)}
.voordeel p{color:rgba(255,255,255,.92)}
.faq summary{font:600 18px var(--kop)}
.faq summary span,.faq details[open] summary span{border-radius:0;background:var(--grijs);color:var(--zwart)}
.faq details[open] summary span{background:var(--geel)}
.tabbladen button{border-radius:0;font-family:var(--kop)}
.tabbladen button[aria-selected="true"]{background:var(--rood);color:#fff;border-color:var(--rood)}
.ptabel caption{background:var(--grijs)}
.chips li,.keuze span,.veld input,.veld textarea,.bk-veld input,.bk-veld select,.bk-veld textarea,.bk-rij input{border-radius:0!important}
.keuze input:checked+span{background:var(--geel)}
.gegevens .ic{color:var(--rood)!important}
.kaart-label{border-radius:0;background:var(--rood)}
.kaartje svg g path{fill:var(--rood)}
.zijkaart{background:var(--zwart);border-radius:0}
.zijkaart .regel .ic{color:var(--geel)!important}
.akkoord input{accent-color:var(--rood)}

/* footer: crème met rode koppen */
.voet{background:var(--creme);color:var(--tekst);border-top:1px solid #ebe8df}
.voet h2{color:var(--rood);font-size:18px}
.voet a{color:var(--tekst)}
.voet a:hover{color:var(--rood)}
.voet-onder{border-top:1px solid #ebe8df;color:var(--zacht)}
.voet-logo .logo{flex-direction:row;gap:10px}

/* zwevende knoppen rechtsonder */
.zweef-rij{position:fixed;right:18px;bottom:18px;z-index:60;display:flex;align-items:center;gap:10px}
.zweef-pil{background:var(--geel);color:var(--zwart);font:700 14px var(--kop);padding:10px 16px;border-radius:999px;text-decoration:none;box-shadow:var(--schaduw-k)}
.zweefknop{position:static!important;background:var(--geel)!important;color:var(--zwart)!important;border:0!important}

/* afspraakformulier */
.bk-stappen li{border-radius:0!important;border:0!important;background:#fff;box-shadow:var(--schaduw-k)}
.bk-stappen li.nu{background:var(--rood)!important;color:#fff}
.bk-stappen li.nu span{background:#fff!important;color:var(--rood)!important}
.bk-stappen li.klaar{background:#fff;color:var(--zwart)}
.bk-stappen li.klaar span{background:var(--rood)!important;color:#fff!important}
.bk-kaart,.bk-pil,.bk-seg,.bk-gekozen,.bk-terug,.bk-adres,.bk-noot,.bk-fout,.bk-code{border-radius:0!important}
.bk-terug{border-radius:50%!important}
.bk-kaart[aria-pressed="true"]{background:#FFF7D6;border-color:var(--geel-d)}
.bk-kaart[aria-pressed="true"] .bk-vink,.bk-pil[aria-pressed="true"]{background:var(--rood);color:#fff}
.bk-pil[aria-pressed="true"] small{color:#ffe0e0}
.bk-seg button[aria-pressed="true"]{background:var(--geel)}
.bk-overzicht{background:#fff;color:var(--tekst)}
.bk-overzicht h2{color:var(--rood)}
.bk-leeg,.ov-app small,.ov-rij.zacht,.ov-totaal small,.ov-noot,.ov-wanneer{color:var(--zacht)}
.ov-app{border-bottom-color:#eee}
.ov-totaal{border-top-color:var(--geel)}
.ov-noot .ic,.ov-wanneer .ic{color:var(--rood)}
.bk-overzicht a{color:var(--rood)}
.bk-tag{background:var(--rood);color:#fff;border-radius:0}
.bk-mbalk{background:var(--rood);border-radius:0}
.bk-mbalk b{color:var(--geel)}
.bk-code{background:var(--geel)}

@media (max-width:940px){
  .kop-in{display:flex!important;justify-content:space-between;min-height:68px}
  .logo{flex-direction:row;gap:8px}
  .hoofdmenu{display:flex;position:fixed;inset:calc(68px + 36px) 0 auto 0;flex-direction:column;align-items:stretch;gap:12px;background:#fff;padding:18px 16px 24px;transform:translateY(-130%);visibility:hidden;transition:transform .3s,visibility .3s;z-index:40;box-shadow:0 10px 20px rgba(0,0,0,.08)}
  .hoofdmenu.open{transform:none;visibility:visible}
  .hoofdmenu ul{flex-direction:column}
  .hoofdmenu ul a{font-size:20px}
  .menuknop{border-radius:0;border:0;background:var(--geel);box-shadow:none}
  .topbalk .wrap{justify-content:flex-start;gap:16px;overflow:hidden;white-space:nowrap}
  .held .knoppen .knop{min-width:0}
  .zweef-pil{display:none}
}
.pk-ic,.pkaart .pk-ic,.pkaart:nth-child(n) .pk-ic,.cat .cat-ic,.cat.c1 .cat-ic,.cat.c2 .cat-ic,.cat.c3 .cat-ic,.meerkaart .mk-ic{background:transparent!important;display:inline-flex!important;justify-self:start;align-self:flex-start;margin-bottom:12px}
.voet a,.voet .ls a{text-decoration:none}
.voet-in p a{text-decoration:underline}
.gegevens .ic,.regel .ic{width:26px!important;height:26px!important;flex:none}
.bk-ic{width:auto!important}
.bk-ic .ic{width:26px;height:26px}

/* ===== Winkelfoto's van Digibuddy in de koppen (14-11-2026) ===== */
.met-foto{position:relative;background:linear-gradient(90deg,rgba(231,35,41,.97) 0%,rgba(231,35,41,.93) 36%,rgba(231,35,41,.55) 55%,rgba(231,35,41,0) 72%),var(--foto) right center/cover no-repeat!important;min-height:440px;display:flex;align-items:center}
.held.met-foto{min-height:560px}
.met-foto>.wrap{width:min(1180px,100% - 32px)}
.met-foto .held-in{grid-template-columns:minmax(0,560px)}
.met-foto .held-beeld,.met-foto .game-beeld{display:none}
.met-foto .game-kop{grid-template-columns:minmax(0,600px)}
.met-foto .intro,.met-foto h1,.met-foto .kruimel{max-width:600px}
.paginakop.kop-donker.met-foto{background:linear-gradient(90deg,rgba(10,10,10,.95) 0%,rgba(10,10,10,.88) 38%,rgba(10,10,10,.4) 58%,rgba(10,10,10,0) 74%),var(--foto) right center/cover no-repeat!important}
@media (max-width:700px){
  .met-foto{background:linear-gradient(180deg,rgba(231,35,41,.15) 0%,rgba(231,35,41,.15) 34%,rgba(231,35,41,.97) 52%),var(--foto-m) center top/100% auto no-repeat,#E72329!important;padding-top:min(56vw,230px)!important;min-height:0}
  .held.met-foto{min-height:0}
  .paginakop.kop-donker.met-foto{background:linear-gradient(180deg,rgba(10,10,10,.1) 0%,rgba(10,10,10,.1) 34%,rgba(10,10,10,.96) 52%),var(--foto-m) center top/100% auto no-repeat,#0A0A0A!important}
}

/* ===== Alleen wit, rood en geel (user 14-11-2026) ===== */
:root{--creme:#FFFFFF;--paper:#FFFFFF;--grijs:#FFFFFF;--paper2:#FFFFFF}
body,.beloftes,.bezoek-s,.voet,.kleur-lime,.kleur-blauw{background:#fff!important}
.kleur-lime,.kleur-blauw{border-block:1px solid #f1f1f1!important}
.voet{border-top:4px solid var(--rood)}
.voet-onder{border-top-color:#f1f1f1}
/* zwarte vlakken worden rood */
.paginakop.kop-donker{background:var(--rood)!important}
.paginakop.kop-donker.met-foto{background:linear-gradient(90deg,rgba(231,35,41,.97) 0%,rgba(231,35,41,.93) 36%,rgba(231,35,41,.55) 55%,rgba(231,35,41,0) 72%),var(--foto) right center/cover no-repeat!important}
.kop-donker .chips li{border-color:#fff}
.kop-donker .chips .ic{color:var(--geel)}
.zijkaart{background:var(--rood)!important;color:#fff}
.zijkaart .regel span{color:#fff}
.zijkaart.geel{background:var(--geel)!important;color:var(--zwart)}
.tabbladen button[aria-selected="true"]{background:var(--rood)}
.bk-pil[aria-pressed="true"]{background:var(--rood)!important;color:#fff}
.kaart-label,.bk-mbalk{background:var(--rood)}
.zweefknop{background:var(--geel)!important}
/* grijze/crème vlakjes binnen kaarten worden wit of lichtgeel */
.ptabel caption{background:#FFF6CC!important}
.faq summary span{background:#FFF6CC!important}
.bk-noot{background:#FFF6CC!important}
.bk-adres{background:#fff!important}
.afspraak-cta{background:#FFF6CC!important}
.mac-blok{background:#fff}
.ptabel tbody tr:hover{background:#FFF9E0}
.veld input,.veld textarea,.bk-veld input,.bk-veld select,.bk-veld textarea,.bk-rij input,.keuze span,.bk-gekozen,.bk-terug{background:#fff!important}
.bk-terug:hover{background:var(--geel)!important}
.bk-gekozen{border-color:#eee!important}
.wkaart .groot,.tarief .groot{color:var(--rood)}
/* game-pc-tekening alleen nog rood/wit/geel (wordt verborgen zodra er een foto is) */
.fan path{fill:var(--geel)}
@media (max-width:700px){
  .paginakop.kop-donker.met-foto{background:linear-gradient(180deg,rgba(231,35,41,.15) 0%,rgba(231,35,41,.15) 34%,rgba(231,35,41,.97) 52%),var(--foto-m) center top/100% auto no-repeat,#E72329!important}
}
@media (max-width:700px){
  .met-foto,.paginakop.met-foto,.held.met-foto,.paginakop.kop-donker.met-foto{background:linear-gradient(180deg,rgba(231,35,41,0) 0,rgba(231,35,41,0) calc(56vw - 70px),#E72329 56vw),var(--foto-m) center top/100% auto no-repeat,#E72329!important;padding-top:calc(56vw + 8px)!important}
}

/* foto wint altijd van de oude kleurvlakken (kop-lime/roze/blauw) */
.met-foto.met-foto.met-foto{background:linear-gradient(90deg,rgba(231,35,41,.97) 0%,rgba(231,35,41,.93) 36%,rgba(231,35,41,.55) 55%,rgba(231,35,41,0) 72%),var(--foto) right center/cover no-repeat!important}
@media (max-width:700px){
  .met-foto.met-foto.met-foto{background:linear-gradient(180deg,rgba(231,35,41,0) 0,rgba(231,35,41,0) calc(56vw - 70px),#E72329 56vw),var(--foto-m) center top/100% auto no-repeat,#E72329!important}
}
/* logotekst in hoofdletters (user 14-11-2026) */
.woord{text-transform:uppercase;letter-spacing:.06em;font-size:17px}

/* ===== Mobiel zoals thephonelab.nl (14-11-2026) ===== */
.kop-wa,.mob-lijst,.menutekst{display:none}
.beloftes b{color:var(--rood)}
@media (max-width:940px){
  /* kop: "Menu" links, logo in het midden, WhatsApp rechts */
  .kop-in{display:grid!important;grid-template-columns:1fr auto 1fr;min-height:64px}
  .kop-in>.logo{grid-column:2;justify-self:center}
  .menuknop{grid-column:1;grid-row:1;justify-self:start;background:none!important;width:auto;height:auto;padding:6px 0}
  .menuknop span{display:none}
  .menutekst{display:inline;font:600 18px var(--kop);font-style:normal;color:var(--zwart);text-decoration:underline;text-underline-offset:4px}
  .menuknop[aria-expanded="true"] .menutekst::after{content:" ×"}
  .kop-wa{display:grid;grid-column:3;grid-row:1;justify-self:end;place-items:center;width:40px;height:40px;color:var(--zwart)}
  .kop-wa .ic{width:28px;height:28px}
  .logo .woord{font-size:14px}
  .logo-mon{width:38px;height:38px}
  .hoofdmenu{inset:calc(64px + 36px) 0 auto 0}
  /* rode balk: één regel in het midden */
  .topbalk .wrap{justify-content:center}
  .topbalk span:not(:first-child){display:none!important}
  .topbalk{font-size:15px}
}
@media (max-width:700px){
  /* hero: foto met de titel er gecentreerd overheen, verder niets */
  .held.met-foto.met-foto{background:linear-gradient(180deg,rgba(0,0,0,.05) 0%,rgba(0,0,0,.45) 100%),var(--foto-m) center/cover no-repeat,#E72329!important;padding:0!important;min-height:250px;display:flex;align-items:center;justify-content:center;text-align:center}
  .held.met-foto .held-in{display:block}
  .held.met-foto .label,.held.met-foto .intro,.held.met-foto .knoppen,.held.met-foto .chips{display:none}
  .held.met-foto h1{font-size:26px;margin:0;padding:24px 16px;text-shadow:0 2px 10px rgba(0,0,0,.35)}
  .held.met-foto h1 br{display:none}
  /* snelkeuze: witte balken met icoon en rood pijltje */
  .mob-lijst{display:block;background:#fff;padding:18px 0 6px}
  .mob-lijst .wrap{display:grid;gap:12px}
  .mob-lijst a{display:flex;align-items:center;gap:16px;background:#fff;box-shadow:var(--schaduw);padding:18px 18px;text-decoration:none;color:var(--zwart);font:600 17px var(--kop)}
  .mob-lijst a .ic{width:26px;height:26px;color:var(--zwart);stroke-width:1.5;flex:none}
  .mob-lijst a span{flex:1}
  .mob-lijst a b{color:var(--rood);font-size:26px;line-height:1;font-weight:700}
  /* beloftes onder elkaar met rode vinkjes */
  .beloftes{border:0}
  .beloftes ul{flex-direction:column;gap:16px;padding:22px 0;font-size:17px}
  .beloftes .ic{width:26px;height:26px}
  /* zwevende knoppen ook op mobiel */
  .zweef-pil{display:inline-block!important;font-size:15px;padding:12px 18px}
}
@media (max-width:940px){.menuknop span{display:none!important}.menuknop{border:0!important;box-shadow:none!important;min-width:0}}

/* ===== Subpagina's op mobiel zoals thephonelab.nl (14-11-2026): wit, terug-link, rode tussenkoppen ===== */
@media (max-width:700px){
  /* paginakop: geen foto, wit vlak, donkere titel, klein rood terug-linkje */
  .paginakop,.paginakop.met-foto.met-foto.met-foto,.paginakop.kop-lime,.paginakop.kop-roze,.paginakop.kop-blauw,.paginakop.kop-donker,.paginakop.kop-donker.met-foto{background:#fff!important;color:var(--zwart);padding:14px 0 6px!important;min-height:0!important;display:block;text-align:left}
  .paginakop.midden{text-align:center}
  .paginakop h1{color:var(--zwart)!important;font-size:30px;line-height:1.1;margin:8px 0 10px}
  .paginakop .gek{color:var(--zwart)!important}
  .paginakop .intro{color:var(--tekst)!important;font-size:16px;max-width:none}
  .paginakop .intro a{color:var(--rood)!important}
  .paginakop .kruimel{font-size:0;color:var(--rood)}
  .paginakop .kruimel a{display:none;font:700 14px var(--kop);color:var(--rood)!important;text-decoration:none}
  .paginakop .kruimel a:last-of-type{display:inline}
  .paginakop .kruimel a:last-of-type::before{content:"‹ ";font-size:18px}
  .paginakop .knoppen{margin:14px 0 6px;gap:10px}
  .paginakop .knoppen .knop{flex:1 1 100%;min-height:50px}
  .paginakop .knoppen .knop-wit{box-shadow:none!important;border:1.5px solid var(--rood)!important;color:var(--rood)!important}
  .paginakop .chips{gap:8px}
  .paginakop .chips li,.kop-donker .chips li{border:0;background:var(--rood);color:#fff;border-radius:0;font-size:13px;padding:6px 10px}
  .paginakop .chips .ic,.kop-donker .chips .ic{color:#fff}
  .game-beeld,.held-beeld{display:none}
  .game-kop{display:block}

  /* secties: wit, compact, rode tussenkoppen links */
  .sectie{padding:30px 0}
  .sectie .label{display:none}
  .kop2,.tekstblok h2,.mac-blok h2{color:var(--rood)!important;font-size:24px;line-height:1.15;margin-bottom:12px}
  .lead,.tekstblok p{font-size:16px}
  .kleur-ink,.kleur-lime,.kleur-blauw{background:#fff!important;color:var(--tekst);border:0!important}
  .kleur-ink .kop2{color:var(--rood)!important}
  .kleur-ink .klein-tekst,.kleur-ink .klein-tekst a{color:var(--zacht)}
  .kleur-ink .voordeel{border:0;box-shadow:var(--schaduw);background:#fff}
  .kleur-ink .voordeel p{color:var(--tekst)}
  .kleur-ink .voordeel .ic{color:var(--rood)}
  .kleur-ink .voordeel h3{color:var(--zwart)}
  .sectie-kop .knop{display:none}

  /* tabbladen als rode vierkante knopjes */
  .tabbladen{gap:8px}
  .tabbladen button{min-height:38px;padding:8px 12px;font-size:14px;border:1.5px solid var(--rood)!important;color:var(--rood);background:#fff}
  .tabbladen button .ic{display:none}
  .tabbladen button[aria-selected="true"]{background:var(--rood);color:#fff}

  /* prijstabel: rode kop, regels onder elkaar */
  .tabel-wrap{box-shadow:none!important;border:1px solid #eee!important}
  .ptabel caption{background:var(--rood)!important;color:#fff;font-size:17px}
  .ptabel tr{padding:12px 14px}
  .ptabel td strong{color:var(--rood)}

  /* kaarten: rijen zoals de lijst op de homepage */
  .cats,.meer-grid,.meer-grid.drie,.niveaus,.voordelen,.tarieven,.waarom{gap:12px}
  .cat,.meerkaart,.niveau,.tarief,.wkaart,.pkaart{padding:18px!important}
  .cat h3,.meerkaart h3,.niveau h3{font-size:19px}
  .cat p,.meerkaart p{font-size:15px}
  .meer{font-size:15px}
  .stappen{gap:28px}
  .stap{padding:26px 18px 18px}
  .faq summary{font-size:17px;padding:16px}

  /* contact en afspraak */
  .contact{gap:20px}
  .formulier{padding:18px!important}
  .zijkaart{padding:18px}
  .boek-s{padding-top:10px}
  .bk-hoofd{box-shadow:none!important;border:0!important;padding:0!important}
  .bk-stappen{margin-bottom:16px}

  /* bezoek-blok onderaan compacter */
  .bezoek-s .kaartje{display:none}
}
@media (max-width:700px){.ptabel caption{display:block;width:100%;box-sizing:border-box}.ptabel{display:block}}

/* ===== Toestelkaarten en prijs per model (14-11-2026) ===== */
.tgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-top:22px}
.tkaart{display:flex;flex-direction:column;gap:8px;background:#fff;box-shadow:var(--schaduw);padding:20px;text-decoration:none;color:var(--tekst);transition:transform .15s,box-shadow .15s}
.tkaart:hover{transform:translateY(-3px);box-shadow:0 0 5px rgba(10,10,10,.12),0 14px 26px -12px rgba(10,10,10,.3)}
.tk-kop{display:flex;align-items:center;gap:10px}
.tk-kop .ic{width:26px;height:26px;stroke-width:1.6;color:var(--zwart);flex:none}
.tk-kop b{font:700 18px/1.2 var(--kop);color:var(--zwart)}
.tk-tekst{font-size:14.5px;color:var(--zacht);flex:1}
.tk-prijs{font-size:14px;color:var(--zacht)}
.tk-prijs strong{color:var(--rood);font:700 17px var(--kop)}
.tkaart .meer{color:var(--rood);font-weight:700;font-size:15px}
.toestel-s{background:#fff}
.pz{margin-top:18px}
.pz-zoek{display:flex;align-items:center;gap:10px;border:1.5px solid #ddd;background:#fff;padding:0 14px;max-width:560px}
.pz-zoek:focus-within{border-color:var(--rood)}
.pz-zoek .ic{color:var(--zacht);width:20px;height:20px}
.pz-zoek input{flex:1;border:0;outline:0;font:400 17px var(--body);padding:14px 0;background:transparent;min-width:0}
.pz-modellen{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}
.pz-model{border:1.5px solid #e2e2e2;background:#fff;padding:9px 13px;font:600 14.5px var(--kop);color:var(--zwart);cursor:pointer}
.pz-model small{font-weight:400;color:var(--zacht)}
.pz-model:hover{border-color:var(--rood);color:var(--rood)}
.pz-model[aria-pressed="true"]{background:var(--rood);border-color:var(--rood);color:#fff}
.pz-model[aria-pressed="true"] small{color:#ffe0e0}
.pz-meer{font-size:14px;color:var(--zacht)}
.pz-detail{scroll-margin-top:120px}
.pz-detail .tabel-wrap{margin-top:10px}
.pz-plan a{color:var(--rood);font-weight:700;text-decoration:none;white-space:nowrap}
.pz-tabel{margin-top:34px}
.mtabel thead th{background:var(--rood);color:#fff;font-size:12.5px}
.mtabel td{white-space:nowrap;font-weight:600}
.mtabel tbody th{font-weight:600}
.bk-zoekmodel{margin-bottom:14px}
.bk-zoekmodel input{width:100%;font:400 17px var(--body);padding:13px 14px;border:1.5px solid #ddd;border-radius:0}
.bk-zoekmodel input:focus{outline:0;border-color:var(--rood)}
.bk-raster .vol{grid-column:1/-1}
@media (max-width:1080px){.tgrid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:940px){.tgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:700px){
  .tgrid{grid-template-columns:minmax(0,1fr);gap:10px}
  .tkaart{flex-direction:row;flex-wrap:wrap;align-items:center;padding:16px 18px}
  .tk-kop{flex:1}
  .tk-tekst,.tk-prijs{display:none}
  .tkaart .meer{font-size:0}
  .tkaart .meer::after{content:"›";font-size:26px;line-height:1}
  .toestel-s{display:none}
  .mtabel thead{display:none}
  .mtabel tr{padding:12px 14px}
  .mtabel tbody th{font-size:16px;margin-bottom:4px}
  .pz-plan{padding-top:6px!important}
  .pz-plan::before{content:""!important}
}

/* afspraakpagina op mobiel: geen zwevende knoppen over de totaalbalk; balk over de volle breedte */
@media (max-width:940px){
  body:has(#boeker) .zweef-rij{display:none}
  .bk-mbalk{width:100%!important;bottom:10px}
}

/* ===== Reviews zoals thephonelab.nl (rode band, carrousel) ===== */
.rv-balk{background:#fff;border-bottom:1px solid #eee}
.rv-balk a{display:flex;align-items:center;justify-content:center;gap:12px;padding:16px 0;color:var(--zwart);text-decoration:none;font-size:15.5px;flex-wrap:wrap;text-align:center}
.rv-balk .streep{width:1px;height:18px;background:#ccc}
.rv-sterren{color:var(--geel);letter-spacing:2px;font-size:18px;line-height:1;white-space:nowrap}
.rv-sterren .uit{color:#ddd}
.rv-s{background:var(--rood);color:#fff;padding:clamp(48px,6vw,72px) 0;text-align:center}
.rv-kop{color:#fff!important;font-size:clamp(26px,3vw,36px);margin-bottom:8px}
.rv-sub{color:rgba(255,255,255,.88);font-size:15px;margin:0 auto 22px;max-width:640px}
.rv-score{display:inline-flex;align-items:center;gap:12px;color:#fff;text-decoration:none;background:rgba(255,255,255,.12);padding:12px 20px}
.rv-score .g-logo{width:32px;height:32px;background:#fff;border-radius:50%;padding:5px}
.rv-score span{display:flex;flex-direction:column;align-items:flex-start;line-height:1.15}
.rv-score b{font-size:14px}.rv-score strong{font:700 26px var(--kop)}.rv-score small{font-size:14px;font-weight:400}.rv-score em{font-style:normal;font-size:13px;opacity:.85}
.rv-car{position:relative;display:flex;align-items:center;gap:12px;margin-top:30px}
.rv-baan{flex:1;display:flex;gap:0;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;outline:0}
.rv-baan::-webkit-scrollbar{display:none}
.rv-kaart{flex:0 0 33.333%;scroll-snap-align:start;margin:0;padding:6px 26px;border-right:1px dashed rgba(255,255,255,.45);display:flex;flex-direction:column;align-items:center;gap:12px}
.rv-kaart:last-child{border-right:0}
.rv-kaart blockquote{margin:0;font-size:15.5px;line-height:1.55;color:#fff;display:-webkit-box;-webkit-line-clamp:6;-webkit-box-orient:vertical;overflow:hidden}
.rv-kaart figcaption{font:700 15px var(--kop);color:#fff;margin-top:auto}
.rv-pijl{flex:none;width:40px;height:40px;border:1.5px solid rgba(255,255,255,.7);background:transparent;color:#fff;font-size:26px;line-height:1;cursor:pointer}
.rv-pijl:hover{background:#fff;color:var(--rood)}
.rv-alle{margin:24px 0 0}
.rv-alle a{color:#fff;font-weight:700}
@media (max-width:940px){.rv-kaart{flex-basis:50%}}
@media (max-width:700px){
  .rv-kaart{flex-basis:100%;padding:6px 10px;border:0}
  .rv-pijl{width:34px;height:34px;font-size:22px}
  .rv-balk a{font-size:14.5px;gap:8px;padding:14px 0}
  .rv-s .rv-kop{color:#fff!important}
}
@media (max-width:700px){.rv-balk a{flex-direction:column;gap:4px}.rv-balk .streep{display:none}}

/* ===== Footer zoals thephonelab.nl ===== */
.voet{background:#fff!important;color:var(--tekst);border-top:1px solid #eee!important;padding:0}
.voet-hulp{border-bottom:1px solid #eee;padding:44px 0}
.voet-hulp .wrap{display:flex;align-items:center;justify-content:center;gap:48px}
.vh-foto{width:180px;height:180px;border-radius:50%;flex:none;background:url(/img/foto/winkel-mobiel-780-logo.webp) 78% 20%/auto 135% no-repeat,var(--rood)}
.vh-tekst h2{color:var(--rood)!important;font-size:28px;margin:0 0 4px}
.vh-tekst h3{font-size:22px;margin:22px 0 2px;color:var(--zwart)}
.vh-tekst p{margin:0;color:var(--tekst)}
.vh-tekst .knoppen{margin:14px 0 0}
.voet-in{display:grid;grid-template-columns:1.2fr 1fr 1fr 1.2fr;gap:30px;padding:44px 0 10px}
.voet h2{color:var(--zwart)!important;font:700 15px var(--kop);margin:0 0 12px}
.vk-merk{color:var(--rood);font:700 15px/1.3 var(--kop);margin:0 0 12px}
.vk-merk span{color:var(--rood);font-weight:700}
.voet .ls{gap:7px}
.voet .ls a,.voet-onder a{color:var(--tekst);text-decoration:none;font-size:14.5px}
.voet .ls a:hover{color:var(--rood)}
.vk-social{display:flex;gap:12px;margin:0 0 22px}
.vk-social a{color:var(--zwart)}
.vk-social svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.vk-social a:hover{color:var(--rood)}
.voet-winkels{padding:26px 0 10px}
.voet-winkels h2{color:var(--rood)!important;font-size:22px!important;margin-bottom:16px}
.vw-raster{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:22px}
.vw{display:flex;flex-direction:column;gap:3px;font-size:14px}
.vw b{font:700 15px var(--kop);color:var(--zwart)}
.vw a{text-decoration:none;display:inline-flex;align-items:center;gap:5px;font-weight:700}
.vw .ic{width:14px;height:14px}
.vw-route{color:#2E8B3A!important}
.vw-tel{color:var(--rood)!important}
.vw-uren{display:inline-flex;align-items:center;gap:5px;color:var(--zacht)}
.voet-onder{border-top:1px solid #eee!important;margin-top:26px;padding:18px 0 90px;font-size:13px;color:var(--zacht)}
@media (max-width:940px){.voet-in{grid-template-columns:1fr 1fr}.vw-raster{grid-template-columns:1fr 1fr}}
@media (max-width:700px){
  .voet-hulp .wrap{flex-direction:column;gap:18px;text-align:center}
  .vh-foto{width:150px;height:150px}
  .voet-in{grid-template-columns:1fr 1fr;gap:24px}
  .voet-in>div:first-child{grid-column:1/-1}
}
.voet .vh-tekst h2{color:var(--rood)!important;font-size:28px!important;margin:0 0 4px}

/* ===== Over ons zoals thephonelab.nl/onze-specialisten ===== */
.over-held{background:linear-gradient(90deg,rgba(0,0,0,.45) 0%,rgba(0,0,0,.1) 55%,rgba(0,0,0,0) 100%),var(--foto) center 30%/cover no-repeat;min-height:420px;display:flex;align-items:flex-end;padding:0 0 46px}
.over-held h1{color:#fff;font-size:clamp(34px,4.5vw,56px);margin:6px 0 0;text-shadow:0 2px 14px rgba(0,0,0,.35)}
.over-held .kruimel,.over-held .kruimel a{color:rgba(255,255,255,.9)}
.over-team{text-align:center;padding-bottom:30px}
.over-kop{color:var(--rood)!important;font-size:clamp(26px,3vw,34px);margin-bottom:14px}
.over-intro{font-size:17px;color:var(--zwart);margin:0 auto 10px}
.sp-car{margin-top:26px;text-align:left}
.sp-baan{gap:22px}
.sp-kaart{flex:0 0 calc(25% - 17px);scroll-snap-align:start;background:#fff;box-shadow:var(--schaduw);text-decoration:none;color:var(--tekst);display:flex;flex-direction:column}
.sp-foto{display:block;aspect-ratio:1/1;background:var(--rood) center 25%/cover no-repeat}
.sp-kaart b{display:block;background:var(--zwart);color:#fff;text-align:center;font:700 16px var(--kop);padding:10px 8px}
.sp-tekst{padding:14px 16px 18px;font-size:14.5px;line-height:1.5}
.sp-kaart:hover b{background:var(--rood)}
.sp-car .rv-pijl{border-color:var(--rood);color:var(--rood);background:#fff}
.sp-car .rv-pijl:hover{background:var(--rood);color:#fff}
.over-werk-in{display:grid;grid-template-columns:1fr 1.1fr;gap:40px;align-items:center}
.over-werk h2{font-size:clamp(22px,2.4vw,28px);color:var(--zwart)!important;line-height:1.25}
.over-tekening{width:100%;max-width:440px}
@media (max-width:940px){.sp-kaart{flex-basis:calc(50% - 11px)}}
@media (max-width:700px){
  .over-held{background:linear-gradient(180deg,rgba(0,0,0,0) 40%,rgba(0,0,0,.5) 100%),var(--foto-m) center/cover no-repeat;min-height:300px;padding-bottom:24px}
  .over-held .kruimel{display:none}
  .sp-kaart{flex-basis:82%}
  .over-werk-in{grid-template-columns:1fr;text-align:center}
  .over-tekening{margin:0 auto;max-width:300px}
}

/* ===== SEO-pagina's per reparatie ===== */
.seo-twee{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:40px;align-items:start}
.seo-twee .kop2{font-size:clamp(22px,2.4vw,28px);margin-top:1.2em}
.seo-twee .kop2:first-child{margin-top:0}
.seo-lijst{list-style:none;padding:0;margin:0 0 10px;display:grid;gap:10px}
.seo-lijst li{display:flex;gap:10px;align-items:flex-start;font-size:16.5px}
.seo-lijst .ic{flex:none;width:22px;height:22px;padding:4px;border-radius:50%;background:var(--rood);color:#fff;stroke-width:3;margin-top:2px}
.seo-tip{display:flex;gap:10px;align-items:flex-start;background:#FFF6CC;padding:14px 16px;margin-top:18px}
.seo-tip .ic{color:var(--rood);flex:none;margin-top:3px}
.seo-zij{position:sticky;top:110px}
.seo-kaart{background:#fff;box-shadow:var(--schaduw);padding:22px;display:flex;flex-direction:column;gap:10px;border-top:5px solid var(--rood)}
.seo-kaart>b{font:700 19px var(--kop);color:var(--zwart)}
.seo-prijs{font-size:15px;color:var(--zacht)}
.seo-prijs strong{font:700 30px var(--kop);color:var(--rood)}
.seo-kaart ul{list-style:none;padding:0;margin:0;display:grid;gap:8px;font-size:15px}
.seo-kaart li{display:flex;gap:8px;align-items:center}
.seo-kaart li .ic{color:var(--rood)}
.seo-kaart .knop{width:100%}
.seo-filter{margin:0 0 14px}
.seo-tabel td{white-space:nowrap}
.seo-chips{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 26px}
.seo-chips a{border:1.5px solid var(--rood);color:var(--rood);padding:8px 12px;text-decoration:none;font:600 14.5px var(--kop);background:#fff}
.seo-chips a:hover{background:var(--rood);color:#fff}
.seo-chips.licht{margin-top:22px}
.kleur-ink .seo-chips a{background:#fff}
a.pkaart{text-decoration:none;color:inherit}
@media (max-width:940px){.seo-twee{grid-template-columns:minmax(0,1fr)}.seo-zij{position:static}}
@media (max-width:700px){.seo-tabel thead{display:none}.seo-chips a{font-size:13.5px;padding:7px 10px}}

/* ===== Kort antwoord bovenaan (goed voor zoekmachines en AI-assistenten) ===== */
.kort-s{background:#fff;padding:34px 0 0}
.kort-s h2{font-size:clamp(22px,2.4vw,28px);color:var(--zwart)!important;margin-bottom:10px}
.kort{font-size:17.5px;line-height:1.6;color:var(--zwart);border-left:5px solid var(--rood);padding:4px 0 4px 18px;margin:0}
.bijgewerkt{display:inline-flex;align-items:center;gap:6px;font-size:13.5px;color:var(--zacht);margin:12px 0 0}
.bijgewerkt .ic{width:15px;height:15px}
@media (max-width:700px){.kort-s{padding-top:24px}.kort{font-size:16.5px}}

/* ===== Prijzenpagina zoals thephonelab.nl/prijzen ===== */
.pr-kop{background:#fff;padding:30px 0 6px}
.pr-kop-in{display:grid;grid-template-columns:minmax(0,1fr) 240px;gap:30px;align-items:start}
.pr-kop h1{font:700 clamp(18px,1.8vw,22px)/1.4 var(--kop);color:var(--zwart);margin:10px 0 16px;max-width:760px}
.pr-zoekrij{display:flex;gap:12px;flex-wrap:wrap;align-items:stretch}
.pr-zoekrij .pz-zoek{flex:1;max-width:380px;border:2px solid var(--rood)}
.knop-rood{background:var(--rood)!important;color:#fff!important}
.pr-score{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;text-decoration:none;color:var(--tekst);font-size:14px;line-height:1.4;padding-top:14px}
.pr-score b{color:var(--rood)}
.pr-tabs{display:flex;flex-wrap:wrap;gap:4px 18px;margin:26px 0 6px;padding-bottom:12px;border-bottom:1px solid #eee}
.pr-tabs a{color:var(--zacht);text-decoration:none;font:600 13.5px var(--kop);text-transform:uppercase;letter-spacing:.03em;padding:4px 0}
.pr-tabs a:hover{color:var(--rood)}
.pr-lijst{padding-top:20px}
.pr-blok{margin-bottom:34px;scroll-margin-top:110px}
.pr-tabel thead th{background:var(--rood);color:#fff;font-size:12.5px;padding:12px 16px}
.pr-tabel thead th:first-child{font:700 16px var(--kop);text-transform:none;letter-spacing:0}
.pr-tabel tbody th{font-weight:400;font-size:14.5px}
.pr-tabel td{font-size:14.5px;white-space:nowrap}
.pr-tabel td,.pr-tabel tbody th{padding:10px 16px}
.pr-alle a{color:var(--rood);text-decoration:none;font-weight:600}
.pr-alle a:hover{text-decoration:underline}
.pr-tabel tbody tr:hover{background:#FFF9E0}
@media (max-width:940px){.pr-kop-in{grid-template-columns:1fr}.pr-score{flex-direction:row;justify-content:flex-start;padding-top:0}}
@media (max-width:700px){
  .pr-kop h1{font-size:17px}
  .pr-zoekrij .pz-zoek{max-width:none;flex-basis:100%}
  .pr-zoekrij .knop{flex:1 1 100%}
  .pr-tabs{flex-wrap:nowrap;overflow-x:auto;gap:16px;scrollbar-width:none}
  .pr-tabs::-webkit-scrollbar{display:none}
  .pr-tabs a{white-space:nowrap}
  .pr-tabel thead{display:table-header-group}
  .pr-tabel thead th:not(:first-child){display:none}
  .pr-tabel tr{padding:10px 14px}
  .pr-alle{padding-top:6px!important}
  .pr-alle::before{content:""!important}
}
@media (max-width:700px){.pr-tabel thead,.pr-tabel thead tr{display:block}.pr-tabel thead th:first-child{display:block;width:100%;box-sizing:border-box;padding:12px 14px}}

/* ===== Vergelijking per kwaliteit (zoals thephonelab.nl) ===== */
.kv-s{background:#fff}
.kv-kies{display:inline-flex;align-items:center;gap:12px;margin:6px 0 18px;font:600 15px var(--kop)}
.kv-kies select{font:400 16px var(--body);padding:10px 12px;border:1.5px solid var(--rood);background:#fff;max-width:320px}
.kv{background:#fff;box-shadow:var(--schaduw);margin:0 0 22px;overflow-x:auto}
.kv-tabel{width:100%;border-collapse:collapse;min-width:520px}
.kv-tabel caption{position:absolute;left:-9999px}
.kv-tabel thead td,.kv-tabel thead th{padding:22px 14px 14px;vertical-align:bottom;text-align:center;position:relative}
.kv-titel{text-align:left!important}
.kv-titel b{display:block;font:700 clamp(22px,2.4vw,30px)/1.05 var(--kop);color:var(--rood)}
.kv-titel span{font-size:14px;color:var(--zacht)}
.kv-tabel thead th b{display:block;font:700 15.5px/1.25 var(--kop);color:var(--zwart)}
.kv-prijs{display:block;font:700 18px var(--kop);color:#2E8B3A;margin-top:4px}
.kv-badge{position:absolute;top:0;left:50%;transform:translateX(-50%);background:var(--rood);color:#fff;font:700 11.5px var(--kop);font-style:normal;padding:4px 10px;white-space:nowrap}
.kv-top{background:#FFFBEA}
.kv-tabel tbody th{text-align:left;font-weight:600;font-size:14.5px;padding:12px 14px;color:var(--zwart);white-space:nowrap}
.kv-tabel tbody td{text-align:center;font-size:14.5px;padding:12px 14px}
.kv-tabel tbody tr{border-top:1px solid #eee}
.kv-tabel tbody tr:nth-child(odd){background:#FCFBF7}
.kv-tabel tfoot td{padding:16px 10px 20px;text-align:center}
.kv-tabel tfoot .knop{min-height:44px;font-size:12px!important;padding:10px 14px;white-space:nowrap;background:var(--geel)!important;color:var(--zwart)!important}
.kv-ster{color:#F5B400;letter-spacing:2px;font-size:16px}
.kv-ster .uit{color:#ddd}
.kv-kop3{font-size:22px;margin:28px 0 12px;color:var(--rood)!important}
.bk-kwal{margin-top:20px;padding-top:16px;border-top:2px dashed #eee}
.bk-kwal h3{font-size:19px;margin-bottom:10px}
.bk-kwal-rij{margin-bottom:12px}
.bk-kwal-rij>b{display:block;font:700 15px var(--kop);margin-bottom:6px}
.ov-optie{display:block;font-size:12.5px;color:var(--zacht)}
@media (max-width:700px){
  .kv-kies{display:flex;flex-direction:column;align-items:stretch;gap:6px}
  .kv-kies select{max-width:none}
  .kv-tabel{min-width:560px}
  .kv-titel b{font-size:20px}
}
.bk-kwal.vol{grid-column:1/-1;margin:0;padding:14px 16px;border:1.5px solid var(--geel-d);background:#FFFBEA;border-top:0}
.bk-kwal.vol>b{display:block;font:700 15px var(--kop);margin-bottom:8px}
.bk-kwal.vol .bk-uitleg{margin:8px 0 0;font-size:13.5px}

/* ===== Laptop kopen als de shop van thephonelab.nl (14-11-2026): typekeuze, filterbalk, productraster ===== */
.shop{background:#fff}
.shop-kop{font:700 26px var(--kop);margin:0 0 14px;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.shop-kop span{font-size:16px;font-weight:600;color:var(--rood)}
.shop-types{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 22px}
.shop-type{display:flex;align-items:center;gap:8px;padding:10px 16px;background:#fff;border:1.5px solid #E2E2E2;font:600 15px var(--kop);color:var(--zwart);cursor:pointer}
.shop-type .ic{width:22px;height:22px;flex:none;color:var(--rood)}
.shop-type small{font-size:12px;color:var(--zacht);font-weight:400}
.shop-type:hover{border-color:var(--rood)}
.shop-type.aan{border-color:var(--rood);background:var(--rood);color:#fff}
.shop-type.aan .ic,.shop-type.aan small{color:#fff}
.shop-balk{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:12px 0;border-top:1px solid #E6E6E6;border-bottom:1px solid #E6E6E6;margin-bottom:24px}
.shop-balk label{display:flex;align-items:center;gap:8px;font:600 14px var(--kop);color:var(--zwart)}
.shop-balk select{font:400 14px var(--body);padding:8px 30px 8px 10px;border:1.5px solid #DADADA;background:#fff;border-radius:0;color:var(--tekst)}
.shop-balk .rechts{margin-left:auto}
.shop-aantal{font-size:14px;color:var(--zacht)}
.shop-raster{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px 20px}
.pk[hidden]{display:none}
.pk a{display:flex;flex-direction:column;gap:4px;color:var(--tekst);text-decoration:none;height:100%}
.pk-foto{position:relative;display:block;background:#F4F4F4;aspect-ratio:1/1;margin-bottom:10px;overflow:hidden}
.pk-foto img{position:absolute;inset:10%;width:80%;height:80%;object-fit:contain;mix-blend-mode:multiply;transition:transform .25s}
.pk a:hover .pk-foto img{transform:scale(1.04)}
.pk-badge{position:absolute;top:10px;left:10px;z-index:1;background:var(--geel);color:var(--zwart);font:700 12px var(--kop);font-style:normal;text-transform:uppercase;letter-spacing:.03em;padding:4px 8px}
.pk-badge.nieuw{background:var(--rood);color:#fff}
.pk-merk{font-size:13px;color:var(--zacht);text-transform:uppercase;letter-spacing:.04em}
.pk-naam{font:600 16px/1.3 var(--kop);color:var(--zwart)}
.pk a:hover .pk-naam{text-decoration:underline}
.pk-spec{font-size:13.5px;color:var(--zacht)}
.pk-prijs{font:700 19px var(--kop);color:var(--zwart);margin-top:auto;padding-top:6px}
.pk-voorraad{font-size:13px;color:#1E7F3C;display:flex;align-items:center;gap:6px}
.pk-voorraad::before{content:"";width:8px;height:8px;border-radius:50%;background:#28A745;flex:none}
.pk-voorraad.uit{color:var(--zacht)}.pk-voorraad.uit::before{background:#bbb}
.shop-leeg{padding:30px;background:#F4F4F4;text-align:center}
.shop-noot{margin-top:28px}
@media (max-width:1000px){.shop-raster{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:720px){
  .shop-kop{font-size:22px}
  .shop-types{flex-wrap:nowrap;overflow-x:auto;margin:0 -16px 16px;padding:0 16px 4px;scrollbar-width:none}
  .shop-type{flex:none;padding:9px 12px;font-size:14px}
  .shop-balk{gap:8px}
  .shop-balk label{flex:1 1 45%;font-size:13px}
  .shop-balk label select{flex:1;min-width:0}
  .shop-balk .rechts{margin-left:0}
  .shop-aantal{flex-basis:100%}
  .shop-raster{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 12px}
  .pk-naam{font-size:14.5px}.pk-spec{font-size:12.5px}.pk-prijs{font-size:17px}
  .pk-badge{font-size:10.5px;top:6px;left:6px}
}