
:root{
--navy:#040a22;--ink:#040a22;--mut:#5b6278;--bg:#fff;--soft:#f3f4f7;--line:#dfe2ea;--acc:#f26a1b;--acc-soft:#fdeee3;--ok:#1a8a4a;--ok-t:#146b39;--sale:#c8102e;--sale-on:#fff;--r:12px;
--ease-out:cubic-bezier(.23,1,.32,1);--ease-drawer:cubic-bezier(.32,.72,0,1);
color-scheme:light;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
html,body{overflow-x:clip}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:400 16px/1.5 var(--font,Figtree),system-ui,-apple-system,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}
body.lock{overflow:hidden}
a{color:inherit;text-decoration:none}button,select,input,textarea{font:inherit;color:inherit}[hidden]{display:none!important}
img{display:block;max-width:100%}
h1,h2,h3{text-wrap:balance}p{text-wrap:pretty}
.w{max-width:1240px;margin:0 auto;padding:0 20px}
svg.i{width:20px;height:20px;flex:none}
/* topbar + header */
.usp2 .w{justify-content:center!important}.usp2 b{font-weight:800}.usp2 svg{width:20px;height:20px;color:inherit}
.usp{background:#fff;color:var(--ink);font-size:14px;border-bottom:1px solid var(--line)}.usp .w,.usp2 .w{display:flex;gap:44px;justify-content:flex-start;padding-top:9px;padding-bottom:9px;overflow-x:auto;white-space:nowrap;scrollbar-width:none}.usp span,.usp2 .w span{display:flex;align-items:center;gap:0;white-space:pre}.usp svg,.usp2 svg{width:20px;height:20px;flex:none;margin-right:8px}.usp b,.usp2 b{color:var(--ink);font-weight:800}
header{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:var(--navy);color:#fff}
.hd{display:flex;align-items:center;gap:20px;padding:14px 0}
.logo{display:flex;align-items:center;flex:none}.logo img{height:52px;width:auto}
.search{flex:1;max-width:560px;margin:0 auto;display:flex;border:0;border-radius:999px;overflow:hidden;background:#fff;color:var(--ink)}.search input{padding:10px 18px!important;font-size:15px}.search input{flex:1;border:0;background:transparent;padding:11px 14px;min-width:0;outline:0}.search button{border:0;background:transparent;color:var(--ink);display:grid;place-items:center;width:48px;padding:0;cursor:pointer}
.cart{display:flex;align-items:center;gap:8px;font-weight:600;white-space:nowrap;border:1.5px solid rgba(255,255,255,.25);border-radius:var(--r);padding:9px 14px;background:transparent;color:#fff;cursor:pointer;transition:border-color .15s ease-out,transform .16s var(--ease-out)}.cart:hover{border-color:#fff}.cart:active{transform:scale(.97)}
.cart i{font-style:normal;background:var(--acc);color:#fff;min-width:22px;text-align:center;padding:1px 6px;border-radius:4px;font-size:13px}
.cart i.bump{animation:bump .32s var(--ease-out)}@keyframes bump{40%{transform:scale(1.25)}}
nav{display:flex;gap:26px;overflow-x:auto;padding-bottom:12px;font-weight:600;font-size:15px;scrollbar-width:none}nav a{white-space:nowrap;color:#aab0c4;transition:color .15s ease-out}nav a:hover{color:#fff}nav a.sale{color:var(--acc)}
.btn{background:var(--acc);color:#fff;border:0;border-radius:var(--r);padding:12px 22px;font-weight:700;cursor:pointer;transition:transform .16s var(--ease-out),filter .15s ease-out;display:inline-flex;align-items:center;justify-content:center;gap:8px;text-align:center}.btn:hover{filter:brightness(.94)}.btn:active{transform:scale(.97)}
.btn.nv{background:var(--navy)}.btn.gh{background:#fff;color:var(--ink);border:1.5px solid var(--line)}.btn.gh:hover{border-color:var(--navy);filter:none}
/* image frame: echte foto, geen overlay */
.ph{position:relative;overflow:hidden;background:var(--soft);min-width:0}.ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply;padding:6%}
/* home */
.hero{display:grid;grid-template-columns:1.1fr .9fr;margin:24px 0 0;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.eyebrow{font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--acc)}
h1{font-size:clamp(34px,5vw,58px);line-height:1.02;letter-spacing:-.035em;margin:10px 0 14px;font-weight:800}.lead{color:var(--mut);max-width:46ch;margin:0 0 26px}
.finder{background:var(--soft);padding:18px;border-radius:12px}.finder h2{font-size:16px;margin:0 0 10px}
.fr{display:grid;grid-template-columns:1fr auto;gap:8px}.fr small{grid-column:1/-1;color:var(--mut)}
.plate{display:flex;border:2px solid var(--navy);border-radius:6px;overflow:hidden;background:#f7c600}.plate b{background:#1f4aa8;color:#fff;padding:0 12px;display:grid;place-items:center;font-size:12px}.plate input{flex:1;min-width:0;border:0;background:transparent;padding:10px 12px;font-size:22px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;outline:0}.plate input::placeholder{color:rgba(0,0,0,.35)}

.tag{position:absolute;top:18px;right:18px;z-index:1;background:var(--navy);color:#fff;padding:6px 10px;font-weight:700;font-size:13px;border-radius:5px}
section{margin:56px 0}.sh{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:18px;gap:12px}h2.t{font-size:26px;letter-spacing:-.025em;margin:0;font-weight:800;line-height:1.15}.sh a{font-weight:600;color:var(--acc);white-space:nowrap}
.cats{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:14px}.cim{display:block;aspect-ratio:1;border-radius:12px;overflow:hidden;background:var(--acc)}.cim img{width:100%;height:100%;object-fit:cover;transition:transform .3s var(--ease-out)}.cat:hover .cim img{transform:scale(1.05)}.cat b svg{width:14px;height:14px;vertical-align:-2px;transition:transform .2s var(--ease-out)}.cat:hover b svg{transform:translateX(2px)}.cat{display:flex;flex-direction:column;gap:10px}.cat .ph{aspect-ratio:1;border-radius:12px}.cat b{font-size:15px}.cat small{color:var(--mut);display:block;font-weight:400}
.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.card{cursor:pointer;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:12px;overflow:hidden;transition:border-color .15s ease-out;background:#fff}.card:hover{border-color:var(--line-strong,#c4c9d6);box-shadow:0 6px 18px rgba(4,10,34,.07)}
.card .ph{aspect-ratio:1/1}.card>a:not(.atc){display:flex;flex-direction:column;flex:1}
.badge{position:absolute;top:10px;left:10px;z-index:1;background:var(--acc);color:#fff;font-size:12px;font-weight:700;padding:3px 8px;border-radius:5px;max-width:calc(100% - 20px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Bespaartekst (geen label) rood */
.sv-t{color:var(--sale);font-weight:700}
/* Kortingslabels overal rood met witte vette tekst (keuze eigenaar okt 2026): --sale / --sale-on, wit op #c8102e = 5,9:1 (WCAG AA) */
:root .badge.badge--sale,:root .psave,:root .save,:root .bdg,:root .kd-dc,:root .li .tag2,:root .vct-ss__badge:not(.vct-ss__badge--out){background:var(--sale);color:var(--sale-on)!important;-webkit-text-fill-color:var(--sale-on);font-weight:800}
.hrt{position:absolute;right:10px;bottom:10px;z-index:1;width:38px;height:38px;background:#fff;border:1px solid var(--line);border-radius:12px;display:grid;place-items:center}
.bd{padding:12px 14px 0;display:flex;flex-direction:column;gap:4px;flex:1}.br{font-size:12px;font-weight:700;color:var(--mut);text-transform:uppercase;letter-spacing:.06em}
.nm{font-weight:600;line-height:1.3;font-size:15px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.st{font-size:13px;color:var(--mut)}.st b{color:#fbbc05;letter-spacing:1px}
.pr{margin-top:auto;padding-top:8px;font-weight:800;font-size:19px}.pr s{font-weight:400;color:var(--mut);font-size:14px;margin-left:6px}
.dl{font-size:13px;color:var(--ok);margin-top:6px}
.atc{margin:10px 14px 14px;background:var(--acc);color:#fff;border:0;border-radius:12px;height:44px;display:grid;place-items:center;cursor:pointer;transition:transform .16s var(--ease-out),filter .15s ease-out}.atc:hover{filter:brightness(.94)}.atc:active{transform:scale(.97)}.atc svg{width:22px;height:22px}
.combo{display:grid;grid-template-columns:1fr 1fr;background:var(--navy);color:#fff;border-radius:12px;overflow:hidden}.combo>div{padding:44px}.combo h2{font-size:34px;line-height:1.05;letter-spacing:-.03em;margin:8px 0 12px}.combo p{color:#aab0c4;max-width:42ch;margin:0 0 22px}
.combo .vis{background:var(--soft);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:6px;padding:24px}.combo .vis .ph{aspect-ratio:1;background:transparent}.combo .vis b{color:var(--navy);font-size:28px}
.brands{display:flex;flex-wrap:wrap;border:1px solid var(--line);border-radius:12px;overflow:hidden}.brands span{flex:1 1 120px;text-align:center;padding:22px 10px;font-weight:800;letter-spacing:-.02em;font-size:18px;color:var(--mut);border-right:1px solid var(--line)}
.blog{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.blog a{border-top:3px solid var(--navy);padding-top:12px}.blog a:hover{border-color:var(--acc)}.blog small{color:var(--acc);font-weight:700;text-transform:uppercase;font-size:12px;letter-spacing:.06em}.blog h3{margin:4px 0 6px;font-size:18px;line-height:1.25}.blog p{margin:0;color:var(--mut);font-size:15px}
footer{background:var(--navy);color:#aab0c4;padding:44px 0 30px;margin-top:64px;font-size:15px}footer .w{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:28px}footer h4{color:#fff;margin:0 0 10px}footer a{display:block;padding:2px 0}footer a:hover{color:#fff}
.flogo{display:inline-flex}.flogo img{height:28px;width:auto}
.pay{grid-column:1/-1;border-top:1px solid #1c2445;padding-top:18px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;font-size:13px}
.bc{font-size:14px;color:var(--mut);margin:18px 0}.bc a:hover{color:var(--ink)}
/* home top: slider + promotegels */
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.top{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:16px;margin-top:20px}
.slider{position:relative;border-radius:12px;overflow:hidden;min-height:420px;background:var(--soft)}

.slide{flex:0 0 100%;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);align-items:center;gap:16px;padding:40px 44px 72px}
.slide h2{font-size:clamp(30px,3.6vw,48px);line-height:1.02;letter-spacing:-.035em;margin:8px 0 12px;font-weight:800}
.slide p{color:var(--mut);max-width:36ch;margin:0 0 18px}
.slide .from{display:block;font-weight:800;font-size:20px;margin-bottom:18px}.slide .from s{font-weight:400;color:var(--mut);font-size:15px;margin-left:6px}
.slide .ph{aspect-ratio:1;background:transparent}.slide .ph img{padding:2%}

.dots{display:flex;gap:8px}.dots button{width:10px;height:10px;border-radius:5px;border:0;padding:0;background:rgba(4,10,34,.2);cursor:pointer;transition:width .3s var(--ease-out),background-color .2s ease-out}.dots button.on{width:28px;background:var(--navy)}
.arr{display:flex;gap:8px}.ar{width:42px;height:42px;padding:0;border-radius:50%;border:0;background:#fff;display:grid;place-items:center;cursor:pointer;box-shadow:0 2px 8px rgba(4,10,34,.12);transition:transform .16s var(--ease-out)}.ar:active{transform:scale(.94)}
.tiles{display:grid;grid-template-rows:1fr 1fr;gap:16px}
.tile{position:relative;border-radius:12px;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) 128px;align-items:center;gap:14px;padding:22px;background:var(--navy);color:#fff}
.tile.or{background:var(--acc)}
.tile small{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--acc)}.tile.or small{color:var(--navy)}
.tile h3{font-size:22px;line-height:1.1;letter-spacing:-.02em;margin:6px 0 8px}.tile p{margin:0;font-size:14px;opacity:.85}
.tile .go{display:inline-flex;align-items:center;gap:4px;margin-top:12px;font-weight:700;font-size:14px}.tile .go svg{width:16px;height:16px;transition:transform .2s var(--ease-out)}.tile:hover .go svg{transform:translateX(3px)}
.tile .ph{width:128px;height:128px;border-radius:12px;background:#fff}.tile .ph img{transition:transform .3s var(--ease-out)}.tile:hover .ph img{transform:scale(1.05)}
.kz{display:grid;grid-template-columns:auto minmax(0,1fr);gap:28px;align-items:center;margin-top:16px;border:1px solid var(--line);border-radius:12px;padding:18px 22px}
.kz h2{font-size:22px;margin:2px 0 0;letter-spacing:-.02em}.kz .fr{grid-template-columns:minmax(0,1fr) auto auto;align-items:center}.kz .fr small{grid-column:auto}.kz small a{text-decoration:underline;text-underline-offset:3px}
/* checkout */



.steps{display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-size:14px;color:var(--mut);margin:20px 0 0}.steps a:hover{color:var(--ink)}.steps .cur{color:var(--ink);font-weight:700}.steps svg{width:12px;height:12px}
.cos{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:44px;align-items:start;padding-bottom:64px}
.cos{margin-top:24px}
.c2{grid-template-columns:1fr 1fr}.c3{grid-template-columns:1.25fr .85fr .7fr}
.fld{position:relative;min-width:0}.fld input,.fld select{width:100%;height:52px;border:1.5px solid var(--line);border-radius:12px;padding:20px 12px 6px;background:#fff;outline:0;appearance:none;transition:border-color .15s ease-out,box-shadow .15s ease-out}
.fld label{position:absolute;left:13px;top:7px;font-size:12px;color:var(--mut);pointer-events:none}
.fld input:focus,.fld select:focus{border-color:var(--navy);box-shadow:0 0 0 1px var(--navy)}.fld input.ok{border-color:var(--ok)}.fld input.bad{border-color:#c42b1c;box-shadow:0 0 0 1px #c42b1c}
.fld .chev{position:absolute;right:12px;top:50%;transform:translateY(-50%);pointer-events:none;color:var(--mut);width:14px;height:14px}
.hint{font-size:13px;color:var(--mut);margin:6px 0 0}
.adr{display:none;margin-top:10px;border-radius:12px;padding:11px 12px;font-size:14px;gap:10px;align-items:flex-start;line-height:1.4}.adr.show{display:flex}.adr.ok{background:#edf7f0;color:#14532d}.adr.bad{background:#fdeeec;color:#7a1a12}.adr.busy{background:var(--soft);color:var(--mut)}.adr svg{flex:none;width:18px;height:18px}
.lnk{background:none;border:0;padding:0;text-decoration:underline;text-underline-offset:3px;font-size:14px;cursor:pointer}
.opts{display:grid;gap:8px}.op{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center;border:1.5px solid var(--line);border-radius:12px;padding:13px 14px;cursor:pointer;transition:border-color .15s ease-out,background-color .15s ease-out}.op:hover{border-color:var(--mut)}
.op:has(input:checked){border-color:var(--acc);background:#fffaf6}.op input{accent-color:var(--acc);width:18px;height:18px;margin:0}.op b{display:block}.op small{display:block;color:var(--mut);font-size:13px}.op .pc{font-weight:700;white-space:nowrap}.op .pc.free{color:var(--ok)}
.pms{display:flex;gap:4px;flex-wrap:wrap;justify-content:flex-end}.pms img{width:38px;height:28px;border-radius:4px}



.paybtn{margin-top:28px;width:100%;font-size:18px;padding:18px}
.legal{font-size:13px;color:var(--mut);text-align:center;margin:12px 0 0}.legal a{text-decoration:underline}
.as{display:flex;gap:10px;align-items:flex-start;font-size:13px;color:var(--mut);line-height:1.4}.as b{display:block;color:var(--ink);font-size:14px}.as svg{width:20px;height:20px;flex:none}.as img{height:28px;width:auto;flex:none}


.qb{position:absolute;top:-7px;right:-7px;z-index:1;background:var(--navy);color:#fff;font-size:12px;font-weight:700;min-width:22px;height:22px;border-radius:12px;display:grid;place-items:center;padding:0 6px}


.cmsg{font-size:13px;min-height:18px}
.deliv{display:flex;gap:10px;align-items:center;margin-top:14px;font-size:14px}.deliv svg{color:var(--ok);width:20px;height:20px;flex:none}
.score{display:flex;gap:12px;align-items:center}.score img{width:40px;height:40px}.score .big{font-size:28px;font-weight:800;line-height:1}.score small{display:block;font-size:13px;color:var(--mut)}.score .stars{color:#fbbc05;letter-spacing:1px}
.quote{margin:0;font-size:14px;background:#fff;border-radius:12px;padding:12px 14px}.quote span{display:block;font-size:13px;color:var(--mut);margin-top:4px}
.wb{display:flex;gap:12px;align-items:flex-start;font-size:13px;color:var(--mut)}.wb img{height:30px;width:auto;flex:none}.wb b{display:block;color:var(--ink)}

.pov{position:fixed;inset:0;z-index:30;background:rgba(4,10,34,.5);display:grid;place-items:center;padding:16px;opacity:0;pointer-events:none;transition:opacity .2s ease-out}.pov.open{opacity:1;pointer-events:auto}
.dlg{background:#fff;border-radius:12px;max-width:440px;width:100%;padding:24px;transform:translateY(12px) scale(.98);transition:transform .3s var(--ease-out);box-shadow:0 28px 56px -20px rgba(4,10,34,.4)}.pov.open .dlg{transform:none}
.dlg h3{font-size:22px;margin:10px 0 6px;letter-spacing:-.02em}.dlg p{margin:0;color:var(--mut)}.okl{display:flex;gap:8px;align-items:center;color:var(--ok);font-weight:700;font-size:15px}.okl svg{width:20px;height:20px}
.offer{display:grid;grid-template-columns:80px minmax(0,1fr);gap:14px;align-items:center;border:1px solid var(--line);border-radius:12px;padding:12px;margin-top:14px}.offer .ph{width:80px;height:80px;border-radius:12px}.offer .nm{font-size:15px}.offer small{display:block;color:var(--mut);font-size:13px}
.dlg .btn{width:100%;margin-top:16px;padding:15px}.ghost{display:block;margin:8px auto 0;background:none;border:0;color:var(--mut);text-decoration:underline;text-underline-offset:3px;cursor:pointer;padding:6px}
/* vertrouwen */
.fs{color:#fbbc05;letter-spacing:1px}.fs i{font-style:normal;background:linear-gradient(90deg,#fbbc05 50%,#d9dce2 50%);-webkit-background-clip:text;background-clip:text;color:transparent}
.tbox{border:1px solid var(--line);border-radius:12px;overflow:hidden;margin:18px 0}
.tb3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}.tb3>div{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;padding:16px 8px;border-left:1px solid var(--line);font-size:13px;color:var(--mut);line-height:1.3}.tb3>div:first-child{border-left:0}
.tb3 b{color:var(--ink);font-size:14px}.tb3 .ic{width:44px;height:44px;border-radius:12px;background:var(--acc-soft);color:var(--acc);display:grid;place-items:center}.tb3 .ic img{width:38px;height:auto}
.tbg{display:flex;justify-content:center;align-items:center;gap:8px;border-top:1px solid var(--line);padding:12px;font-size:14px;color:var(--mut)}.tbg b{color:var(--ink)}.tbg svg{color:var(--acc)}
.tbr{border-top:1px solid var(--line);background:var(--soft);padding:12px;display:grid;justify-items:center;gap:4px;font-size:14px;color:var(--mut)}.tbr .l1{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:center}.tbr img{width:28px;height:28px}.tbr b{color:var(--ink)}.tbr .l2{display:flex;align-items:center;gap:6px}.tbr .l2 svg{color:var(--ok);width:16px;height:16px}
.help{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 150px;align-items:end;border:1px solid var(--line);border-radius:12px;overflow:hidden;margin:18px 0;min-height:0}
.help>div{padding:22px;align-self:center}.help h3{margin:0 0 4px;font-size:20px}.help p{margin:0 0 16px;color:var(--mut)}.help>img{width:100%;max-height:170px;object-fit:contain;object-position:bottom;align-self:end;display:block}
.team{display:grid;grid-template-columns:minmax(0,1fr) 280px;align-items:end;background:var(--navy);color:#fff;border-radius:12px;overflow:hidden}
.team>div{padding:40px 44px;align-self:center}.team h2{font-size:32px;line-height:1.05;letter-spacing:-.03em;margin:8px 0 12px}.team p{color:#aab0c4;max-width:44ch;margin:0 0 20px}.team>img{width:100%;max-width:260px;max-height:260px;object-fit:contain;object-position:bottom;justify-self:end;margin-right:24px;display:block}
.team .proof{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}.team .proof span{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.07);border-radius:12px;padding:8px 12px;font-size:14px}.team .proof img{height:22px;width:auto;max-width:none}.team .proof b{color:#fff}



.fks{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:20px;border-bottom:1px solid #1c2445;margin-bottom:28px}
.fks h4{color:var(--acc);font-size:22px;margin:0 0 10px}.fks p{margin:0 0 14px}.fks b{color:#fff}.fks>img{width:auto;max-width:180px;max-height:150px;object-fit:contain;object-position:bottom;justify-self:end;display:block;opacity:.9}

.mtrust{display:flex;align-items:center;justify-content:center;gap:10px;font-size:13px;color:var(--mut);flex-wrap:wrap}.mtrust img{height:22px;width:auto}
/* voorpagina redactioneel */
.uspb{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:16px}.uspb>div{display:flex;gap:12px;align-items:center;background:var(--soft);border-radius:12px;padding:14px 16px;font-size:13px;color:var(--mut);line-height:1.3}.uspb b{display:block;color:var(--ink);font-size:14px}.uspb svg{color:var(--acc);width:24px;height:24px}
.theme{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:16px}
.th-main{position:relative;border-radius:12px;overflow:hidden;min-height:380px;background:var(--navy);display:block}.th-img{position:absolute;inset:0}.th-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease-out)}.th-main:hover .th-img img{transform:scale(1.03)}
.th-main::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(4,10,34,.92) 0%,rgba(4,10,34,.35) 55%,rgba(4,10,34,0) 100%)}
.th-txt{position:absolute;left:0;right:0;bottom:0;z-index:1;padding:32px;color:#fff;display:grid;gap:12px;justify-items:start}.th-txt b{font-size:clamp(24px,2.6vw,34px);line-height:1.08;letter-spacing:-.03em;max-width:20ch}
.th-side{border:1px solid var(--line);border-radius:12px;padding:22px;display:flex;flex-direction:column}.th-side h2{margin-bottom:8px}
.thl{display:grid;grid-template-columns:64px minmax(0,1fr) auto;gap:14px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}.thl .ph{width:64px;height:64px;border-radius:12px}.thl b{display:block;line-height:1.25}.thl small{color:var(--mut)}.thl svg{color:var(--acc);transition:transform .2s var(--ease-out)}.thl:hover svg{transform:translateX(3px)}
.th-all{margin-top:auto;padding-top:14px;display:flex;align-items:center;gap:6px;font-weight:700;color:var(--acc)}.th-all svg{width:16px;height:16px}
.kh{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.khc{border:1px solid var(--line);border-radius:12px;padding:22px;display:flex;flex-direction:column;gap:8px;transition:border-color .15s ease-out}.khc:hover{border-color:var(--navy)}
.ki{width:48px;height:48px;border-radius:12px;background:var(--acc-soft);color:var(--acc);display:grid;place-items:center;margin-bottom:6px}.ki svg{width:24px;height:24px}.khc b{font-size:18px;line-height:1.2}.khc p{margin:0;color:var(--mut);font-size:15px}.khc .go{margin-top:auto;padding-top:8px;display:flex;align-items:center;gap:6px;font-weight:700;color:var(--acc)}.khc .go svg{width:16px;height:16px;transition:transform .2s var(--ease-out)}.khc:hover .go svg{transform:translateX(3px)}
.scr{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 48px)/4);gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px;scrollbar-width:thin}.scr>.card{scroll-snap-align:start}
.brs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.br3{border-radius:12px;overflow:hidden;display:grid;grid-template-rows:auto 1fr;background:var(--soft)}.br3 .ph{aspect-ratio:16/10;background:transparent}.br3 .ph img{padding:8%}
.br3>div{padding:20px 22px 22px;display:flex;flex-direction:column;gap:6px}.br3 b{font-size:22px;letter-spacing:-.02em}.br3 p{margin:0;color:var(--mut);font-size:15px}.br3 .go{margin-top:8px;font-weight:700;display:flex;align-items:center;gap:6px}.br3 .go svg{width:16px;height:16px}
.br3.nv{background:var(--navy);color:#fff}.br3.nv p{color:#aab0c4}.br3.nv .ph{background:#fff}.br3.or{background:var(--acc-soft)}.br3.bl{background:#eaf2fb}.br3 small{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--acc)}
.also{color:var(--mut);margin:14px 0 0;font-size:15px}.also b{color:var(--ink)}
.nb{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;align-items:center;background:var(--acc);color:#fff;border-radius:12px;padding:36px 40px}.nb h2{margin:0 0 6px;font-size:28px;letter-spacing:-.03em}.nb p{margin:0;color:#fff;opacity:.9}
.nbf{display:flex;gap:8px;background:#fff;border-radius:12px;padding:6px}.nbf input{flex:1;min-width:0;border:0;outline:0;padding:10px 12px;color:var(--ink)}.nbf .btn{background:var(--navy)}.nbf b{color:var(--ink);padding:10px}
.marr{display:flex;gap:8px}.marr .ar{box-shadow:none;border:1px solid var(--line)}
.mtrack{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 5*14px)/6);gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none}.mtrack::-webkit-scrollbar{display:none}
.ml{scroll-snap-align:start;height:110px;border:1px solid var(--line);border-radius:12px;display:grid;place-items:center;padding:18px;background:#fff;transition:border-color .15s ease-out}.ml:hover{border-color:var(--navy)}.ml img{max-width:100%;max-height:56px;object-fit:contain;mix-blend-mode:multiply;transition:transform .2s var(--ease-out)}.ml:hover img{transform:scale(1.05)}
/* footer zoals live */
.pre{border-top:1px solid var(--line)}.pre .w{display:flex;justify-content:center;flex-wrap:wrap;gap:10px 28px;padding-top:18px;padding-bottom:18px;font-size:14px;color:var(--mut)}.pre span{display:flex;align-items:center;gap:6px}.pre b{color:var(--ink);font-weight:600}.pre svg{width:16px;height:16px;color:var(--ok)}
footer{margin-top:0;padding:48px 0 0}
footer .w.fw{align-items:stretch;display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,.8fr) minmax(0,.8fr) minmax(0,1.1fr);gap:32px;padding-bottom:0}
footer h4{color:var(--acc)!important;font-size:20px;margin:0 0 14px;letter-spacing:-.01em}
.fks{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:16px;border:0!important;margin:0!important;align-self:stretch}.fks>div{align-self:start;padding-bottom:40px}.fks p{margin:0 0 14px;color:#d6d9e3}.fks b{color:#fff}.fks>img{max-width:230px!important;max-height:210px!important;object-fit:contain;object-position:bottom;align-self:end;opacity:1!important;display:block;margin-bottom:0}.fc,.fn{padding-bottom:40px!important}
.fc summary{list-style:none;cursor:default;pointer-events:none}.fc summary::after{display:none}.fc summary::-webkit-details-marker{display:none}.fc{border:0!important;padding:0!important}
.fc nav{display:grid;gap:6px;overflow:visible;padding:0;font-size:15px;font-weight:500}.fc nav a{color:#d6d9e3;padding:0}.fc nav a:hover{color:#fff}
.fn p{color:#d6d9e3;font-size:14px;margin:0 0 12px}.soc{display:flex;gap:16px;margin-bottom:14px}.soc a{color:#fff;padding:0}.soc svg{width:22px;height:22px}.soc a:hover{color:var(--acc)}
.fnf{display:grid;gap:10px}.fnf input{background:#fff;border:0;border-radius:12px;padding:13px 14px;outline:0;color:var(--ink)}.fnf .btn{justify-self:start;padding:12px 26px}.fnf b{color:#fff}
.fb{background:#fff;color:var(--mut);margin-top:0;position:relative}.fb .w{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;padding-top:16px;padding-bottom:16px;font-size:14px}
.fbl{display:flex;align-items:center;gap:20px;flex-wrap:wrap}.fbl a{color:var(--mut);padding:0;text-decoration:underline;text-underline-offset:3px}.twl{height:30px;width:auto}
.fpay{display:flex;flex-wrap:nowrap;gap:6px;width:100%;max-width:380px}.fpay img{flex:1 1 0;min-width:0;max-width:38px;height:auto;aspect-ratio:38/28;border-radius:4px}
/* fototegels zoals live */
.top{grid-template-columns:minmax(0,1.9fr) minmax(0,1fr)}.tiles{grid-template-rows:1fr 1fr}
.pt{position:relative;display:block;border-radius:12px;overflow:hidden;background:var(--navy);min-height:220px}.pt img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease-out)}.pt:hover img{transform:scale(1.03)}
.pt::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(4,10,34,.75),rgba(4,10,34,0) 55%)}
.pt-t{position:absolute;left:24px;bottom:22px;z-index:1;color:#fff;display:grid;gap:2px}.pt-t b{font-size:28px;letter-spacing:-.02em;line-height:1.1}.pt-t span{color:var(--acc);font-weight:700;display:flex;align-items:center;gap:4px}.pt-t svg{width:14px;height:14px;transition:transform .2s var(--ease-out)}.pt:hover .pt-t svg{transform:translateX(3px)}
.top .pt.big{min-height:480px}.top .pt.big .pt-t b{font-size:38px}
.svc{display:grid;grid-template-columns:minmax(0,2fr) repeat(3,minmax(0,1fr));gap:16px}.svc .pt{min-height:300px}.svc .pt.big .pt-t b{font-size:32px}
.rvh2{display:flex;align-items:center;gap:12px}.fbc2{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:12px;padding:6px 10px;font-size:13px;line-height:1.2}.fbc2 img{width:22px;height:22px}.fbc2 small{display:block;color:var(--mut);font-size:11px}
.rvt{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 48px)/4);gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none}.rvt::-webkit-scrollbar{display:none}
.rvq{scroll-snap-align:start;border:1px solid var(--line);border-radius:12px;padding:20px;display:flex;flex-direction:column;gap:10px;min-height:220px}.rvq .fs{font-size:18px}.rvq .fs em{font-style:normal;color:#d9dce2}.rvq p{margin:0;flex:1}.rvq b{font-size:14px}.via{display:flex;align-items:center;gap:6px;border-top:1px solid var(--line);padding-top:10px;font-size:13px;color:var(--mut)}.via img{width:16px;height:16px}
.rvn{text-align:center;color:var(--mut);font-size:14px;margin:16px 0 0}.rvn a{text-decoration:underline;text-underline-offset:3px}
.blg{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.blg a{display:flex;flex-direction:column;gap:6px}.bim{display:block;aspect-ratio:16/11;border-radius:12px;overflow:hidden;background:var(--soft)}.bim img{width:100%;height:100%;object-fit:cover;transition:transform .4s var(--ease-out)}.blg a:hover .bim img{transform:scale(1.03)}.blg small{color:var(--acc);font-weight:700;text-transform:uppercase;font-size:12px;letter-spacing:.06em;margin-top:6px}.blg h3{margin:0;font-size:18px;line-height:1.25}
.clist{display:none}
@media (min-width:1101px){.top{grid-template-columns:260px minmax(0,1.9fr) minmax(0,1fr)}
.clist{display:flex;flex-direction:column;background:var(--soft);border-radius:12px;padding:12px 10px}
.clhd{display:flex;align-items:baseline;justify-content:space-between;gap:8px;padding:4px 10px 8px}.clh{font-size:13px;color:var(--mut)}.clist a.clall{display:inline-flex;align-items:center;gap:2px;padding:0;border-radius:0;font-size:13px;font-weight:700;color:var(--acc);margin-left:auto}.clist a.clall:hover{background:none;text-decoration:underline}.clist a.clall .cv{width:14px;height:14px;color:currentColor}
.clist a{display:grid;grid-template-columns:40px minmax(0,1fr) 16px;align-items:center;gap:12px;padding:7px 10px;border-radius:12px;font-weight:600;font-size:15px;transition:background-color .15s ease-out}.clist a+a{border-top:1px solid var(--line)}.clist a:hover{background:#fff}
.clist img{width:40px;height:40px;border-radius:12px;object-fit:contain;padding:4px;box-sizing:border-box;background:var(--soft);mix-blend-mode:multiply}.clist .cv{width:16px;height:16px;color:var(--mut);transition:transform .2s var(--ease-out)}.clist a:hover .cv{transform:translateX(2px);color:var(--acc)}
.clist .pc{width:40px;height:40px;border-radius:12px;background:var(--acc-soft);color:var(--acc);display:grid;place-items:center;font-weight:800;font-size:18px}.clist .sale{color:var(--acc)}
.top .pt.big{min-height:520px}}
/* header acties + mobiel menu */
.hb{display:none;width:42px;height:42px;border:0;background:transparent;color:#fff;border-radius:12px;place-items:center;cursor:pointer;flex:none;padding:0}.hb svg{width:28px;height:28px}
.acts{display:flex;align-items:center;gap:6px;flex:none}
.ia{position:relative;display:flex;flex-direction:column;align-items:center;gap:2px;min-width:52px;padding:4px 6px;border:0!important;background:transparent!important;color:#fff;font-size:12px;font-weight:600;cursor:pointer;border-radius:12px;transition:transform .16s var(--ease-out),color .15s ease-out}.ia:hover{color:var(--acc)}.ia:active{transform:scale(.95)}
.ia svg{width:28px;height:28px}.ia .lbl{display:block!important;line-height:1}
.ia .bub{position:absolute;top:-2px;right:6px;min-width:20px;height:20px;padding:0 5px;border-radius:12px;background:var(--acc);color:#fff;font-style:normal;font-size:12px;font-weight:800;display:grid;place-items:center;box-shadow:0 0 0 2px var(--navy)}
.ia .bub[hidden]{display:none}.ia .bub.bump{animation:bump .32s var(--ease-out)}
.hrt{cursor:pointer;transition:transform .16s var(--ease-out),color .15s ease-out}.hrt:active{transform:scale(.9)}.hrt.on{color:#e0245e}.hrt.on svg{fill:currentColor}
.mov{position:fixed;inset:0;z-index:20;background:rgba(4,10,34,.45);opacity:0;pointer-events:none;transition:opacity .3s ease}.mov.open{opacity:1;pointer-events:auto}
.mm{position:fixed;top:0;left:0;bottom:0;width:min(360px,88vw);z-index:21;background:#fff;display:flex;flex-direction:column;transform:translateX(-100%);visibility:hidden;transition:transform .4s var(--ease-drawer),visibility 0s linear .4s;padding-top:env(safe-area-inset-top,0px)}
.mm.open{transform:none;visibility:visible;transition:transform .4s var(--ease-drawer);box-shadow:12px 0 40px rgba(4,10,34,.18)}
.mm-h{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;background:var(--navy)}.mm-h img{height:36px;width:auto}.mm-h .x{background:transparent;border-color:rgba(255,255,255,.25);color:#fff}
.mm-b{flex:1;overflow:auto;padding:8px 16px 20px;overscroll-behavior:contain}.mm-t{display:block;font-size:13px;color:var(--mut);margin:14px 0 6px}
.mml,.mms{display:block!important;padding:0!important}
.mml a{display:grid;grid-template-columns:44px minmax(0,1fr) 16px;align-items:center;gap:12px;padding:8px 0;font-weight:600;border-bottom:1px solid var(--line);color:var(--ink)}.mml img{width:44px;height:44px;border-radius:12px;object-fit:contain;padding:4px;box-sizing:border-box;background:var(--soft);mix-blend-mode:multiply}.mml .cv{width:16px;height:16px;color:var(--mut)}
.mml .pc{width:44px;height:44px;border-radius:12px;background:var(--acc-soft);color:var(--acc);display:grid;place-items:center;font-weight:800;font-size:18px}.mml a.sale{color:var(--acc)}
.mms a{display:flex;align-items:center;gap:10px;padding:11px 0;border-bottom:1px solid var(--line);font-weight:500;color:var(--ink)}.mms svg{width:20px;height:20px;color:var(--mut)}
.mm-f{border-top:1px solid var(--line);padding:14px 16px calc(14px + env(safe-area-inset-bottom,0px));font-size:13px;color:var(--mut)}
/* producttabs + omschrijving */
.ptabs{position:sticky;top:var(--hh,0px);z-index:4;background:#fff;border-bottom:1px solid var(--line);margin:48px 0 0;box-shadow:-20px 0 0 #fff,20px 0 0 #fff}.ptw{display:flex;gap:32px;overflow-x:auto;scrollbar-width:none}.ptw::-webkit-scrollbar{display:none}
.ptabs a{white-space:nowrap;padding:16px 0 14px;color:var(--mut);font-weight:600;border-bottom:2px solid transparent;transition:color .15s ease-out,border-color .15s ease-out}.ptabs a:hover{color:var(--ink)}.ptabs a.on{color:var(--ink);border-color:var(--acc)}
#prod section[id^="p-"],#prod [id^="p-"],#reviews{scroll-margin-top:calc(var(--hh,0px) + 70px)}
.ph2{font-size:24px;letter-spacing:-.02em;margin:0 0 14px;font-weight:800}
.pinfo{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:56px;align-items:start;margin-top:36px}
.rdm{position:relative;max-height:260px;overflow:hidden;color:#3a4156;transition:max-height .5s var(--ease-out)}.rdm p{margin:0 0 14px;line-height:1.65}.rdm h3{font-size:17px;margin:20px 0 8px;color:var(--ink)}.rdm ul{margin:0 0 14px;padding-left:20px;line-height:1.75}
.rdm::after{content:"";position:absolute;left:0;right:0;bottom:0;height:110px;background:linear-gradient(to bottom,rgba(255,255,255,0),#fff);pointer-events:none;transition:opacity .3s ease-out}.rdm.open{max-height:1400px}.rdm.open::after{opacity:0}
.rmb{display:block;margin:6px auto 0;border:0;background:none;color:var(--acc);font-weight:700;cursor:pointer;padding:6px 10px}
.ppm{background:var(--soft);border-radius:12px;padding:24px}.pml{list-style:none;margin:0;padding:0;display:grid;gap:12px}.pml li{display:grid;grid-template-columns:24px minmax(0,1fr);gap:10px;align-items:start;line-height:1.45}
.pml i{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;color:#fff}.pml i svg{width:14px;height:14px}.pml .p i{background:var(--ok)}.pml .m i{background:#c42b1c}.pml .m{color:var(--mut)}
.spec{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:48px;margin:0}.spec div{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:16px;padding:12px 0;border-bottom:1px solid var(--line)}.spec dt{color:var(--mut)}.spec dd{margin:0;font-weight:600}
.qal{border-top:1px solid var(--line)}.qa{border-top:0!important;border-bottom:1px solid var(--line)!important;padding:0!important}.qa summary{padding:16px 0;font-weight:700;align-items:center}.qa summary::after{display:none}.qa summary svg{width:18px;height:18px;color:var(--mut);transition:transform .2s var(--ease-out);flex:none}.qa[open] summary svg{transform:rotate(180deg)}.qa p{margin:0 0 16px!important;color:var(--mut)}
.qan{color:var(--mut);margin:16px 0 0}.qan a{color:var(--acc);font-weight:700}
/* subcollecties */
.scw{position:relative;margin:0 0 24px}.scr2{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 5*16px)/6);gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;padding:2px}.scr2::-webkit-scrollbar{display:none}
.sct{scroll-snap-align:start;border:1px solid var(--line);border-radius:12px;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:18px 12px;text-align:center;min-height:180px;transition:border-color .15s ease-out}.sct:hover{border-color:var(--navy)}
.sct span{width:96px;height:96px;display:grid;place-items:center}.sct img{max-width:100%;max-height:100%;object-fit:contain;transition:transform .25s var(--ease-out)}.sct:hover img{transform:scale(1.05)}.sct b{font-size:15px;line-height:1.25}
.scw .ar{position:absolute;top:50%;z-index:1;transform:translateY(-50%);background:#fff;box-shadow:0 2px 10px rgba(4,10,34,.15)}.scl{left:-14px}.scrb{right:-14px}
/* feedback company reviews onderaan */
.fbr{margin-top:64px}.fbr .t{margin-bottom:18px}.fbw{display:grid;grid-template-columns:220px auto minmax(0,1fr) auto;gap:16px;align-items:center}
.fbs{border:1px solid var(--line);border-radius:12px;padding:20px;display:grid;justify-items:center;gap:4px;text-align:center;align-self:stretch;align-content:center}.fbs .big{font-size:28px}.fbs b{font-size:22px}.fbs span:not(.fs){font-size:18px}.fbs img{width:40px;height:40px;margin-top:8px}.fbs small{color:var(--mut)}
.fs em{font-style:normal;color:#d9dce2}
.frt2{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 32px)/3);gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none}.frt2::-webkit-scrollbar{display:none}
.frc{scroll-snap-align:start;border:1px solid var(--line);border-radius:12px;padding:18px;min-height:180px;display:flex;flex-direction:column;gap:10px}.frt{display:flex;justify-content:space-between;align-items:center}.frt .fs{font-size:20px}.vfy{width:22px;height:22px}.frc p{margin:0;flex:1}.frc small{color:var(--mut)}
.fbw .ar{border:1px solid var(--line);box-shadow:none}
/* winkelwagen + drawer uitgewerkt */
.shipc{background:var(--soft);border-radius:12px;padding:16px 18px;margin-bottom:18px}.dlt{display:flex;align-items:center;gap:8px;margin:10px 0 0;font-size:14px;color:var(--ink)}.dlt svg{width:18px;height:18px;color:var(--ok);flex:none}.dlt b{color:var(--ok)}.dlt.c{justify-content:center;margin-top:12px}
.cl-h a{color:var(--acc);font-weight:700}
.rm{display:inline-flex;align-items:center;gap:6px;text-decoration:none!important}.rm svg{width:16px;height:16px}
.cpu{margin-top:32px}.cpu>p{color:var(--mut);margin:4px 0 14px}.cpu-g{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.upc{display:grid;grid-template-columns:72px minmax(0,1fr);grid-template-rows:auto auto;gap:10px 12px;border:1px solid var(--line);border-radius:12px;padding:12px;align-items:start}.upc .ph{width:72px;height:72px;border-radius:12px}.uc-t{display:grid;gap:3px}.uc-t .nm{font-size:14px;-webkit-line-clamp:2}.uc-t small{color:var(--ok);font-size:12px;line-height:1.3}.uc-t b{font-size:15px}.uc-t s{color:var(--mut);font-weight:400;font-size:13px}
.upc button{grid-column:1/-1;border:1.5px solid var(--acc);color:var(--acc);background:#fff;border-radius:12px;height:38px;font-weight:700;cursor:pointer;transition:background-color .15s ease-out,transform .16s var(--ease-out)}.upc button:hover{background:var(--acc-soft)}.upc button:active{transform:scale(.97)}
.upc.sm{grid-template-columns:56px minmax(0,1fr) auto;grid-template-rows:none;align-items:center;margin-bottom:8px}.upc.sm .ph{width:56px;height:56px}.upc.sm button{grid-column:auto;height:36px;padding:0 12px;font-size:14px}.upc.sm .uc-t .nm{font-size:13px}
.cass{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:28px}.cass>div{display:flex;gap:10px;align-items:center;background:var(--soft);border-radius:12px;padding:12px 14px;font-size:13px;color:var(--mut);line-height:1.3}.cass b{display:block;color:var(--ink);font-size:14px}.cass svg{width:22px;height:22px;color:var(--acc);flex:none}
.kcd{border:0!important;padding:6px 0 0!important}.kcd summary{font-weight:600;font-size:14px;color:var(--acc);justify-content:flex-start}.kcd summary::after{display:none}.kcd .code{margin:10px 0 6px}
.go-co svg{width:18px;height:18px}
.pmr{display:flex;flex-wrap:wrap;gap:5px;justify-content:center;margin-top:12px}.pmr img{width:34px;height:24px;border-radius:4px}
.tblk{display:grid;gap:10px;margin-top:16px;padding-top:16px;border-top:1px solid var(--line)}.tb-r{display:flex;gap:10px;align-items:center;font-size:14px}.tb-r img{width:30px;height:30px;flex:none}.tb-r img.tw{width:auto;height:26px}.tb-r small{display:block;color:var(--mut);font-size:12px}
.hlp{display:flex;gap:12px;align-items:center;margin-top:16px;padding:12px;border-radius:12px;background:var(--soft);font-size:13px;color:var(--mut);line-height:1.4}.hlp img{width:56px;height:56px;border-radius:50%;object-fit:cover;object-position:top;background:#fff;flex:none}.hlp b{display:block;color:var(--ink);font-size:14px}.hlp a{color:var(--acc);font-weight:700}
.dl2-h{display:flex;gap:8px;align-items:flex-start;justify-content:space-between}.ib{border:0;background:none;color:var(--mut);cursor:pointer;padding:2px;flex:none;border-radius:6px}.ib:hover{color:#c42b1c}.ib svg{width:18px;height:18px}
.dr-s .dlt{font-size:13px}.dr-f .pmr{margin-top:2px}
/* sticky winkelwagenbalk + chatbot */
.sbar{position:fixed;left:0;right:0;bottom:0;z-index:6;background:#fff;border-top:1px solid var(--line);box-shadow:0 -6px 24px rgba(4,10,34,.08);transform:translateY(110%);transition:transform .35s var(--ease-out);padding-bottom:env(safe-area-inset-bottom,0px)}.sbar.show{transform:none}
.sbw{display:grid;grid-template-columns:56px minmax(0,1fr) auto auto 56px;gap:16px;align-items:center;padding-top:10px;padding-bottom:10px}
.sb-im .ph{display:block;width:56px;height:56px;border-radius:12px}.sb-t{min-width:0}.sb-t small{display:block;color:var(--mut);font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.05em}.sb-t b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sb-p{text-align:right;white-space:nowrap}.sb-p s{color:var(--mut);font-size:14px;margin-right:6px}.sb-p strong{font-size:22px;font-weight:800}
.sbw .btn{padding:14px 26px;font-size:16px}
.chatb,.chatf{position:relative;width:56px;height:56px;border-radius:50%;border:0;padding:0;background:none;cursor:pointer;transition:transform .16s var(--ease-out)}.chatb:active,.chatf:active{transform:scale(.94)}
.av2{position:relative;display:grid;place-items:center;width:100%;height:100%;border-radius:50%;overflow:hidden;background:var(--acc);color:#fff;box-shadow:0 0 0 3px #fff,0 4px 14px rgba(4,10,34,.18)}.av2 svg{width:26px;height:26px}.av2 img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 30%;transform:scale(1.32)}
.av2.sm{width:40px;height:40px;flex:none;box-shadow:none}.av2.sm svg{width:20px;height:20px}
.dot{position:absolute;right:2px;bottom:2px;width:13px;height:13px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 2px #fff}
.chatf{position:fixed;right:20px;bottom:20px;z-index:6}
.chat{position:fixed;right:20px;bottom:90px;z-index:22;width:min(380px,calc(100vw - 32px));max-height:min(560px,calc(100vh - 120px));background:#fff;border-radius:16px;box-shadow:0 24px 60px rgba(4,10,34,.25);display:flex;flex-direction:column;overflow:hidden;opacity:0;transform:translateY(12px) scale(.98);transform-origin:bottom right;pointer-events:none;transition:opacity .2s ease-out,transform .25s var(--ease-out)}.chat.open{opacity:1;transform:none;pointer-events:auto}
.ch-h{display:flex;align-items:center;gap:10px;padding:14px 16px;background:var(--navy);color:#fff}.ch-h b{display:block}.ch-h small{display:flex;align-items:center;gap:6px;font-size:12px;color:#aab0c4}.dot2{width:8px;height:8px;border-radius:50%;background:#22c55e}.ch-h .x{margin-left:auto;background:transparent;border-color:rgba(255,255,255,.25);color:#fff}
.ch-b{flex:1;overflow:auto;padding:16px;display:flex;flex-direction:column;gap:10px;background:var(--soft)}

@keyframes pop{from{opacity:0;transform:translateY(6px)}}
.typing{display:flex;gap:4px;padding:12px 14px}.typing i{width:6px;height:6px;border-radius:50%;background:var(--mut);animation:tp 1s infinite}.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}@keyframes tp{50%{opacity:.3;transform:translateY(-3px)}}
.ch-q{display:flex;flex-wrap:wrap;gap:6px;padding:10px 16px 0}.ch-q button{border:1.5px solid var(--line);background:#fff;border-radius:999px;padding:6px 12px;font-size:13px;font-weight:600;cursor:pointer;transition:border-color .15s ease-out}.ch-q button:hover{border-color:var(--acc);color:var(--acc)}
.ch-f{display:flex;gap:8px;padding:10px 16px}.ch-f input{flex:1;min-width:0;border:1.5px solid var(--line);border-radius:999px;padding:10px 14px;outline:0;font-size:15px}.ch-f input:focus{border-color:var(--navy)}.ch-f button{width:42px;height:42px;border-radius:50%;border:0;background:var(--acc);color:#fff;display:grid;place-items:center;cursor:pointer;flex:none}
.ch-n{margin:0;padding:0 16px 12px;font-size:11px;color:var(--mut);text-align:center}

body.prodr .chatf{display:none}body.prodr:has(.sbar.show){padding-bottom:84px}
/* klantenservice */
.ey2{display:flex;align-items:center;gap:8px}.ey2 svg{width:20px;height:20px}
.ksh{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:48px;align-items:center;margin-top:12px}.ksh h1{font-size:clamp(34px,4.4vw,56px)}.ksh .lead{font-size:18px;max-width:52ch}
.lnk2{display:inline-flex;align-items:center;gap:8px;text-decoration:underline;text-underline-offset:3px;font-weight:600}.lnk2 svg{width:18px;height:18px}
.ksi{position:relative;padding-bottom:28px}.ksi>img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:16px;background:var(--soft);display:block}
.ksb{position:absolute;left:28px;bottom:0;display:flex;gap:12px;align-items:center;background:#fff;border-radius:999px;padding:8px 22px 8px 8px;box-shadow:0 10px 30px rgba(4,10,34,.15)}.ksb>span{width:46px;height:46px;border-radius:50%;background:var(--acc);color:#fff;display:grid;place-items:center}.ksb svg{width:22px;height:22px}.ksb b{display:block;font-size:15px}.ksb small{color:var(--mut)}
.ksg{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.kst{display:grid;grid-template-columns:48px minmax(0,1fr);gap:14px;align-items:start;border:1px solid var(--line);border-radius:12px;padding:20px;transition:border-color .15s ease-out}.kst:hover{border-color:var(--navy)}.kst .ki{margin:0}.kst b{display:block;font-size:17px;margin-bottom:4px}.kst small{color:var(--mut);font-size:14px;line-height:1.45;display:block}
.ksc{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:40px;align-items:start}
.kcg{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.kcc{border:1px solid var(--line);border-radius:12px;padding:22px}.kcc b{display:block;font-size:18px;margin:4px 0 6px}.kcc p{margin:0;color:var(--mut);font-size:15px}.kcc a{color:var(--acc);text-decoration:underline;text-underline-offset:3px}.go2{display:inline-flex!important;align-items:center;gap:4px;margin-top:14px;font-weight:700;text-decoration:none!important}.go2 svg{width:16px;height:16px}
.kcn{display:flex;gap:12px;background:var(--soft);border-radius:12px;padding:18px 20px;margin-top:16px}.kcn svg{width:22px;height:22px;color:var(--acc);flex:none}.kcn p{margin:0}.kcn a{color:var(--acc);text-decoration:underline}
.kform{border:1px solid var(--line);border-radius:12px;padding:24px;margin-top:24px;display:grid;gap:12px}.kform h3{margin:0 0 4px;font-size:20px}.kform textarea{width:100%;border:1.5px solid var(--line);border-radius:12px;padding:24px 12px 8px;font:inherit;resize:vertical;outline:0}.kform textarea:focus{border-color:var(--navy);box-shadow:0 0 0 1px var(--navy)}.kform .btn{justify-self:start;padding:14px 28px}.kok b{font-size:20px}.kok p{color:var(--mut)}
.kbg{background:var(--soft);border-radius:16px;padding:26px;position:sticky;top:calc(var(--hh,0px) + 20px)}.kbg h3{margin:0 0 14px;font-size:20px}.kbg dl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px 18px;margin:0}.kbg dt{color:var(--mut)}.kbg dd{margin:0;font-weight:600}.kbg a{color:var(--acc);text-decoration:underline;text-underline-offset:3px}
/* blog artikel */
.bart{max-width:1100px;margin:0 auto}.bh{max-width:780px}.bcat{display:inline-block;background:var(--acc-soft);color:var(--acc);font-weight:700;font-size:13px;border-radius:999px;padding:4px 12px}.bh h1{font-size:clamp(30px,4vw,48px);margin:14px 0 12px}.bh .lead{font-size:19px;max-width:none}
.bmeta{display:flex;align-items:center;gap:12px;margin:8px 0 24px}.bav{width:44px;height:44px;border-radius:50%;background:var(--navy);color:var(--acc);display:grid;place-items:center;font-weight:800;font-size:12px}.bmeta b{display:block}.bmeta small{display:flex;align-items:center;gap:6px;color:var(--mut)}.bmeta small svg{width:14px;height:14px}
.shr{margin-left:auto;display:flex;align-items:center;gap:8px;border:1.5px solid var(--line);background:#fff;border-radius:999px;padding:8px 16px;font-weight:600;cursor:pointer}.shr svg{width:16px;height:16px}
.bhero{border-radius:16px;overflow:hidden;aspect-ratio:2/1;background:var(--soft)}.bhero img{width:100%;height:100%;object-fit:cover}
.blay{display:grid;grid-template-columns:260px minmax(0,1fr);gap:56px;margin-top:40px;align-items:start}
.btoc{position:sticky;top:calc(var(--hh,0px) + 20px);display:grid;gap:4px}.btoc>b{font-size:13px;color:var(--mut);text-transform:uppercase;letter-spacing:.06em;margin-bottom:6px}.btoc nav{display:grid;border-left:2px solid var(--line)}.btoc nav a{padding:7px 0 7px 14px;margin-left:-2px;border-left:2px solid transparent;color:var(--mut);font-size:15px;transition:color .15s ease-out,border-color .15s ease-out}.btoc nav a:hover{color:var(--ink)}.btoc nav a.on{color:var(--ink);border-color:var(--acc);font-weight:600}
.bhelp{margin-top:24px;background:var(--soft);border-radius:12px;padding:18px}.bhelp b{display:block}.bhelp p{color:var(--mut);font-size:14px;margin:4px 0 12px}.bhelp .btn{width:100%}
.bbody{max-width:720px;font-size:17px;line-height:1.75;color:#2d3348}.bbody h2{font-size:26px;letter-spacing:-.02em;color:var(--ink);margin:40px 0 12px;line-height:1.2;scroll-margin-top:calc(var(--hh,0px) + 20px)}.bbody h2:first-child{margin-top:0}.bbody p{margin:0 0 16px}.bbody ul,.bbody ol{padding-left:22px;margin:0 0 18px}
.btip{display:flex;gap:12px;background:var(--acc-soft);border-radius:12px;padding:16px 18px;margin:20px 0}.btip svg{width:22px;height:22px;color:var(--acc);flex:none;margin-top:3px}.btip p{margin:0}
.bsteps{list-style:none;padding:0!important;counter-reset:st;display:grid;gap:14px}.bsteps li{counter-increment:st;position:relative;padding-left:48px}.bsteps li::before{content:counter(st);position:absolute;left:0;top:2px;width:32px;height:32px;border-radius:50%;background:var(--navy);color:#fff;display:grid;place-items:center;font-weight:800;font-size:15px}
.bprods{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:22px 0 8px}.bprods.one{grid-template-columns:minmax(0,1fr)}
.bpc{display:grid;grid-template-columns:72px minmax(0,1fr) auto;gap:14px;align-items:center;border:1px solid var(--line);border-radius:12px;padding:12px;line-height:1.35;transition:border-color .15s ease-out}.bpc:hover{border-color:var(--navy)}.bpc .ph{width:72px;height:72px;border-radius:12px}.bpc small{display:block;color:var(--acc);font-weight:700;font-size:12px}.bpc b{display:block;font-size:15px;color:var(--ink)}.bpc em{font-style:normal;font-weight:800;color:var(--ink)}.bpc .btn{padding:9px 16px;font-size:14px}
.bfoot{display:flex;align-items:center;gap:10px;margin-top:32px;padding-top:20px;border-top:1px solid var(--line)}.bfoot span{font-weight:700;margin-right:6px}
/* juridisch */
.lgh{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:6px 24px;border-bottom:1px solid var(--line);padding-bottom:20px}.lgh .ct{margin:0}.lgh .lead{grid-column:1;margin:0;font-size:15px}.lgh .btn{grid-row:1/3;grid-column:2}
.blay.lg .bbody{font-size:16px}.blay.lg .bbody h2{font-size:21px;margin-top:32px}.lgo a.on{color:var(--ink);font-weight:600;border-color:var(--acc)}
/* retourpagina */
.rtl{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:56px;align-items:start;margin-top:20px}
.rtf{border:1px solid var(--line);border-radius:16px;padding:24px;display:grid;gap:8px;margin-top:20px}.rtf label{font-weight:700;margin-top:6px}.rtf input{border:1.5px solid var(--line);border-radius:12px;padding:16px;font-size:16px;outline:0}.rtf input:focus{border-color:var(--navy);box-shadow:0 0 0 1px var(--navy)}.rtf .btn{margin-top:10px;padding:16px;font-size:17px}.rtm{margin:6px 0 0;background:var(--soft);border-radius:12px;padding:12px 14px;color:var(--mut);font-size:14px}
.rtc{margin-top:16px}.rtc a{color:var(--acc);text-decoration:underline;text-underline-offset:3px}
.rts{display:grid;gap:20px}.rtw{border:1px solid var(--line);border-radius:16px;padding:26px}.rtw h2{font-size:21px;margin:0 0 18px}
.rst{list-style:none;margin:0;padding:0;counter-reset:r}.rst li{counter-increment:r;position:relative;padding:0 0 22px 52px}.rst li::before{content:counter(r);position:absolute;left:0;top:0;width:36px;height:36px;border-radius:50%;background:var(--acc-soft);color:var(--acc);display:grid;place-items:center;font-weight:800}.rst li:not(:last-child)::after{content:"";position:absolute;left:17px;top:42px;bottom:4px;width:2px;background:var(--line)}.rst b{display:block;font-size:17px}.rst small{color:var(--mut);font-size:14px}
.rtb{display:flex;gap:14px;align-items:center;border-top:1px solid var(--line);padding-top:18px;margin-top:4px}.rtb>span{width:40px;height:40px;border-radius:50%;background:#edf7f0;color:var(--ok);display:grid;place-items:center;flex:none}.rtb svg{width:20px;height:20px}.rtb b{display:block}.rtb small{color:var(--mut)}
.rts .help{margin:0}
.tl{border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin:16px 0;font-size:14px;color:var(--mut)}.tl ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:minmax(0,1fr);gap:8px}.tl li{display:flex;align-items:center;gap:8px;line-height:1.3}.tl li b{color:var(--ink);font-weight:600}.tl li svg{width:18px;height:18px;color:var(--acc);flex:none}.tl .tlw{height:16px;width:auto;flex:none}
.tlr{display:flex;align-items:center;gap:8px;border-top:1px solid var(--line);margin-top:10px;padding-top:10px}.tlr img{width:18px;height:18px}.tlr .fs{font-size:14px}.tlr b{color:var(--ink)}
.help{grid-template-columns:minmax(0,1fr) 42%!important;align-items:end;min-height:0}.help>div{padding:20px 0 20px 22px!important;align-self:center}.help h3{font-size:19px!important;margin:0 0 4px}.help p{margin:0 0 14px!important;font-size:15px;line-height:1.45}
.help .btn{white-space:nowrap;padding:11px 18px;font-size:15px}.help>img{max-height:150px!important;max-width:100%;object-fit:contain;object-position:bottom right;justify-self:end;align-self:end}
/* bundels en combideals */
.addon{border:0!important;padding:0!important}.adh{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px}.adh b{font-size:16px}.adb{background:var(--acc-soft);color:var(--acc);font-weight:700;font-size:13px;border-radius:999px;padding:3px 10px}
#ao{display:grid;gap:10px}
.sc{display:grid;grid-template-columns:auto 72px minmax(0,1fr);gap:12px;align-items:center;border:1.5px solid var(--line);border-radius:12px;padding:12px;background:#fff;transition:border-color .15s ease-out,background-color .15s ease-out}.sc.on{border-color:var(--acc);background:#fffaf6}
.scc input{width:22px;height:22px;margin:0;accent-color:var(--acc);cursor:pointer}.sc .ph{width:72px;height:72px;border-radius:12px}
.sci{min-width:0;display:grid;gap:3px}.sci small{color:var(--mut);font-size:12px;font-weight:600}.sci .nm{font-size:14px;-webkit-line-clamp:2}
.scp{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.scp strong{font-size:16px;font-weight:800}.scp s{color:var(--mut);font-size:13px}.bdg{background:var(--acc-soft);color:var(--acc);font-weight:800;font-size:12px;border-radius:6px;padding:2px 7px}
.sca{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:2px}
.alt{border:0;background:none;padding:0;color:var(--ink);font-weight:600;font-size:14px;text-decoration:underline;text-underline-offset:3px;cursor:pointer}.alt:hover{color:var(--acc)}
.ib2{width:24px;height:24px;border-radius:50%;border:0;background:var(--navy);color:#fff;font:italic 800 13px/1 Georgia,serif;display:grid;place-items:center;cursor:pointer;flex:none;transition:transform .16s var(--ease-out)}.ib2:hover{background:var(--acc)}.ib2:active{transform:scale(.92)}


#fbt{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;position:relative}


.fbt-sum{background:var(--soft);border-radius:12px;padding:22px;position:sticky;top:calc(var(--hh,0px) + 80px)}.fbt-sum p{margin:0 0 4px;color:var(--mut)}.fbt-sum strong{font-size:32px;font-weight:900;letter-spacing:-.03em}.fbt-sum s{color:var(--mut)}.fbsv{color:var(--sale)!important;font-weight:700}.fbt-sum .btn{width:100%;margin-top:14px;background:var(--cta)!important;color:var(--navy)!important}
.mdo{position:fixed;inset:0;z-index:30;background:rgba(4,10,34,.45);opacity:0;pointer-events:none;transition:opacity .25s ease}.mdo.open{opacity:1;pointer-events:auto}
.md{position:fixed;left:50%;top:50%;z-index:31;width:min(560px,calc(100vw - 24px));max-height:min(80vh,680px);background:#fff;border-radius:16px;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 30px 70px rgba(4,10,34,.3);transform:translate(-50%,-46%) scale(.98);opacity:0;pointer-events:none;transition:opacity .2s ease-out,transform .25s var(--ease-out)}.md.open{opacity:1;transform:translate(-50%,-50%);pointer-events:auto}
.md-h{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid var(--line)}.md-h b{font-size:17px}.md-b{overflow:auto;padding:18px;overscroll-behavior:contain}
.mi{display:grid;grid-template-columns:180px minmax(0,1fr);gap:20px}.mi>.ph{aspect-ratio:1;border-radius:12px}.mib{color:var(--mut);font-weight:700;font-size:12px;text-transform:uppercase;letter-spacing:.04em}.mi h3{font-size:18px;margin:4px 0 8px;line-height:1.25}.mi p{margin:10px 0 6px;color:#3a4156}.mi ul{margin:0 0 12px;padding-left:18px;color:#3a4156;line-height:1.7}
.alts{display:grid;gap:10px}.altc{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;border:1.5px solid var(--line);border-radius:12px;padding:10px 12px;transition:border-color .15s ease-out}.altc.on{border-color:var(--acc);background:#fffaf6}.altc:hover{border-color:var(--mut)}
.altp{display:grid;grid-template-columns:64px minmax(0,1fr) 22px;gap:12px;align-items:center;border:0;background:none;padding:0;text-align:left;cursor:pointer}.altp .ph{width:64px;height:64px;border-radius:12px}.altp .nm{font-size:14px;-webkit-line-clamp:2;display:-webkit-box}
.mi .ok{white-space:normal;align-items:flex-start}.rad{width:20px;height:20px;border-radius:50%;border:2px solid var(--line)}.altc.on .rad{border:6px solid var(--acc)}
.fbadge{position:fixed;left:16px;bottom:16px;z-index:4;display:flex;align-items:center;gap:6px;height:38px;padding:0 12px 0 8px;background:#fff;border:1px solid var(--line);border-radius:999px;box-shadow:0 4px 14px rgba(4,10,34,.1);font-size:14px;color:var(--ink);transition:box-shadow .2s ease-out,transform .16s var(--ease-out)}
.fbadge img{width:20px;height:20px}.fbadge .s{font-style:normal;color:#fbbc05;font-size:15px;line-height:1}.fbadge b{font-weight:800}
.fbx{max-width:0;overflow:hidden;white-space:nowrap;color:var(--mut);font-size:13px;transition:max-width .3s var(--ease-out)}.fbadge:hover .fbx{max-width:100px}.fbadge:hover{box-shadow:0 6px 20px rgba(4,10,34,.16)}.fbadge:active{transform:scale(.97)}
.dr-f{gap:8px!important;padding:12px 20px calc(12px + env(safe-area-inset-bottom,0px))!important;box-shadow:0 -8px 20px rgba(4,10,34,.06)}
.dft{display:flex;justify-content:space-between;align-items:center;gap:12px}.dft b{font-size:16px}.dft small{display:block;color:var(--mut);font-size:12px}.dft strong{font-size:20px;font-weight:900}
.dr-f .btn{padding:13px!important;font-size:16px}
.dfb{display:flex;justify-content:space-between;align-items:center;gap:10px}.dfb a{font-size:13px;font-weight:600;text-decoration:underline;text-underline-offset:3px;color:var(--ink);white-space:nowrap}
.pmr.sm{display:flex;gap:3px;margin:0;flex-wrap:nowrap}.pmr.sm img{width:26px;height:18px;border-radius:3px}
.dr-s{padding:10px 20px!important}.dr-s .dlt{margin-top:6px}.dr-h{padding:14px 20px!important}
.dr-b .upc.sm{padding:8px 10px;gap:10px;margin-bottom:6px}.dr-b .upc.sm .ph{width:52px;height:52px}.dr-b .uc-t{gap:1px}.dr-b .uc-t .nm{-webkit-line-clamp:1}.dr-b .uc-t small{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}.dr-b .upc.sm button{height:34px;padding:0 10px;font-size:13px}.dr-up{padding:12px 0 16px!important}.dr-up h3{margin-bottom:8px!important}
.ptop{display:none}
.pfav.on{color:#e0245e}.pfav.on svg{fill:currentColor}
/* reviewfoto's */
.rvph{margin-bottom:20px}.rvph-h{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px}.rvph-h b{font-size:16px}.rvph-h>span{color:var(--mut);font-size:14px}.rvf{margin-left:auto;display:flex;align-items:center;gap:6px;font-size:14px;cursor:pointer}.rvf input{accent-color:var(--acc);width:16px;height:16px}
.rvps{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none}.rvps::-webkit-scrollbar{display:none}
.rvth{position:relative;flex:none;width:92px;height:92px;border-radius:12px;overflow:hidden;border:0;padding:0;background:var(--soft);cursor:pointer;transition:transform .16s var(--ease-out)}.rvth:active{transform:scale(.96)}.rvth img{width:100%;height:100%;object-fit:cover}
.rvth .more{position:absolute;inset:0;z-index:1;background:rgba(4,10,34,.55);color:#fff;font-weight:800;font-size:20px;display:grid;place-items:center}

.rvth.sm{width:72px;height:72px}
.lbx img{width:100%;max-height:52vh;object-fit:contain;background:var(--soft);border-radius:12px}.lbt{margin-top:14px}.lbt .stars{color:#fbbc05;letter-spacing:1px}.lbt p{margin:4px 0 6px;color:#3a4156}.lbt small{color:var(--mut)}



.gx{display:none!important}.gal .th{display:flex!important;flex-direction:row;order:2;gap:8px;max-height:none;overflow-x:auto;scrollbar-width:none}.gal .th::-webkit-scrollbar{display:none}.gal .th button{width:76px;flex:none}
.rdm.fits::after{opacity:0}
/* vaak samen gekocht v2 */
.fsteps{list-style:none;margin:-4px 0 18px;padding:0;display:flex;flex-wrap:wrap;gap:8px 22px;color:var(--mut);font-size:14px}.fsteps li{display:flex;align-items:center;gap:8px}.fsteps li>i{font-style:normal;width:22px;height:22px;border-radius:50%;background:var(--navy);color:#fff;font-size:12px;display:grid;place-items:center;flex:none}.fsteps u{text-underline-offset:3px;color:var(--ink)}.hl10{color:var(--ok)}
#fbt.fbv{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr));gap:22px;position:static}
.bfc{position:relative;display:flex;flex-direction:column;border:1.5px solid var(--line);border-radius:12px;background:#fff;overflow:visible;transition:border-color .15s ease-out,opacity .2s ease-out}
.bfc+.bfc::before{content:"+";position:absolute;left:-19px;top:34%;width:16px;text-align:center;font-weight:800;font-size:20px;color:var(--mut)}
.bfc.bfm{border-color:var(--navy);background:var(--soft)}.bfc.on{border-color:var(--acc)}.bfc:not(.on):not(.bfm) .ph,.bfc:not(.on):not(.bfm) .fc-i>*:not(.sca){opacity:.55}
.bfc>.ph{aspect-ratio:1;border-radius:12px 12px 0 0;background:var(--soft)}.bfc.bfm>.ph{background:#fff}
.fc-tag{position:absolute;top:10px;left:10px;z-index:2;background:var(--navy);color:#fff;font-size:11px;font-weight:800;border-radius:6px;padding:3px 8px}
.fc-ck{position:absolute;top:10px;left:10px;z-index:2;display:flex;align-items:center;gap:6px;background:#fff;border:1px solid var(--line);border-radius:999px;padding:4px 10px 4px 6px;font-size:12px;font-weight:700;cursor:pointer;box-shadow:0 2px 6px rgba(4,10,34,.08)}.fc-ck input{width:18px;height:18px;margin:0;accent-color:var(--acc)}.bfc.on .fc-ck{border-color:var(--acc);color:var(--acc)}
.fc-i{padding:12px;display:flex;flex-direction:column;gap:4px;flex:1}.fc-i small{color:var(--mut);font-size:12px;font-weight:600}.fc-i .nm{font-size:13px;-webkit-line-clamp:2;line-height:1.3}.fc-i .sca{margin-top:auto;padding-top:6px}
.fbbar{position:static!important;margin-top:18px;display:flex!important;align-items:center;justify-content:space-between;gap:20px;padding:18px 22px!important}.fbs-l p{margin:0;color:var(--mut)}.fbs-p{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}.fbs-p strong{font-size:30px!important}.fbs-p s{color:var(--mut)}.fbbar .fbsv{margin:0!important}.fbbar .btn{width:auto!important;margin:0!important;padding:15px 34px!important;font-size:16px}
@media (min-width:1101px){#rel,#cupg{grid-template-columns:repeat(6,minmax(0,1fr));gap:14px}#rel .nm,#cupg .nm{font-size:14px}#rel .pr,#cupg .pr{font-size:18px}#rel .dl,#cupg .dl{display:none}#rel .bd,#cupg .bd{padding:10px 12px 0}#rel .atc,#cupg .atc{margin:8px 12px 12px;height:40px}}
@media (min-width:901px) and (max-width:1100px){#rel,#cupg{grid-template-columns:repeat(4,minmax(0,1fr))}#rel>:nth-child(n+5),#cupg>:nth-child(n+5){display:none}}
.mainw{position:relative}.main img{transition:opacity .2s ease-out,transform .25s var(--ease-out)}
.gar{position:absolute;top:50%;z-index:2;width:40px;height:40px;margin-top:-20px;border-radius:50%;border:0;padding:0;background:rgba(255,255,255,.92);color:var(--ink);display:grid;place-items:center;cursor:pointer;box-shadow:0 2px 10px rgba(4,10,34,.15);opacity:0;transition:opacity .2s ease-out,transform .16s var(--ease-out)}.gar svg{width:20px;height:20px}.gp{left:12px}.gn{right:12px}.mainw:hover .gar,.gar:focus-visible{opacity:1}.gar:active{transform:scale(.92)}
.gcnt{position:absolute;right:12px;bottom:12px;z-index:2;background:rgba(4,10,34,.7);color:#fff;font-size:12px;font-weight:700;border-radius:999px;padding:3px 9px}
@media (min-width:901px){.main{max-height:calc(100vh - var(--hh,0px) - 230px);aspect-ratio:auto;height:calc(100vh - var(--hh,0px) - 230px);min-height:360px}}
@media (hover:none){.gar{opacity:1;width:34px;height:34px;margin-top:-17px}}
/* collectie */
.ct{font-size:clamp(28px,4vw,40px);margin:6px 0 16px;letter-spacing:-.03em;font-weight:800}
.tb{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:14px}
.flt{display:flex;align-items:center;justify-content:center;gap:10px;background:#fff;border:1.5px solid var(--line);border-radius:12px;font-weight:600;padding:13px;cursor:pointer}
.sl{display:flex;align-items:center;border:1.5px solid var(--line);border-radius:12px;padding-left:12px;gap:8px}.sl{position:relative;padding-right:0}.sl select{border:0;flex:1;min-width:0;font-weight:600;padding:13px 40px 13px 0;background:transparent;appearance:none;-webkit-appearance:none;cursor:pointer;outline:0}.sl::after{content:"";position:absolute;right:16px;top:50%;width:8px;height:8px;border-right:2px solid var(--ink);border-bottom:2px solid var(--ink);transform:translateY(-70%) rotate(45deg);pointer-events:none}
.cnt{margin:0 0 6px;color:var(--mut)}
.fa{display:none}.fa.open{display:block;border:1px solid var(--line);border-radius:12px;padding:16px;margin-bottom:12px}
.fa .fg{border-top:1px solid var(--line);padding:16px 0}.fa .fg:first-child{border:0;padding-top:0}.fa h3{margin:0 0 8px;font-size:15px}.fa label{display:flex;gap:10px;padding:5px 0;font-size:15px;cursor:pointer}.fa input{accent-color:var(--acc);width:18px;height:18px;margin:0}
.row{cursor:pointer;display:flex;gap:16px;padding:16px 0;border-top:1px solid var(--line)}.row:first-child{border-top:0}
.row .ph{flex:0 0 38%;max-width:220px;aspect-ratio:1;align-self:flex-start;border-radius:12px}
.rb{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}.rb .nm{font-size:16px;-webkit-line-clamp:4}.rb .pr{margin:0;padding:0;font-size:20px;white-space:nowrap}
.rf{margin-top:auto;display:flex;justify-content:space-between;align-items:flex-end;gap:8px}
.ok{display:flex;align-items:center;gap:6px;color:var(--ok);font-weight:600;font-size:14px;margin-top:4px;white-space:nowrap}.ok i{width:18px;height:18px;border-radius:50%;background:var(--ok);color:#fff;font-style:normal;font-size:11px;display:grid;place-items:center}
.add{background:var(--acc);color:#fff;border:0;border-radius:12px;height:44px;padding:0 14px;display:flex;align-items:center;gap:4px;font-weight:700;font-size:20px;flex:none;cursor:pointer;transition:transform .16s var(--ease-out)}.add:active{transform:scale(.97)}.add svg{width:22px;height:22px}
/* product */
.pd{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:44px;align-items:start}
.gal{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;min-width:0}@media (min-width:901px){.gal{position:sticky;top:calc(var(--hh,0px) + 20px);align-self:start}}.th{display:flex;flex-direction:column;gap:8px;max-height:560px;overflow:auto;scrollbar-width:none}
.th button{border:1px solid var(--line);border-radius:12px;aspect-ratio:1;cursor:pointer;padding:0;flex:none;width:100%;overflow:hidden;transition:border-color .15s ease-out}.th button .ph{width:100%;height:100%}.th button.on{border:2px solid var(--acc)}
.main{aspect-ratio:1/1;border:1px solid var(--line);border-radius:12px}.main img{transition:opacity .2s ease-out}.main img.fade{opacity:0}
.info{min-width:0}.info h1{font-size:clamp(22px,2.6vw,30px);margin:6px 0 8px}
.rate{font-size:14px;color:var(--mut);display:flex;gap:8px;align-items:center}.rate b{color:#fbbc05;letter-spacing:1px}.rate a{text-decoration:underline;text-underline-offset:3px}
.hl{display:grid;gap:8px;margin:16px 0}.hl div{display:flex;align-items:center;gap:12px;font-weight:600;font-size:15px}.hl i{width:38px;height:38px;border-radius:12px;background:var(--acc-soft);color:var(--acc);display:grid;place-items:center;flex:none}
.opt{margin:20px 0}.opt>label,.opt>b{display:flex;justify-content:space-between;font-weight:700;margin-bottom:8px}.opt label span{font-weight:400;color:var(--mut)}
.chips{display:flex;gap:8px;flex-wrap:wrap}.chip{border:1.5px solid var(--line);background:#fff;border-radius:12px;padding:9px 16px;font-weight:700;cursor:pointer;transition:border-color .15s ease-out,transform .16s var(--ease-out)}.chip:hover{border-color:var(--mut)}.chip:active{transform:scale(.97)}.chip.on{border-color:var(--acc);background:var(--acc-soft)}.chip:disabled{opacity:.45;cursor:not-allowed;text-decoration:line-through}
.tiers{display:grid;gap:8px}.tier{position:relative;display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;border:1.5px solid var(--line);border-radius:12px;padding:12px 14px;cursor:pointer;transition:border-color .15s ease-out,background-color .15s ease-out}.tier:has(input:checked){border-color:var(--acc);background:#fffaf6}
.tier input{accent-color:var(--acc);width:18px;height:18px;margin:0}.tier b{display:block}.tier small{color:var(--mut)}.tier .tp{text-align:right;font-weight:800}.tier .tp s{display:block;font-weight:400;color:var(--mut);font-size:13px}
.save{display:inline-block;background:var(--ok);color:#fff!important;-webkit-text-fill-color:#fff;font-size:11px;font-weight:700;padding:2px 7px;border-radius:4px;margin-left:6px;vertical-align:2px}
.pop{position:absolute;top:-10px;right:14px;background:var(--navy);color:#fff;font-size:11px;font-weight:700;padding:2px 8px;border-radius:4px;letter-spacing:.04em;text-transform:uppercase}
.price strong{font-size:40px;letter-spacing:-.03em;font-weight:800;display:inline-block;line-height:1.1;margin-top:12px}.price s{color:var(--mut);font-size:18px;margin-left:8px}.price small{color:var(--mut);display:block}
.kl{display:flex;gap:10px;align-items:center;margin:12px 0;font-size:15px}.kl b.k{background:#ffb3c7;padding:4px 10px;border-radius:6px}
.info-i{color:var(--mut);font-size:14px;margin:0 0 16px}
.dlv{background:var(--soft);border-radius:12px;padding:16px;margin:16px 0;font-size:15px}.dlv b{color:var(--ok)}
.buy{display:grid;grid-template-columns:auto 1fr;gap:10px;margin:20px 0 12px}.buy .btn{font-size:17px;padding:15px}
.qty{display:flex;border:1.5px solid var(--navy);border-radius:12px;background:#fff}.qty button{width:40px;border:0;background:transparent;font-size:20px;cursor:pointer}.qty output{min-width:30px;display:grid;place-items:center;font-weight:700}
.qty.sm{border-width:1px;border-color:var(--line)}.qty.sm button{width:32px;height:34px;font-size:17px}.qty.sm output{min-width:24px;font-size:15px}
.addon{border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin:14px 0}.addon>b{display:block;margin-bottom:8px;font-size:15px}
.ao{display:grid;grid-template-columns:auto 52px 1fr auto;gap:12px;align-items:center;padding:6px 0;cursor:pointer;font-size:14px}.ao+.ao{border-top:1px dashed var(--line)}.ao input{accent-color:var(--acc);width:18px;height:18px;margin:0}.ao .ph{width:52px;height:52px;border-radius:6px}.ao b{white-space:nowrap}
.fit{background:var(--soft);padding:16px;border-radius:12px;margin:16px 0;font-size:15px}.fit .fr{margin-top:8px}.fit .plate input{font-size:18px}
details{border-top:1px solid var(--line);padding:14px 0}details:last-of-type{border-bottom:1px solid var(--line)}summary{font-weight:700;cursor:pointer;list-style:none;display:flex;justify-content:space-between}summary::-webkit-details-marker{display:none}summary::after{content:"+";font-size:20px;line-height:1}details[open] summary::after{content:"\2212"}details p,details td{color:var(--mut);font-size:15px;margin:8px 0 0}td{padding:4px 24px 4px 0}
/* varianten = losse producten */
.vs{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x proximity;padding:2px 2px 8px;scrollbar-width:none}.vs::-webkit-scrollbar{display:none}
.vb{flex:0 0 92px;text-align:center;scroll-snap-align:start;font-weight:700;font-size:15px}
.vb .ph{display:block;aspect-ratio:1;border:2px solid var(--line);border-radius:12px;margin-bottom:6px;background:#fff;transition:border-color .15s ease-out}.vb:hover .ph{border-color:var(--mut)}.vb.on .ph{border-color:var(--acc)}
.vb.off{color:var(--mut)}.vb.off .ph img{opacity:.5}.vb.off .ph::after{content:"";position:absolute;inset:0;background:linear-gradient(to top right,transparent calc(50% - 1px),var(--mut) 50%,transparent calc(50% + 1px));opacity:.6}
.dlv.no b{color:#c42b1c}.btn:disabled{background:var(--line);color:var(--mut);cursor:not-allowed;filter:none;transform:none}
/* bundel */
.fbt{border:1px solid var(--line);border-radius:12px;padding:24px;display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:32px;align-items:center}

.fi{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px;font-size:14px;transition:opacity .2s ease-out}.fi.off{opacity:.4}.fi .ph{aspect-ratio:1;border-radius:12px}.fi label{display:flex;gap:8px;align-items:flex-start;cursor:pointer;line-height:1.3}.fi input{accent-color:var(--acc);width:18px;height:18px;margin:1px 0 0;flex:none}.fi b{font-size:15px}
.fbt-sum{background:var(--soft);border-radius:12px;padding:20px}.fbt-sum p{margin:0 0 4px;color:var(--mut);font-size:15px}.fbt-sum strong{font-size:32px;letter-spacing:-.03em;font-weight:800}.fbt-sum s{color:var(--mut);margin-left:8px}.fbt-sum .btn{width:100%;margin-top:14px}
/* reviews */
.rv{display:grid;grid-template-columns:300px minmax(0,1fr);gap:40px;align-items:start}
.rv-sum{border:1px solid var(--line);border-radius:12px;padding:22px;position:sticky;top:140px}.rv-sum .big{font-size:56px;font-weight:800;letter-spacing:-.04em;line-height:1}.rv-sum .stars{color:#fbbc05;font-size:20px;letter-spacing:2px;margin:6px 0 2px}.rv-sum small{color:var(--mut)}
.dist{display:grid;gap:6px;margin:18px 0}.dist button{display:grid;grid-template-columns:28px 1fr 30px;gap:10px;align-items:center;border:0;background:none;padding:2px 0;cursor:pointer;font-size:14px;color:var(--mut);text-align:left}.dist button:hover{color:var(--ink)}.dist button.on{color:var(--ink);font-weight:700}
.dist span{height:8px;background:var(--soft);border-radius:4px;overflow:hidden}.dist span i{display:block;height:100%;background:#fbbc05;border-radius:4px}
.rv-sum .btn{width:100%}
.rvl{display:grid;gap:0}.rvc{border-top:1px solid var(--line);padding:20px 0}.rvc:first-child{border-top:0;padding-top:0}
.rvh{display:flex;align-items:center;gap:12px;margin-bottom:8px}.av{width:40px;height:40px;border-radius:50%;background:var(--navy);color:#fff;display:grid;place-items:center;font-weight:700;flex:none}
.rvh b{display:block;line-height:1.2}.rvh small{color:var(--mut)}.vf{display:inline-flex;align-items:center;gap:4px;color:var(--ok);font-size:13px;font-weight:600}
.rvc .stars{color:#fbbc05;letter-spacing:1px}.rvc h3{font-size:16px;margin:4px 0}.rvc p{margin:0;color:#2d3348}.rvc .car{display:inline-block;margin-top:10px;font-size:13px;background:var(--soft);border-radius:6px;padding:3px 8px;color:var(--mut)}
.rv-more{margin-top:16px}
.rv-empty{color:var(--mut)}
/* winkelwagen pagina */
.cp{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:36px;align-items:start}
.cl-h{display:flex;justify-content:space-between;align-items:baseline;gap:12px;border-bottom:1px solid var(--line);padding-bottom:12px;color:var(--mut);font-size:14px}
.li{display:grid;grid-template-columns:112px minmax(0,1fr) auto;gap:18px;padding:20px 0;border-bottom:1px solid var(--line)}
.li .ph{aspect-ratio:1;border-radius:12px}.li .nm{font-size:16px;-webkit-line-clamp:2}
.li .meta{font-size:14px;color:var(--mut);margin:4px 0 10px}.li .tag2{display:inline-block;background:var(--acc-soft);color:var(--acc);font-weight:700;font-size:12px;border-radius:4px;padding:2px 7px;margin-left:6px}
.li-a{display:flex;align-items:center;gap:16px}.rm{border:0;background:none;color:var(--mut);font-size:14px;text-decoration:underline;text-underline-offset:3px;cursor:pointer;padding:0}.rm:hover{color:var(--ink)}
.li-p{text-align:right;font-weight:800;font-size:18px;white-space:nowrap}.li-p s{display:block;font-weight:400;color:var(--mut);font-size:14px}
.sum{border:1px solid var(--line);border-radius:12px;padding:22px;position:sticky;top:140px;background:#fff}.sum h2{font-size:20px;margin:0 0 14px}
.sr{display:flex;justify-content:space-between;gap:12px;padding:5px 0;font-size:15px}.sr.dc{color:var(--sale);font-weight:600}.sr.tot{border-top:1px solid var(--line);margin-top:10px;padding-top:14px;font-weight:800;font-size:20px}.sr.tot small{display:block;font-weight:400;font-size:13px;color:var(--mut)}
.code{display:flex;gap:8px;margin:14px 0}.code input{flex:1;min-width:0;border:1.5px solid var(--line);border-radius:12px;padding:10px 12px;outline:0}.code input:focus{border-color:var(--navy)}.code .btn{padding:10px 16px}
.msg{font-size:13px;color:var(--mut);margin:-6px 0 10px;min-height:0}
.sum .btn.go{width:100%;font-size:17px;padding:16px}
.trust{list-style:none;padding:0;margin:16px 0 0;display:grid;gap:8px;font-size:14px;color:var(--mut)}.trust li{display:flex;gap:8px;align-items:center}.trust svg{color:var(--ok)}
.pm{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px}.pm span{border:1px solid var(--line);border-radius:5px;padding:3px 8px;font-size:12px;font-weight:700;color:var(--mut)}
.empty{text-align:center;padding:60px 20px;border:1px dashed var(--line);border-radius:12px}.empty h2{margin:0 0 6px}.empty p{color:var(--mut);margin:0 0 18px}
/* gratis verzending meter */
.ship{font-size:14px}.ship b{color:var(--acc)}.ship.done b{color:var(--ok)}.meter{height:6px;background:var(--soft);border-radius:3px;overflow:hidden;margin-top:8px}.meter i{display:block;height:100%;background:var(--acc);border-radius:3px;transition:width .4s var(--ease-out)}.ship.done .meter i{background:var(--ok)}
/* drawer */
.ov{position:fixed;inset:0;background:rgba(4,10,34,.45);z-index:20;opacity:0;pointer-events:none;transition:opacity .3s ease}.ov.open{opacity:1;pointer-events:auto}
.dr{position:fixed;top:0;right:0;bottom:0;width:min(440px,100vw);z-index:21;background:#fff;display:flex;flex-direction:column;transform:translateX(100%);transition:transform .45s var(--ease-drawer),visibility 0s linear .45s;visibility:hidden;padding-top:env(safe-area-inset-top,0px)}
.dr.open{transform:none;visibility:visible;transition:transform .45s var(--ease-drawer);box-shadow:-12px 0 40px rgba(4,10,34,.18)}
.dr-h{display:flex;justify-content:space-between;align-items:center;padding:18px 20px;border-bottom:1px solid var(--line)}.dr-h h2{margin:0;font-size:20px}.dr-h h2 span{color:var(--mut);font-weight:500;font-size:16px}
.x{width:40px;height:40px;border:1px solid var(--line);background:#fff;border-radius:12px;display:grid;place-items:center;cursor:pointer;transition:border-color .15s ease-out,transform .16s var(--ease-out)}.x:hover{border-color:var(--navy)}.x:active{transform:scale(.95)}
.dr-s{padding:14px 20px;border-bottom:1px solid var(--line)}
.dr-b{flex:1;overflow:auto;padding:0 20px;overscroll-behavior:contain}
.dl2{display:grid;grid-template-columns:76px minmax(0,1fr);gap:14px;padding:16px 0;border-bottom:1px solid var(--line)}.dl2 .ph{aspect-ratio:1;border-radius:12px}
.dl2 .nm{font-size:14px;-webkit-line-clamp:2}.dl2 .meta{font-size:13px;color:var(--mut);margin:2px 0 8px}.dl2-a{display:flex;justify-content:space-between;align-items:center;gap:8px}.dl2-a b{white-space:nowrap}.dl2-a s{font-weight:400;color:var(--mut);font-size:13px;margin-right:4px}
.dr-up .upc[hidden],.dr-up .cpu-sub[hidden]{display:none}
.dr-up{padding:16px 0 20px}.dr-up h3{font-size:15px;margin:0 0 10px}
.mini{display:grid;grid-template-columns:56px minmax(0,1fr) auto;gap:12px;align-items:center;padding:8px;border:1px solid var(--line);border-radius:12px;margin-bottom:8px}.mini .ph{width:56px;height:56px;border-radius:6px}.mini .nm{font-size:13px;-webkit-line-clamp:2}.mini small{font-weight:800;font-size:14px}
.mini button{border:1.5px solid var(--acc);color:var(--acc);background:#fff;border-radius:12px;height:36px;padding:0 12px;font-weight:700;cursor:pointer;transition:transform .16s var(--ease-out),background-color .15s ease-out}.mini button:hover{background:var(--acc-soft)}.mini button:active{transform:scale(.96)}
.dr-f{border-top:1px solid var(--line);padding:16px 20px calc(16px + env(safe-area-inset-bottom,0px));display:grid;gap:10px;background:#fff}
.dr-f .sr{padding:0}.dr-f .sr.tot{margin:0;padding-top:0;border:0;font-size:18px}
.dr-f .btn{width:100%;padding:15px;font-size:16px}
.dr-e{padding:40px 0;text-align:center}.dr-e p{color:var(--mut)}
.bar{display:none}
/* USP-balk desktop: compact zoals de oude site, met rechts de knop Klantenservice */
@media (min-width:901px){.usp{font-size:13px}.usp .w{padding-top:5px;padding-bottom:5px;gap:34px;align-items:center}.usp svg,.usp .uspi{width:17px;height:17px;margin-right:7px}.usp .usp-ks{margin-left:auto;display:inline-flex;align-items:center;gap:6px;padding:3px 10px 3px 8px;border-radius:999px;color:var(--ink);font-weight:600;text-decoration:none;transition:background-color .16s ease,color .16s ease}.usp .usp-ks svg{width:15px;height:15px;margin:0;fill:none;stroke:currentColor;stroke-width:2}.usp .usp-ks:hover,.usp .usp-ks:focus-visible{background:#f1f3f7}}
@media (max-width:900px){.usp .usp-ks{display:none}}
@media (min-width:901px){.cl{display:grid;grid-template-columns:240px minmax(0,1fr);gap:28px;align-items:start}.fa{display:block}.flt{display:none}.tb{display:flex;justify-content:flex-end}.sl{min-width:240px}#cg{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:28px}.row:nth-child(2){border-top:0}}
@media (max-width:900px){
#fbt.fbv{display:grid!important;grid-auto-flow:column;grid-template-columns:none!important;grid-auto-columns:46%;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px!important;margin:0 -20px!important;padding:0 20px 4px!important;scrollbar-width:none}.fbv::-webkit-scrollbar{display:none}.bfc{scroll-snap-align:start}.bfc+.bfc::before{left:-13px;font-size:16px}
.fbbar{flex-direction:column;align-items:stretch}.fbbar .btn{width:100%!important}.fsteps{flex-direction:column;gap:6px}
.gx{display:none}.gal .th{display:flex!important}
.rvth{width:76px;height:76px}.rvf{margin-left:0;width:100%}
.ptop{display:block;margin:4px 0 14px}.pback{display:inline-flex;align-items:center;gap:4px;color:var(--acc);font-weight:600;font-size:15px;margin-bottom:6px}.pback svg{width:16px;height:16px}
.pt-h{font-size:22px!important;line-height:1.2!important;letter-spacing:-.02em!important;margin:0 0 8px!important;font-weight:800!important;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pt-r{display:flex;align-items:center;gap:10px;flex-wrap:nowrap;font-size:14px;white-space:nowrap}.pt-r .fs{flex:none}.pt-r .fs{font-size:16px}.pt-r a{font-weight:700;text-decoration:underline;text-underline-offset:3px}.pt-b{color:var(--mut);min-width:0;overflow:hidden;text-overflow:ellipsis}
.pfav{margin-left:auto;display:flex;align-items:center;gap:5px;border:0;background:none;padding:0;color:var(--mut);font-size:14px;cursor:pointer}.pfav svg{width:20px;height:20px}
#prod .bc,#prod .info>.br,#prod .info>h1,#prod .info>.rate{display:none}
body.prodr .fbadge,body.lock .fbadge{display:none}.fbadge{left:12px;bottom:14px;height:34px;font-size:13px}
#fbt{grid-template-columns:minmax(0,1fr)}.fbt-sum{position:static}.mi{grid-template-columns:minmax(0,1fr)}.mi>.ph{max-width:220px}.md{top:auto;bottom:0;left:0;width:100%;max-height:88vh;border-radius:20px 20px 0 0;transform:translateY(100%)}.md.open{transform:none}
.tl ul{grid-template-columns:minmax(0,1fr)}
.rtl{grid-template-columns:minmax(0,1fr);gap:28px}
.ksh,.ksc,.blay{grid-template-columns:minmax(0,1fr);gap:24px}.ksh .lead{font-size:16px}.ksg{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}.kst{grid-template-columns:minmax(0,1fr);padding:16px;gap:10px}.kst b{font-size:15px}.kst small{font-size:13px}.kcg{grid-template-columns:minmax(0,1fr)}.kbg{position:static}.ksb{left:14px}
.btoc{position:static;background:var(--soft);border-radius:12px;padding:16px}.btoc .bhelp{display:none}.bbody{font-size:16px}.bbody h2{font-size:22px}.bprods{grid-template-columns:minmax(0,1fr)}.bpc{grid-template-columns:60px minmax(0,1fr)}.bpc .ph{width:60px;height:60px}.bpc .btn{display:none}.bhero{aspect-ratio:16/10;border-radius:12px}.shr span{display:none}
.lgh{grid-template-columns:minmax(0,1fr)}.lgh .btn{grid-row:auto;grid-column:auto;justify-self:start}
.sbw{grid-template-columns:minmax(0,1fr) 52px;gap:10px;padding-top:10px;padding-bottom:10px}.sb-im,.sb-t,.sb-p{display:none}.sbw .btn{padding:15px;font-size:17px}.chatb{width:52px;height:52px}.sbar{transform:none}
.chatf{right:14px;bottom:14px;width:52px;height:52px}body.pp .chatf{bottom:86px}.chat{right:12px;bottom:80px}body.prodr .chat{bottom:84px}
.cpu-g{grid-template-columns:minmax(0,1fr)}.upc{grid-template-columns:64px minmax(0,1fr) auto;grid-template-rows:none;align-items:center}.upc .ph{width:64px;height:64px}.upc button{grid-column:auto;padding:0 12px}.cass{grid-template-columns:minmax(0,1fr)}
.fc{padding-bottom:0!important}.fn{padding-bottom:28px!important}.fks>div{padding-bottom:20px}.fks>img{max-width:150px!important;max-height:160px!important}
.scr2{grid-auto-columns:38%;gap:10px}.sct{min-height:150px;padding:14px 8px}.sct span{width:72px;height:72px}.sct b{font-size:14px}.scw .ar{display:none}
.fbw{grid-template-columns:minmax(0,1fr)}.fbw .ar{display:none}.fbs{grid-template-columns:auto auto;justify-content:start;align-items:center;column-gap:12px;text-align:left;justify-items:start}.fbs img{margin:0}.frt2{grid-auto-columns:82%}
.pinfo{grid-template-columns:minmax(0,1fr);gap:28px}.spec{grid-template-columns:minmax(0,1fr)}.ptw{gap:22px}.ptabs a{font-size:15px}.ph2{font-size:21px}
.hd{display:grid!important;grid-template-columns:1fr auto 1fr;align-items:center;gap:8px 4px;padding:10px 0}.hb{display:grid}.logo{justify-self:center;flex:none}.logo img{height:46px!important}
.acts{justify-self:end;gap:0}.ia{min-width:0;padding:6px}.ia .lbl{display:none!important}.ia svg{width:26px;height:26px}.ia .bub{top:0;right:0;min-width:18px;height:18px;font-size:11px}
.search{grid-column:1/-1;order:0;flex-basis:auto;max-width:none;width:100%;margin:2px 0 4px;justify-self:stretch}.search input{font-size:16px;padding:12px 18px!important}header nav{display:none}
.top .pt.big{min-height:300px}.top .pt.big .pt-t b{font-size:28px}.tiles{grid-template-rows:none;grid-template-columns:1fr 1fr}.tiles .pt{min-height:170px}.pt-t{left:16px;bottom:14px}.pt-t b{font-size:20px}
.svc{grid-template-columns:1fr 1fr;gap:10px}.svc .pt,.svc .pt.big{grid-column:auto;min-height:0;aspect-ratio:1}.svc .pt .pt-t b,.svc .pt.big .pt-t b{font-size:18px}.svc .pt-t span{font-size:14px}
.rvt{grid-auto-columns:80%}.rvh2 .fbc2{display:none}.blg{grid-auto-flow:column;grid-template-columns:none;grid-auto-columns:80%;overflow-x:auto;scroll-snap-type:x mandatory}.blg a{scroll-snap-align:start}
footer .w.fw{grid-template-columns:minmax(0,1fr);gap:0}.fks{grid-template-columns:minmax(0,1fr) 40%;border-bottom:1px solid #1c2445!important;padding-bottom:0}.fks>img{max-width:150px!important;max-height:150px!important}
.fc{border-bottom:1px solid #1c2445!important}.fc summary{pointer-events:auto;cursor:pointer;display:flex;justify-content:space-between;align-items:center;padding:18px 0}.fc summary h4{margin:0}.fc summary::after{display:block;content:"";width:10px;height:10px;border-right:2.5px solid var(--acc);border-bottom:2.5px solid var(--acc);transform:rotate(45deg);margin-top:-6px;transition:transform .2s var(--ease-out)}.fc[open] summary::after{transform:rotate(225deg);margin-top:4px}.fc nav{padding-bottom:18px}
.fn{padding-top:20px}.fb .w{flex-direction:column;align-items:center;text-align:center}.fbl{justify-content:center;gap:10px 16px}.fpay{justify-content:center}footer{padding-top:32px}
.mtrack{grid-auto-columns:40%}.ml{height:84px;padding:14px}.ml img{max-height:44px}
.usp .w,.usp2 .w{display:grid!important;justify-content:center;overflow:hidden}.usp .w span,.usp2 .w span{grid-area:1/1;justify-content:center;opacity:0;transform:translateY(6px);transition:opacity .35s ease-out,transform .35s var(--ease-out);pointer-events:none}.usp2 .w span.on,.usp .w span.on{opacity:1;transform:none;pointer-events:auto}
.uspb{grid-template-columns:1fr 1fr;gap:8px}.uspb>div{padding:12px;gap:10px}.uspb svg{width:20px;height:20px}
.theme,.kh,.brs,.nb{grid-template-columns:minmax(0,1fr)}.th-main{min-height:300px}.th-txt{padding:22px}.nb{padding:26px 20px;gap:16px}.nb h2{font-size:24px}
.scr{grid-auto-columns:72%}
.team{grid-template-columns:minmax(0,1fr)}.team>div{padding:28px 20px 0}.team h2{font-size:26px}.team>img{max-width:190px;max-height:190px;margin:12px auto 0}
.fks{grid-template-columns:minmax(0,1fr) auto}.fks>img{max-width:110px;max-height:100px}.fks h4{font-size:19px}
.help>div{padding:18px}.help h3{font-size:18px}

.cos{grid-template-columns:minmax(0,1fr);gap:0}


.c3{grid-template-columns:1fr 1fr}.c3 .wd{grid-column:1/-1}

.top{grid-template-columns:minmax(0,1fr);margin-top:14px}.slider{min-height:0}.slide{grid-template-columns:minmax(0,1fr) 38%;padding:22px 20px 58px;gap:10px}.slide h2{font-size:26px}.slide p{display:none}.slide .from{font-size:17px;margin-bottom:12px}.slide .btn{padding:10px 16px;font-size:14px}.ar{width:36px;height:36px}
.tiles{grid-template-rows:none;grid-template-columns:1fr 1fr;gap:10px}.tile{grid-template-columns:minmax(0,1fr);padding:14px;gap:10px;align-content:start}.tile .ph{width:100%;height:auto;aspect-ratio:1;order:-1}.tile h3{font-size:16px}.tile p{display:none}.tile .go{margin-top:6px}
.kz{grid-template-columns:minmax(0,1fr);gap:12px;padding:16px}.kz .fr{grid-template-columns:minmax(0,1fr) auto}.kz .fr small{grid-column:1/-1}
header{position:static}.hero,.combo,.pd,.fbt,.rv,.cp{grid-template-columns:minmax(0,1fr)}
.cats{display:grid;grid-auto-flow:column;grid-template-columns:none;grid-auto-columns:36%;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;gap:12px}.cats::-webkit-scrollbar{display:none}.cat{scroll-snap-align:start}.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.blog{grid-template-columns:1fr}footer .w{grid-template-columns:1fr 1fr}.combo>div{padding:28px 20px}
.gal{position:static;grid-template-columns:minmax(0,1fr)}.th{flex-direction:row;order:2;max-height:none}.th button{width:64px}
.hd{flex-wrap:wrap;gap:10px}.search{order:3;flex-basis:100%}.logo{flex:1}.logo img{height:40px}
.cart .lbl{display:none}
.fbt{padding:16px;gap:18px}.fi{display:grid;grid-template-columns:64px minmax(0,1fr) auto;align-items:center;gap:12px;font-size:14px}.fi .ph{width:64px}.fi b{font-size:15px}
.rv-sum,.sum{position:static}
.li{grid-template-columns:84px minmax(0,1fr);gap:14px}.li-p{grid-column:2;text-align:left}.li-p s{display:inline;margin-left:6px}
.bar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:6;background:var(--bg);border-top:1px solid var(--line);padding:10px 16px calc(10px + env(safe-area-inset-bottom,0px));gap:12px;align-items:center}.bar strong{font-size:20px;font-weight:800}.bar .btn{flex:1}
body.pp:has(.sbar,.cbar,.fbar:not([hidden])){padding-bottom:76px}}
@media (hover:none){.btn:hover,.atc:hover{filter:none}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:.01ms!important;animation:none!important}}
/* TYPOGRAFIE STRAKKER (Figtree) */
body{line-height:1.55}
h1,.ct,.ksh h1,.bh h1{font-weight:900;letter-spacing:-.04em;line-height:1.02}
h2,h2.t,.ph2,.combo h2,.team h2{font-weight:800;letter-spacing:-.03em;line-height:1.1}
h3,.khc b,.br3 b,.tile h3,.pt-t b{font-weight:800;letter-spacing:-.02em}
h2.t{font-size:28px}.ph2{font-size:26px}
.eyebrow,.br,.tile small,.br3 small,.blg small,.bpc small{letter-spacing:.03em;font-size:12px}
.nm{font-weight:600;letter-spacing:-.005em}
.pr,.price strong,.sb-p strong,.li-p,.sr,.tp,.lp,.dl2-a b,.uc-t b,.bpc em,.fbt-sum strong{font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.pr{font-weight:900;font-size:20px}.price strong{font-weight:900;letter-spacing:-.04em}
.lead,p{color:inherit}.lead{color:var(--mut);letter-spacing:-.005em}
nav a,.btn,.chip{letter-spacing:-.005em}
.btn{font-weight:800}
.st,.dl,small{letter-spacing:0}
/* gele winkelwagenknoppen */
:root{--cta:#ffcd00;--cta-h:#f2c200}
#add,#add2,.atc,.add{background:var(--cta)!important;color:var(--navy)!important}#add:hover,#add2:hover,.atc:hover,.add:hover{background:var(--cta-h)!important;filter:none}
#add:disabled,#add2:disabled{background:var(--line)!important;color:var(--mut)!important}
/* mobiel: sliders lopen tot de schermrand, eerste kaart start op de paginamarge */
@media (max-width:900px){
.cats,.scr,.mtrack,.rvt,.frt2,.scr2,.rvps,.blg,.vs,.ptw{margin-left:-20px!important;margin-right:-20px!important;padding-left:20px!important;padding-right:20px!important;scroll-padding-inline:20px;width:auto!important;max-width:none!important}
h2.t{font-size:24px!important}.sh{align-items:baseline}
}
/* subtielere typografie */
h1,.ct,.ksh h1,.bh h1{font-weight:700!important;letter-spacing:-.025em!important}
.ct{font-size:clamp(26px,3vw,34px)!important}.pt-h,.info h1{font-weight:700!important}
h2,h2.t,.ph2,.combo h2,.team h2,.nb h2{font-weight:700!important;letter-spacing:-.02em!important}
h3,.khc b,.br3 b,.tile h3,.pt-t b,.kst b,.rst b{font-weight:700!important;letter-spacing:-.01em!important}
.price strong,.fbt-sum strong,.fbs-p strong{font-weight:800!important;letter-spacing:-.03em!important}
.pr,.sb-p strong,.dft strong{font-weight:700!important}
.btn{font-weight:700!important}
nav a{font-weight:500}
.uspi{width:20px;height:20px;flex:none;margin-right:8px;object-fit:contain}
/* bundelkaart: hele kaart klikbaar, subtiel vinkje */
.bfc:not(.bfm){cursor:pointer;user-select:none}.bfc:not(.bfm):hover{border-color:var(--mut)}.bfc.on:hover{border-color:var(--acc)}
.fc-ck{top:10px!important;left:auto!important;right:10px;padding:0!important;border:0!important;background:none!important;box-shadow:none!important}
.fc-ck input{position:absolute;opacity:0;width:1px;height:1px}
.fc-ck i{width:26px;height:26px;border-radius:50%;border:2px solid var(--line);background:#fff;display:grid;place-items:center;transition:background-color .15s ease-out,border-color .15s ease-out,transform .16s var(--ease-out)}
.fc-ck i::after{content:"";width:6px;height:11px;border:solid #fff;border-width:0 2.5px 2.5px 0;transform:rotate(45deg) translate(-1px,-1px);opacity:0;transition:opacity .15s ease-out}
.bfc.on .fc-ck i{background:var(--acc);border-color:var(--acc)}.bfc.on .fc-ck i::after{opacity:1}
.bfc:active .fc-ck i{transform:scale(.9)}.fc-ck input:focus-visible+i{outline:2px solid var(--navy);outline-offset:2px}
@media (min-width:1101px){.scr.scr6{grid-auto-columns:calc((100% - 5*14px)/6);gap:14px}.scr6 .nm{font-size:14px}.scr6 .pr{font-size:18px}.scr6 .dl{display:none}.scr6 .bd{padding:10px 12px 0}.scr6 .atc{margin:8px 12px 12px;height:40px}}
@media (min-width:901px) and (max-width:1100px){.scr.scr6{grid-auto-columns:calc((100% - 3*16px)/4)}}

/* =====================================================================================================================
   THEMA-AANVULLINGEN (alles hierboven is het ontwerp v4; hieronder wat een echte winkel extra nodig heeft)
   ===================================================================================================================== */
.s-header{position:sticky;top:env(safe-area-inset-top,0px);z-index:5}
.s-header header{position:static}
@media (max-width:900px){.s-header{position:static}}
.skip{position:absolute;left:12px;top:-60px;z-index:50;background:var(--navy);color:#fff;padding:10px 16px;border-radius:12px;font-weight:700}.skip:focus{top:12px}
main:focus{outline:0}
:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.logo img{height:var(--logo-h,52px)}
.logo img.logo-svg{height:auto!important;width:150px}
@media (max-width:900px){.logo img.logo-svg{width:130px}}
.mm-h img.logo-svg{height:auto;width:103px}
@media (max-width:900px){.logo img{height:var(--logo-h-m,46px)!important}}
.search input[type=search]{-webkit-appearance:none;appearance:none}.search input::-webkit-search-cancel-button{display:none}
/* productkaart */
.card{position:relative}
.card .ph{aspect-ratio:1/1;display:block}
.card .ph-l{position:absolute;inset:0;display:block}
.card .hrt{z-index:2}
.card>a.bd{display:flex;flex-direction:column;flex:1}
a.atc{text-decoration:none}
.badge.nv{background:var(--navy)}
.dl.no{color:#c42b1c}
.st{display:flex;align-items:center;gap:6px;min-height:19px}.st .fs{font-size:14px}.st-v{color:var(--ink);font-weight:600}
[aria-busy=true]{opacity:.6;pointer-events:none}
/* winkelwagenlade */
.dr.busy .dr-b,.dr.busy .dr-f{opacity:.55;pointer-events:none;transition:opacity .15s}
.dr.dr-laadt .dr-b>*,.dr.dr-laadt .dr-f{visibility:hidden}.dr.dr-laadt .dr-b::before{content:"";display:block;height:172px;margin-top:16px;background:linear-gradient(var(--soft) 0 0) 0 0/100% 76px no-repeat,linear-gradient(var(--soft) 0 0) 0 96px/100% 76px no-repeat}
.dr-later h3,.dr-up h3{font-size:15px;margin:16px 0 10px}
.upc-b{grid-column:auto;display:grid;place-items:center;border:1.5px solid var(--acc);color:var(--acc);border-radius:12px;height:36px;padding:0 12px;font-weight:700;font-size:14px}
.upc:not(.sm) .upc-b{grid-column:1/-1;height:38px}
.go-co{display:flex;background:var(--cta)!important;color:var(--navy)!important}.go-co:hover{background:var(--cta-h)!important;filter:none}
/* footer */
.fks-t p{margin:0 0 14px;color:#d6d9e3}.fks-t strong{color:#fff}
.fks-c{display:grid;gap:6px}.fks-c a{display:inline-flex;align-items:center;gap:8px;color:#fff}.fks-c svg{width:18px;height:18px;color:var(--acc)}
.fn-ok b{color:#fff}.fn-err{color:#ffb4a8;margin:0;font-size:14px}
.fbl a{color:var(--mut)}
/* melding */
.toast{position:fixed;left:50%;bottom:24px;z-index:40;transform:translate(-50%,8px);opacity:0;background:var(--navy);color:#fff;padding:8px 14px;border-radius:10px;font-size:14px;line-height:1.35;font-weight:600;text-align:center;box-shadow:0 8px 20px rgba(4,10,34,.2);transition:opacity .18s ease-out,transform .2s var(--ease-out);width:max-content;max-width:min(360px,calc(100vw - 32px))}
.toast.on{opacity:1;transform:translate(-50%,0)}
body.prodr .toast{bottom:100px}
@media (max-width:900px){.toast{font-size:13px;bottom:calc(16px + env(safe-area-inset-bottom,0px))}body.pp:has(.sbar,.cbar,.fbar:not([hidden])) .toast,body.prodr .toast{bottom:calc(88px + env(safe-area-inset-bottom,0px))}}
@media (prefers-reduced-motion:reduce){.toast{transition:opacity .01s;transform:translate(-50%,0)}}
/* tekst uit de editor (pagina's, blogs, beleid) */
.rte{line-height:1.7;color:#2d3348}.rte h2{font-size:24px;margin:32px 0 10px;color:var(--ink)}.rte h3{font-size:19px;margin:24px 0 8px;color:var(--ink)}.rte p{margin:0 0 14px}.rte ul,.rte ol{padding-left:22px;margin:0 0 16px}.rte a{color:var(--acc);text-decoration:underline;text-underline-offset:3px}.rte img{border-radius:12px;height:auto}.rte table{border-collapse:collapse;width:100%;margin:0 0 16px}.rte td,.rte th{border-bottom:1px solid var(--line);padding:8px 12px 8px 0;text-align:left}
.rte iframe{max-width:100%;border:0;border-radius:12px}
.policy{max-width:860px;padding-top:24px;padding-bottom:56px}.policy .shopify-policy__title h1{font-size:clamp(28px,4vw,40px);margin:6px 0 20px}.policy .shopify-policy__body{line-height:1.7;color:#2d3348}.policy a{color:var(--acc);text-decoration:underline}
/* paginering */
.pag{display:flex;justify-content:center;align-items:center;gap:6px;margin:28px 0 8px;flex-wrap:wrap}.pag a,.pag span{min-width:42px;height:42px;padding:0 12px;display:grid;place-items:center;border:1.5px solid var(--line);border-radius:12px;font-weight:700}.pag a:hover{border-color:var(--navy)}.pag .cur{background:var(--navy);color:#fff;border-color:var(--navy)}.pag .gap{border:0}
/* formulieren algemeen */
.fld textarea{width:100%;min-height:130px;border:1.5px solid var(--line);border-radius:12px;padding:24px 12px 8px;background:#fff;outline:0;resize:vertical}.fld textarea:focus{border-color:var(--navy);box-shadow:0 0 0 1px var(--navy)}
.note{border-radius:12px;padding:12px 14px;font-size:15px;margin:0 0 14px}.note.ok{background:#edf7f0;color:#14532d}.note.bad{background:#fdeeec;color:#7a1a12}.note.info{background:var(--soft);color:var(--ink)}
.btn.cta{background:var(--cta);color:var(--navy)}.btn.cta:hover{background:var(--cta-h);filter:none}
.lnk3{color:var(--acc);font-weight:700;text-decoration:underline;text-underline-offset:3px}
/* algemene paginatitel en lege staten */
.pg{padding-top:8px;padding-bottom:24px}
.pg-h{margin-bottom:18px}.pg-h .lead{margin:0}
@media print{.usp,.s-header,.s-footer,.fbadge,#vct-chat,.sbar,.pre{display:none!important}}
.sfree{color:var(--ok)}
/* =====================================================================================================================
   BEWEGING (micro-interacties en scroll-reveals). Alleen transform/opacity (translate/scale), kort en met ease-out.
   Alles binnen prefers-reduced-motion: no-preference; scroll-reveals alleen in browsers met scroll-driven animations
   (Chrome/Edge 115+, Safari 26+); elders staat alles gewoon stil (progressieve verbetering, geen script nodig).
   ===================================================================================================================== */
@media screen and (prefers-reduced-motion:no-preference){
  /* klikken: bevestiging na toevoegen aan winkelwagen en bij een nieuwe favoriet */
  @keyframes vct-added{0%{scale:1}35%{scale:1.07}100%{scale:1}}
  @keyframes vct-pop{0%{scale:1}40%{scale:1.25}100%{scale:1}}
  .added{animation:vct-added .36s var(--ease-out)}
  .hrt.pop svg{animation:vct-pop .4s var(--ease-out)}
  .vb .ph{transition:border-color .15s ease-out,scale .16s var(--ease-out)}
  .vb:active .ph{scale:.96}
  /* openen: regels in de lade en het mobiele menu schuiven kort na elkaar in */
  @keyframes vct-in-x{from{opacity:0;translate:12px 0}}
  @keyframes vct-in-xl{from{opacity:0;translate:-12px 0}}
  @keyframes vct-fade{from{opacity:0;translate:0 -4px}}
  /* alleen bij het openen (.is-opening, vct-theme.js), niet na elke verversing van de lade: anders schuift alles opnieuw in */
  .dr.is-opening .dr-b>*{animation:vct-in-x .26s var(--ease-out) both}
  .dr.is-opening .dr-b>:nth-child(2){animation-delay:40ms}.dr.is-opening .dr-b>:nth-child(3){animation-delay:80ms}
  .dr.is-opening .dr-b>:nth-child(n+4){animation-delay:120ms}
  .mm.open .mml>a,.mm.open .mms>a{animation:vct-in-xl .26s var(--ease-out) both}
  .mm.open .mml>a:nth-child(2){animation-delay:25ms}.mm.open .mml>a:nth-child(3){animation-delay:50ms}
  .mm.open .mml>a:nth-child(4){animation-delay:75ms}.mm.open .mml>a:nth-child(5){animation-delay:100ms}
  .mm.open .mml>a:nth-child(n+6),.mm.open .mms>a{animation-delay:125ms}
  /* uitklappen: inhoud van vraag-en-antwoord komt zacht binnen */
  details[open]>:not(summary){animation:vct-fade .22s var(--ease-out)}
  /* scrollen: rijen en tegels komen in beeld met een kleine verschuiving, kinderen licht na elkaar */
  @supports ((animation-timeline:view()) and (animation-range:entry)){
    @keyframes vct-rise{from{opacity:.8;translate:0 8px}}   /* klein en kort: half zichtbare kaarten leken 'niet beschikbaar' (eigenaar okt 2026) */
    :is(.cats,.scr,.grid,.kh,.brs,.svc,.blg,.uspb,.ksg,.kcg,.rvt){view-timeline:--vct-rv block}
    :is(.cats,.scr,.grid,.kh,.brs,.svc,.blg,.uspb,.ksg,.kcg,.rvt)>*{animation:vct-rise linear both;animation-timeline:--vct-rv;animation-range:entry 0% entry 25%}
    :is(.cats,.scr,.grid,.kh,.brs,.svc,.blg,.uspb,.ksg,.kcg,.rvt)>:nth-child(2){animation-range:entry 2% entry 27%}
    :is(.cats,.scr,.grid,.kh,.brs,.svc,.blg,.uspb,.ksg,.kcg,.rvt)>:nth-child(3){animation-range:entry 4% entry 29%}
    :is(.cats,.scr,.grid,.kh,.brs,.svc,.blg,.uspb,.ksg,.kcg,.rvt)>:nth-child(n+4){animation-range:entry 6% entry 31%}
    :is(.theme,.combo,.fbr,.ksc){animation:vct-rise linear both;animation-timeline:view();animation-range:entry 0% entry 25%}
  }
}
/* Oranje vlakken met witte tekst (knoppen, labels) gebruiken het accent zelf, dezelfde kleur als de vinkjes in de
   lade (keuze eigenaar okt 2026). --acc-on blijft alleen voor oranje tekst op wit. */
.btn,.badge,.kd-pill,.ia .bub,.msg-u,.flt .fcnt,.bcat:hover{background-color:var(--acc)}
.fzn .pc{background-color:var(--acc)!important}
/* categoriebalk die niet past (lang menu): rand vervaagt aan de kant waar nog meer staat */
.hnav.hnav-more{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 56px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 56px),transparent);scroll-behavior:smooth}
.hnav.hnav-more.hnav-start{-webkit-mask-image:linear-gradient(90deg,transparent,#000 56px,#000 calc(100% - 56px),transparent);mask-image:linear-gradient(90deg,transparent,#000 56px,#000 calc(100% - 56px),transparent)}
.hnav.hnav-more.hnav-start.hnav-end{-webkit-mask-image:linear-gradient(90deg,transparent,#000 56px);mask-image:linear-gradient(90deg,transparent,#000 56px)}
.hnav a:focus-visible{outline-offset:-2px}
/* tablet (901-1100 px): acht categorietegels zijn te smal voor de naam met pijl; dan vier per rij */
@media (min-width:901px) and (max-width:1100px){.cats.cats:not(.many):not(.cov-cats){grid-template-columns:repeat(4,minmax(0,1fr))}}
/* Ontwerptokens die het slimme zoeken, de vergelijker en de chatlader lezen (--vct-*). Ze stonden in het oude
   vct-tokens.css; zonder deze waarden had het zoekvenster geen achtergrond, lettertype of afronding. */
:root{--vct-white:#fff;--vct-surface:#fff;--vct-surface-2:var(--soft);--vct-ink-raised:#111a3a;--vct-line:var(--line);--vct-line-strong:#c4c9d6;
--vct-text-muted:var(--mut);--vct-on-dark:#fff;--vct-on-dark-muted:#aab0c4;--vct-brand-hover:var(--acc-on,#c4520c);--vct-brand-tint:var(--acc-soft);
--vct-danger:#c42b1c;--vct-focus-color:var(--acc);--vct-font:var(--font,Figtree),system-ui,-apple-system,"Segoe UI",sans-serif;
--vct-fs-xs:12px;--vct-fs-sm:13px;--vct-fs-base:15px;--vct-fs-md:16px;--vct-fs-lg:20px;--vct-fw-regular:400;--vct-fw-semibold:600;--vct-fw-bold:700;
--vct-lh:1.5;--vct-lh-tight:1.25;--vct-radius-sm:8px;--vct-radius:12px;--vct-radius-lg:16px;--vct-radius-pill:999px;
--vct-shadow:0 4px 14px rgba(4,10,34,.08);--vct-shadow-lg:0 24px 60px rgba(4,10,34,.22);--vct-duration:.2s;--vct-ease:cubic-bezier(.23,1,.32,1)}
/* de zwevende Feedback Company-badge mag niet over een vaste knop onderin of een open paneel vallen */
.flt-open .fbadge,.cart-open .fbadge,.menu-open .fbadge,body.lock .fbadge{display:none}
/* favorietenpagina: de lijst komt uit de browser (localStorage); vaste minimumhoogte zodat de footer niet verspringt */
.favs{min-height:min(560px,70vh)}
/* blog: zonder inhoudsopgave (minder dan twee tussenkoppen) bleef op tablet en mobiel een leeg grijs vlak staan */
@media (max-width:900px){.btoc.btoc-leeg{display:none}}

/* Henk (oktober 2026): tweede productfoto bij hover; de rand subtieler (was donkerblauw) */
.card{transition:border-color .15s ease-out,box-shadow .2s ease-out}
.card .ph-l img{transition:opacity .25s ease-out,transform .3s var(--ease-out)}
.card .ph-l .ph2{opacity:0}
/* STAP 3 punt 11: zonder muis (telefoon, tablet) nooit getoond, dus ook niet ophalen (lazy met display:none laadt niet) */
@media (hover:none){.card .ph-l .ph2{display:none}}
@media (hover:hover){.card:hover .ph-l .ph2{opacity:1}.card:hover .ph-l:has(.ph2) img:not(.ph2){opacity:0}}

/* Categoriebalk en mega-menu (Henk, oktober 2026: "categorieen iets dikker, een ander soort blauw eronder, menu's moeten
   kunnen uitklappen, submenu mooier dan een lange saaie lijst"). Eigen blauwe balk onder de header, witte onderstreping
   bij hover en open, oranje bij de huidige categorie. Het paneel staat buiten de scrollende nav (niet afgesneden). */
:root{--hbar:#16213f}
.hbar{position:relative;background:var(--hbar);color:#fff;border-top:1px solid rgba(255,255,255,.08)}
.hbar .hnav{padding:0;gap:0 20px;font-weight:700;font-size:15px;letter-spacing:.005em}
.hbar .hnav>a,.hni>a{position:relative;display:block;flex:none;padding:11px 0 12px;color:#dfe3ee;transition:color .15s ease-out}
.hbar .hnav>a::after,.hni>a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;border-radius:2px 2px 0 0;background:#fff;transform:scaleX(0);transform-origin:left;transition:transform .2s var(--ease-out)}
.hbar .hnav>a:hover,.hni>a:hover,.hni.open>a{color:#fff}
.hbar .hnav>a:hover::after,.hni>a:hover::after,.hni.open>a::after{transform:none}
.hbar .hnav>a[aria-current]::after,.hbar .hnav>a.on::after,.hni>a[aria-current]::after,.hni>a.on::after{transform:none;background:var(--acc)}
.hbar .hnav>a[aria-current],.hbar .hnav>a.on,.hni>a[aria-current],.hni>a.on{color:#fff}
.hbar .hnav>a.sale,.hni>a.sale{color:var(--acc)}.hbar .hnav>a.sale::after,.hni>a.sale::after{background:var(--acc)}
.hni{display:flex;align-items:center;gap:2px;flex:none}
.hnt{width:20px;height:22px;display:grid;place-items:center;flex:none;border:0;padding:0;border-radius:6px;background:transparent;color:#aab0c4;cursor:pointer;transition:color .15s ease-out,background-color .15s ease-out}
.hnt svg{width:14px;height:14px;transition:transform .2s var(--ease-out)}
.hnt:hover,.hni.open .hnt{color:#fff;background:rgba(255,255,255,.1)}
.hnt[aria-expanded="true"] svg{transform:rotate(180deg)}
.hnt:focus-visible{outline-offset:0}
.mega{position:absolute;left:0;right:0;top:100%;z-index:6;background:#fff;color:var(--ink);border-top:1px solid var(--line);box-shadow:0 24px 48px -18px rgba(4,10,34,.3);opacity:0;transform:translateY(8px);transition:opacity .18s ease-out,transform .22s var(--ease-out)}
.mega.open{opacity:1;transform:none}.mega.now{transition:none}
.mega-in{display:grid;grid-template-columns:minmax(0,1fr) 232px;gap:28px;padding-top:20px;padding-bottom:22px;max-height:calc(100vh - var(--hh,160px) - 16px);overflow:auto;overscroll-behavior:contain}
/* Megamenu (eigenaar okt 2026): het paneel deelt zichzelf in (sections/header.liquid). Links de subcategorieën zonder
   subs als lijst met fotootje, rechts die met subs als blok met sublinks; alle kolommen even breed (--c, --lc, --gc). */
.mg{display:grid;grid-template-columns:repeat(var(--c,4),minmax(0,1fr));column-gap:28px;align-items:start;min-width:0}
.mg-l{grid-column:span var(--lc,1);columns:var(--lc,1);column-gap:28px;list-style:none;margin:0;padding:0}
.mg-g{grid-column:span var(--gc,1);columns:var(--gc,1);column-gap:28px}
.mg-l li,.mg-grp{break-inside:avoid}
.mg-grp{padding-bottom:14px}
.mg-a{display:flex;align-items:center;gap:12px;padding:6px 8px;margin:0 -8px 2px;border-radius:12px;font-weight:600;font-size:15px;line-height:1.25;color:var(--ink);transition:background-color .15s ease-out}
.mg-a:hover{background:var(--soft)}
.mg-a[aria-current] .mg-n{color:var(--acc-on,var(--acc))}
.mg-h{font-weight:700;margin-bottom:0}
.mg-ph{width:40px;height:40px;flex:none;border-radius:10px;background:var(--soft);display:grid;place-items:center;overflow:hidden;color:var(--mut);transition:background-color .15s ease-out}
.mg-a:hover .mg-ph{background:#fff}
.mg-ph img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply;transition:transform .25s var(--ease-out)}
.mg-a:hover .mg-ph img{transform:scale(1.06)}
.mg-ph svg{width:18px;height:18px}
.mg-n{min-width:0}
.mg-s{list-style:none;margin:2px 0 0 52px;padding:0}
.mg-s a{display:block;padding:4px 0;font-size:14px;line-height:1.3;color:var(--mut);transition:color .15s ease-out}
.mg-s a:hover,.mg-s a[aria-current]{color:var(--ink);text-decoration:underline;text-underline-offset:2px}
.mg-meer a{color:var(--acc-on,#c4520c);font-weight:700}
.mega-all{display:flex;flex-direction:column;align-items:flex-start;gap:2px;align-self:start;padding:18px;border-radius:12px;background:var(--hbar);color:#fff}
.mega-ph{width:96px;height:96px;margin-bottom:12px;border-radius:10px;background:#fff;display:grid;place-items:center;overflow:hidden;color:var(--mut)}
.mega-ph img{width:100%;height:100%;object-fit:contain;transition:transform .25s var(--ease-out)}.mega-all:hover .mega-ph img{transform:scale(1.05)}
.mega-ph svg{width:28px;height:28px}
.mega-all small{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#aab0c4}
.mega-all b{font-size:20px;line-height:1.15;letter-spacing:-.01em}
.mega-all .go{display:inline-flex;align-items:center;gap:6px;margin-top:12px;font-weight:700;font-size:14px;color:var(--acc)}
.mega-all .go svg{width:16px;height:16px;transition:transform .2s var(--ease-out)}.mega-all:hover .go svg{transform:translateX(3px)}
/* kort menu (max 2 rijen): kaart "Alles in" liggend en compact, zodat het paneel niet hoger wordt dan de inhoud */
.mega-in.kort .mega-all{display:grid;grid-template-columns:56px minmax(0,1fr);column-gap:14px;row-gap:0;align-items:center;padding:12px 14px}
.mega-in.kort .mega-ph{grid-row:1/4;width:56px;height:56px;margin:0}
.mega-in.kort .mega-all b{font-size:17px}
.mega-in.kort .mega-all .go{margin-top:2px}
/* smalle schermen: de kaart "Alles in" valt weg zodat de kolommen ruimte houden (de categorienaam in de balk linkt er ook naar) */
@media (min-width:901px) and (max-width:1100px){.mega-in{grid-template-columns:minmax(0,1fr)}.mega-in .mega-all,.mega-in.kort .mega-all{display:none}.mg,.mg-l,.mg-g{column-gap:20px}}
@media (max-width:900px){.hbar{display:none}}
@media (prefers-reduced-motion:reduce){.mega{transform:none}.hbar .hnav>a::after,.hni>a::after{transition:none}}
/* mobiel menu: categorieen met subcategorieen klappen uit (accordeon) */
.mmi{display:grid;grid-template-columns:minmax(0,1fr) 44px;align-items:center;gap:4px;border-bottom:1px solid var(--line)}
.mml .mmi>a{grid-template-columns:44px minmax(0,1fr);border-bottom:0}
.mmt{width:44px;height:44px;display:grid;place-items:center;border:0;padding:0;border-radius:12px;background:transparent;color:var(--mut);cursor:pointer;transition:background-color .15s ease-out,color .15s ease-out}
.mmt svg{width:18px;height:18px;transition:transform .2s var(--ease-out)}
.mmt[aria-expanded="true"]{color:var(--ink);background:var(--soft)}.mmt[aria-expanded="true"] svg{transform:rotate(180deg)}
.mmsub{padding:4px 0 10px 10px;border-bottom:1px solid var(--line)}
.mmsub:not([hidden]){animation:mm-in .22s var(--ease-out)}@keyframes mm-in{from{opacity:0;transform:translateY(-4px)}}
.mml .mmsub a{grid-template-columns:32px minmax(0,1fr);gap:10px;padding:6px 0;font-size:15px;border-bottom:0}
.mml .mmsub img{width:32px;height:32px;border-radius:8px;object-fit:contain;background:var(--soft)}
.mml .mmsub .pc{width:32px;height:32px;border-radius:8px;font-size:14px}.mml .mmsub .pc svg{width:16px;height:16px}
.mml .mmsub a.mmk{display:block;padding:3px 0 3px 42px;font-size:14px;font-weight:500;color:var(--mut)}
.mml .mmsub a.mma{display:flex;align-items:center;gap:6px;margin-top:4px;padding:8px 0;font-weight:700;color:var(--acc-on,var(--acc))}.mml .mmsub a.mma svg{width:16px;height:16px}
/* de algemene regel nav a:hover (wit, voor de donkere header) maakte een link in het witte mobiele menu onzichtbaar */
.mml a:hover{color:var(--ink)}.mml a.sale:hover,.mml .mmsub a.mma:hover{color:var(--acc-on,var(--acc))}.mml .mmsub a.mmk:hover{color:var(--ink)}
/* Adviezen (Henk, oktober 2026): adviesblok, adviespagina, tip op de productpagina, hulp en gezichten in de footer.
   Foto's van medewerkers op zachte grijze tegels zoals de productfoto's; oranje knop met witte tekst (donkerder oranje
   voor het contrast); geen nieuwe kleuren. */
.rdv-b{display:flex;align-items:center;gap:10px;width:fit-content;max-width:100%;background:var(--soft);border:1px solid var(--line);border-radius:999px;padding:4px 16px 4px 4px;margin:2px 0 18px;font-size:14px;line-height:1.3}
.rdv-b .rdv-rond{width:32px;height:32px;background:#fff}.rdv-b .rdv-rond img,.rdv-b .rdv-rond .rdv-fig{object-position:50% 12%}
.rdv-b-t{margin:0;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rdv-b-t b{font-weight:700}
.rdv-b-t small{margin-left:6px;font-size:12px;font-weight:600;color:var(--mut)}.rdv-b-t span{margin-left:6px;color:var(--mut)}
.rdv-b-l{flex:none;display:inline-flex;align-items:center;gap:2px;font-weight:700;color:var(--acc-on,var(--acc));white-space:nowrap;text-decoration:underline;text-underline-offset:3px}.rdv-b-l:hover{color:var(--ink)}.rdv-b-l svg{width:14px;height:14px}
.rdv-p{display:block;align-self:end;margin:-56px 0 -18px;height:204px;overflow:hidden}
.rdv-p img,.rdv-p .rdv-fig{display:block;height:100%;width:auto;max-width:100%;object-fit:contain;object-position:bottom center}
.btn.rdv-k{background:var(--acc);color:#fff;font-weight:800;white-space:nowrap}
.rdv-s{margin-top:24px;margin-bottom:24px}
.rdv-rond{display:block;width:56px;height:56px;flex:none;border-radius:999px;overflow:hidden;background:var(--soft)}
.rdv-rond img,.rdv-rond .rdv-fig{width:100%;height:100%;object-fit:cover;object-position:top center}
.rdv-tip{display:flex;gap:12px;align-items:center;background:var(--soft);border-radius:12px;padding:12px 14px;margin-top:14px}
.rdv-tip p{margin:0;font-size:14px;line-height:1.45}.rdv-tip b{font-size:15px}.rdv-tip a{font-weight:700;color:var(--acc-on,var(--acc));text-decoration:underline;text-underline-offset:3px}
.rdv-hulp{display:flex;gap:24px;align-items:flex-end;background:var(--soft);border-radius:12px;padding:20px 24px 0;margin:28px 0;overflow:hidden}
.rdv-hulp .rdv-p{flex:none;width:150px;margin:0;height:170px}.rdv-hulp>div{flex:1;min-width:0;padding-bottom:20px}.rdv-kn .btn{white-space:nowrap}.rdv-hulp b{display:block;font-size:18px}.rdv-hulp p{margin:4px 0 14px;color:var(--mut)}
.rdv-kn{display:flex;gap:8px;flex-wrap:wrap}
.rdv-ct{flex:0 0 300px;list-style:none;margin:0;padding:16px 0 16px 24px;border-left:1px solid var(--line);display:grid;gap:8px;align-self:center}
.rdv-ct a,.rdv-ct button{display:flex;align-items:center;gap:12px;width:100%;padding:10px 12px;border:0;border-radius:10px;background:#fff;color:var(--ink);text-decoration:none;text-align:left;font:inherit;cursor:pointer}
.rdv-ct a:hover,.rdv-ct button:hover{box-shadow:0 0 0 1px var(--acc)}
.rdv-ct b{display:block;font-size:15px}.rdv-ct small{display:block;color:var(--mut);font-size:13px}
.rdv-ci{flex:none;display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--acc-soft);color:var(--acc)}.rdv-ci svg{width:18px;height:18px}
.rdv-ct [hidden]{display:none}
.rdv-pg{padding-bottom:40px}
.rdv-kop{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:32px;align-items:start;margin-bottom:26px}
.rdv-intro{font-size:17px;margin:8px 0 0;max-width:680px}.rdv-meta{font-size:13px;color:var(--mut);margin:12px 0 0}
.rdv-auteur{display:flex;gap:14px;align-items:center;border:1px solid var(--line);border-radius:12px;padding:14px 16px}
.rdv-auteur .rdv-rond{width:76px;height:76px}.rdv-auteur small{display:block;color:var(--mut);font-size:13px}.rdv-auteur b{display:block;font-size:17px}.rdv-auteur span:not(.rdv-rond){display:block;font-size:14px;font-weight:700;color:var(--acc-on,var(--acc))}
.rdv-lijst{list-style:none;margin:0;padding:0 0 0 14px;display:grid;gap:14px}
.rdv-kaart{position:relative;display:grid;grid-template-columns:160px minmax(0,1fr) 220px;gap:20px;border:1px solid var(--line);border-radius:12px;padding:18px 20px 18px 30px}
.rdv-kaart.een{border-color:var(--acc)}
.rdv-nr{position:absolute;left:-14px;top:18px;width:36px;height:36px;border-radius:999px;background:var(--navy);color:#fff;font-weight:900;display:grid;place-items:center;font-size:17px}
.rdv-kaart.een .rdv-nr{background:var(--acc)}
.rdv-foto{display:block;height:150px;border-radius:12px;background:var(--soft);overflow:hidden}.rdv-foto img{width:100%;height:100%;object-fit:contain}
.rdv-lbl{display:inline-block;background:var(--acc-soft);color:var(--acc-on,#c4520c);font-weight:800;font-size:13px;border-radius:999px;padding:3px 12px}
.rdv-info h2{margin:8px 0 4px;font-size:19px;letter-spacing:-.01em;line-height:1.3}.rdv-info h2 a:hover{color:var(--acc-on,var(--acc))}
.rdv-vd{list-style:none;padding:0;margin:10px 0 0;display:grid;gap:5px;font-size:15px}
.rdv-vd li{position:relative;padding-left:24px}.rdv-vd li::before{content:"";position:absolute;left:2px;top:6px;width:12px;height:7px;border-left:2.5px solid var(--ok);border-bottom:2.5px solid var(--ok);transform:rotate(-45deg)}
.rdv-koop{display:flex;flex-direction:column;gap:8px;justify-content:center;border-left:1px solid var(--line);padding-left:20px}
.rdv-koop .pr{margin:0;padding:0;font-size:26px;font-weight:800;white-space:nowrap}.rdv-koop .pr s{font-size:15px;color:var(--mut);font-weight:600;margin-left:8px}
.rdv-koop .ok{margin:0}
.rdv-cta,button.rdv-cta{background:var(--cta);color:var(--navy);display:flex;align-items:center;justify-content:center;min-height:46px;border:0;border-radius:8px;font-weight:800;font-size:15px;cursor:pointer;text-align:center;transition:transform .16s var(--ease-out),background-color .15s ease-out}.rdv-cta:hover{background:var(--cta-h)}.rdv-cta:active{transform:scale(.97)}
.rdv-lnk{font-size:14px;font-weight:700;color:var(--acc-on,var(--acc));text-align:center}
.rdv-alle{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:22px;background:var(--soft);border-radius:12px;padding:20px 24px}
.rdv-alle b{display:block;font-size:18px}.rdv-alle span{color:var(--mut);font-size:14px}
.rdv-hoe{margin:22px 0 0;font-size:14px;color:var(--mut);border-top:1px solid var(--line);padding-top:14px}
.rdv-team{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin-top:16px;font-size:14px;font-weight:600}.rdv-team>span:last-child{min-width:12em}
.rdv-gez{display:flex}.rdv-gez .rdv-rond{width:44px;height:44px;border:2px solid var(--navy);margin-left:-10px}.rdv-gez .rdv-rond:first-child{margin-left:0}
.hlp .rdv-rond{width:56px;height:56px}
.rdv-rkn{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.rdv-rk{display:flex;gap:14px;align-items:center;border:1px solid var(--line);border-radius:12px;padding:14px 16px;transition:border-color .15s ease-out}.rdv-rk:hover{border-color:var(--navy)}
.rdv-rk .rdv-rond{width:72px;height:72px}.rdv-rk b{display:block;font-size:16px}.rdv-rk span:not(.rdv-rond){font-size:14px;color:var(--mut)}
@media (max-width:900px){
  .rdv-b{width:auto;border-radius:12px;padding:5px 12px 5px 5px;font-size:13px}
  .rdv-b-t{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.rdv-b-t small{margin-left:4px}
  .rdv-p{height:150px;margin:-52px 0 -18px -6px;grid-row:span 2}
  .rdv-hulp{padding:16px 16px 0;gap:12px}.rdv-hulp .rdv-p{width:96px;height:130px;margin:0}
  .rdv-hulp{flex-wrap:wrap}.rdv-ct{flex:1 1 100%;order:3;border-left:0;border-top:1px solid var(--line);padding:12px 0 16px}
  .rdv-kop{grid-template-columns:minmax(0,1fr);gap:16px}
  .rdv-lijst{padding-left:10px}
  .rdv-kaart{grid-template-columns:96px minmax(0,1fr);gap:12px;padding:16px 14px 16px 22px}
  .rdv-nr{left:-10px;width:30px;height:30px;font-size:15px}
  .rdv-foto{height:96px}
  .rdv-koop{grid-column:1/-1;border-left:0;padding-left:0;border-top:1px solid var(--line);padding-top:12px;display:grid;grid-template-columns:1fr 1fr;align-items:center}
  .rdv-koop .rdv-cta,.rdv-koop .rdv-lnk{grid-column:1/-1}
  .rdv-koop .pr{font-size:22px}.rdv-info h2{font-size:17px}
  .rdv-alle{flex-direction:column;align-items:stretch;text-align:center}
  .rdv-rkn{grid-template-columns:minmax(0,1fr)}
}
/* Kenteken (eigenaar 25 en 28 okt 2026): geel #F7C600 met een enkele zwarte rand, blauwe EU-band met 12 gele sterren en
   NL in wit; de letters breed en vet in de themaletter met ruime spatiëring (niet smal), placeholder licht */
.plate{border:2px solid #111;border-radius:7px;background:#f7c600}
.plate .eu{background:#003da5;color:#fff;padding:4px 7px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;font-size:12px;font-weight:700;line-height:1;letter-spacing:.02em;min-width:38px}
.plate .eu svg{display:block;width:20px;height:20px}
.plate input{text-align:center;font-family:var(--font);font-weight:800;letter-spacing:.1em;color:#111;padding-left:calc(12px + .1em);padding-right:12px}
.plate input::placeholder{color:rgba(17,17,17,.4);letter-spacing:.1em}

/* Slim zoeken (sections/vct-smart-search.liquid): stond als <style> in elke pagina; hier eenmaal geladen en bewaard */
  /* Opmaak volgt het VCT-designsysteem (DESIGN.md, assets/vct-tokens.css): alleen var(--vct-*) waarden */
  .vct-ss{position:fixed;inset:0;z-index:99999;display:flex;align-items:flex-start;justify-content:center;padding:4vh 16px 16px;font-family:var(--vct-font);font-size:var(--vct-fs-base);line-height:var(--vct-lh);color:var(--vct-ink);opacity:0;visibility:hidden;pointer-events:none;transition:opacity var(--vct-duration) var(--vct-ease),visibility var(--vct-duration) var(--vct-ease)}
  .vct-ss.is-open{opacity:1;visibility:visible;pointer-events:auto;transition:opacity var(--vct-duration) var(--vct-ease),visibility 0s}   /* meteen focusbaar: geen letters kwijt (Henk 29 okt) */
  .vct-ss *{box-sizing:border-box}
  :where(.vct-ss) button,:where(.vct-ss) input{appearance:none;-webkit-appearance:none;float:none;margin:0;min-width:0;min-height:0;height:auto;line-height:1.2;letter-spacing:0;text-transform:none;box-shadow:none;text-decoration:none}
  :where(.vct-ss) button{position:relative;padding:0;border:0;background:none;color:inherit;font:inherit;display:inline-flex;align-items:center;justify-content:center;gap:6px;width:auto;cursor:pointer}
  :where(.vct-ss) input{width:auto;border-radius:0}
  .vct-ss :is(a,button):focus-visible{outline:2px solid var(--vct-focus-color);outline-offset:2px}
  .vct-ss mark{display:inline;margin:0;padding:0;border-radius:var(--vct-radius-sm);background:color-mix(in srgb,var(--vct-brand) 22%,transparent);color:inherit;font:inherit}
  .vct-ss__close-ico{display:none}
  .vct-ss__backdrop{position:absolute;inset:0;background:color-mix(in srgb,var(--vct-ink) 60%,transparent)}
  .vct-ss__panel{position:relative;width:100%;max-width:1080px;max-height:92vh;display:flex;flex-direction:column;background:var(--vct-white);border-radius:var(--vct-radius-lg);box-shadow:var(--vct-shadow-lg);overflow:hidden}

  /* Zoekveld: de focus is zichtbaar op het hele veld (.vct-ss__field:focus-within), daarom geen outline op de input zelf */
  .vct-ss__bar{display:flex;align-items:center;gap:12px;margin:0;padding:16px;border-bottom:1px solid var(--vct-line)}
  .vct-ss__field{flex:1 1 auto;min-width:0;display:flex;align-items:center;gap:8px;height:48px;padding:0 6px 0 14px;border:1px solid var(--vct-line-strong);border-radius:var(--vct-radius);background:var(--vct-white);transition:border-color var(--vct-duration) var(--vct-ease),box-shadow var(--vct-duration) var(--vct-ease)}
  .vct-ss__field:focus-within{border-color:var(--vct-brand);box-shadow:inset 0 0 0 1px var(--vct-brand)}
  .vct-ss__icon{flex:0 0 auto;color:var(--vct-text-muted)}
  .vct-ss__input{flex:1 1 auto;width:100%;min-width:0;height:100%;padding:0;border:0;outline:0;background:transparent;font:inherit;font-size:var(--vct-fs-md);font-weight:var(--vct-fw-regular);color:var(--vct-ink);text-overflow:ellipsis}
  .vct-ss__input:focus,.vct-ss__input:focus-visible{border:0;outline:0;box-shadow:none}
  .vct-ss__input::placeholder,.vct-ss__input:focus::placeholder{color:var(--vct-text-muted);opacity:1}
  .vct-ss__input::-webkit-search-cancel-button{display:none}
  .vct-ss__btn{flex:0 0 auto;border-radius:var(--vct-radius);transition:background-color var(--vct-duration) var(--vct-ease),color var(--vct-duration) var(--vct-ease)}
  .vct-ss__btn[hidden]{display:none}
  .vct-ss__clear{width:36px;height:36px;color:var(--vct-text-muted)}
  .vct-ss__clear:hover{background:var(--vct-surface);color:var(--vct-ink)}
  .vct-ss__close{gap:8px;min-height:44px;padding:0 12px;color:var(--vct-ink);font-size:var(--vct-fs-sm);font-weight:var(--vct-fw-semibold)}
  .vct-ss__close:hover{background:var(--vct-surface)}
  .vct-ss__kbd{display:inline-block;padding:1px 6px;border:1px solid var(--vct-line-strong);border-radius:var(--vct-radius-sm);background:var(--vct-surface);color:var(--vct-text-muted);font-family:inherit;font-size:var(--vct-fs-xs);font-weight:var(--vct-fw-semibold);line-height:1.4}

  /* "Bedoelde je …?" */
  .vct-ss__hint{padding:12px 16px 0;font-size:var(--vct-fs-base);line-height:var(--vct-lh);color:var(--vct-text-muted)}
  .vct-ss__hint:empty{display:none}
  .vct-ss__hint b{color:var(--vct-ink);font-weight:var(--vct-fw-bold)}
  .vct-ss__hint button{display:inline-flex;vertical-align:baseline;min-height:28px;margin:0 2px;padding:0 12px;border:1px solid var(--vct-brand);border-radius:var(--vct-radius-pill);background:var(--vct-brand-tint);color:var(--vct-ink);font-weight:var(--vct-fw-bold);transition:background-color var(--vct-duration) var(--vct-ease)}
  .vct-ss__hint button:hover{background:color-mix(in srgb,var(--vct-brand) 22%,transparent)}

  /* Inhoud en secties */
  .vct-ss__body{flex:1 1 auto;overflow-y:auto;overscroll-behavior:contain;padding:16px 16px 24px;-webkit-overflow-scrolling:touch}
  .vct-ss__section{margin-bottom:24px}
  .vct-ss__section:last-child{margin-bottom:0}
  .vct-ss__title{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:24px;margin:0 0 8px;padding:0;font-family:var(--vct-font);font-size:var(--vct-fs-xs);font-weight:var(--vct-fw-bold);line-height:var(--vct-lh-tight);letter-spacing:.06em;text-transform:uppercase;color:var(--vct-text-muted)}
  .vct-ss__title a,.vct-ss__title button{display:inline-flex;align-items:center;min-height:32px;padding:0;border:0;background:none;font:inherit;font-size:var(--vct-fs-sm);font-weight:var(--vct-fw-semibold);letter-spacing:0;text-transform:none;color:var(--vct-brand);text-decoration:underline;text-underline-offset:.15em;cursor:pointer;transition:color var(--vct-duration) var(--vct-ease)}
  .vct-ss__title a:hover,.vct-ss__title button:hover{color:var(--vct-brand-hover)}

  /* Productregels */
  .vct-ss__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:8px}
  .vct-ss__card{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto 1fr;grid-template-areas:"name name" "meta meta" "price badge";column-gap:8px;align-items:start;min-height:82px;padding:8px 8px 8px 84px;border:1px solid var(--vct-line);border-radius:var(--vct-radius);background:var(--vct-white);color:var(--vct-ink);text-decoration:none;transition:border-color var(--vct-duration) var(--vct-ease),box-shadow var(--vct-duration) var(--vct-ease),background-color var(--vct-duration) var(--vct-ease)}
  .vct-ss__card:hover{border-color:var(--vct-line-strong);box-shadow:var(--vct-shadow);color:var(--vct-ink)}
  .vct-ss__card.is-active{border-color:var(--vct-brand);box-shadow:inset 0 0 0 1px var(--vct-brand);background:var(--vct-brand-tint)}
  .vct-ss__img{position:absolute;left:8px;top:8px;width:64px;height:64px;border-radius:var(--vct-radius);background:var(--vct-surface);overflow:hidden;display:grid;place-items:center}
  .vct-ss__img img{display:block;width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply}
  .vct-ss__name{grid-area:name;font-size:14px;font-weight:var(--vct-fw-semibold);line-height:1.35;color:var(--vct-ink);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .vct-ss__meta{grid-area:meta;margin-top:2px;font-size:var(--vct-fs-xs);line-height:1.4;color:var(--vct-text-muted)}
  .vct-ss__price{grid-area:price;align-self:end;display:flex;flex-wrap:wrap;align-items:baseline;gap:0 6px;margin-top:6px;font-size:var(--vct-fs-base);font-weight:var(--vct-fw-bold);line-height:1.3;color:var(--vct-ink)}
  .vct-ss__price s{font-size:var(--vct-fs-sm);font-weight:var(--vct-fw-regular);color:var(--vct-text-muted)}
  .vct-ss__badge{grid-area:badge;align-self:end;justify-self:end;display:inline-flex;align-items:center;padding:2px 8px;border-radius:var(--vct-radius-sm);background:var(--vct-danger);color:var(--vct-white);font-size:var(--vct-fs-xs);font-weight:var(--vct-fw-bold);line-height:1.5;white-space:nowrap}
  .vct-ss__badge--out{background:var(--vct-surface-2);color:var(--vct-text-muted)}

  /* Resultaten: producten links, categorieën, blog en pagina's rechts */
  .vct-ss__cols{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:24px}
  .vct-ss__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
  .vct-ss__list li{margin:0;padding:0}
  .vct-ss__list a{display:flex;align-items:center;gap:10px;min-height:40px;padding:8px 10px;border:1px solid transparent;border-radius:var(--vct-radius);color:var(--vct-ink);font-size:14px;font-weight:var(--vct-fw-semibold);line-height:1.35;text-decoration:none;transition:border-color var(--vct-duration) var(--vct-ease),background-color var(--vct-duration) var(--vct-ease)}
  .vct-ss__list a:hover{background:var(--vct-surface);color:var(--vct-ink)}
  .vct-ss__list a.is-active{border-color:var(--vct-brand);background:var(--vct-brand-tint)}
  .vct-ss__list a svg{width:18px;height:18px;flex:0 0 auto;color:var(--vct-brand)}
  .vct-ss__list a small{margin-left:auto;color:var(--vct-text-muted);font-weight:var(--vct-fw-regular);font-size:var(--vct-fs-xs);white-space:nowrap}
  .vct-ss__list--chips{flex-direction:row;flex-wrap:wrap;gap:8px}
  .vct-ss__tip p{margin:0;font-size:var(--vct-fs-sm);line-height:var(--vct-lh);color:var(--vct-text-muted)}
  .vct-ss__tip b{color:var(--vct-ink);font-weight:var(--vct-fw-semibold)}

  /* Chips: zoektermen en categorieën (na de lijstregels, zodat de categorie-chips die overschrijven) */
  .vct-ss__chips{display:flex;flex-wrap:wrap;gap:8px}
  .vct-ss__chip,.vct-ss__list--chips a{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0 14px;border:1px solid var(--vct-line-strong);border-radius:var(--vct-radius-pill);background:var(--vct-white);color:var(--vct-ink);font:inherit;font-size:14px;font-weight:var(--vct-fw-semibold);line-height:1.2;text-decoration:none;cursor:pointer;transition:border-color var(--vct-duration) var(--vct-ease),background-color var(--vct-duration) var(--vct-ease)}
  .vct-ss__chip:hover,.vct-ss__chip.is-active,.vct-ss__list--chips a:hover,.vct-ss__list--chips a.is-active{border-color:var(--vct-brand);background:var(--vct-brand-tint);color:var(--vct-ink)}
  .vct-ss__chip svg,.vct-ss__list--chips a svg{flex:0 0 auto;width:16px;height:16px;color:var(--vct-text-muted);transition:color var(--vct-duration) var(--vct-ease)}
  .vct-ss__chip:hover svg,.vct-ss__chip.is-active svg,.vct-ss__list--chips a:hover svg,.vct-ss__list--chips a.is-active svg{color:var(--vct-brand)}

  /* Lege toestand */
  .vct-ss__empty{max-width:520px;margin:0 auto;padding:32px 16px;text-align:center;font-size:var(--vct-fs-base);line-height:var(--vct-lh);color:var(--vct-text-muted)}
  .vct-ss__empty strong{display:block;margin-bottom:4px;font-size:var(--vct-fs-lg);font-weight:var(--vct-fw-bold);line-height:var(--vct-lh-tight);color:var(--vct-ink)}
  .vct-ss__empty-icon{display:grid;place-items:center;width:48px;height:48px;margin:0 auto 12px;border-radius:var(--vct-radius-lg);background:var(--vct-surface);color:var(--vct-text-muted)}
  .vct-ss__cols .vct-ss__empty{max-width:none;margin:0;padding:16px;border:1px solid var(--vct-line);border-radius:var(--vct-radius);background:var(--vct-surface);text-align:left}
  .vct-ss__cols .vct-ss__empty strong{font-size:var(--vct-fs-md)}

  /* Voettekst */
  .vct-ss__footer{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:12px 16px;border-top:1px solid var(--vct-line);background:var(--vct-white)}
  .vct-ss__footer:has(> small:empty):has(> [data-vct-all][hidden]){display:none}
  .vct-ss__footer small{color:var(--vct-text-muted);font-size:var(--vct-fs-sm)}
  .vct-ss__cta[hidden]{display:none}
  .vct-ss__cta svg{flex:0 0 auto}

  /* Laden */
  .vct-ss__spinner{flex:0 0 auto;width:18px;height:18px;border:2px solid var(--vct-line);border-top-color:var(--vct-brand);border-radius:50%;animation:vctspin .7s linear infinite}
  .vct-ss__spinner[hidden]{display:none}
  @keyframes vctspin{to{transform:rotate(360deg)}}
  .vct-ss__skel{position:relative;display:flex;flex-direction:column;gap:8px;min-height:82px;padding:12px 8px 8px 84px;border:1px solid var(--vct-line);border-radius:var(--vct-radius);background:var(--vct-white)}
  .vct-ss__skel span{display:block;height:12px;border-radius:var(--vct-radius-sm);background:#e6e8ee;animation:vctskel 1s var(--vct-ease) infinite alternate}
  .vct-ss__skel span:first-child{position:absolute;left:8px;top:8px;width:64px;height:64px;border-radius:var(--vct-radius)}
  .vct-ss__skel span:nth-child(2){width:85%}
  .vct-ss__skel span:nth-child(3){width:55%}
  @keyframes vctskel{from{background-color:#e6e8ee}to{background-color:#f1f2f6}}   /* nooit wit: anders lijken het lege kaartjes (Henk 29 okt) */

  /* Suggestie op de zoekpagina zonder resultaten */
  .vct-ss__suggest{margin:0 0 16px;font-size:var(--vct-fs-md);line-height:var(--vct-lh);color:var(--vct-ink)}
  .vct-ss__suggest a{color:var(--vct-brand);font-weight:var(--vct-fw-bold);text-decoration:underline;text-underline-offset:.15em}
  .vct-ss__suggest a:hover{color:var(--vct-brand-hover)}

  @media (max-width:760px){
    .vct-ss{padding:0}
    .vct-ss__panel{max-width:none;height:100dvh;max-height:100dvh;border-radius:0;box-shadow:none}
    .vct-ss__bar{gap:4px;padding:8px 8px 8px 12px}
    .vct-ss__field{height:44px;padding-left:12px}
    .vct-ss__kbd{display:none}
    .vct-ss__close{padding:0 8px}
    .vct-ss__body{padding:16px 12px 24px}
    .vct-ss__hint{padding:12px 12px 0}
    .vct-ss__cols{grid-template-columns:1fr}
    .vct-ss__grid{grid-template-columns:1fr}
    .vct-ss__footer{position:sticky;bottom:0;padding:12px 12px max(12px,env(safe-area-inset-bottom))}
    .vct-ss__cta{flex:1 1 auto;width:100%}
    .vct-ss__footer small{display:none}
  }
  @media (prefers-reduced-motion:reduce){
    .vct-ss__skel span{animation:none}
  }
  body.vct-ss-lock{overflow:hidden}
  /* Henk (oktober 2026): op desktop vanuit de zoekbalk van de kop, even breed (vct-smart-search.js: plaats) */
  @media (min-width:990px){
    .vct-ss.vct-ss--drop{display:block;padding:0}
    .vct-ss--drop .vct-ss__backdrop{background:rgba(4,10,34,.28)}
    .vct-ss--drop .vct-ss__panel{max-width:none;border-radius:16px;box-shadow:0 18px 50px rgba(4,10,34,.28)}
    .vct-ss--drop .vct-ss__bar{min-height:var(--vct-ss-balk,52px);padding:0 8px 0 16px;border-bottom:1px solid var(--vct-line)}
    .vct-ss--drop .vct-ss__close-txt,.vct-ss--drop .vct-ss__kbd{display:none}
    .vct-ss--drop .vct-ss__body{padding-top:8px}
  }
.vct-ss__fz{display:flex;align-items:center;gap:12px;margin:12px 0 0;padding:14px 16px;border-radius:var(--vct-radius);background:var(--vct-ink);color:var(--vct-on-dark);text-decoration:none;transition:background-color var(--vct-duration) var(--vct-ease)}
.vct-ss__fz:hover{background:var(--vct-ink-raised);color:var(--vct-on-dark)}
.vct-ss__fz>svg{flex:0 0 auto;width:28px;height:28px;color:var(--vct-brand)}
.vct-ss__fz-text{display:flex;flex:1;flex-direction:column;gap:2px;min-width:0;font-size:var(--vct-fs-sm);line-height:1.4;color:var(--vct-on-dark-muted)}
.vct-ss__fz-text strong{font-size:var(--vct-fs-md);font-weight:var(--vct-fw-bold);color:var(--vct-on-dark)}
.vct-ss__fz-btn{display:inline-flex;flex:0 0 auto;align-items:center;gap:6px;min-height:40px;padding:0 14px;border-radius:var(--vct-radius);background:var(--vct-brand);color:var(--vct-on-brand);font-size:var(--vct-fs-sm);font-weight:var(--vct-fw-bold);white-space:nowrap}
.vct-ss__fz-btn svg{width:16px;height:16px}
.vct-ss__empty-more{margin-top:20px}
.vct-ss__help{margin:16px 0 0;font-size:var(--vct-fs-sm);line-height:var(--vct-lh);color:var(--vct-text-muted)}
.vct-ss__help a{color:var(--vct-brand);font-weight:var(--vct-fw-semibold);text-decoration:underline;text-underline-offset:.15em}
@media (max-width:600px){.vct-ss__fz{flex-wrap:wrap}.vct-ss__fz-btn{width:100%;justify-content:center}}

/* Vloeiend (Henk 25 okt 2026, Apple-principes): weggaan is korter dan komen en versnelt, zodat sluiten direct voelt; openen
   blijft rustig zonder na te veren. Zoomen bij aanwijzen alleen met een muis (op een telefoon bleef het plaatje hangen).
   Tussen pagina's een korte overvloeier (alleen in browsers die het kennen), niets bij minder beweging. */
:root{--ease-exit:cubic-bezier(.4,0,1,1)}
.dr{transition:transform .28s var(--ease-exit),visibility 0s linear .28s}
.mm{transition:transform .26s var(--ease-exit),visibility 0s linear .26s}
.ov,.mov,.mdo{transition:opacity .2s ease-out}
.ov.open,.mov.open,.mdo.open{transition:opacity .35s var(--ease-out)}
.dr,.mm{touch-action:pan-y;overscroll-behavior:contain}
a,button,summary,label{-webkit-tap-highlight-color:transparent}
@media (hover:none){.cat:hover .cim img,.pt:hover img,.blg a:hover .bim img,.th-main:hover .th-img img{transform:none}.cat:hover b svg{transform:none}}
@view-transition{navigation:auto}
::view-transition-old(root){animation-duration:.12s;animation-timing-function:cubic-bezier(.4,0,1,1)}
::view-transition-new(root){animation-duration:.2s;animation-timing-function:cubic-bezier(.23,1,.32,1)}
@media (prefers-reduced-motion:reduce){@view-transition{navigation:none}}
/* Henk 25 okt 2026: de 5%-teaserknop van de nieuwsbriefpopup moet weg. Het script maakt hem niet meer, maar een oude kopie
   uit de cache (Cloudflare en de browser bewaren het script 4 uur) kon hem nog tonen; zo blijft hij ook dan onzichtbaar. */
.vctm-teaser{display:none!important}

/* Henk 25 okt 2026: in winkelwagen bevestigt de knop zelf (vct-theme.js gelukt): groen, wit vinkje dat zich tekent, korte tekst */
.gelukt,.gelukt.cta,.gelukt.btn{background:var(--ok)!important;color:#fff!important;filter:none!important;transition:background-color .2s var(--ease-out),color .2s var(--ease-out)}
.gelukt{display:inline-flex;align-items:center;justify-content:center;gap:8px;white-space:nowrap;overflow:hidden}
.gelukt .gelukt-t{overflow:hidden;text-overflow:ellipsis;animation:gelukt-in .24s var(--ease-out) both}
.gelukt-v{width:22px;height:22px;flex:none;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:24;stroke-dashoffset:24;animation:gelukt-v .36s var(--ease-out) .05s forwards}
@keyframes gelukt-v{to{stroke-dashoffset:0}}
@keyframes gelukt-in{from{opacity:0;transform:translateY(4px)}}
@media (prefers-reduced-motion:reduce){.gelukt-v{stroke-dashoffset:0;animation:none}.gelukt .gelukt-t{animation:none}}

/* UX-ronde psychologie (okt 2026): verzendmeter met stappen (snippets/vct-ship-steps.liquid). "Product gekozen" staat al
   afgevinkt (voorsprong), de punten kleuren mee met de meter; alleen kleur verandert, niets beweegt uit zichzelf. */
.vst-t{margin:0}
.vst{position:relative;margin:0 7px}
.vst .meter{margin-top:10px}
.vst-d{position:absolute;top:3px;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:#fff;border:2px solid var(--line);box-sizing:border-box;transition:background-color .16s ease-out,border-color .16s ease-out}
.vst-d.on{background:var(--acc);border-color:var(--acc)}
.ship.done .vst-d.on{background:var(--ok);border-color:var(--ok)}
.vst-d.on::after{content:"";position:absolute;left:3px;top:1px;width:3px;height:6px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
.vst-l{position:relative;list-style:none;margin:6px 7px 0;padding:0;height:16px;font-size:12px;color:var(--mut)}
.vst-l li{position:absolute;top:0;transform:translateX(-50%);white-space:nowrap}
.vst-l li:first-child{transform:translateX(-30%)}
.vst-l li.end{transform:translateX(-100%)}
.vst-l li.on{color:var(--ink);font-weight:600}
/* cadeaus als extra stappen (vct-theme.js giftBalk): bij 3 of meer doelen mogen de namen op twee regels, smal en gecentreerd */
.vst-l.vol{height:30px}
.vst-l.vol li{white-space:normal;width:64px;text-align:center;line-height:1.2}
.vst-l.vol li:first-child{text-align:left;transform:translateX(-12%)}
.vst-l.vol li.end{text-align:right}
/* tekst van giftBalk boven de balk: hooguit twee regels (lange cadeaunamen worden afgekapt) */
.vst-t.vg-kort{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
/* bundelkorting die vervalt bij verwijderen: inline vraag onder de regel (cart-line.liquid, vct-theme.js lossAsk) */
.bl-ask{display:grid;gap:8px;margin-top:10px;padding:10px 12px;border-radius:8px;background:var(--acc-soft);font-size:13px;color:var(--ink)}
.bl-b{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.bl-ask .btn{padding:8px 14px;font-size:13px}
.bl-ask .rm{font-size:13px}
/* winkelwagenicoon op alle toevoegknoppen */
.upc button{display:inline-flex;align-items:center;justify-content:center;gap:6px}
.upc button svg.i,.rdv-cta svg.i,.gf-add svg{width:16px;height:16px}
.rdv-cta{gap:8px}
/* cadeaus in lade en winkelwagen (vct-theme.js gifts; data van het eigen systeem). Behaald als gratis regel met vinkje en de
   waarde doorgestreept ernaast (contrast); bijna met de meter van de verzendmeter, die nooit op 0 begint. Niets beweegt uit
   zichzelf; alleen de breedte van de meter volgt de wagen. */
.vgs{display:grid;gap:8px;margin:0 0 12px}
.vg{display:grid;grid-template-columns:32px minmax(0,1fr) auto;gap:10px;align-items:center;padding:6px 10px;border:1px solid var(--line);border-radius:10px;background:#fff;font-size:13px;line-height:1.3}
.vg.ok{border-style:solid;border-color:var(--ok);background:#eef7f1}
/* productpagina: "Gratis <cadeau> bij ..." (vct-theme.js giftProduct) */
.vg-pp{display:grid;gap:4px;margin:8px 0 0}
.vg-pp[hidden]{display:none}
.vg-pp-i{flex:none;width:16px;height:13px;border:2px solid var(--acc);border-top-width:4px;border-radius:3px;box-sizing:border-box}
.vg-ph{position:relative;width:32px;height:32px;border-radius:6px;background:var(--soft);display:grid;place-items:center}
.vg-ph img{width:100%;height:100%;object-fit:contain;border-radius:6px}
.vg-ph.vg-ic::before{content:"";width:14px;height:12px;border:2px solid var(--acc);border-top-width:4px;border-radius:2px;box-sizing:border-box}
.vg-v{position:absolute;right:-5px;top:-5px;width:14px;height:14px;border-radius:50%;background:var(--ok);border:2px solid #fff}
.vg-v::after{content:"";position:absolute;left:2px;top:0;width:3px;height:6px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
.vg-t{display:block;min-width:0}
.vg-t b{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-weight:600;color:var(--ink)}
.vg.ok .vg-t b{display:block;white-space:nowrap;text-overflow:ellipsis}
.vg.ok .vg-t b{color:var(--ok-t)}      /* tekst in donkerder groen: WCAG AA (6:1 op de lichtgroene kaart; --ok haalde 4:1) */
.vg-t small{font-size:12px;color:var(--mut)}
.vg-p{display:flex;flex-shrink:0;gap:6px;align-items:baseline;white-space:nowrap;font-variant-numeric:tabular-nums}
.vg-p b{color:var(--ok-t);font-weight:800}
.vg-p s{font-size:12px;color:var(--mut)}
.vg-l{flex-shrink:0;white-space:nowrap;color:var(--ink);text-decoration:underline;text-underline-offset:2px}
/* Productkaarten: prijs en knop altijd op dezelfde hoogte (ook zonder reviews of met kortere titel); lange woorden breken af */
.card .bd .nm{overflow-wrap:anywhere}
.card .bd .st{min-height:18px}
.card .bd .pr{margin-top:auto}
/* Cadeau op de productpagina: eigen kaartje onder het leverblok. Label + waarde, naam op een regel, voorwaarde voluit */
.vg-pp{grid-template-columns:minmax(0,1fr);gap:8px;margin:-4px 0 16px}
/* Henk 4 november 2026 ("balkje mag wel wat subtieler"): neutrale kaart met een dunne lichte rand; alleen het label in de merkkleur */
.vg-pp-r{display:grid;grid-template-columns:44px minmax(0,1fr);gap:12px;align-items:start;min-width:0;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:#fff;font-weight:400;color:var(--ink)}
.vg-pp-ph{width:44px;height:44px;border-radius:8px;background:var(--soft);display:grid;place-items:center;overflow:hidden}
.vg-pp-ph img{width:100%;height:100%;object-fit:cover}
.vg-pp-ph .vg-pp-i{width:20px;height:16px}
.vg-pp-t{display:grid;gap:2px;min-width:0;font-size:14px;line-height:1.35}
.vg-pp-k{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--acc-on,#c4520c)}
.vg-pp-k s{margin-left:6px;font-weight:600;text-transform:none;letter-spacing:0;color:var(--mut)}
.vg-pp-n{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vg-pp-c{font-weight:600}
.vg-pp-a{font-size:12px;color:var(--mut)}
.vg-pp-l{font-size:13px;color:var(--acc-on,#c4520c);text-decoration:underline;justify-self:start}
/* Verzend-/cadeaubalk zonder verspringen (eigenaar okt 2026): tekst en labels houden een vaste hoogte, ook als een
   cadeaustap erbij komt of de tekst korter wordt; ruimte tussen balk en cadeaublok */
.vst-t{line-height:1.35}
.vst-l.vol{height:30px}
.vgs{margin-top:12px}
/* Thema-iconen i.p.v. tekens/emoji (eigenaar okt 2026) */
.ok i svg{width:12px;height:12px}
.dl{display:flex;align-items:flex-start;gap:5px}.dl svg{flex:none;width:13px;height:13px;margin-top:2px}
.dlt.late svg{color:var(--acc)}
/* Slim zoeken (eigenaar okt 2026): geen overlap, venster groeit uit de zoekbalk, zelfde marges */
.vct-ss__grid{grid-template-columns:repeat(auto-fill,minmax(min(280px,100%),1fr))}
.vct-ss__card{min-width:0}
.vct-ss__name{overflow-wrap:anywhere}
@media (min-width:761px){.vct-ss__cols{grid-template-columns:minmax(0,1fr) minmax(200px,260px)}}
.vct-ss__cols>*{min-width:0}
@media (min-width:990px){
  .vct-ss--drop .vct-ss__bar{min-height:0;padding:var(--vct-ss-pad,12px);gap:8px;border-bottom:1px solid var(--vct-line)}
  .vct-ss--drop .vct-ss__field{flex:0 0 auto;width:var(--vct-ss-veld-w,auto);height:var(--vct-ss-balk,48px);margin-left:var(--vct-ss-veld-l,0);border-radius:999px}
  .vct-ss--drop .vct-ss__close{margin-left:auto}
  .vct-ss--drop .vct-ss__body{padding:16px var(--vct-ss-pad,12px) 20px}
  .vct-ss--drop .vct-ss__hint{padding:12px var(--vct-ss-pad,12px) 0}
  .vct-ss--drop .vct-ss__footer{padding:12px var(--vct-ss-pad,12px)}
  .vct-ss--drop.is-open .vct-ss__panel{animation:vct-ss-grow .2s cubic-bezier(.2,.8,.2,1) both}
}
@keyframes vct-ss-grow{from{clip-path:inset(0 0 calc(100% - var(--vct-ss-balk,48px) - 2 * var(--vct-ss-pad,12px)) 0 round 16px)}to{clip-path:inset(0 0 0 0 round 16px)}}
@media (prefers-reduced-motion:reduce){.vct-ss--drop.is-open .vct-ss__panel{animation:none}}
/* ---- Lade en knoppen: huisstijl, rust, beweging (eigenaar okt 2026) ------------------------------------------------ */
/* kleuren: navy + oranje accent i.p.v. groen */
.ship b,.ship.done b{color:var(--acc-on,#c4520c)}
.vst-t.vg-kort b{color:var(--ink)}
.meter i,.ship.done .meter i{background:var(--acc)}
.vst-d.on,.ship.done .vst-d.on{background:var(--acc);border-color:var(--acc)}
.dlt svg{color:var(--navy)}.dlt b{color:var(--ink)}
.vg.ok{border-color:color-mix(in srgb,var(--acc) 45%,#fff);background:var(--acc-soft)}
.vg.ok .vg-t b{color:var(--ink)}
.vg-p b{color:var(--acc-on,#c4520c)}
.gelukt,.gelukt.cta,.gelukt.btn,#add.gelukt,#add2.gelukt{background:var(--cta)!important;color:var(--navy)!important}   /* knop blijft geel (eigenaar) */
/* vinkjes echt in het midden */
.vst-d.on::after,.vg-v::after{left:50%;top:50%;width:3px;height:6px;margin:0;transform:translate(-50%,-62%) rotate(45deg)}
.vg .vg-v,.vg.ok .vg-v{top:auto;right:-4px;bottom:-4px;width:16px;height:16px;background:var(--acc);display:block;font-size:0}
/* laden: bewegende balk bovenaan de lade i.p.v. een doorzichtige lade */
.dr.busy .dr-b,.dr.busy .dr-f{opacity:1;pointer-events:auto}
.dr::after{content:"";position:absolute;left:0;right:0;top:0;height:3px;z-index:5;pointer-events:none;opacity:0;transition:opacity .15s;
  background:linear-gradient(90deg,transparent,var(--acc),transparent) no-repeat;background-size:40% 100%}
.dr.busy::after{opacity:1;animation:dr-load 1s linear infinite}
@keyframes dr-load{from{background-position:-40% 0}to{background-position:140% 0}}
/* regel weg: direct inklappen */
.li.is-gone,.dl2.is-gone{overflow:hidden;opacity:0;padding-top:0!important;padding-bottom:0!important;border-bottom-color:transparent;
  transition:height .22s var(--ease-out,ease),opacity .14s ease,padding .22s var(--ease-out,ease)}
/* knop tijdens toevoegen: spinner + tekst, niet doorzichtig */
[aria-busy=true].btn-load,#add[aria-busy="true"].btn-load,#add2[aria-busy="true"].btn-load{opacity:1}
.btn-load{display:inline-flex;align-items:center;justify-content:center;gap:8px;white-space:nowrap;cursor:progress}
.btn-spin{width:18px;height:18px;flex:none;border-radius:50%;border:2.5px solid currentColor;border-right-color:transparent;animation:btn-spin .7s linear infinite}
@keyframes btn-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.dr.busy::after{animation:none;background-size:100% 100%;opacity:.6}.btn-spin{animation-duration:1.6s}.li.is-gone,.dl2.is-gone{transition:none}}
.vg-pp-ph:has(img){background:#fff;border:1px solid var(--line)}.vg-pp-ph img{object-fit:contain}
/* eerste bezoek: balk pas tonen als bekend is of er een cadeaustap bij hoort (vct-theme.js giftBalk) */
.ship .vst,.ship .vst-l,.ship .vst-t{transition:opacity .2s ease}
.ship.vst-wacht .vst,.ship.vst-wacht .vst-l,.ship.vst-wacht .vst-t{opacity:0}
.sfree{color:var(--ink)!important;font-weight:600}   /* geen groen in de lade (eigenaar okt 2026) */
/* Productkaart: label "Onze keuze" (tag onze-keuze of nummer 1 uit het advies), linksonder op de foto, los van het
   korting- of voorraadlabel linksboven */
.card-pk{position:absolute;left:10px;bottom:10px;z-index:1;display:inline-flex;align-items:center;gap:5px;max-width:calc(100% - 20px);padding:4px 10px 4px 6px;border-radius:999px;background:#fff;color:var(--navy);font-size:12px;font-weight:800;line-height:1.2;white-space:nowrap;box-shadow:0 2px 8px rgba(4,10,34,.12)}
.card-pk svg{width:14px;height:14px;flex:none;color:var(--acc);fill:currentColor}
/* Bedrijfsgegevens (snippets/vct-ip-company part details, eigenaar okt 2026): witte rijen op de grijze kaart .kbg,
   e-mail en telefoon aantikbaar, adres met noot en kaartlink, onderaan naam, KvK en btw als nette lijst */
.cog{display:flex;flex-direction:column;gap:8px}
.cog-r{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px 14px;background:#fff;border-radius:12px;color:var(--ink);transition:box-shadow .15s ease-out}
.kbg a.cog-r{color:var(--ink);text-decoration:none}
a.cog-r:hover{box-shadow:inset 0 0 0 1px var(--navy)}
.cog-i{width:40px;height:40px;border-radius:50%;background:var(--acc-soft);color:var(--acc-on,#c4520c);display:grid;place-items:center}
.cog-i svg{width:20px;height:20px}
.cog-t{display:flex;flex-direction:column;min-width:0}
.cog-t small{font-size:12px;font-weight:600;color:var(--mut);line-height:1.35}
.cog-t b{font-size:15px;font-weight:700;line-height:1.35;overflow-wrap:anywhere}
.cog-go{width:18px;height:18px;color:var(--mut);transition:transform .2s var(--ease-out)}
a.cog-r:hover .cog-go{transform:translateX(2px);color:var(--ink)}
.cog-adr{grid-template-columns:40px minmax(0,1fr);align-items:start}
.cog-n{font-size:13px;line-height:1.45;color:var(--mut);margin-top:2px}
.kbg .cog-adr a{align-self:flex-start;margin-top:6px;font-size:14px;font-weight:700;color:var(--acc-on,#c4520c)}
.kbg dl.cog-f{display:block;margin:0;padding:2px 14px;background:#fff;border-radius:12px}
.cog-f div{display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding:10px 0;font-size:14px}
.cog-f div+div{border-top:1px solid var(--line)}
.kbg .cog-f dt{color:var(--mut)}
.kbg .cog-f dd{margin:0;font-weight:700;text-align:right;overflow-wrap:anywhere}
/* vertrouwen onder de bedrijfsgegevens: twee witte kaartjes, naast elkaar waar het past */
.kbg .tblk{grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:8px;margin-top:8px;padding-top:0;border-top:0}
.kbg .tb-r{background:#fff;border-radius:12px;padding:12px 14px;line-height:1.35}
.kbg .tb-r small{display:block;color:var(--mut);font-size:12px;margin-top:2px}

/* Keurmerken klein in de header (snippets/vct-header-trust): de beeldmerken direct op het navy, alleen breed scherm */
.hkm{display:none}
@media (min-width:1180px){
  .hkm{display:flex;align-items:center;gap:14px;flex:none;padding-right:16px;border-right:1px solid rgba(255,255,255,.16);color:#fff}
  .hkm a,.hkm span{display:flex;align-items:center}
  .hkm-tw img{display:block;height:24px;width:auto}
  .hkm-fc{gap:6px;font-size:14px;font-weight:700;line-height:1;color:#fff;text-decoration:none}
  .hkm-fc img{display:block;width:24px;height:24px}
  .hkm-fc .hkm-st{width:14px;height:14px;margin-left:-2px;color:#f5b301;fill:currentColor;stroke:none}
  .hkm a{transition:opacity .15s ease-out}.hkm a:hover{opacity:.8}
}
/* Ingedrukt (Henk okt 2026: "knoppen moeten duidelijk maken dat ze zijn ingedrukt"): elke knop zonder eigen stand reageert
   meteen bij aanraken; alleen kleur en filter, nooit maat of plaats */
:where(button,[role=button],a.btn,input[type=submit],input[type=button]):not(:disabled):active{filter:brightness(.88)}
.qty button:not(:disabled):active{background:var(--soft);border-radius:10px}.rm:active{color:var(--ink)}
/* Winkelwagen bijwerken (Henk 29 okt 2026: "het totaal loopt achter"): zolang de server rekent, zijn de totalen zichtbaar
   'bezig' (gedimd) in plaats van een oud bedrag dat er gewoon uitziet */
.dr.busy .dft strong,[data-main-cart].busy .tot span:last-child,[data-main-cart].busy .cbar strong{opacity:.4;transition:opacity .12s ease-out}
/* Melding met knop (verwijderd, ongedaan maken) */
.toast-b{margin-left:8px;padding:6px 4px;background:none;border:0;color:var(--cta);font:inherit;font-weight:700;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.fbl a.wdr-k{display:inline-flex;align-items:center;min-height:44px;white-space:nowrap}.wdr-rein .usp,.wdr-rein .pre,.wdr-rein .fn,.wdr-rein .rdv-team{display:none}.wdr-p{max-width:640px;padding-top:24px;padding-bottom:40px}.wdr-form{display:grid;gap:6px;margin-top:16px}.wdr-form label{font-weight:700;margin-top:10px}.wdr-form input{min-height:44px;padding:8px 12px;border:1px solid var(--line);border-radius:10px;font:inherit}.wdr-b{margin-top:18px;justify-self:start}.wdr-f{color:#b42318;font-weight:600;margin:4px 0 0}.wdr-dl{margin-top:16px}.wdr-dl dt{font-weight:700;margin-top:10px}.wdr-dl dd{margin:2px 0 0;overflow-wrap:anywhere}
.pvat{display:block;font-size:12px;color:var(--mut);font-weight:500}.pgp{display:block}
/* STAP 3 punt 27: chatknop met een vaste plek (onzichtbaar en niet te bedienen) tot vct-chat.js geladen is (snippets/vct-chat.liquid);
   zo schuiven de lege winkelwagen en de 404 niet als hij verschijnt */
[data-chat-open][data-chat-wacht]{visibility:hidden}
/* STAP 3 punt 30: de knop Lees meer houdt zijn plek; vct-theme.js (readmore) maakt hem zichtbaar als de tekst niet past */
[data-readmore-btn][data-rm-wacht]{visibility:hidden}

/* VCTparts: opmaak van de onderdelen die op elke pagina kunnen staan: ingangen naar de fittingzoeker
   (snippets/vct-fz-entry.liquid), de fitkaart en "Past in jouw auto" (assets/vct-fit.js) en de productvergelijker
   (assets/vct-compare.js). Sinds STAP 3 punt 17 (ronde 5) onderdeel van vct-theme.css: een verzoek minder in de head, zelfde plek in de cascade. */

/* ---- ingangen fittingzoeker ---- */
.fze{display:flex;align-items:center;gap:10px;color:#fff;flex:none;padding:6px 12px 6px 6px;border:1.5px solid rgba(255,255,255,.25);border-radius:var(--r);transition:border-color .15s ease-out;max-width:230px}
.fze:hover{border-color:#fff}
.fze-i{width:34px;height:34px;border-radius:6px;background:var(--acc);display:grid;place-items:center;flex:none}
.fze-i svg{width:20px;height:20px}
.fze-t{display:grid;min-width:0;line-height:1.2}
.fze-t small{font-size:12px;color:#aab0c4;font-weight:600}
.fze-t b{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (max-width:1100px){.fze{display:none}}
.fzn{font-weight:700}
.fzn .pc{background:var(--acc)!important;color:#fff!important}
.fzd{display:flex;align-items:center;gap:8px;font-weight:700}
.fzd svg{width:18px;height:18px;color:var(--acc)}

/* ---- fitkaart op de productpagina (ontwerp .fit) ---- */
.vfit>div>b{display:block}
.vfit .fr{margin-top:8px}
.vfit .fr small a{text-decoration:underline;text-underline-offset:3px}
.vfit .fr .btn svg{width:18px;height:18px}
.vfit-r{display:flex;align-items:center;gap:12px}
.vfit-l{position:relative;flex:none;width:52px;height:52px;border-radius:12px;background:#fff;border:1px solid var(--line);display:grid;place-items:center}
.vfit-l img{width:40px;height:40px;object-fit:contain}
.vfit-l>svg{width:26px;height:26px;color:var(--mut)}
.vfit-b{position:absolute;right:-6px;bottom:-6px;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;color:#fff;border:2px solid var(--soft);background:var(--mut)}
.vfit-b svg{width:12px;height:12px}
.vfit-b.fit{background:var(--ok)}
.vfit-b.maybe,.vfit-b.vw{background:var(--acc)}
.vfit-b.nofit{background:#b42318}
.vfit-t{flex:1;min-width:0;display:grid;gap:1px;font-size:14px;color:var(--mut)}
.vfit-t strong{font-size:16px;color:var(--ink);line-height:1.25}
.vfit-t small{font-size:13px}
.vfit-t small a{color:var(--acc);font-weight:700;text-decoration:underline}
.vfit[data-state="fit"] .vfit-t>span{color:var(--ok);font-weight:700}
.vfit[data-state="nofit"] .vfit-t>span{color:#b42318;font-weight:700}
.vfit-e{flex:none;width:38px;height:38px}
.vfit-e svg{width:16px;height:16px}
.vfit-n{margin:10px 0 0;font-size:12px;color:var(--mut);line-height:1.45}
/* fitkaart in de vorm van de eigenaar (tegel, tekst, knop), zoals de productpagina hem kan bouwen */
.fit .vct-fitcard__car{color:var(--ink)}
.fit .vct-fitcard__detail{display:block;font-size:13px;color:var(--mut);font-weight:400}
.fit .vct-fitcard__detail a{color:var(--acc);font-weight:700;text-decoration:underline}
.fit[data-state="fit"] .vct-fitcard__lead{color:var(--ok);font-weight:700}
.fit[data-state="nofit"] .vct-fitcard__lead{color:#b42318;font-weight:700}
.fit [data-vct-fitline-tile].vfit-l{width:48px;height:48px}
[data-vct-fit-sticky]{display:inline-flex;align-items:center;gap:6px;color:var(--ok);font-weight:700;font-size:13px}
[data-vct-fit-sticky] svg{width:16px;height:16px;flex:none}

/* ---- "Past in jouw Golf" op kaarten en rijen ---- */
.vfb{position:absolute;left:8px;bottom:8px;z-index:2;display:inline-flex;align-items:center;gap:4px;max-width:calc(100% - 60px);background:var(--ok);color:#fff;font-size:12px;font-weight:700;padding:3px 8px;border-radius:999px;pointer-events:none}
.vfb span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vfb svg{width:12px;height:12px;flex:none}
.row .vfb{max-width:calc(100% - 16px)}

/* ---- vergelijker: knoppen en vinkjes ---- */
.cmpm{display:inline-flex;align-items:center;gap:8px;justify-content:center;white-space:nowrap}
.cmpm svg{width:18px;height:18px}
.cmpm[aria-pressed="true"]{border-color:var(--acc);background:var(--acc-soft)}
.cmpa{display:inline-flex;align-items:center;gap:6px;background:none;border:0;padding:6px 0;color:var(--ink);font-weight:600;cursor:pointer}
.cmpa svg{width:18px;height:18px}
.cmpa:hover span{text-decoration:underline;text-underline-offset:3px}
.cmpa[aria-pressed="true"]{color:var(--acc)}
.cmpa[aria-busy="true"]{opacity:.6}
.vct-cmp-toggle{display:none}
.vct-cmp-mode .vct-cmp-toggle{display:inline-flex;align-items:center;gap:6px;cursor:pointer;font-size:13px;font-weight:700;color:var(--ink)}
.vct-cmp-toggle input{width:18px;height:18px;margin:0;accent-color:var(--acc);cursor:pointer}
.vct-cmp-toggle.is-busy{opacity:.55}
.card .vct-cmp-toggle{position:absolute;top:8px;right:8px;z-index:3;background:#fff;border:1px solid var(--line);border-radius:12px;padding:5px 8px}
.card .vct-cmp-toggle.is-on{border-color:var(--acc);background:var(--acc-soft)}
.row .vct-cmp-toggle{margin:6px 0 2px}

/* ---- vergelijker: balk onderin ---- */
.vct-cmp-bar{position:fixed;left:50%;bottom:calc(16px + var(--vct-cmp-lift,0px));z-index:8;transform:translateX(-50%);width:min(820px,calc(100vw - 32px));background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:0 18px 50px rgba(4,10,34,.18);padding:12px 14px;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px 16px;align-items:center}
.vct-cmp-bar[hidden]{display:none}
.vct-cmp-bar__head{display:grid;line-height:1.25}
.vct-cmp-bar__head strong{font-size:15px}
.vct-cmp-bar__head span{font-size:13px;color:var(--mut)}
.vct-cmp-bar__items{list-style:none;margin:0;padding:0;display:flex;gap:8px;min-width:0}
.vct-cmp-bar__items li{position:relative;width:52px;height:52px;flex:none;border:1px solid var(--line);border-radius:12px;background:var(--soft)}
.vct-cmp-bar__items li.is-empty{border-style:dashed;background:#fff}
.vct-cmp-bar__items img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply;padding:4px;border-radius:12px}
.vct-cmp-bar__items li span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.vct-cmp-bar__items button{position:absolute;top:-7px;right:-7px;width:20px;height:20px;border-radius:50%;border:0;background:var(--navy);color:#fff;font-size:13px;line-height:1;display:grid;place-items:center;cursor:pointer}
.vct-cmp-bar__actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.vct-cmp-bar__actions .btn{padding:10px 16px;font-size:15px}
.vct-cmp-bar__hint{margin:0;font-size:13px;color:var(--mut)}
.vct-cmp-bar__clear{background:none;border:0;padding:4px;color:var(--mut);font-size:14px;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.vct-cmp-bar__msg{grid-column:1/-1;display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:var(--acc-soft);border-radius:12px;padding:8px 10px;font-size:14px}
.vct-cmp-bar__msg p{margin:0;flex:1;min-width:200px}
.vct-cmp-bar__msg .btn{padding:8px 12px;font-size:14px}
.vct-cmp-bar__x{background:none;border:0;font-size:20px;line-height:1;cursor:pointer;color:var(--mut);padding:2px 6px}
.vct-cmp-bar.is-compact{display:block;width:auto;padding:6px;border-radius:999px}
.vct-cmp-bar__pill{display:flex;align-items:center;gap:4px}
.vct-cmp-bar__open{display:flex;align-items:center;gap:8px;background:var(--navy);color:#fff;border:0;border-radius:999px;padding:6px 14px 6px 6px;font-weight:700;font-size:14px;cursor:pointer}
.vct-cmp-bar__open:disabled{background:var(--mut);cursor:default}
.vct-cmp-bar__stack{display:flex}
.vct-cmp-bar__stack img{width:30px;height:30px;border-radius:50%;background:#fff;border:2px solid var(--navy);object-fit:contain;margin-right:-8px}
.vct-cmp-bar__stack img:last-child{margin-right:0}
@media (max-width:900px){
  .vct-cmp-bar{grid-template-columns:minmax(0,1fr) auto;bottom:calc(10px + var(--vct-cmp-lift,0px));width:calc(100vw - 20px);padding:10px}
  .vct-cmp-bar__items{grid-column:1/-1;grid-row:2}
  .vct-cmp-bar__items li{width:44px;height:44px}
  .vct-cmp-bar__actions{grid-column:1/-1;justify-content:space-between}
  .vct-cmp-bar__actions .btn{flex:1}
  .vct-cmp-bar.is-compact{left:auto;right:10px;transform:none;width:auto}
}

/* ---- vergelijker: paneel met tabel ---- */
html.vct-cmp-locked,html.vct-cmp-locked body{overflow:hidden}
.vct-cmp-dialog{position:fixed;inset:0;z-index:30;background:rgba(4,10,34,.45);display:grid;place-items:center;padding:12px;opacity:0;transition:opacity .2s ease-out}
.vct-cmp-dialog[hidden]{display:none}
.vct-cmp-dialog.is-open{opacity:1}
.vct-cmp-dialog__panel{background:#fff;border-radius:16px;box-shadow:0 30px 70px rgba(4,10,34,.3);width:min(1100px,100%);max-height:min(88vh,900px);display:flex;flex-direction:column;overflow:hidden;transform:translateY(8px);transition:transform .25s var(--ease-out)}
.vct-cmp-dialog.is-open .vct-cmp-dialog__panel{transform:none}
.vct-cmp-dialog__head{display:flex;align-items:center;gap:14px;padding:14px 18px;border-bottom:1px solid var(--line)}
.vct-cmp-dialog__head h2{margin:0;font-size:19px;flex:1;min-width:0}
.vct-cmp-diff{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:600;cursor:pointer}
.vct-cmp-diff input{width:18px;height:18px;margin:0;accent-color:var(--acc)}
.vct-cmp-dialog__scroll{overflow:auto;overscroll-behavior:contain;flex:1}
.vct-cmp-dialog__note{margin:0;padding:10px 18px;border-top:1px solid var(--line);font-size:13px;color:var(--mut)}
.vct-cmp-table{border-collapse:separate;border-spacing:0;width:100%;min-width:calc(150px + var(--vct-cmp-cols,2) * 190px);font-size:14px}
.vct-cmp-table th,.vct-cmp-table td{padding:10px 14px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.vct-cmp-table thead th,.vct-cmp-table thead td{position:sticky;top:0;background:#fff;z-index:2;border-bottom:1px solid var(--line)}
.vct-cmp-table tbody th{position:sticky;left:0;background:var(--soft);font-weight:700;width:150px;z-index:1}
.vct-cmp-table__corner{position:sticky;left:0;z-index:3!important;background:#fff}
.vct-cmp-table td.is-best{background:#edf7f0;color:#14532d;font-weight:700}
.vct-cmp-table td.is-best::before{content:"✓ ";color:var(--ok)}
.vct-cmp-table.is-diff-only tr.is-same{display:none}
.vct-cmp-table__none{color:var(--mut)}
.vct-cmp-col{position:relative;display:grid;gap:6px;min-width:160px;font-weight:400}
.vct-cmp-col__rm{position:absolute;top:0;right:0;width:26px;height:26px;border-radius:50%;border:1px solid var(--line);background:#fff;cursor:pointer;font-size:16px;line-height:1;z-index:1}
.vct-cmp-col__link{display:grid;gap:6px}
.vct-cmp-col__img{display:block;aspect-ratio:1;max-width:120px;background:var(--soft);border-radius:12px;overflow:hidden}
.vct-cmp-col__img img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply;padding:6%}
.vct-cmp-col__name{font-weight:600;line-height:1.35;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.vct-cmp-col__link:hover .vct-cmp-col__name{text-decoration:underline}
.vct-cmp-col__price{font-size:18px;font-weight:800}
.vct-cmp-col__buy .btn{width:100%;padding:10px 12px;font-size:14px}
.vct-cmp-col__buy .btn.is-done{background:#edf7f0!important;color:var(--ok)!important}
.vct-cmp-col__msg{margin:4px 0 0;font-size:12px;color:#b42318}
.vct-cmp-col__msg:empty{display:none}
.vct-cmp-stars{position:relative;display:inline-block;font-size:15px;line-height:1;letter-spacing:2px;color:var(--line)}
.vct-cmp-stars::before{content:"★★★★★"}
.vct-cmp-stars__fill{position:absolute;inset:0 auto 0 0;overflow:hidden;white-space:nowrap;color:#fbbc05}
.vct-cmp-stars__fill::before{content:"★★★★★"}
.vct-cmp-stock{font-weight:700}
.vct-cmp-stock.is-in{color:var(--ok)}
.vct-cmp-stock.is-back{color:var(--acc)}
.vct-cmp-stock.is-out{color:#b42318}
.vct-cmp-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
@media (max-width:900px){
  .vct-cmp-dialog{padding:0;place-items:end stretch}
  .vct-cmp-dialog__panel{width:100%;max-height:92vh;border-radius:20px 20px 0 0}
  .vct-cmp-dialog__head{flex-wrap:wrap}
  .vct-cmp-diff{order:3;width:100%}
  .vct-cmp-table{font-size:13px;min-width:calc(110px + var(--vct-cmp-cols,2) * 150px)}
  .vct-cmp-table tbody th{width:110px}
  .vct-cmp-table th,.vct-cmp-table td{padding:8px 10px}
  .vct-cmp-col{min-width:130px}
}
@media (prefers-reduced-motion:reduce){.vct-cmp-dialog,.vct-cmp-dialog__panel{transition:none}}
@media (max-width:900px){.card .vct-cmp-toggle span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.card .vct-cmp-toggle{padding:6px}}
