@font-face{font-family:"Figtree";src:url(/fonts/figtree.woff2) format("woff2");font-weight:300 900;font-display:swap}
@font-face{font-family:"Fraunces";src:url(/fonts/fraunces.woff2) format("woff2");font-weight:100 900;font-display:swap}

:root{
  --navy:#1F2A44;--navy-2:#2E3D5E;--ink:#1F2733;--muted:#545E6B;
  --paper:#F7F4EE;--sand:#E9DFCC;--sand-2:#F1EADC;--white:#fff;--line:#DDD3C1;
  --accent:#A8461F;--accent-d:#8A3816;--zon:#F3D27A;--ok:#2F6B47;
  --r:14px;--r-s:8px;--max:1120px;--smal:720px;
  --schaduw:0 1px 2px rgba(31,42,68,.06),0 12px 32px rgba(31,42,68,.10);
  --kop:"Fraunces",Georgia,"Times New Roman",serif;
  --tekst:"Figtree","Segoe UI",system-ui,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:5rem;scroll-padding-bottom:6rem}
body{margin:0;background:var(--paper);color:var(--ink);font:400 1.0625rem/1.6 var(--tekst)}
img{max-width:100%;height:auto;display:block}
a{color:var(--navy);text-underline-offset:.2em;text-decoration-thickness:1px}
a:hover{color:var(--accent-d)}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:4px}
h1,h2,h3,h4{font-family:var(--kop);font-weight:600;color:var(--navy);line-height:1.15;letter-spacing:-.01em;margin:0 0 .6em}
h1{font-size:clamp(2.1rem,5vw,3.4rem)}
h2{font-size:clamp(1.6rem,3.2vw,2.3rem)}
h3{font-size:1.25rem}
h4{font-size:1.05rem}
p{margin:0 0 1em}
ul,ol{padding-left:1.25em}
.wrap{width:min(100% - 32px,var(--max));margin-inline:auto}
.smal{max-width:var(--smal)}
.visueel-weg,.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:1rem;top:-4rem;background:var(--navy);color:#fff;padding:.6rem 1rem;border-radius:var(--r-s);z-index:20}
.skip:focus{top:1rem;color:#fff}
main:focus{outline:none}

/* Knoppen */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.4em;min-height:48px;padding:.75rem 1.4rem;border-radius:999px;font:700 1rem/1.2 var(--tekst);text-decoration:none;border:2px solid transparent;transition:transform .15s,background-color .15s;cursor:pointer}
.btn:hover{transform:translateY(-1px)}
.btn-primary{background:var(--accent);color:#fff}
.btn-primary:hover{background:var(--accent-d);color:#fff}
.btn-ghost{background:transparent;color:var(--navy);border-color:var(--navy)}
.btn-ghost:hover{background:var(--navy);color:#fff}
.btn-sm{min-height:40px;padding:.5rem 1rem;font-size:.95rem}
.tekstlink{font-weight:600}

/* Kop */
.top{position:sticky;top:0;z-index:10;background:rgba(247,244,238,.94);backdrop-filter:saturate(1.4) blur(8px);border-bottom:1px solid var(--line)}
.top-in{display:flex;align-items:center;gap:1.5rem;min-height:64px}
.brand{display:flex;text-decoration:none}.logo{display:block;width:auto}
.nav{display:flex;gap:1.25rem;margin-left:auto}
.nav a{text-decoration:none;font-weight:600;color:var(--ink)}
.nav a:hover,.nav a[aria-current]{color:var(--accent-d)}
@media (max-width:820px){.nav{display:none}.top-cta{margin-left:auto}}
@media (max-width:400px){.brand .logo{height:26px}.top-cta{padding-inline:.8rem;font-size:.85rem}}

/* Secties */
.sectie{padding:clamp(3rem,7vw,5.5rem) 0}
.licht{background:var(--sand-2)}
.lede{font-size:1.15rem;color:var(--muted);max-width:60ch}
.kruimel{font-size:.95rem;color:var(--muted)}
.klein{font-size:.95rem;color:var(--muted)}

/* Hero */
.hero{padding:clamp(2.5rem,6vw,5rem) 0 clamp(2.5rem,5vw,4rem)}
.hero-in{display:grid;gap:clamp(2rem,5vw,4rem);grid-template-columns:1.05fr .95fr;align-items:center}
@media (max-width:900px){.hero-in{grid-template-columns:minmax(0,1fr)}.blad-tabel{font-size:.8rem}.blad-tabel td,.blad-tabel th{padding:.4rem .25rem}}
.kicker{font-weight:700;color:var(--accent-d);letter-spacing:.02em;margin-bottom:.8rem}
.lead{font-size:clamp(1.1rem,2vw,1.3rem);color:var(--muted);max-width:34ch}
.hero-acties{display:flex;flex-wrap:wrap;align-items:center;gap:1rem 1.5rem;margin:1.75rem 0 1.25rem}
.hero-zeker{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:.4rem 1.25rem;color:var(--muted);font-size:.95rem}
.hero-zeker li::before{content:"✓";color:var(--ok);font-weight:700;margin-right:.4em}
.hero-beeld{margin:0;perspective:1200px}
.blad{overflow:hidden;background:var(--white);border-radius:var(--r);box-shadow:var(--schaduw);padding:1rem 1rem .75rem;transform:rotate(-1.2deg);animation:landen .8s cubic-bezier(.2,.7,.2,1) both}
@keyframes landen{from{opacity:0;transform:translateY(16px) rotate(-3deg)}to{opacity:1;transform:rotate(-1.2deg)}}
.blad-tabs{display:flex;gap:.25rem;margin-bottom:.75rem;font-size:.85rem;font-weight:600}
.blad-tabs span{padding:.35rem .75rem;border-radius:6px 6px 0 0;background:var(--sand-2);color:var(--muted)}
.blad-tabs .aan{background:var(--navy);color:#fff}
.blad-tabel,.pp table{width:100%;border-collapse:collapse;font-size:.92rem}
.blad-tabel th{text-align:left;font-weight:700;color:var(--muted);border-bottom:2px solid var(--line);padding:.45rem .4rem}
.blad-tabel td{padding:.55rem .4rem;border-bottom:1px solid #EFE8DB}
.blad-tabel .let{background:var(--zon);font-weight:700;border-radius:4px}
.blad-noot{font-size:.8rem;color:var(--muted);margin:.6rem 0 0}

.herken-sectie p{font-size:1.15rem}

/* Demo */
.demo{display:grid;grid-template-columns:minmax(0,1fr) 48px minmax(0,1.1fr);gap:1.5rem;align-items:center;margin-top:2rem}
@media (max-width:860px){.demo{grid-template-columns:1fr}.demo-pijl{display:none}}
.demo-brieven{display:grid;gap:.75rem}
.brief{all:unset;box-sizing:border-box;display:grid;gap:.15rem;cursor:pointer;background:var(--white);border:2px solid var(--line);border-radius:var(--r);padding:1rem 1.1rem;transition:transform .2s,border-color .2s,box-shadow .2s}
.brief:hover{transform:translateX(4px)}
.brief:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.brief[aria-pressed="true"]{border-color:var(--navy);box-shadow:var(--schaduw)}
.brief-vb{font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:var(--accent-d);font-weight:700}
.brief-afz{font-weight:700;color:var(--navy)}
.brief-ond{color:var(--muted)}
.brief-lijn{height:6px;border-radius:3px;background:#EFE8DB;margin-top:.35rem;width:90%}
.brief-lijn.kort{width:55%}
.demo-pijl{height:2px;background:var(--navy);position:relative}
.demo-pijl::after{content:"";position:absolute;right:-2px;top:-6px;border:7px solid transparent;border-left-color:var(--navy)}
.demo-map{background:var(--navy);color:#fff;border-radius:var(--r);padding:1.5rem;box-shadow:var(--schaduw)}
.demo-kop{font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;color:var(--zon);font-weight:700;margin:0 0 .5rem}
.demo-in{display:grid;gap:.4rem;margin:0 0 1.25rem}
.demo-in div{display:flex;justify-content:space-between;gap:1rem;border-bottom:1px solid rgba(255,255,255,.15);padding-bottom:.35rem}
.demo-in dt{color:rgba(255,255,255,.75)}
.demo-in dd{margin:0;font-weight:600;text-align:right}
.demo-uit{background:var(--white);color:var(--ink);border-radius:var(--r-s);padding:1rem 1.1rem}
.demo-uit.nieuw{animation:opkomen .5s ease-out both}
@keyframes opkomen{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.demo-termijn{font-size:1.15rem;margin:0 0 .35rem}
.demo-termijn strong{background:var(--zon);padding:.05em .35em;border-radius:4px}
.demo-regel{color:var(--muted);font-size:.95rem;margin:0 0 .5rem}
.demo-map-nr{margin:0;font-weight:600}
.demo-noot{font-size:.82rem;color:rgba(255,255,255,.75);margin:.75rem 0 0}

/* Kaarten */
.cards{list-style:none;padding:0;margin:2rem 0 0;display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr))}
.card{display:flex;flex-direction:column;background:var(--white);border:1px solid var(--line);border-radius:var(--r);transition:transform .2s,box-shadow .2s}
.card:hover{transform:translateY(-3px);box-shadow:var(--schaduw)}
.card-link{display:block;padding:1.25rem 1.25rem .75rem;text-decoration:none;color:inherit;flex:1}
.card-link h3{margin:.35rem 0 .4rem}
.card-link p{color:var(--muted);margin:0 0 .6rem}
.card-nr{font-size:.8rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--accent-d)}
.card-feit{font-size:.85rem;color:var(--muted)}
.card-voet{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.75rem 1.25rem 1.25rem}
.card-voet .btn{white-space:nowrap;flex:none}
@media (max-width:480px){.card-bundel .card-voet{flex-direction:column;align-items:stretch}.card-bundel .card-voet .btn{text-align:center}}
.card-prijs{font-weight:800;font-size:1.15rem;color:var(--navy)}
.card-prijs small{display:block;font-weight:500;font-size:.85rem;color:var(--muted)}
.card-bundel{background:var(--navy);border-color:var(--navy)}
.card-bundel h3,.card-bundel .card-prijs{color:#fff}
.card-bundel p,.card-bundel .card-feit,.card-bundel .card-prijs small{color:rgba(255,255,255,.8)}
.card-bundel .card-nr{color:var(--zon)}
.los-noot{margin-top:1.25rem;color:var(--muted)}

/* Keuzehulp */
.kies fieldset{border:0;padding:0;margin:1.5rem 0;display:grid;gap:.5rem}
.kies label{display:flex;gap:.75rem;align-items:center;background:var(--white);border:1px solid var(--line);border-radius:var(--r-s);padding:.8rem 1rem;cursor:pointer;min-height:48px}
.kies label:has(input:checked){border-color:var(--navy);box-shadow:inset 0 0 0 1px var(--navy)}
.kies input{width:1.25rem;height:1.25rem;accent-color:var(--navy)}
.kies-uit{background:var(--sand-2);border-radius:var(--r);padding:1.25rem}
.kies-uit ul{margin:.25rem 0 1rem}
.kies-advies{font-weight:700;color:var(--navy);margin-bottom:.4rem}

/* Stappen */
.stappen{list-style:none;padding:0;margin:2rem 0 0;display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));counter-reset:s}
.stappen li{counter-increment:s;background:var(--white);border-radius:var(--r);padding:1.25rem;display:grid;gap:.35rem}
.stappen li::before{content:counter(s);display:grid;place-items:center;width:2rem;height:2rem;border-radius:50%;background:var(--navy);color:#fff;font-weight:700}
.stappen span{color:var(--muted)}

/* FAQ */
.faq details,.pp details{border-bottom:1px solid var(--line);padding:.9rem 0}
.faq summary,.pp summary{cursor:pointer;font-weight:700;color:var(--navy);list-style:none;display:flex;gap:.6rem;align-items:baseline}
.faq summary::-webkit-details-marker,.pp summary::-webkit-details-marker{display:none}
.faq summary::before,.pp summary::before{content:"+";flex:none;width:1ch;color:var(--accent);font-weight:700}
.faq details[open]>summary::before,.pp details[open]>summary::before{content:"\2013"}
.faq details p,.pp details p{margin:.6rem 0 0;color:var(--muted)}

.slot{background:var(--navy);color:#fff;padding:2.5rem 0}
.slot-in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem}
.slot-tekst{font:600 clamp(1.3rem,2.6vw,1.8rem)/1.2 var(--kop);margin:0}

/* Voet */
.foot{background:var(--sand);padding:3rem 0 2rem;font-size:.95rem}
.foot-in{display:grid;gap:1.25rem}
.foot nav{display:flex;flex-wrap:wrap;gap:.5rem 1.5rem}
.foot-sub,.foot-note{color:var(--muted);margin:.4rem 0 0}
.foot-id{margin:0}

/* Tekstpagina's */
.tekst main>section{padding:3rem 0}
.tekst main .wrap{max-width:var(--smal)}

/* Productpagina's (inhoud uit v7) */
.pp .wrap{width:min(100% - 32px,var(--max));margin-inline:auto}
.pp-kop{padding:2.5rem 0 3rem}
.pp-kop>.wrap{display:grid;gap:2.5rem;grid-template-columns:1.1fr .9fr;align-items:start}
@media (max-width:900px){.pp-kop>.wrap{grid-template-columns:1fr}}
.pp-kop h1{font-size:clamp(1.8rem,4vw,2.7rem)}
.herken{display:inline-block;font-weight:700;color:var(--accent-d);margin-bottom:.5rem}
.situatie{font-size:1.15rem}
.product-naam{font:600 1.2rem/1.3 var(--kop);color:var(--navy);margin:.5rem 0}
.voorwie{color:var(--muted)}
.helpt,.helpt-lijst{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:.4rem;margin:.25rem 0 1rem}
.helpt li,.helpt-lijst li{background:var(--white);border:1px solid var(--line);border-radius:999px;padding:.2rem .75rem;font-size:.9rem}
.feiten{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:.5rem 1.25rem;font-weight:700;color:var(--navy)}
.feiten li::before{content:"✓ ";color:var(--ok)}
.snel{font-size:.95rem;color:var(--muted)}
.betaal-taal{display:block;font-size:.9rem;color:var(--muted);margin:.25rem 0}
.mock{margin:0}
.mock-map{position:relative;aspect-ratio:3/3.6;max-width:420px;margin-inline:auto}
.mock-rug{position:absolute;inset:4% 0 0 6%;background:var(--navy);border-radius:10px}
.mock-blad{position:absolute;width:72%;background:#fff;border-radius:4px;box-shadow:var(--schaduw);overflow:hidden}
.mock-blad img{width:100%}
.mock-blad.b3{top:0;left:22%;transform:rotate(5deg)}
.mock-blad.b2{top:3%;left:16%;transform:rotate(2deg)}
.mock-blad.b1{top:6%;left:10%}
.mock-klem{position:absolute;top:2%;left:30%;width:28%;height:4%;background:var(--zon);border-radius:4px}
.waaier .mock-blad{width:44%;top:10%;left:28%;transform-origin:50% 110%}
.waaier .w1{transform:rotate(-18deg)}.waaier .w2{transform:rotate(-9deg)}.waaier .w3{transform:rotate(0);z-index:3}.waaier .w4{transform:rotate(9deg);z-index:2}.waaier .w5{transform:rotate(18deg);z-index:1}
.waaier .w1,.waaier .w2{z-index:1}.waaier .w2{z-index:2}
.mock-label{z-index:4;position:absolute;bottom:3%;right:4%;background:var(--zon);color:var(--navy);font-weight:800;padding:.25rem .6rem;border-radius:6px}
.pp-sectie{padding:clamp(2.5rem,6vw,4rem) 0}
.pp-sectie.licht{background:var(--sand-2)}
.pp-twee{display:grid;gap:2.5rem;grid-template-columns:1fr 1fr}
@media (max-width:860px){.pp-twee{grid-template-columns:1fr}}
.groep-kop small{font:500 .95rem var(--tekst);color:var(--muted);margin-left:.4em}
.bladen{list-style:none;padding:0;display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr));margin:1rem 0 2rem}
.blad-item,.bladen .blad{display:grid;grid-template-columns:96px 1fr;gap:1rem;align-items:start;background:var(--white);border:1px solid var(--line);border-radius:var(--r);padding:.9rem;transform:none;box-shadow:none;animation:none}
.bladen .blad.xl{grid-template-columns:140px 1fr}
.bladen img{border:1px solid var(--line);border-radius:4px;background:var(--sand-2);min-height:60px}
.bladen h4{margin:.1rem 0 .25rem}
.bladen p{font-size:.95rem;color:var(--muted);margin:0}
.pnr{font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--accent-d)}
.vb-noot{color:var(--muted);font-size:.95rem}
.spec{display:grid;grid-template-columns:max-content 1fr;gap:.4rem 1.25rem;background:var(--white);border-radius:var(--r);padding:1.25rem;border:1px solid var(--line)}
.spec dt{font-weight:700}
.spec dd{margin:0;color:var(--muted)}
.stap3{padding-left:1.25em}
.stap3 li{margin-bottom:.8rem}
.stap3 b,.ik-drie b{display:block;color:var(--navy)}
.bestel{background:var(--white);border:2px solid var(--navy);border-radius:var(--r);padding:1.5rem;max-width:560px}
.prijs{font:800 2rem/1 var(--tekst);color:var(--navy);margin:1rem 0 0}
.prijs small{font-size:.9rem;font-weight:500;color:var(--muted)}
.koop,.ik-koop{display:inline-flex;align-items:center;min-height:48px;padding:.75rem 1.4rem;border-radius:999px;background:var(--accent);color:#fff;font-weight:700;text-decoration:none;margin:.5rem .5rem .5rem 0}
.koop:hover,.ik-koop:hover{background:var(--accent-d);color:#fff}
.ik-bundelknop{display:inline-flex;align-items:center;min-height:48px;padding:.7rem 1.2rem;border-radius:999px;border:2px solid var(--navy);color:var(--navy);font-weight:700;text-decoration:none}
.ook{margin-top:1rem;color:var(--muted)}
.bestel .verkoper{font-size:.88rem;color:var(--muted);margin:1rem 0 0}
.btw-regel{padding:2rem 0;font-size:.92rem;color:var(--muted);border-top:1px solid var(--line)}
.feedback{padding:2.5rem 0;background:var(--sand-2)}
.byline{font-size:.9rem;color:var(--muted)}

/* Inkijk-onderdelen */
.ik-vbn{list-style:none;padding:0;display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr))}
.ik-vb{background:var(--white);border:1px solid var(--line);border-radius:var(--r);padding:1.25rem}
.ik-drie{padding-left:1.1em;color:var(--muted)}
.ik-drie li{margin-bottom:.5rem}
.ik-brief{display:grid;gap:.15rem;background:var(--paper);border:1px solid var(--line);border-radius:var(--r-s);padding:.75rem;margin-bottom:.9rem;max-width:280px}
.ik-brief.blauw{background:#EAF0F7}
.ik-brief .vb,.ik-mock .vb,.ik-tel .vb{font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;color:var(--accent-d);font-weight:700}
.ik-brief .afz{font-weight:700;color:var(--navy)}
.ik-brief .bk{color:var(--muted);font-size:.92rem}
.ik-brief .lijn,.ik-mock .lijn{display:block;height:5px;background:#E6DECF;border-radius:3px;margin-top:.3rem}
.ik-brief .lijn.k,.ik-mock .lijn.k{width:60%}
.ik-klein{font-size:.9rem;color:var(--muted)}
.ik-acties{display:flex;flex-wrap:wrap;gap:.5rem}
.ik-link{all:unset;cursor:pointer;color:var(--navy);font-weight:700;text-decoration:underline;text-underline-offset:.2em}
.ik-link:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.ik-inv{background:var(--sand-2)}
.ik-gedachte{color:var(--muted)}
.ik-inv-grid{display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));margin-top:1.5rem}
.ik-stapel .ik-brief:nth-child(2){transform:rotate(-2deg) translateX(10px)}
.ik-stapel .ik-brief:nth-child(3){transform:rotate(1.5deg) translateX(4px)}
.ik-form,.ik-rest{background:var(--white);border-radius:var(--r);padding:1.25rem}
.ik-form dl div{display:flex;justify-content:space-between;gap:1rem;border-bottom:1px solid var(--line);padding:.35rem 0}
.ik-form dt{color:var(--muted)}
.ik-form dd{margin:0;font-weight:700}
.ik-uit{all:unset;cursor:zoom-in;display:block;margin-top:1rem}
.ik-uit img{border-radius:var(--r-s);border:1px solid var(--line)}
.ik-markeer{display:block;font-size:.9rem;color:var(--muted);margin-top:.4rem}
.ik-past-l{list-style:none;padding:0;display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr))}
.ik-past-l li{background:var(--white);border:1px solid var(--line);border-radius:var(--r);padding:1.1rem}
.ik-past-l li>a:first-child{display:grid;gap:.25rem;text-decoration:none;color:inherit;margin-bottom:.5rem}
.ik-past-l b{color:var(--navy)}
.ik-pr{font-weight:800;color:var(--navy)}
.ik-anker{margin-top:1.5rem;background:var(--navy);color:#fff;border-radius:var(--r);padding:1.25rem}
.ik-anker a{color:var(--zon);font-weight:700}
.ik-zw{padding:clamp(2.5rem,6vw,4rem) 0}
.ik-zw-grid{display:grid;gap:2rem;grid-template-columns:1.3fr .7fr;align-items:start}
@media (max-width:860px){.ik-zw-grid{grid-template-columns:1fr}}
.ik-zw-stappen{list-style:none;padding:0;display:grid;gap:1rem}
.ik-zw-stappen li{display:grid;grid-template-columns:28px 1fr;gap:.9rem}
.ik-zw-stappen svg{width:28px;height:28px;color:var(--accent-d)}
.ik-zw-stappen b{display:block;color:var(--navy)}
.ik-zw-stappen span{color:var(--muted)}
.ik-tel{margin:0}
.ik-tel-scherm{position:relative;border:10px solid var(--navy);border-radius:28px;overflow:hidden;background:#fff;max-width:240px;margin-inline:auto}
.ik-tel-balk{display:block;background:var(--navy);color:#fff;font-size:.8rem;padding:.25rem .6rem}
.ik-tel .vb{position:absolute;bottom:.4rem;right:.5rem;background:#fff;padding:0 .3rem;border-radius:3px}
.ik-tel figcaption{text-align:center;font-size:.9rem;color:var(--muted);margin-top:.6rem}
.ik-zw-noot,.ik-papier{color:var(--muted);font-size:.95rem}
.ik-papier{display:flex;gap:.6rem;align-items:flex-start}
.ik-papier svg{width:22px;flex:none}
.ik-kr{list-style:none;padding:0;display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr))}
.ik-kr li{background:var(--white);border:1px solid var(--line);border-radius:var(--r);padding:1rem;display:grid;gap:.3rem}
.ik-kr b{color:var(--navy)}
.ik-kr span{color:var(--muted);font-size:.95rem}
.ik-mock{display:grid;gap:.25rem;background:var(--paper);border-radius:var(--r-s);padding:.6rem;margin-bottom:.4rem;font-size:.85rem}
.mk-veld{background:#fff;border:1px solid var(--line);border-radius:4px;padding:.15rem .4rem}
.mk-knop{justify-self:start;background:var(--accent);color:#fff;border-radius:4px;padding:0 .5rem}
.ik-balk{position:sticky;bottom:0;z-index:5;display:flex;justify-content:space-between;align-items:center;gap:1rem;background:rgba(31,42,68,.97);color:#fff;padding:.6rem max(16px,calc((100% - var(--max))/2))}
.ik-balk b{font-weight:600}
.ik-balk.weg{visibility:hidden;transform:translateY(100%)}
@media (prefers-reduced-motion:no-preference){.ik-balk{transition:transform .2s,visibility .2s}}
.ik-balk .ik-koop{margin:0;white-space:nowrap;flex:none}
.ik-balk span{min-width:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
@media (max-width:600px){.ik-balk span{font-size:.85rem}}
.ik-garantie{color:var(--ink)}
.herroep{color:var(--muted)}

dialog.inkijk{border:0;border-radius:var(--r);padding:0;max-width:min(92vw,900px);max-height:92vh;box-shadow:var(--schaduw)}
dialog.inkijk::backdrop{background:rgba(31,42,68,.7)}
dialog.inkijk img{max-height:88vh;width:auto;margin:auto}
.inkijk-dicht{position:absolute;top:.5rem;right:.5rem;width:44px;height:44px;border-radius:50%;border:0;background:var(--navy);color:#fff;font-size:1.5rem;cursor:pointer}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .blad{transform:rotate(-1.2deg)}
}
.ik-anker .ik-koop{background:var(--zon);color:var(--navy)}
.ik-anker .ik-koop:hover{background:#fff;color:var(--navy)}
.bladen h3{font-size:1.05rem;margin:.1rem 0 .25rem}
.seizoen{background:var(--white);border-left:4px solid var(--zon);border-radius:var(--r-s);padding:.8rem 1rem;margin:1.5rem 0 0;max-width:70ch}
.card-nu{outline:2px solid var(--zon);outline-offset:2px}
.spec{grid-template-columns:minmax(0,max-content) minmax(0,1fr)}
.spec dt,.spec dd{overflow-wrap:anywhere}
@media (max-width:560px){.spec{grid-template-columns:minmax(0,1fr)}.spec dd{margin-bottom:.5rem}}

/* Plaatsvervanger zolang een previewbeeld nog niet is aangemaakt */
.beeld-volgt{display:block;width:100%;aspect-ratio:300/425;background:repeating-linear-gradient(180deg,transparent 0 18px,var(--line) 18px 19px) 12% 22%/76% 60% no-repeat,#fff;border:1px solid var(--line);border-radius:4px}
.blad.xl .beeld-volgt,.ik-shot .beeld-volgt,figure .beeld-volgt{aspect-ratio:16/10}
.mock .mock-blad .beeld-volgt{aspect-ratio:300/425;height:auto;border:0;border-radius:0}