@font-face{font-family:"Archivo";src:url("fonts/archivo.woff") format("woff");font-weight:100 900;font-stretch:62% 125%;font-display:swap}
@font-face{font-family:"Caveat";src:url("fonts/caveat.woff") format("woff");font-weight:400 700;font-display:swap}
:root{--hand:"Caveat", "Segoe Print", cursive;
--primair:#16181b;--op-primair:#ffffff;--accent:#ffd23f;--op-accent:#1d1d1f;--primair-diep:#16181b;--accent-diep:#7f691f;--inkt:#16181b;--vlak:#f6f6f3;
--tekst:var(--inkt);--achtergrond:var(--vlak);
--zacht:color-mix(in srgb,var(--primair) 7%,var(--vlak));--wit:color-mix(in srgb,#fff 70%,var(--vlak));
--lijn:color-mix(in srgb,var(--inkt) 13%,transparent);--stil:color-mix(in srgb,var(--inkt) 68%,var(--vlak));
--hoek:22px;--briefje-1:#fbf5d9;--briefje-2:#f3e8b4;--briefje-3:#dccb85;--font:"Archivo", system-ui, sans-serif;--kop-stretch:82%;--kop-gewicht:760;--kop-spatie:-0.005em;--kop-woord:normal;--kop-schaal:1;
--maat:1160px;--ruimte:clamp(48px,6vw,84px);--t-klein:.9rem;--t-lead:clamp(1.15rem,.6vw + 1rem,1.35rem);
--t-h3:clamp(1.2rem,.5vw + 1.05rem,1.4rem);--t-h2:calc(clamp(1.75rem,2.4vw + 1rem,2.6rem) * var(--kop-schaal));--t-h1:calc(clamp(2.2rem,4.2vw + 1rem,3.9rem) * var(--kop-schaal))}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:96px}
body{margin:0;font:400 1.125rem/1.62 var(--font);color:var(--inkt);background:var(--vlak);font-kerning:normal;text-rendering:optimizeLegibility}
img{max-width:100%;height:auto;display:block}
[hidden]{display:none!important}
button{font:inherit;cursor:pointer}
h1,h2,h3,h4{font-stretch:var(--kop-stretch);font-weight:var(--kop-gewicht);letter-spacing:var(--kop-spatie);word-spacing:var(--kop-woord);line-height:1.08;margin:0 0 .45em;text-wrap:balance}
h1{font-size:var(--t-h1)}h2{font-size:var(--t-h2)}h3{font-size:var(--t-h3);line-height:1.2}
p,ul,ol,table,address{margin:0 0 1em}p,li{max-width:68ch}p{text-wrap:pretty}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:.18em}a:hover{text-decoration-thickness:2px}
strong{font-weight:700}
:focus-visible{outline:3px solid var(--primair);outline-offset:3px;border-radius:2px}
.wrap{width:min(var(--maat),100% - 40px);margin-inline:auto}
.lead{font-size:var(--t-lead);line-height:1.5;color:var(--stil)}
.skip{position:absolute;left:-9999px;top:8px;background:var(--vlak);color:var(--inkt);padding:10px 16px;z-index:100}.skip:focus{left:8px}

/* lijsten: een vinkje in de hoofdkleur */
main ul:not([class]){list-style:none;padding:0}
main ul:not([class])>li{position:relative;padding-left:1.7em;margin:.35em 0}
main ul:not([class])>li::before{content:"";position:absolute;left:.15em;top:.5em;width:.75em;height:.4em;border-left:2.5px solid var(--primair);border-bottom:2.5px solid var(--primair);transform:rotate(-45deg)}

/* knoppen */
.knoppen{display:flex;flex-wrap:wrap;gap:12px;margin-top:1.6em}
.knop{display:inline-flex;align-items:center;gap:.5em;min-height:50px;padding:12px 24px;border-radius:var(--hoek);background:var(--accent);color:var(--op-accent);font-weight:700;text-decoration:none;border:2px solid var(--accent);line-height:1.2}
.knop:hover{background:color-mix(in srgb,var(--accent) 88%,var(--inkt));border-color:color-mix(in srgb,var(--accent) 88%,var(--inkt))}
.knop.tweede{background:transparent;color:inherit;border-color:currentColor}.knop.tweede:hover{background:color-mix(in srgb,currentColor 8%,transparent)}
.knop svg{width:1.1em;height:1.1em;flex:none}
.knop{transition:background .15s,border-color .15s,transform .12s ease}.knop:active{transform:scale(.97)}
/* melding na versturen */
.melding{position:fixed;right:16px;bottom:16px;z-index:90;max-width:min(360px,calc(100% - 32px));padding:14px 18px;border-radius:12px;background:var(--inkt);color:var(--vlak);font-weight:600;font-size:.95rem;box-shadow:0 12px 32px -10px rgba(0,0,0,.45);opacity:0;transform:translateY(12px) scale(.98);transition:opacity .3s,transform .4s cubic-bezier(.2,.8,.2,1)}
.melding.in{opacity:1;transform:none}
@media(max-width:700px){.met-belbalk .melding{bottom:88px}}
/* lade op de telefoon */
dialog.lade{position:fixed;inset:auto 0 0 0;margin:0;width:100%;max-width:none;max-height:85vh;border:0;border-radius:22px 22px 0 0;padding:10px 20px 28px;background:var(--vlak);color:var(--inkt);transform:translateY(100%);transition:transform .45s cubic-bezier(.32,.72,0,1);touch-action:none}
dialog.lade.op{transform:none}dialog.lade::backdrop{background:rgba(0,0,0,0);transition:background .3s}dialog.lade.op::backdrop{background:rgba(0,0,0,.4)}
.lade-greep{width:44px;height:5px;border-radius:9px;background:var(--lijn);margin:2px auto 14px}
.lade-kop{font-weight:800;font-size:1.2rem;margin:0 0 12px}.lade-bel{width:100%;justify-content:center}
.lade-form{display:grid;gap:6px;margin-top:18px;padding-top:16px;border-top:1px solid var(--lijn)}.lade-of{margin:0;font-weight:700}
.lade-form label{font-size:var(--t-klein);font-weight:600}.lade-form input:not([type=checkbox]){font:inherit;padding:11px 12px;border:1.5px solid var(--lijn);border-radius:10px;background:#fff}
.lade .vink{display:flex;gap:10px;font-weight:400;font-size:.85rem;line-height:1.4;color:var(--stil)}.lade .hp{position:absolute;left:-9999px}.lade .b-form-ok{font-weight:700;margin:16px 0 0}
/* cijfers even breed, dan springt een prijs niet */
.reken,.chk-nummer,.melding{font-variant-numeric:tabular-nums}

/* kop van de site */
.kop{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--vlak) 94%,transparent);backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--lijn)}
.kop .wrap{display:flex;align-items:center;gap:20px;min-height:76px}
.logo{font-weight:800;font-stretch:var(--kop-stretch);font-size:1.3rem;letter-spacing:var(--kop-spatie);text-decoration:none;line-height:1;margin-right:auto;flex:none}.logo img{max-height:44px;width:auto;max-width:min(220px,46vw)}
.nav ul{list-style:none;margin:0;padding:0}.nav a{text-decoration:none;display:block;padding:10px 12px;font-weight:500;white-space:nowrap}
.nav a:hover,.nav a[aria-current]{text-decoration:underline;text-decoration-color:var(--primair);text-decoration-thickness:2px}
.nav summary{cursor:pointer;padding:10px 14px;font-weight:700;list-style:none;border:1.5px solid var(--lijn);border-radius:var(--hoek)}.nav summary::-webkit-details-marker{display:none}
.kop-knop{min-height:44px;padding:8px 18px;font-size:1rem}
.kop-bel,.kop-knop{white-space:nowrap;flex:none}
.kop-bel{min-height:44px;padding:8px 18px;font-size:1rem;background:var(--inkt);border-color:var(--inkt);color:var(--vlak)}.kop-bel:hover{background:color-mix(in srgb,var(--inkt) 85%,var(--vlak));border-color:transparent}
/* taal: één knop met een vlag, de andere talen klappen eronder uit */
.talen{position:relative;flex:none}
.talen summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:6px;padding:8px;border-radius:var(--hoek);font-weight:600;font-size:var(--t-klein)}
.talen summary::-webkit-details-marker{display:none}.talen summary:hover{background:var(--zacht)}
.talen summary span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.talen summary::after{content:"";width:.38em;height:.38em;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-.15em) rotate(45deg);opacity:.55}
.vlag{width:24px;height:16px;border-radius:3px;flex:none;box-shadow:0 0 0 1px rgba(0,0,0,.12)}
.talen nav{position:absolute;right:0;top:calc(100% + 6px);z-index:60;background:var(--vlak);color:var(--inkt);border:1px solid var(--lijn);border-radius:var(--hoek);padding:6px;min-width:170px;box-shadow:0 18px 40px -18px color-mix(in srgb,var(--inkt) 45%,transparent)}
.talen ul{list-style:none;margin:0;padding:0}
.talen a{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:calc(var(--hoek) * .7);text-decoration:none;font-weight:600;font-size:.95rem}
.talen a:hover{background:var(--zacht)}.talen a[aria-current]{background:var(--zacht);pointer-events:none}
@media(min-width:960px){.nav summary{display:none}.nav>details>ul{display:flex;gap:2px}.nav li{position:relative}
.nav li ul{display:none;position:absolute;left:0;top:100%;min-width:260px;background:var(--vlak);border:1px solid var(--lijn);border-radius:var(--hoek);padding:8px;z-index:20;box-shadow:0 18px 40px -18px color-mix(in srgb,var(--inkt) 40%,transparent)}
.nav li:hover>ul,.nav li:focus-within>ul{display:block}
.nav li.mega-item{position:static}
/* megamenu: over de volle breedte onder de kop, uitgelijnd op de inhoud van de pagina.
   Opent zacht bij hover en focus. Blijft even staan als je met de muis naar beneden gaat (zichtbaarheid met vertraging). */
.kop .wrap{position:static}
.nav .mega{position:absolute;left:0;right:0;top:100%;z-index:40;visibility:hidden;opacity:0;transform:translateY(-8px);pointer-events:none;
  transition:opacity .18s ease,transform .28s cubic-bezier(.2,.8,.2,1),visibility 0s linear .22s;
  background:var(--vlak);border-top:1px solid var(--lijn);box-shadow:0 40px 60px -40px color-mix(in srgb,var(--inkt) 45%,transparent),0 1px 0 var(--lijn)}
.nav .mega::before{content:"";position:absolute;left:0;right:0;bottom:100%;height:22px}
.nav .mega-item:hover>.mega,.nav .mega-item:focus-within>.mega{visibility:visible;opacity:1;transform:none;pointer-events:auto;transition-delay:.06s,.06s,0s}
.nav .mega-in{width:min(var(--maat),100% - 40px);margin-inline:auto;display:flex;gap:clamp(24px,3vw,48px);padding-block:clamp(28px,3vw,40px)}
.nav .mega-intro{flex:0 0 clamp(200px,20vw,260px);padding-right:clamp(16px,2vw,32px);border-right:1px solid var(--lijn)}
.nav .mega-titel{margin:0 0 8px;font-stretch:var(--kop-stretch);font-weight:var(--kop-gewicht);letter-spacing:var(--kop-spatie);font-size:1.75rem;line-height:1.05}
.nav .mega-uitleg{margin:0 0 16px;color:var(--stil);font-size:.98rem;line-height:1.5}
.kop .nav .mega .mega-alles{display:inline-flex;align-items:center;gap:6px;padding:0;font-weight:700;color:var(--primair)}
.kop .nav .mega .mega-alles:hover{background:none;text-decoration:underline;text-underline-offset:4px}
.nav .mega-kol{flex:1 1 0;min-width:0;max-width:380px}
.nav .mega .mega-kol ul{display:grid;gap:2px;position:static;min-width:0;background:none;border:0;padding:0;box-shadow:none}
.nav .mega-kop{margin:0 0 10px;padding:0 14px;font-size:.78rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--primair)}
.nav .mega-kol a{display:grid;grid-template-columns:1fr auto;align-items:center;column-gap:12px;white-space:normal;padding:12px 14px;border-radius:calc(var(--hoek) * .8);font-weight:700;font-size:1.05rem;line-height:1.25;transition:background .15s}
.nav .mega-kol a span{grid-column:1;display:block;font-size:.88rem;font-weight:400;color:var(--stil);margin-top:3px}
.nav .mega-kol a .mega-pijl{grid-column:2;grid-row:1/span 2}
.nav .mega a:hover,.nav .mega a[aria-current]{text-decoration:none;background:var(--zacht);color:var(--primair)}
.nav .mega-pijl{width:18px;height:18px;flex:none;opacity:0;transform:translateX(-6px);transition:opacity .15s,transform .2s cubic-bezier(.2,.8,.2,1)}
.nav .mega a:hover .mega-pijl,.nav .mega a:focus-visible .mega-pijl,.nav .mega-alles .mega-pijl{opacity:1;transform:none}
.nav .mega-foto{flex:0 0 clamp(220px,24vw,320px);margin:0;position:relative;border-radius:var(--hoek);overflow:hidden;align-self:stretch;min-height:200px}
.nav .mega-foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.nav .mega-foto figcaption{position:absolute;left:0;right:0;bottom:0;padding:40px 16px 14px;color:#fff;font-weight:700;line-height:1.3;background:linear-gradient(0deg,rgba(0,0,0,.7),transparent)}
/* tegels met foto in het megamenu (bijv. de categorieën van een winkel) */
.nav .mega-kol.mega-tegels{flex:2 1 0;max-width:none}
.nav .mega .mega-tegels ul{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.nav .mega .mega-tegels ul:has(>li:nth-child(5)){grid-template-columns:repeat(3,minmax(0,1fr))}
.nav .mega .mega-tegels a.mega-tegel{display:flex;flex-direction:column;align-items:stretch;gap:0;padding:0;border-radius:18px;overflow:hidden;background:var(--zacht);height:100%;transition:transform .2s cubic-bezier(.2,.8,.2,1),box-shadow .2s}
.nav .mega .mega-tegels a.mega-tegel:hover{transform:translateY(-2px);box-shadow:0 14px 28px -16px color-mix(in srgb,var(--inkt) 55%,transparent);background:var(--zacht)}
.nav .mega-tegel img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover}
.nav .mega .mega-kol .mega-tegel .mega-tegel-naam{display:block;margin:0;padding:10px 14px 12px;font-weight:700;font-size:1rem;line-height:1.2;color:var(--inkt)}
.nav .mega .mega-kol .mega-tegel .mega-tegel-naam span{display:block;margin-top:3px;font-size:.82rem;font-weight:400;color:var(--stil)}
.nav .mega .mega-tegels a.mega-tegel-alles{background:var(--primair);color:#fff;justify-content:flex-end;flex-direction:row;align-items:flex-end;padding:14px}
.nav .mega .mega-tegels a.mega-tegel-alles:hover{background:color-mix(in srgb,var(--primair) 85%,#000);color:#fff}
.nav .mega .mega-kol .mega-tegel-alles .mega-tegel-naam{flex:1;padding:0;color:#fff;font-size:1.1rem}.nav .mega .mega-kol .mega-tegel-alles .mega-tegel-naam span{color:color-mix(in srgb,#fff 75%,var(--primair))}
.nav .mega-tegel-alles .mega-pijl{opacity:1;transform:none}
.nav .mega-voet{border-top:1px solid var(--lijn);background:var(--zacht)}
.nav .mega-voet-in{width:min(var(--maat),100% - 40px);margin-inline:auto;display:flex;justify-content:flex-end;align-items:center;gap:14px;padding-block:12px;font-size:.95rem;color:var(--stil)}
.nav .mega .mega-voet a{padding:0;font-weight:700;color:var(--primair)}.nav .mega .mega-voet a:hover{background:none;text-decoration:underline}
.nav .mega-item>a::after{content:"";display:inline-block;width:.4em;height:.4em;margin-left:.45em;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-.2em) rotate(45deg);opacity:.6;transition:transform .2s}
.nav .mega-item:hover>a::after,.nav .mega-item:focus-within>a::after{transform:translateY(.05em) rotate(225deg)}
.nav .nav-ikoon{margin-left:4px}.nav .nav-ikoon+.nav-ikoon{margin-left:0}
.nav .nav-hart .nav-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}}}
@media(min-width:960px) and (max-width:1279px){.nav a{padding:10px 8px;font-size:.97rem}.kop .wrap{gap:12px}.kop-bel{padding:8px 13px}.kop-bel span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}}
/* Met een extra knop in de kop (bijv. naar de webshop) is de ruimte eerder op: de belknop wordt dan eerder alleen een icoon. */
@media(min-width:1280px) and (max-width:1479px){.kop:has(.kop-knop) .nav a{padding:10px 10px}.kop:has(.kop-knop) .wrap{gap:14px}.kop:has(.kop-knop) .kop-bel{padding:8px 13px}.kop:has(.kop-knop) .kop-bel span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}}
@media(max-width:959px){.nav .mega-intro,.nav .mega-foto,.nav .mega-voet,.nav .mega-pijl,.nav .mega-tegel img{display:none}.nav .mega a .mega-tegel-naam{display:inline}.nav .mega .mega-kol ul{padding-left:0}.nav .mega-kop{margin:10px 0 2px;font-size:.82rem;font-weight:700;color:var(--primair)}.nav .mega a span{display:none}.nav .mega{padding-left:16px}.nav .mega a{padding:7px 12px}.nav>details[open]>ul{max-height:calc(100vh - 80px);overflow-y:auto;position:absolute;left:0;right:0;top:100%;background:var(--vlak);padding:12px 20px 20px;border-bottom:1px solid var(--lijn);z-index:20}.nav li ul{padding-left:16px}
.kop-bel{display:none}.kop-knop{padding:6px 14px;min-height:40px;font-size:.92rem}}
.nav-bol{display:inline-grid;place-items:center;min-width:1.45em;height:1.45em;padding:0 .4em;margin-left:.4em;border-radius:999px;background:var(--accent);color:var(--op-accent);font-size:.72rem;font-weight:800;line-height:1;vertical-align:.12em}
.nav-ikoon a{display:flex;align-items:center;gap:6px;position:relative}.nav-ikoon svg{width:20px;height:20px;flex:none}
.nav-hart .nav-bol{position:absolute;top:2px;right:0;margin:0;font-size:.65rem}
/* fotovorm logo: één grote ronde hoek boven en een schuine kant, als de vormen in een logo.
   Foto rechts van de tekst: ronde hoek linksboven, schuin aan de linkerkant. Foto links: gespiegeld. */
.fotovorm-logo{--fv-hoek:clamp(36px,7vw,104px)}
.fotovorm-logo .b-hero-beeld img,.fotovorm-logo .b-foto-rechts figure img{border-radius:var(--fv-hoek) 0 0 0;clip-path:polygon(0 0,100% 0,100% 100%,9% 100%)}
.fotovorm-logo .b-foto-links figure img,.fotovorm-logo .b-persoon img{border-radius:0 var(--fv-hoek) 0 0;clip-path:polygon(0 0,100% 0,91% 100%,0 100%)}
/* smalle telefoon: logo, menu en knop in de kop passen naast elkaar */
@media(max-width:479px){.kop .wrap{gap:8px}.logo img{max-width:30vw}.kop-knop{padding:6px 10px;font-size:.82rem}}
/* logogrootte uit het thema: geldt voor elke ontwerpstijl */
body.logo-groot .logo img{max-height:60px;max-width:min(290px,50vw)}
body.logo-xl .logo img{max-height:76px;max-width:min(360px,56vw)}
@media(max-width:959px){body.logo-groot .logo img{max-height:50px}body.logo-xl .logo img{max-height:58px}}
@media(max-width:479px){body.logo-groot .logo img{max-width:42vw}body.logo-xl .logo img{max-width:48vw}}

/* secties: vaste ruimte, achtergrond als variant */
main>section{padding-block:var(--ruimte)}
/* twee lichte secties na elkaar: geen dubbele witruimte */
main>section:not(:is([class*=bg-],.b-cta,.b-check-accent,.b-kaarten:not(.k-licht),.b-reviews:not(.rv-licht),.b-form,.b-hero-achter,.b-check-doek,.zs-doek,.zs-opzij,.b-bezorg-doek,.kh-doek,.b-kenmerken))+section:not(:is([class*=bg-],.b-cta,.b-check-accent,.b-kaarten:not(.k-licht),.b-reviews:not(.rv-licht),.b-form)){padding-top:0}
.bg-zacht{background:var(--zacht)}.bg-donker{background:var(--inkt);color:var(--vlak)}.bg-donker .lead{color:color-mix(in srgb,var(--vlak) 80%,var(--inkt))}
.bg-donker ul:not([class])>li::before{border-color:var(--accent)}
.bg-primair{background:var(--primair);color:var(--op-primair)}

/* briefje: een geel memo in handschrift, helemaal in CSS. Scherp op elk scherm, tekst aan te passen. */
.briefje{position:relative;width:min(100%,300px);min-height:200px;padding:34px 30px 34px;margin:0;font-family:var(--hand);font-weight:700;font-size:clamp(1.6rem,1.2vw + 1.05rem,2rem);line-height:1.12;color:#1d1b16;
background:linear-gradient(170deg,var(--briefje-1) 0%,var(--briefje-1) 40%,var(--briefje-2) 100%);transform:rotate(-2.5deg);
border-radius:2px 2px 2px 2px;box-shadow:0 1px 1px rgba(0,0,0,.06),0 16px 28px -16px rgba(20,20,10,.35);
clip-path:polygon(0 0,100% 0,100% 82%,82% 100%,0 100%);transition:transform .35s cubic-bezier(.2,.8,.2,1);display:flex;flex-direction:column;justify-content:space-between}
.briefje::before{content:"";position:absolute;inset:0 0 auto 0;height:26px;background:linear-gradient(rgba(0,0,0,.04),transparent)}
.briefje::after{content:"";position:absolute;right:0;bottom:0;width:18%;height:18%;background:linear-gradient(135deg,var(--briefje-3) 0%,var(--briefje-2) 45%,var(--briefje-3) 50%,rgba(0,0,0,0) 51%)}
.briefje p{margin:0;max-width:none}.briefje .groet{display:block;margin-top:18px}
.briefje:hover{transform:rotate(0deg) translateY(-3px)}
@media(prefers-reduced-motion:reduce){.briefje:hover{transform:rotate(-2.5deg)}}

/* voet */
.voet{background:var(--inkt);color:color-mix(in srgb,var(--vlak) 82%,var(--inkt));padding:64px 0 40px;font-size:1rem}
.voet .wrap{display:grid;gap:32px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.voet strong{color:var(--vlak);font-stretch:var(--kop-stretch);font-size:1.25rem;display:block;margin-bottom:.5em}
.voet address{font-style:normal}.voet ul{list-style:none;padding:0;margin:0}.voet li{margin:.3em 0}.voet a{text-decoration:none}.voet a:hover{text-decoration:underline}
.voet-kop{font-size:1rem!important;margin-bottom:.6em!important}.voet-tijden li{display:grid;grid-template-columns:6.2em auto;gap:4px 16px;max-width:300px;white-space:nowrap;font-variant-numeric:tabular-nums}.voet-tijden span{color:var(--vlak);white-space:normal}
.voet .klein{grid-column:1/-1;border-top:1px solid color-mix(in srgb,var(--vlak) 18%,transparent);padding-top:20px;font-size:var(--t-klein);display:flex;gap:16px;flex-wrap:wrap}

/* belbalk op de telefoon */
.belbalk{display:none}
@media(max-width:700px){.belbalk{display:flex;position:fixed;left:12px;right:12px;bottom:12px;z-index:60;justify-content:center;box-shadow:0 10px 30px -8px color-mix(in srgb,var(--inkt) 50%,transparent)}body.met-belbalk{padding-bottom:84px}}



@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

.pen{position:relative;white-space:nowrap;display:inline-block;isolation:isolate}
.pen svg{position:absolute;left:-9%;top:-22%;width:118%;height:150%;z-index:-1;overflow:visible;pointer-events:none}
.pen path{fill:none;stroke:var(--accent);stroke-width:3.2;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;vector-effect:non-scaling-stroke;transition:stroke-dashoffset 1.1s cubic-bezier(.6,.1,.3,1) .25s}
.pen.zien path{stroke-dashoffset:0}
@media(prefers-reduced-motion:reduce){.pen path{stroke-dashoffset:0}}
.cb-scherm{position:fixed;inset:0;z-index:69;background:rgba(0,0,0,.5);pointer-events:none;animation:cb-in .25s ease-out}
.cb{position:fixed;left:16px;right:16px;bottom:16px;z-index:70;max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1fr auto;gap:20px 40px;align-items:center;background:var(--achtergrond);color:var(--tekst);border-radius:var(--hoek);padding:32px 40px;box-shadow:0 30px 80px rgba(0,0,0,.35);font-size:17px;line-height:1.5;animation:cb-in .3s ease-out}
.cb:focus,.cb:focus-visible{outline:none}
.cb b{display:block;font-size:22px;line-height:1.25;margin-bottom:6px}.cb p{margin:0;max-width:62ch}
.cb-k{display:flex;gap:12px;flex-wrap:wrap}.cb-k button{min-width:170px;min-height:52px;padding:12px 22px;border-radius:var(--hoek);border:2px solid var(--tekst);font:inherit;font-weight:700;cursor:pointer;background:var(--achtergrond);color:var(--tekst)}
.cb-k button.ja{background:var(--tekst);color:var(--achtergrond)}
.cb-k button:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.cb-link{background:none;border:0;color:inherit;font:inherit;text-decoration:underline;cursor:pointer;padding:0;justify-self:start}
@keyframes cb-in{from{opacity:0}to{opacity:1}}
@media(max-width:900px){.cb{grid-template-columns:1fr;padding:24px 22px;font-size:16px}.cb-k button{flex:1;min-width:130px}}
@media(max-width:600px){.cb{left:8px;right:8px;bottom:8px}.cb b{font-size:20px}}
@media(prefers-reduced-motion:reduce){.cb,.cb-scherm{animation:none}}
.b-hero{padding-block:clamp(48px,7vw,104px) clamp(56px,8vw,112px)}
.b-hero .wrap{display:grid;gap:clamp(32px,5vw,72px);align-items:center}
.b-hero-twee .wrap{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
@media(max-width:860px){.b-hero-twee .wrap{grid-template-columns:1fr}}
.b-hero h1{max-width:22ch}.b-hero-twee h1{max-width:18ch;font-size:calc(clamp(2.1rem,3.6vw + 1rem,3.5rem) * var(--kop-schaal,1))}
.b-hero-lang h1,.b-hero-twee.b-hero-lang h1{font-size:calc(clamp(1.9rem,2.6vw + 1rem,2.9rem) * var(--kop-schaal,1));max-width:24ch}
.b-hero .lead{margin-top:1.1em;max-width:52ch}
.b-hero-achter{position:relative;isolation:isolate;color:#fff;min-height:min(78vh,640px);display:flex;align-items:flex-end;padding-block:clamp(120px,16vw,200px) clamp(48px,6vw,80px)}
.b-hero-achter .wrap{width:min(var(--maat),100% - 40px)}
.b-hero-doek{position:absolute;inset:0;z-index:-1}.b-hero-doek img{width:100%;height:100%;object-fit:cover}
.b-hero-doek::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,12,14,.82) 0%,rgba(10,12,14,.55) 45%,rgba(10,12,14,.1) 100%),linear-gradient(0deg,rgba(10,12,14,.55),transparent 55%)}
.b-hero-achter .lead{color:rgba(255,255,255,.88)}.b-hero-achter .knop.tweede{color:#fff}
@media(max-width:860px){.b-hero-doek::after{background:linear-gradient(0deg,rgba(10,12,14,.88) 15%,rgba(10,12,14,.35) 100%)}}
.b-hero-beeld img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--hoek)}
.werkbon{position:relative;background:var(--wit);color:var(--inkt);border:2px solid var(--inkt);border-radius:var(--hoek);box-shadow:8px 8px 0 var(--accent)}
.werkbon-kop{background:var(--primair);color:var(--op-primair);padding:22px 24px 26px;border-radius:calc(var(--hoek) - 2px) calc(var(--hoek) - 2px) 0 0;position:relative}
.werkbon-kop::after{content:"";position:absolute;left:12px;right:12px;bottom:-6px;height:12px;background:radial-gradient(circle at 6px 6px,var(--wit) 4px,transparent 4.5px) 0 0/18px 12px repeat-x}
.werkbon-kop p{margin:0 0 6px;font-weight:600;font-size:1.05rem;opacity:.92}
.werkbon-nummer{display:flex;align-items:center;gap:.4em;font-stretch:var(--kop-stretch);font-weight:800;font-size:clamp(1.9rem,2.4vw + 1rem,2.6rem);line-height:1;text-decoration:none;letter-spacing:var(--kop-spatie);white-space:nowrap}
.werkbon-nummer svg{width:.75em;height:.75em;flex:none}
.werkbon-form{padding:22px 24px 24px;display:grid;gap:4px}
.werkbon-of{margin:0 0 6px;font-weight:700}
.werkbon label{font-size:var(--t-klein);font-weight:600;margin-top:6px}
.werkbon input:not([type=checkbox]),.werkbon textarea{width:100%;font:inherit;font-size:1rem;padding:11px 12px;border:1.5px solid var(--lijn);border-radius:calc(var(--hoek) * .6);background:#fff;color:var(--inkt)}
.werkbon input:focus,.werkbon textarea:focus{border-color:var(--primair);outline:2px solid color-mix(in srgb,var(--primair) 35%,transparent);outline-offset:0}
.werkbon .vink{display:flex;gap:10px;align-items:flex-start;font-weight:400;font-size:.85rem;line-height:1.4;margin:10px 0 6px;color:var(--stil)}.werkbon .vink input{margin-top:2px;width:18px;height:18px;flex:none;accent-color:var(--primair)}
.werkbon .knop{width:100%;justify-content:center;margin-top:6px}
.werkbon .hp{position:absolute;left:-9999px}
.werkbon .b-form-ok{margin:0;padding:24px;font-weight:700;font-size:1.15rem}
.b-stappen-lijst{list-style:none;counter-reset:stap;padding:0;margin:clamp(28px,4vw,48px) 0 8px;display:grid;gap:clamp(20px,3vw,36px);grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr))}
.b-stappen-lijst>li{counter-increment:stap;position:relative;padding-top:52px}
.b-stappen-lijst>li::before{content:counter(stap);position:absolute;top:0;left:0;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--primair) 12%,var(--vlak));color:var(--primair);font-weight:800;font-size:1rem;font-variant-numeric:tabular-nums}
.b-stappen-lijst>li::after{content:"";position:absolute;top:18px;left:48px;right:-12px;border-top:2px dotted color-mix(in srgb,var(--primair) 35%,transparent)}
.b-stappen-lijst>li:last-child::after{display:none}
@media(max-width:700px){.b-stappen-lijst>li::after{display:none}}
.b-stappen .wrap>p:last-child{margin:clamp(28px,3vw,40px) 0 0}
.b-stappen-lijst h3{margin-bottom:.35em}.b-stappen-lijst p{color:var(--stil)}.b-stappen-lijst p:last-child{margin-bottom:0}
.b-tekst .b-tekst-inhoud{max-width:68ch}
@media(min-width:900px){.b-tekst-naast .b-tekst-inhoud{max-width:none;display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);column-gap:clamp(40px,6vw,96px);align-items:start}
.b-tekst-naast .b-tekst-inhoud>*{grid-column:2}.b-tekst-naast .b-tekst-inhoud>:is(h1,h2){grid-column:1;grid-row:1 / span 20;position:sticky;top:110px;padding-top:.1em;border-top:3px solid var(--accent);padding-top:.5em}}
.b-tekst h2{margin-bottom:.6em}
.b-tekst-foto .wrap{display:grid;gap:clamp(32px,5vw,72px);align-items:center;grid-template-columns:minmax(0,6fr) minmax(0,5fr)}
.b-foto-links .wrap{grid-template-columns:minmax(0,5fr) minmax(0,6fr)}.b-foto-links figure{order:-1}
@media(max-width:820px){.b-tekst-foto .wrap,.b-foto-links .wrap{grid-template-columns:1fr}.b-foto-links figure{order:0}}
.b-tekst-briefje{display:grid;place-items:center}
.t-kader>.wrap{background:var(--zacht);border-radius:calc(var(--hoek) * 1.8);padding:clamp(26px,4.5vw,60px)}
.t-kader-accent>.wrap{background:color-mix(in srgb,var(--accent) 14%,var(--vlak))}
.t-kader.b-tekst-naast .b-tekst-inhoud>:is(h1,h2){border-top:0;padding-top:0;color:var(--primair-diep,var(--primair))}
.b-tekst figure{margin:0}.b-tekst figure img{width:100%;border-radius:var(--hoek)}

.b-reviews{background:var(--zacht)}.b-reviews.rv-licht{background:transparent}.rv-licht .rv-lijst figure{box-shadow:0 0 0 1px var(--lijn)}
.rv-kop{display:flex;flex-wrap:wrap;gap:16px 32px;align-items:flex-end;justify-content:space-between;margin-bottom:clamp(24px,3vw,40px)}
.rv-kop h2{margin-bottom:.3em}
.rv-score{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0}
.rv-score strong{font-stretch:var(--kop-stretch);font-weight:800;font-size:clamp(2.6rem,4vw,3.6rem);line-height:1;letter-spacing:-.02em}
.rv-score>span:last-child{color:var(--stil);font-size:.95rem}
.rv-sterren{color:#f2a900;letter-spacing:2px;font-size:1.05rem;white-space:nowrap}.rv-sterren span{color:color-mix(in srgb,var(--inkt) 18%,transparent)}
.rv-score .rv-sterren{font-size:1.3rem}
.rv-raster{display:grid;gap:clamp(24px,3vw,48px);align-items:start}
.rv-raster.met-briefje{grid-template-columns:minmax(0,1fr) minmax(220px,300px)}
.rv-raster>.briefje{position:sticky;top:110px}
@media(max-width:860px){.rv-raster.met-briefje{grid-template-columns:1fr}.rv-raster>.briefje{position:static;justify-self:center}}
.rv-lijst{list-style:none;margin:0;padding:0;display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr))}.rv-lijst blockquote{max-width:70ch}
.rv-lijst figure{margin:0;height:100%;background:var(--wit);border-radius:var(--hoek);padding:22px 22px 24px;display:flex;flex-direction:column;gap:10px}
.rv-lijst figcaption{display:flex;align-items:center;gap:12px}
.rv-lijst figcaption>span:not(.rv-letter,.rv-via){display:flex;flex-direction:column;line-height:1.3;flex:1;min-width:0}
.rv-lijst figcaption time,.rv-lijst figcaption>span>span{font-size:.85rem;color:var(--stil)}
.rv-letter{flex:none;width:42px;height:42px;border-radius:50%;color:#fff;display:grid;place-items:center;font-weight:700;font-size:1.1rem}
.rv-lijst figcaption img{width:42px;height:42px;border-radius:50%;object-fit:cover}
.rv-bron{width:20px;height:20px;flex:none}.rv-via{flex:none;font-size:.75rem;font-weight:700;color:var(--stil);border:1px solid var(--lijn);border-radius:99px;padding:2px 8px;white-space:nowrap}
.rv-lijst blockquote{margin:0}.rv-lijst blockquote p{margin:0 0 .5em;max-width:none}.rv-lijst blockquote p:last-child{margin:0}
/* uitgelicht: twee kolommen, de eerste review groot met foto, de derde donker, gele sterren */
.rv-uitgelicht .rv-sterren{color:#fbbc05}
.rv-uitgelicht .rv-lijst{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:20px}
.rv-uitgelicht .rv-lijst figure{border-radius:28px;padding:24px 26px;background:var(--wit)}
.rv-uitgelicht.rv-licht .rv-lijst figure{background:var(--zacht);box-shadow:none}
.rv-uitgelicht .rv-groot{grid-row:span 2}
.rv-uitgelicht .rv-lijst .rv-groot figure{padding:0;overflow:hidden;background:var(--wit);box-shadow:0 0 0 1.5px color-mix(in srgb,var(--primair) 12%,transparent)}
.rv-uitgelicht .rv-groot figure>:not(.rv-foto){margin-inline:26px}.rv-uitgelicht .rv-groot figure>:last-child{margin-bottom:26px}
.rv-uitgelicht .rv-groot figure>figcaption:first-child{margin-top:24px}
.rv-foto{background:#fff;padding-top:12px;margin-bottom:12px}.rv-foto img{display:block;width:100%;height:260px;object-fit:contain}
.rv-uitgelicht .rv-groot blockquote{font-size:clamp(1.25rem,.8vw + 1rem,1.6rem);line-height:1.3}
.rv-uitgelicht .rv-lijst .rv-donker figure{background:var(--primair);color:#fff}.rv-uitgelicht .rv-donker :is(blockquote,blockquote p,strong){color:#fff}
.rv-uitgelicht .rv-donker figcaption time,.rv-uitgelicht .rv-donker figcaption>span>span{color:color-mix(in srgb,#fff 75%,var(--primair))}
.rv-uitgelicht .rv-donker .rv-sterren span{color:rgba(255,255,255,.3)}.rv-uitgelicht .rv-donker .rv-bron{background:#fff;border-radius:50%;padding:3px;width:26px;height:26px}
@media(max-width:760px){.rv-uitgelicht .rv-lijst{grid-template-columns:1fr}.rv-uitgelicht .rv-groot{grid-row:auto}.rv-foto img{height:200px}}

.b-cta{padding-block:clamp(48px,6vw,80px)}
.b-cta .wrap{display:flex;gap:24px 48px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.b-cta .wrap>div{max-width:60ch}.b-cta h2{margin-bottom:.3em}.b-cta p{margin-bottom:0}.b-cta .knoppen{margin-top:0}
.b-cta-hoofdkleur{background:var(--primair);color:var(--op-primair)}
.b-cta-accent{background:var(--accent);color:var(--op-accent)}.b-cta-accent .knop{background:var(--inkt);border-color:var(--inkt);color:var(--vlak)}
.b-cta-zacht{background:var(--zacht)}
.b-cta-donker{background:var(--inkt);color:var(--vlak)}
.b-prijzen-intro{max-width:62ch}
.b-prijzen-raster{display:grid;gap:clamp(20px,3vw,40px);margin-top:clamp(24px,3vw,40px);align-items:start}
.b-prijzen-raster.met-reken{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
@media(min-width:861px){.b-prijzen-raster.met-zij{grid-template-columns:minmax(0,7fr) minmax(0,4fr);align-items:end}}
.b-prijzen-zij .b-voetnoot{margin-top:0!important}.b-prijzen-zij .knoppen{margin-top:1em}
@media(max-width:860px){.b-prijzen-raster.met-reken{grid-template-columns:1fr}}
.b-prijzen .b-bon{max-width:760px;background:var(--wit);border-radius:var(--hoek);padding:clamp(20px,3vw,36px);box-shadow:0 0 0 1px var(--lijn)}
.b-prijslijst{width:100%;border-collapse:collapse;margin:0}
.b-prijslijst th,.b-prijslijst td{padding:16px 0;border-bottom:1.5px dashed var(--lijn);vertical-align:baseline}
.b-prijslijst tr:last-child th,.b-prijslijst tr:last-child td{border-bottom:0}
.b-prijslijst th{text-align:left;font-weight:600;padding-right:20px}.b-prijslijst th span{display:block;font-weight:400;font-size:var(--t-klein);color:var(--stil);margin-top:2px}
.b-prijslijst td{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums;color:var(--stil)}
.b-prijslijst strong{font-stretch:var(--kop-stretch);font-weight:800;font-size:1.6rem;color:var(--inkt);letter-spacing:var(--kop-spatie)}
.b-btw{font-size:var(--t-klein);color:var(--stil);margin:14px 0 0}
@media(max-width:520px){.b-prijslijst th,.b-prijslijst td{display:block;padding:0}.b-prijslijst tr{display:block;padding:14px 0;border-bottom:1.5px dashed var(--lijn)}.b-prijslijst tr:last-child{border-bottom:0}.b-prijslijst th,.b-prijslijst td{border:0}.b-prijslijst td{text-align:left;margin-top:4px;white-space:normal}.b-prijslijst strong{font-size:1.35rem}}
.b-reken{background:var(--inkt);color:var(--wit);border-radius:var(--hoek);padding:clamp(22px,3vw,34px)}
.b-reken-kop{font-family:var(--hand);font-size:1.9rem;line-height:1;color:var(--accent);margin:0 0 14px}
.b-reken label{display:block;font-weight:600;margin-bottom:12px}
.b-reken input{width:100%;accent-color:var(--accent);height:28px;cursor:pointer}
.b-reken-uit{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin:14px 0 0;max-width:none}
.b-reken-uit output{font-size:1.1rem;opacity:.85}
.b-reken-prijs{font-stretch:var(--kop-stretch);font-weight:800;font-size:clamp(2.6rem,3vw + 1rem,3.6rem);line-height:1;color:var(--accent);font-variant-numeric:tabular-nums}
.b-reken-noot{font-size:var(--t-klein);opacity:.75;margin:16px 0 0;max-width:none}
.b-prijzen .b-voetnoot{margin-top:28px;max-width:68ch}
.b-contact .wrap{display:grid;gap:clamp(24px,4vw,64px);grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr))}
.b-contact address{font-style:normal;font-size:1.15rem}.b-contact address a{font-weight:600}
.b-tijden{border-collapse:collapse;width:100%;max-width:420px}.b-tijden th,.b-tijden td{padding:10px 0;border-bottom:1px solid var(--lijn);text-align:left;font-variant-numeric:tabular-nums}.b-tijden th{font-weight:600;padding-right:24px}
/* stap 2 en de uitslag verschijnen zacht in plaats van te springen */
.chk-klachten,.chk-uitslag{transition:opacity .22s ease,translate .28s cubic-bezier(.2,.8,.2,1),display .28s allow-discrete}
@starting-style{.chk-klachten,.chk-uitslag{opacity:0;translate:0 8px}}
.chk-apparaten label,.chk-chips label{transition:background .15s,color .15s,border-color .15s,transform .12s ease}
.chk-apparaten label:active,.chk-chips label:active{transform:scale(.96)}
.chk-nummer:active{transform:scale(.98)}.chk-nummer-ico{transition:transform .2s cubic-bezier(.2,.8,.2,1)}.chk-nummer:hover .chk-nummer-ico{transform:scale(1.08) rotate(-8deg)}
.b-check{padding-block:clamp(40px,6vw,88px)}
.b-check-accent{background:var(--accent);color:var(--op-accent)}
.b-check-doek{position:relative;isolation:isolate;color:#fff}
.chk-doek{position:absolute;inset:0;z-index:-1;overflow:hidden}.chk-doek img{width:100%;height:100%;object-fit:cover}
.chk-doek::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,12,14,.86) 0%,rgba(10,12,14,.62) 42%,rgba(10,12,14,.35) 100%)}
@media(max-width:900px){.chk-doek::after{background:rgba(10,12,14,.72)}}
.b-check>.wrap{display:grid;gap:clamp(28px,4vw,64px);grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:start}
@media(max-width:900px){.b-check>.wrap{grid-template-columns:1fr}}
.chk-kop{position:sticky;top:110px}@media(max-width:900px){.chk-kop{position:static}}
.b-check h1{font-size:calc(clamp(2.4rem,4.4vw + 1rem,4.4rem) * var(--kop-schaal,1));line-height:.98;max-width:12ch;margin-bottom:.35em}
.b-check .lead{color:inherit;opacity:.85;max-width:40ch}
.chk-nummer{display:inline-flex;align-items:center;gap:14px;margin-top:26px;padding:12px 30px 12px 12px;border:2px solid currentColor;border-radius:999px;background:color-mix(in srgb,currentColor 7%,transparent);text-decoration:none;font-stretch:var(--kop-stretch);font-weight:800;font-size:clamp(1.5rem,1.4vw + 1rem,2rem);line-height:1;letter-spacing:var(--kop-spatie);transition:background .2s,transform .2s}
.chk-nummer-ico{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:var(--accent);color:var(--op-accent);flex:none}.chk-nummer-ico svg{width:24px;height:24px}
.chk-nummer-tekst{display:flex;flex-direction:column}
.chk-nummer-tekst span{font-family:var(--font);font-stretch:100%;font-size:.9rem;font-weight:600;letter-spacing:0;margin-bottom:6px;opacity:.85}
.chk-nummer:hover{background:color-mix(in srgb,currentColor 15%,transparent);transform:translateY(-2px)}
.chk-foto{position:relative;margin:28px 0 0}
.chk-foto img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:var(--hoek)}
.chk-memo{display:flex;justify-content:flex-end;margin:-26px -14px 0 0;position:relative;z-index:2}@media(max-width:900px){.chk-memo{margin:-20px 0 0}}
.chk-memo .briefje{width:190px;min-height:0;font-size:1.3rem;padding:22px 20px 24px;transform:rotate(3deg)}.chk-memo .briefje:hover{transform:rotate(0) translateY(-3px)}
.chk-foto-memo{position:absolute;left:-36px;bottom:-34px}.chk-foto-memo .briefje{width:190px;font-size:1.35rem;padding:24px 20px 20px}
@media(max-width:900px){.chk-foto-memo{left:auto;right:-6px;bottom:-30px}.chk-foto-memo .briefje{width:160px;font-size:1.2rem}}
.chk{background:var(--wit);color:var(--inkt);border-radius:var(--hoek);padding:clamp(20px,3vw,36px);box-shadow:0 30px 60px -30px color-mix(in srgb,var(--inkt) 55%,transparent),0 0 0 1px color-mix(in srgb,var(--inkt) 12%,transparent)}
.chk fieldset{border:0;margin:0;padding:0;min-width:0}.chk legend{padding:0;width:100%}
.chk-stap+.chk-stap,.chk-uitslag,.chk-terug{margin-top:26px;padding-top:24px;border-top:1.5px dashed var(--lijn)}
.chk-label{display:flex;align-items:center;gap:12px;font-weight:700;font-size:1.15rem;margin:0 0 14px;max-width:none}
.chk-nr{flex:none;width:30px;height:30px;border-radius:50%;background:var(--inkt);color:var(--wit);display:grid;place-items:center;font-size:.95rem;font-weight:800}
.chk-r{position:absolute;opacity:0;width:1px;height:1px}
.chk-apparaten{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
@media(max-width:520px){.chk-apparaten{grid-template-columns:repeat(2,1fr)}}
.chk-apparaten label{display:flex;flex-direction:column;align-items:center;gap:8px;padding:16px 8px 14px;border:1.5px solid var(--lijn);border-radius:calc(var(--hoek) * .8);cursor:pointer;text-align:center;font-weight:600;font-size:.95rem;line-height:1.2;transition:background .15s,border-color .15s}
.chk-apparaten svg{width:46px;height:46px}
.chk-apparaten .chk-anders{grid-column:1/-1;flex-direction:row;justify-content:center;gap:12px;padding:12px 14px}.chk-apparaten .chk-anders svg{width:26px;height:26px}
.chk-anders-uitleg{margin:0 0 14px;max-width:none}
.chk-anders-label{display:block;font-weight:600;font-size:var(--t-klein);margin-bottom:6px}
.chk-anders-stap textarea{display:block;width:100%;font:inherit;font-size:1rem;padding:11px 12px;border:1.5px solid var(--lijn);border-radius:calc(var(--hoek) * .6);background:#fff;color:var(--inkt);resize:vertical;margin-bottom:14px}
.chk-anders-stap textarea:focus{border-color:var(--inkt);outline:2px solid color-mix(in srgb,var(--inkt) 25%,transparent);outline-offset:0}
.chk-apparaten label:hover{border-color:var(--inkt)}
.chk-r:checked+label{background:var(--inkt);border-color:var(--inkt);color:var(--accent)}
.chk-r:checked+label span{color:var(--wit)}
.chk-r:focus-visible+label{outline:3px solid var(--primair);outline-offset:2px}
.chk-chips{display:flex;flex-wrap:wrap;gap:8px}
.chk-chips label{padding:10px 16px;border:1.5px solid var(--lijn);border-radius:999px;cursor:pointer;font-weight:600;font-size:.98rem;line-height:1.2}
.chk-chips label:hover{border-color:var(--inkt)}
.chk-veilig{font-size:var(--t-klein);background:var(--zacht);border-left:3px solid var(--inkt);padding:10px 14px;margin:0 0 14px;max-width:none}
.chk-zelf ol{list-style:none;padding:0;margin:0;display:grid;gap:4px}
.chk-zelf li{display:flex;gap:12px;align-items:flex-start;padding:10px 0;max-width:none}
.chk-zelf li input{flex:none;width:22px;height:22px;margin:2px 0 0;accent-color:var(--inkt);cursor:pointer}
.chk-zelf li label{cursor:pointer}
.chk-zelf li input:checked+label{color:var(--stil);text-decoration:line-through;text-decoration-thickness:1px}
.chk-oordeel{margin-top:18px;padding:20px 22px;border-radius:calc(var(--hoek) * .8);background:var(--zacht)}
.chk-altijd{background:var(--inkt);color:var(--wit)}
.chk-oordeel-kop{font-stretch:var(--kop-stretch);font-weight:800;font-size:1.45rem;line-height:1.1;margin:0 0 .35em;letter-spacing:var(--kop-spatie)}
.chk-oordeel p{max-width:none}
.chk .knop{background:var(--inkt);border-color:var(--inkt);color:var(--wit)}
.chk-altijd .knop{background:var(--accent);border-color:var(--accent);color:var(--op-accent)}
.chk .knop.tweede{background:transparent;color:inherit;border-color:currentColor;min-height:42px;padding:8px 16px;font-size:.95rem}
.chk-bel{margin-top:6px;max-width:100%;white-space:normal;text-align:left}
.chk-altijd .chk-nr{background:var(--accent);color:var(--op-accent)}
@media(max-width:520px){.chk-oordeel .chk-bel{width:100%;justify-content:center}}
.chk-terug-kop{font-weight:700;margin:0 0 6px;max-width:none}
.chk-velden{display:grid;grid-template-columns:auto 1fr;gap:10px 14px;align-items:center;margin:12px 0}
@media(max-width:520px){.chk-velden{grid-template-columns:1fr;gap:4px}}
.chk-velden label{font-weight:600;font-size:var(--t-klein)}
.chk-velden input{width:100%;font:inherit;font-size:1rem;padding:11px 12px;border:1.5px solid var(--lijn);border-radius:calc(var(--hoek) * .6);background:#fff;color:var(--inkt)}
.chk-velden input:focus{border-color:var(--inkt);outline:2px solid color-mix(in srgb,var(--inkt) 25%,transparent);outline-offset:0}
.chk .vink{display:flex;gap:10px;align-items:flex-start;font-size:.85rem;line-height:1.4;color:var(--stil);margin:4px 0 14px}.chk .vink input{margin-top:2px;width:18px;height:18px;flex:none;accent-color:var(--inkt)}
.chk .hp{position:absolute;left:-9999px}
.chk-start{margin:26px 0 0;padding-top:20px;border-top:1.5px dashed var(--lijn);font-size:.95rem;color:var(--stil);display:flex;flex-wrap:wrap;gap:10px;align-items:center;max-width:none}
.chk-start .knop{color:var(--inkt)}
.b-check .b-form-ok{grid-column:2;background:var(--wit);color:var(--inkt);border-radius:var(--hoek);padding:28px;font-weight:700;font-size:1.2rem}
@supports selector(:has(*)){
.chk-klachten,.chk-uitslag,.chk-terug,.chk-anders-stap{display:none}
.chk:has(.a-anders:checked) .chk-anders-stap,.chk:has(.a-anders:checked) .chk-terug{display:block}
.chk:has(.a-anders:checked) .chk-start{display:none}
.chk:has(.chk-klachten input:checked) .chk-start{display:none}
.chk:has(.a-wasmachine:checked) .k-wasmachine,
.chk:has(.a-wasmachine:checked):has(.k-wasmachine-afpompen:checked) .r-wasmachine-afpompen,
.chk:has(.a-wasmachine:checked):has(.k-wasmachine-start:checked) .r-wasmachine-start,
.chk:has(.a-wasmachine:checked):has(.k-wasmachine-lekt:checked) .r-wasmachine-lekt,
.chk:has(.a-wasmachine:checked):has(.k-wasmachine-centrifugeren:checked) .r-wasmachine-centrifugeren,
.chk:has(.a-wasmachine:checked):has(.k-wasmachine-lawaai:checked) .r-wasmachine-lawaai,
.chk:has(.a-wasmachine:checked):has(.k-wasmachine-deur:checked) .r-wasmachine-deur,
.chk:has(.a-wasmachine:checked):has(.k-wasmachine-stinkt:checked) .r-wasmachine-stinkt,
.chk:has(.a-wasmachine:checked):has(.k-wasmachine-foutcode:checked) .r-wasmachine-foutcode,
.chk:has(.a-wasmachine:checked):has(.k-wasmachine-stroom:checked) .r-wasmachine-stroom,
.chk:has(.a-droger:checked) .k-droger,
.chk:has(.a-droger:checked):has(.k-droger-droogt:checked) .r-droger-droogt,
.chk:has(.a-droger:checked):has(.k-droger-warm:checked) .r-droger-warm,
.chk:has(.a-droger:checked):has(.k-droger-trommel:checked) .r-droger-trommel,
.chk:has(.a-droger:checked):has(.k-droger-stopt:checked) .r-droger-stopt,
.chk:has(.a-droger:checked):has(.k-droger-start:checked) .r-droger-start,
.chk:has(.a-droger:checked):has(.k-droger-stroom:checked) .r-droger-stroom,
.chk:has(.a-vaatwasser:checked) .k-vaatwasser,
.chk:has(.a-vaatwasser:checked):has(.k-vaatwasser-afpompen:checked) .r-vaatwasser-afpompen,
.chk:has(.a-vaatwasser:checked):has(.k-vaatwasser-schoon:checked) .r-vaatwasser-schoon,
.chk:has(.a-vaatwasser:checked):has(.k-vaatwasser-lekt:checked) .r-vaatwasser-lekt,
.chk:has(.a-vaatwasser:checked):has(.k-vaatwasser-droog:checked) .r-vaatwasser-droog,
.chk:has(.a-vaatwasser:checked):has(.k-vaatwasser-start:checked) .r-vaatwasser-start,
.chk:has(.a-koelkast:checked) .k-koelkast,
.chk:has(.a-koelkast:checked):has(.k-koelkast-koelt:checked) .r-koelkast-koelt,
.chk:has(.a-koelkast:checked):has(.k-koelkast-water:checked) .r-koelkast-water,
.chk:has(.a-koelkast:checked):has(.k-koelkast-ijs:checked) .r-koelkast-ijs,
.chk:has(.a-koelkast:checked):has(.k-koelkast-lawaai:checked) .r-koelkast-lawaai,
.chk:has(.a-koelkast:checked):has(.k-koelkast-stroom:checked) .r-koelkast-stroom,
.chk:has(.a-oven:checked) .k-oven,
.chk:has(.a-oven:checked):has(.k-oven-warm:checked) .r-oven-warm,
.chk:has(.a-oven:checked):has(.k-oven-lampje:checked) .r-oven-lampje,
.chk:has(.a-oven:checked):has(.k-oven-glas:checked) .r-oven-glas,
.chk:has(.a-oven:checked):has(.k-oven-stroom:checked) .r-oven-stroom,
.chk:has(.a-oven:checked):has(.k-oven-gas:checked) .r-oven-gas,
.chk:has(.a-kookplaat:checked) .k-kookplaat,
.chk:has(.a-kookplaat:checked):has(.k-kookplaat-pan:checked) .r-kookplaat-pan,
.chk:has(.a-kookplaat:checked):has(.k-kookplaat-slot:checked) .r-kookplaat-slot,
.chk:has(.a-kookplaat:checked):has(.k-kookplaat-foutcode:checked) .r-kookplaat-foutcode,
.chk:has(.a-kookplaat:checked):has(.k-kookplaat-glas:checked) .r-kookplaat-glas{display:block}
.chk:has(.a-wasmachine:checked):has(.chk-klachten.k-wasmachine input:checked) .chk-terug,
.chk:has(.a-droger:checked):has(.chk-klachten.k-droger input:checked) .chk-terug,
.chk:has(.a-vaatwasser:checked):has(.chk-klachten.k-vaatwasser input:checked) .chk-terug,
.chk:has(.a-koelkast:checked):has(.chk-klachten.k-koelkast input:checked) .chk-terug,
.chk:has(.a-oven:checked):has(.chk-klachten.k-oven input:checked) .chk-terug,
.chk:has(.a-kookplaat:checked):has(.chk-klachten.k-kookplaat input:checked) .chk-terug{display:block}
}