/* ssl.tdgdigital.com — "Vandaag aanvragen. Morgen rijden." Rood uit het S-logo, hun eigen beige (#efe9e4 van de oude site) als papier,
   asfalt voor de rekenaar, kentekengeel alleen op de platen. Funnel Display + Funnel Sans; Barlow Condensed alleen voor platen/teller. */
@font-face{font-family:"Display";src:url(/fonts/display.woff2) format("woff2");font-weight:300 800;font-display:swap}
@font-face{font-family:"Tekst";src:url(/fonts/tekst.woff2) format("woff2");font-weight:300 800;font-display:swap}
@font-face{font-family:"Tekst";src:url(/fonts/tekst-i.woff2) format("woff2");font-weight:300 800;font-style:italic;font-display:swap}
@font-face{font-family:"Plaat";src:url(/fonts/plaat-600.woff2) format("woff2");font-weight:600;font-display:swap}
:root{--rood:#ec161b;--rood-d:#c80f14;--inkt:#141414;--asfalt:#1a1b1e;--asfalt-2:#26282c;--papier:#efe9e4;--papier-2:#f7f4f1;--wit:#fff;
  --geel:#f7b500;--eu:#1d3f9a;--grijs:#6b6661;--lijn:#d9d1ca;--g:clamp(1rem,4.2vw,4.5rem);--kop-h:4.25rem;--accent:var(--rood);
  --r:.375rem;--ease:cubic-bezier(.2,.7,.1,1)}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:calc(var(--kop-h) + 1rem)}
/* Brede schermen (Joost 2026-10-10): alles in rem, vanaf 1440 schaalt het ontwerp als geheel mee. */
@media (min-width:1440px){html{font-size:clamp(100%,1.1111vw,200%)}:where(button,input,select,textarea){font-size:.8333rem}}
body{margin:0;background:var(--papier-2);color:var(--inkt);font-family:"Tekst",system-ui,sans-serif;font-size:1.0625rem;line-height:1.6;font-weight:400}
img,video,svg{display:block;max-width:100%;height:auto}
[hidden]{display:none!important}
p,li,dd{hyphens:auto;overflow-wrap:break-word}
h1,h2,h3{font-family:"Display",system-ui,sans-serif;font-weight:800;line-height:1.02;letter-spacing:-.025em;margin:0;hyphens:manual;overflow-wrap:normal;text-wrap:balance}
h2{font-size:clamp(2.1rem,4.6vw,4.25rem)}
h3{font-size:1.45rem;letter-spacing:-.015em}
p{margin:0 0 1em}
a{color:inherit}
::selection{background:var(--rood);color:#fff}
:focus-visible{outline:2px solid var(--rood);outline-offset:3px}
a[href^=mailto],a[href^=tel]{hyphens:none;overflow-wrap:anywhere;white-space:nowrap}
.skip{position:absolute;left:-9999px}.skip:focus{left:1rem;top:1rem;z-index:99;background:var(--papier);padding:.5rem 1rem}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.klein{font-size:.82rem;color:var(--grijs)}

/* knoppen */
.knop{display:inline-flex;align-items:center;justify-content:center;gap:.5em;min-height:3rem;padding:.7rem 1.35rem;border-radius:var(--r);
  font:700 1rem/1.1 "Tekst",sans-serif;text-decoration:none;border:2px solid transparent;cursor:pointer;transition:background .2s,color .2s,border-color .2s,transform .2s}
.knop:active{transform:translateY(1px)}
.knop-rood{background:var(--rood);color:#fff}.knop-rood:hover{background:var(--rood-d)}
.knop-inkt{background:var(--inkt);color:#fff}.knop-inkt:hover{background:#000}
.knop-glas{background:rgba(255,255,255,.12);color:#fff;border-color:rgba(255,255,255,.55);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.knop-glas:hover{background:#fff;color:var(--inkt)}
.knop-lijn{border-color:var(--inkt);color:var(--inkt)}.knop-lijn:hover{background:var(--inkt);color:#fff}

/* kentekenplaat */
.plaat{display:inline-flex;align-items:stretch;height:1.85em;border-radius:.22em;background:var(--geel);box-shadow:inset 0 0 0 .09em #111;
  font:600 1rem/1 "Plaat","Arial Narrow",sans-serif;color:#111;overflow:hidden;white-space:nowrap;vertical-align:middle}
.plaat-nl{display:flex;align-items:flex-end;justify-content:center;width:1.3em;padding-bottom:.32em;background:var(--eu);color:#fff;font:600 .5em/1 "Tekst",sans-serif;letter-spacing:0;border-radius:.2em 0 0 .2em;margin:.09em 0 .09em .09em}
.plaat-k{display:flex;align-items:center;padding:0 .55em 0 .5em;font-size:1.32em;letter-spacing:.045em}
.plaat-groot{font-size:1.6rem}

/* prijs */
.prijs{display:flex;flex-wrap:wrap;align-items:baseline;gap:.15em .4em}
.prijs b{font:800 1.75rem/1 "Display",sans-serif;letter-spacing:-.02em}
.prijs small{font-size:.84rem;color:var(--grijs)}
.prijs-groot b{font-size:clamp(2.6rem,4.4vw,3.6rem)}
.prijs-op{font-weight:700}

/* kop */
.kop{position:fixed;inset:0 0 auto;z-index:40;height:var(--kop-h);display:flex;align-items:center;gap:1.5rem;padding:0 var(--g);
  color:#fff;background:rgba(20,20,20,.92);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:background .35s,box-shadow .35s}
.body-home .kop:not(.kop-vast){background:linear-gradient(rgba(0,0,0,.45),rgba(0,0,0,0));-webkit-backdrop-filter:none;backdrop-filter:none}
.logo{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:inherit;flex-shrink:0}
.logo-s{width:3.1rem;height:auto;color:var(--rood)}
.logo-w{font:300 .95rem/1 "Tekst",sans-serif;letter-spacing:.06em}.logo-w b{font-weight:800}
.kop-nav{display:flex;gap:1.6rem;margin-left:auto}
.kop-nav a{display:flex;align-items:center;min-height:2.75rem;text-decoration:none;font-weight:600;font-size:.98rem;padding:0;border-bottom:2px solid transparent}
.kop-nav a:hover,.kop-nav a[aria-current]{border-color:var(--rood)}
.kop-rechts{display:flex;align-items:center;gap:.9rem}
.klant{display:inline-flex;padding:.2rem;border-radius:calc(var(--r) + .2rem);background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22)}
.klant-knop{min-height:2.5rem;padding:0 .85rem;border:0;border-radius:var(--r);background:none;color:inherit;font:600 .92rem/1 "Tekst",sans-serif;cursor:pointer;opacity:.75}
.klant-knop[aria-pressed=true]{background:#fff;color:var(--inkt);opacity:1}
.kop-aanvraag{min-height:2.75rem;padding:.5rem 1.1rem}
.menu-knop{display:none;flex-shrink:0;width:2.9rem;height:2.9rem;border:0;border-radius:var(--r);background:rgba(255,255,255,.12);color:#fff;cursor:pointer;position:relative}
.menu-streep,.menu-streep::before,.menu-streep::after{position:absolute;left:.8rem;right:.8rem;height:2px;background:currentColor;transition:transform .3s,opacity .3s}
.menu-streep{top:50%}.menu-streep::before{content:"";left:0;right:0;top:-.42rem}.menu-streep::after{content:"";left:0;right:0;top:.42rem}
.menu-knop[aria-expanded=true] .menu-streep{background:transparent}
.menu-knop[aria-expanded=true] .menu-streep::before{transform:translateY(.42rem) rotate(45deg)}
.menu-knop[aria-expanded=true] .menu-streep::after{transform:translateY(-.42rem) rotate(-45deg)}
.lade{position:fixed;inset:var(--kop-h) 0 0;z-index:39;background:var(--inkt);color:#fff;padding:1.5rem var(--g) 2rem;overflow-y:auto;display:flex;flex-direction:column;gap:2rem}
.lade nav{display:flex;flex-direction:column}
.lade nav a{font:800 1.9rem/1.1 "Display",sans-serif;text-decoration:none;padding:.65rem 0;border-bottom:1px solid rgba(255,255,255,.12)}
.lade-voet p{margin:0 0 .5rem;opacity:.7;font-size:.9rem}
.lade-tel{display:inline-block;margin-top:1.4rem;font:800 1.6rem/1 "Display",sans-serif;color:var(--rood);text-decoration:none}
@media (max-width:68rem){.kop-nav{display:none}.kop-rechts{margin-left:auto}.menu-knop{display:block}}
@media (max-width:48rem){.kop .klant,.kop-aanvraag{display:none}.logo-w{font-size:.85rem}}
@media (max-width:22rem){.logo-w{display:none}}

/* opening: de S rijdt zichzelf, dan schuift het doek als een weg opzij */
.opening{position:fixed;inset:0;z-index:60;display:none;place-content:center;justify-items:center;gap:1.4rem;background:var(--inkt);color:#fff}
.js .opening{display:grid}
.opening-s{width:min(62vw,26rem);height:auto}
.om{fill:none;stroke:#fff;stroke-width:56;stroke-linecap:round;stroke-linejoin:round}
/* dashoffset wordt in site.js als attribuut geanimeerd: Chromium tekent CSS-animaties binnen <mask> niet opnieuw */
.opening-w{margin:0;font:300 clamp(1rem,2.4vw,1.4rem)/1 "Tekst",sans-serif;letter-spacing:.14em;opacity:0;transform:translateY(.5rem);transition:opacity .5s,transform .5s}
.opening-w b{font-weight:800}
.opening.woord .opening-w{opacity:1;transform:none}
.opening.weg{clip-path:inset(0 0 100% 0);transition:clip-path .9s cubic-bezier(.7,0,.2,1)}
.opening.klaar{display:none!important}

/* hero */
.hero{position:relative;height:100svh;min-height:32rem;max-height:62rem;color:#fff;overflow:hidden;background:#0d0e10}
.hero-beeld,.hero-poster,.hero-film{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:52% 60%}
.hero-film{opacity:0;transition:opacity .6s}
.hero.film-aan .hero-film{opacity:1}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(8,8,10,.86) 0%,rgba(8,8,10,.55) 32%,rgba(8,8,10,0) 62%),linear-gradient(to right,rgba(8,8,10,.45),rgba(8,8,10,0) 55%);pointer-events:none}
.hero-tekst{position:absolute;z-index:2;left:var(--g);right:var(--g);bottom:clamp(1.6rem,6vh,4.5rem)}
.hero h1{font-size:clamp(3.1rem,7.6vw,8.2rem);line-height:.92;letter-spacing:-.035em;max-width:14ch}
.h-regel{display:block}
.h-morgen{color:rgba(255,255,255,.3);transition:color 1.2s var(--ease)}
.hero.is-morgen .h-morgen,.no-film .h-morgen{color:var(--rood)}
.hero-datum{display:flex;align-items:center;gap:.8rem;margin:1.1rem 0 .7rem;font-weight:600;font-size:1.02rem}
.hero-datum [data-dag="1"]{opacity:.55;transition:opacity 1s}
.hero.is-morgen .hero-datum [data-dag="1"],.no-film .hero-datum [data-dag="1"]{opacity:1}
.hero-pijl{width:3.5rem;height:2px;background:linear-gradient(90deg,#fff 50%,rgba(255,255,255,.3) 50%);background-size:200% 100%;background-position:100% 0;transition:background-position 6s linear}
.hero.film-aan .hero-pijl,.no-film .hero-pijl{background-position:0 0}
.hero-sub{max-width:36rem;font-size:1.08rem;opacity:.92;margin-bottom:1.4rem}
.hero-knoppen{display:flex;flex-wrap:wrap;gap:.7rem}
.hero-opnieuw{position:absolute;z-index:3;right:var(--g);bottom:clamp(1.6rem,6vh,4.5rem);min-height:2.75rem;padding:0 1rem;border-radius:var(--r);border:1px solid rgba(255,255,255,.45);
  background:rgba(0,0,0,.3);color:#fff;font:600 .9rem "Tekst",sans-serif;cursor:pointer}
@media (max-width:48rem){.hero{max-height:none}.hero-beeld,.hero-poster,.hero-film{object-position:44% 60%}
  .hero::after{background:linear-gradient(to top,rgba(8,8,10,.9) 0%,rgba(8,8,10,.6) 45%,rgba(8,8,10,.1) 75%)}
  .hero-opnieuw{top:calc(var(--kop-h) + .75rem);bottom:auto}}
@media (max-height:30rem) and (orientation:landscape){.hero{min-height:100svh}.hero h1{font-size:clamp(2rem,6.5vw,3.4rem)}.hero-sub{display:none}.hero-datum{margin:.6rem 0}}

/* secties algemeen */
section{padding:clamp(4rem,9vw,8.5rem) var(--g)}
.sectie-kop{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:1rem 4rem;align-items:end;margin-bottom:clamp(2rem,4vw,3.5rem)}
.sectie-kop p{margin:0;max-width:38rem;color:#3d3a37}
@media (max-width:52rem){.sectie-kop{grid-template-columns:1fr}}

/* de weg */
.weg{background:var(--papier)}
.weg-intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1.2rem 5rem;margin-bottom:clamp(3rem,6vw,5.5rem)}
.weg-intro h2{grid-row:span 2;margin-bottom:.4rem}
.weg-intro p{max-width:40rem;margin:0}
.weg-baan{position:relative}
.weg-lijn{position:absolute;left:0;right:0;top:.4rem;width:100%;height:3.5rem;overflow:visible}
.weg-lijn path{fill:none;stroke:var(--rood);stroke-width:5;stroke-linecap:round;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 2.2s var(--ease)}
.weg-baan.zichtbaar .weg-lijn path,.no-js .weg-lijn path{stroke-dashoffset:0}
.stops{list-style:none;margin:0;padding:5.2rem 0 0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2.5rem}
.stop{position:relative}
.stop::before{content:"";position:absolute;top:-2.6rem;left:0;width:1.15rem;height:1.15rem;border-radius:50%;background:var(--papier);border:4px solid var(--inkt)}
.stop-wanneer{margin:0 0 .4rem;color:var(--rood);font-weight:800;font-size:1rem}
.stop h3{font-size:clamp(1.4rem,2vw,1.75rem);margin-bottom:.7rem}
.stop p:last-child{color:#3d3a37;margin:0}
@media (max-width:60rem){.weg-intro{grid-template-columns:1fr}.weg-intro h2{grid-row:auto}
  .weg-lijn{display:none}.stops{grid-template-columns:1fr 1fr;padding-top:0;gap:2.4rem 2rem}.stop{padding-top:2rem;border-top:4px solid var(--rood)}.stop::before{display:none}}
@media (max-width:34rem){.stops{grid-template-columns:1fr}}

/* auto's */
.terrein{background:var(--papier-2)}
.autos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1.5rem,2.6vw,2.6rem) clamp(1rem,2vw,2rem)}
.auto-link{display:block;text-decoration:none;color:inherit}
.auto-foto{position:relative;border-radius:var(--r);overflow:hidden;background:#ddd6cf}
.auto-foto img{width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform .6s var(--ease)}
.auto-link:hover .auto-foto img{transform:scale(1.035)}
.auto-n{position:absolute;right:.6rem;bottom:.6rem;padding:.2rem .5rem;border-radius:.25rem;background:rgba(0,0,0,.6);color:#fff;font-size:.78rem;font-weight:600}
.auto-tekst{padding-top:1rem}
.auto-tekst .plaat{font-size:.9rem;margin-bottom:.75rem}
.auto-tekst h3{font-size:1.6rem}
.auto-type{margin:.2rem 0 .15rem;color:var(--grijs);font-size:.95rem;line-height:1.35}
.auto-kenm{margin:0 0 .8rem;font-size:.92rem;color:#3d3a37}
.terrein-meer{margin:clamp(2rem,4vw,3.5rem) 0 0;text-align:center}
@media (max-width:64rem){.autos{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:40rem){.autos{grid-template-columns:1fr}
  .autos-home{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:1rem;margin:0 calc(-1 * var(--g));padding:0 var(--g) .5rem;scrollbar-width:none}
  .autos-home::-webkit-scrollbar{display:none}.autos-home .auto{flex:0 0 84%;scroll-snap-align:start}}

/* rekenaar (signatuur) */
.rekenaar{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:3rem clamp(3rem,7vw,7rem);align-items:center;background:var(--asfalt);color:#fff;position:relative;overflow:hidden}
.rek-links,.rek-rechts{position:relative}
.rek-links h2{margin-bottom:1.3rem}.rek-links p{max-width:34rem;opacity:.85}
.rek-keuze{display:block;margin:1.6rem 0 2rem}
.rek-keuze span{display:block;font-size:.9rem;opacity:.75;margin-bottom:.35rem}
.rek-keuze select,.veld select{width:100%;max-width:32rem;min-height:3rem;padding:.6rem 2.6rem .6rem .9rem;border-radius:var(--r);border:1px solid rgba(255,255,255,.3);
  background:var(--asfalt-2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23fff' stroke-width='2'/%3E%3C/svg%3E") no-repeat right 1rem center;
  color:#fff;font:600 1rem "Tekst",sans-serif;-webkit-appearance:none;appearance:none}
.rek-strook{position:relative;margin-top:2.2rem;padding-bottom:2rem;border-radius:var(--r)}
.rek-strook:has(:focus-visible){outline:2px solid var(--rood);outline-offset:6px}
.maanden{display:flex;gap:3px;height:4.2rem}
.maand{flex:1;border-radius:2px;background:var(--asfalt-2);transition:background .25s,transform .25s}
.maand.aan{background:var(--rood)}
.maand.aan:last-of-type,.maand.eind{transform:scaleY(1.12)}
.maand-min{position:relative}
.maanden-schuif{position:absolute;left:0;right:0;top:0;width:100%;height:4.2rem;margin:0;opacity:0;cursor:ew-resize;touch-action:pan-y}
.maanden-schaal{position:absolute;left:0;right:0;bottom:0;height:1.4rem;font:600 .88rem/1 "Plaat",sans-serif;opacity:.7}
.maanden-schaal span{position:absolute;left:calc((var(--m) - .5) / 24 * 100%);transform:translateX(-50%)}
.rek-looptijd{margin:0 0 1rem;font:800 clamp(2.4rem,4vw,3.4rem)/1 "Display",sans-serif;letter-spacing:-.03em}
.rek-looptijd span{font-weight:400;font-size:.55em;opacity:.8;letter-spacing:0}
.teller{display:flex;align-items:center;gap:1rem;margin-bottom:1.6rem}
.teller-cijfers{display:flex;gap:2px;padding:.3rem;border-radius:.3rem;background:#0b0b0c;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.tc{display:block;width:1.55rem;height:2.4rem;overflow:hidden;border-radius:2px;background:linear-gradient(#1f2024,#141518 50%,#1f2024)}
.tc-rol{display:flex;flex-direction:column;transform:translateY(calc(var(--n,0) * -2.4rem));transition:transform .7s var(--ease)}
.tc i{display:block;height:2.4rem;line-height:2.4rem;text-align:center;font:600 1.75rem/2.4rem "Plaat",sans-serif;font-style:normal;color:#f2f2f2}
.tc:last-child{background:linear-gradient(#f2f2f2,#d8d8d8 50%,#f2f2f2)}.tc:last-child i{color:#111}
.teller-km{font-size:.95rem;opacity:.8}
.rek-regels{margin:0 0 1rem}
.rek-regels div{display:flex;justify-content:space-between;gap:1rem;padding:.6rem 0;border-bottom:1px solid rgba(255,255,255,.14)}
.rek-regels dt{opacity:.8}.rek-regels dd{margin:0;font-weight:700;font-variant-numeric:tabular-nums}
.rek-totaal dd{font:800 1.9rem/1 "Display",sans-serif;color:#fff}
.rek-totaal{border-bottom:0!important;padding-top:1rem!important;align-items:baseline}
.rek-noot{font-size:.84rem;opacity:.7;margin-bottom:1.6rem}
@media (max-width:60rem){.rekenaar{grid-template-columns:1fr}.rekenaar::before{display:none}}
@media (max-width:30rem){.maanden{gap:2px;height:3.6rem}.maanden-schuif{height:3.6rem}.tc{width:1.35rem;height:2.1rem}.tc-rol{transform:translateY(calc(var(--n,0) * -2.1rem))}.tc i{height:2.1rem;font-size:1.5rem;line-height:2.1rem}}

/* inbegrepen */
.inbegrepen{background:var(--papier-2)}
.inbegrepen h2{font-size:clamp(2.3rem,5.4vw,5.2rem);max-width:18ch;margin-bottom:clamp(2.5rem,5vw,4.5rem)}
.inbegrepen h2 span{display:block;color:var(--grijs);font-weight:400;font-size:.52em;letter-spacing:-.01em;margin-top:.5rem}
.inb-tabel{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:2.5rem 6rem}
.inb-tabel h3{font-size:1.1rem;padding-bottom:.9rem;border-bottom:3px solid var(--inkt);margin-bottom:.4rem;letter-spacing:0}
.inb-niet h3{border-color:var(--lijn);color:var(--grijs)}
.inb-tabel ul{list-style:none;margin:0 0 1.2rem;padding:0}
.inb-tabel li{display:flex;gap:.9rem;align-items:baseline;padding:.85rem 0;border-bottom:1px solid var(--lijn);font-size:1.12rem}
.inb-wel li{font-weight:600}
.inb-wel li::before{content:"";flex:0 0 .85rem;height:.45rem;border-left:3px solid var(--rood);border-bottom:3px solid var(--rood);transform:rotate(-45deg) translateY(-.15rem)}
.inb-niet li{color:var(--grijs)}.inb-niet li::before{content:"";flex:0 0 .85rem;height:2px;background:var(--lijn);transform:translateY(-.3rem)}
.inb-niet p{color:var(--grijs);font-size:.95rem}
@media (max-width:52rem){.inb-tabel{grid-template-columns:1fr}}

/* bkr */
.bkr{background:var(--rood);color:#fff;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:2rem clamp(3rem,7vw,7rem);align-items:start}
.bkr h2{font-size:clamp(2.5rem,5.6vw,5.6rem);letter-spacing:-.035em}
.bkr ::selection{background:#fff;color:var(--rood)}
.bkr-lead{font:800 1.4rem/1.2 "Display",sans-serif}
.bkr-tekst p{max-width:36rem}
.bkr-drie{font-weight:700;padding-top:1rem;border-top:2px solid rgba(255,255,255,.4);margin:1.6rem 0 0}
@media (max-width:56rem){.bkr{grid-template-columns:1fr}}

/* zakelijk / privé */
.voorwie{background:var(--wit);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,.9fr);gap:0 clamp(2rem,4vw,4rem)}
.voorwie .sectie-kop{grid-column:1 / 3}
.wie{display:contents}
.wie-kol{padding-top:1.4rem;border-top:4px solid var(--inkt);transition:opacity .4s,border-color .4s}
.wie-kol h3{margin-bottom:1rem}
.wie-kol ul{padding-left:1.1rem;margin:0 0 1rem}.wie-kol li{margin-bottom:.4rem}.wie-kol li::marker{color:var(--rood)}
html:not([data-klant=prive]) .wie-kol[data-wie=zakelijk],html[data-klant=prive] .wie-kol[data-wie=prive]{border-color:var(--rood)}
html:not([data-klant=prive]) .wie-kol[data-wie=prive],html[data-klant=prive] .wie-kol[data-wie=zakelijk]{opacity:.55}
.wie-foto{grid-column:3;grid-row:1 / 3;align-self:stretch;border-radius:var(--r);overflow:hidden;min-height:22rem}
.wie-foto img{width:100%;height:100%;object-fit:cover;object-position:60% 50%}
@media (max-width:64rem){.voorwie{grid-template-columns:1fr 1fr}.voorwie .sectie-kop{grid-column:1 / -1}.wie-foto{grid-column:1 / -1;grid-row:auto;min-height:0;aspect-ratio:16/9;margin-top:2.5rem}}
@media (max-width:40rem){.voorwie{grid-template-columns:1fr;gap:2.4rem}.wie-foto{margin-top:0}}

/* aanvraag */
.aanvraag{background:var(--inkt);color:#fff;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:3rem clamp(3rem,7vw,7rem)}
.aanvraag h2{font-size:clamp(2rem,3.8vw,3.6rem)}
.aanv-of{margin:2rem 0 .2rem;opacity:.75}
.aanv-tel{display:inline-block;font:800 clamp(2.2rem,4.6vw,4.4rem)/1 "Display",sans-serif;letter-spacing:-.03em;color:var(--rood);text-decoration:none;margin-bottom:2rem}
.aanv-tel:hover{color:#fff}
.aanv-links p:last-child{opacity:.8;max-width:34rem}
.aanv-form{display:grid;grid-template-columns:1fr 1fr;gap:1rem 1.2rem;align-content:start}
.aanv-wie{grid-column:1 / -1;display:flex;gap:.5rem;border:0;padding:0;margin:0 0 .4rem}
.aanv-wie legend{float:left;margin-right:1rem;padding:.75rem 0;opacity:.75}
.aanv-wie label{display:flex;align-items:center;gap:.5rem;min-height:2.9rem;padding:0 1.1rem;border-radius:var(--r);border:1px solid rgba(255,255,255,.3);cursor:pointer;font-weight:600}
.aanv-wie label:has(:checked){background:#fff;color:var(--inkt);border-color:#fff}
.aanv-wie input{accent-color:var(--rood)}
.veld{display:block}.veld span{display:block;font-size:.88rem;color:#efe2d6;margin-bottom:.3rem}
.veld input{width:100%;min-height:3rem;padding:.6rem .85rem;border-radius:var(--r);border:1px solid rgba(255,255,255,.3);background:#202124;color:#fff;font:400 1rem "Tekst",sans-serif}
.veld input:focus,.veld select:focus{border-color:#fff;outline:none}
.veld select{max-width:none;background-color:#202124}
.veld:nth-of-type(4),.veld:nth-of-type(5){grid-column:auto}
.aanv-form .knop{grid-column:1 / -1;justify-self:start;margin-top:.6rem}
.aanv-melding{grid-column:1 / -1;margin:0;padding:1rem 1.1rem;border-radius:var(--r);background:#25262a;border-left:0}
@media (max-width:56rem){.aanvraag{grid-template-columns:1fr}}
@media (max-width:30rem){.aanv-form{grid-template-columns:1fr}.aanv-wie{flex-wrap:wrap}.aanv-wie legend{float:none;width:100%;padding:0 0 .3rem}}

/* voet */
.voet{background:#0c0c0d;color:#d8d3ce;padding:clamp(3rem,6vw,5rem) var(--g) 2rem;font-size:.95rem}
.voet-boven{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:2.5rem;padding-bottom:2.5rem;border-bottom:1px solid rgba(255,255,255,.12)}
.logo-voet{color:#fff;margin-bottom:1rem}.logo-voet .logo-s{width:4rem}
.voet-kop{color:#fff;font-weight:700;margin-bottom:.6rem}
.voet-tel{font:800 1.7rem/1 "Display",sans-serif;color:var(--rood);text-decoration:none}
.voet ul{list-style:none;padding:0;margin:0}.voet li{margin-bottom:.35rem}
.voet a{text-decoration-color:rgba(255,255,255,.3);text-underline-offset:.2em}
.voet-onder{display:flex;flex-wrap:wrap;gap:.4rem 2rem;padding-top:1.5rem;font-size:.84rem;opacity:.7}
.voet-onder p{margin:0}
@media (max-width:52rem){.voet-boven{grid-template-columns:1fr}}

/* paginakop (subpagina's) */
.pag-kop{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0;padding:0;background:var(--inkt);color:#fff;min-height:min(34rem,72svh)}
.pag-kop-tekst{display:flex;flex-direction:column;justify-content:flex-end;padding:calc(var(--kop-h) + 3rem) var(--g) clamp(2.5rem,5vw,4.5rem)}
.pag-kop h1{font-size:clamp(2.8rem,6.4vw,6.4rem);letter-spacing:-.035em;margin-bottom:1.2rem}
.pag-kop p{max-width:34rem;opacity:.88;font-size:1.1rem}
.pag-kop-beeld{position:relative;overflow:hidden}
.pag-kop-beeld img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.pag-kop-404{grid-template-columns:1fr}
@media (max-width:52rem){.pag-kop{grid-template-columns:1fr;min-height:0}.pag-kop-beeld{height:clamp(12rem,52vw,22rem)}.pag-kop-tekst{padding-bottom:2rem}}

/* aanbod */
.aanbod{padding-top:clamp(2rem,4vw,3.5rem)}
.filters{position:sticky;top:var(--kop-h);z-index:20;display:flex;flex-wrap:wrap;align-items:center;gap:.8rem 1.4rem;margin:0 calc(-1 * var(--g)) 1.2rem;padding:1rem var(--g);
  background:rgba(247,244,241,.95);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--lijn)}
.zoek-plaat{display:inline-flex;height:3rem;border-radius:.3rem;background:var(--geel);box-shadow:inset 0 0 0 2px #111;overflow:hidden}
.zoek-plaat .plaat-nl{width:1.6rem;font-size:.7rem;border-radius:.25rem 0 0 .25rem;padding-bottom:.45rem}
.zoek-plaat input{width:11.5rem;border:0;background:none;padding:0 .7rem;font:600 1.35rem/1 "Plaat",sans-serif;letter-spacing:.05em;text-transform:uppercase;color:#111}
.zoek-plaat input::placeholder{color:rgba(17,17,17,.45);text-transform:none;letter-spacing:.02em;font-size:1.1rem}
.zoek-plaat input:focus{outline:none}.zoek-plaat:focus-within{outline:2px solid var(--rood);outline-offset:2px}
.budget{display:flex;flex-direction:column;gap:.2rem;min-width:14rem;font-size:.9rem}
.budget b{font-weight:800}
.budget input{width:100%;accent-color:var(--rood);height:1.8rem}
.segs{display:flex;flex-wrap:wrap;gap:.3rem}
.seg{min-height:2.6rem;padding:0 .85rem;border:1px solid var(--lijn);border-radius:var(--r);background:#fff;font:600 .9rem "Tekst",sans-serif;color:var(--inkt);cursor:pointer}
.seg[aria-pressed=true]{background:var(--inkt);color:#fff;border-color:var(--inkt)}
.vink{display:flex;align-items:center;gap:.5rem;font-weight:600;font-size:.92rem;min-height:2.6rem;cursor:pointer}
.vink input{width:1.15rem;height:1.15rem;accent-color:var(--rood)}
.sorteer{display:flex;align-items:center;gap:.5rem;margin-left:auto;font-size:.9rem}
.sorteer select{height:2.75rem;min-height:2.75rem;border-radius:var(--r);border:1px solid var(--lijn);padding:0 .6rem;font:600 .9rem "Tekst",sans-serif;background:#fff;color:var(--inkt)}
.aanbod-telling{margin:0 0 1.5rem;color:var(--grijs)}.aanbod-telling b{color:var(--inkt)}
.aanbod-leeg{font-size:1.2rem;font-weight:600;padding:2rem 0}
.auto.weg-gefilterd{display:none}
@media (max-width:60rem){.filters{position:static;margin-bottom:1rem}.sorteer{margin-left:0}}
@media (max-width:40rem){.filters{gap:.8rem}.zoek-plaat{width:100%}.zoek-plaat input{width:100%}.budget{width:100%}
  .segs{flex-wrap:nowrap;overflow-x:auto;width:100%;scrollbar-width:none}.segs::-webkit-scrollbar{display:none}.seg{flex-shrink:0}}

/* detail */
.kruimel{padding:calc(var(--kop-h) + 1.4rem) var(--g) 0;font-size:.92rem;color:var(--grijs)}
.kruimel a{color:var(--inkt);font-weight:600}
.detail{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:2.5rem clamp(2rem,4.5vw,4.5rem);padding-top:1.4rem;align-items:start}
.galerij{min-width:0}
.dias{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;list-style:none;margin:0;padding:0;border-radius:var(--r);scrollbar-width:none;background:#ddd6cf}
.dias::-webkit-scrollbar{display:none}
.dia{flex:0 0 100%;scroll-snap-align:start}
.dia img{width:100%;aspect-ratio:4/3;object-fit:cover}
.gal-knoppen{display:flex;align-items:center;justify-content:space-between;margin:.7rem 0}
.gal-knoppen button{width:2.9rem;height:2.9rem;border-radius:50%;border:1px solid var(--lijn);background:#fff;font-size:1.5rem;line-height:1;cursor:pointer;color:var(--inkt)}
.gal-teller{font:600 1rem "Plaat",sans-serif;letter-spacing:.05em}
.duimen{display:grid;grid-template-columns:repeat(auto-fill,minmax(5.5rem,1fr));gap:.4rem}
.dum{padding:0;border:2px solid transparent;border-radius:.25rem;overflow:hidden;cursor:pointer;background:none;opacity:.7}
.dum[aria-current=true]{border-color:var(--rood);opacity:1}
.dum img{width:100%;aspect-ratio:4/3;object-fit:cover}
.detail-info{position:sticky;top:calc(var(--kop-h) + 1.5rem)}
.detail-info h1{font-size:clamp(2.4rem,4.2vw,4rem);margin:1rem 0 .3rem;letter-spacing:-.035em}
.detail-type{font-size:1.1rem;margin:0 0 .3rem;color:#3d3a37}
.detail-kenm{color:var(--grijs);margin-bottom:1.4rem}
.detail-info .prijs{margin-bottom:.8rem}
.detail-in{font-size:.95rem;color:#3d3a37;max-width:32rem}
.detail-knoppen{display:flex;flex-wrap:wrap;gap:.6rem;margin:1.4rem 0 1.8rem}
.rdw{padding:1.2rem 1.3rem;border-radius:var(--r);background:#fff;border:1px solid var(--lijn)}
.rdw-kop{display:flex;align-items:center;gap:.5rem;margin:0 0 .7rem;font-weight:800}
.rdw-kop::before{content:"";width:.6rem;height:.6rem;border-radius:50%;background:#bbb}
.rdw.klaar .rdw-kop::before{background:#1f9d55;box-shadow:0 0 0 4px rgba(31,157,85,.18)}
.rdw dl{margin:0;display:grid;grid-template-columns:1fr 1fr;gap:.7rem 1.2rem}
.rdw dt{font-size:.8rem;color:var(--grijs)}.rdw dd{margin:0;font-weight:700}
.rdw-laden,.rdw-bron{font-size:.84rem;color:var(--grijs);margin:0}
.rdw-bron{margin-top:.9rem}
.detail-meer{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:3rem clamp(2rem,5vw,5rem);background:var(--wit)}
.detail-meer h2{font-size:clamp(1.8rem,3vw,2.6rem);margin-bottom:1.4rem}
.detail-tekst p{max-width:44rem}
.spec{margin:0}.spec div{display:flex;justify-content:space-between;gap:1rem;padding:.6rem 0;border-bottom:1px solid var(--lijn)}
.spec dt{color:var(--grijs)}.spec dd{margin:0;font-weight:700;text-align:right}
.opties{margin-top:1.6rem}
.opties summary{cursor:pointer;font-weight:700;min-height:2.75rem;display:flex;align-items:center}
.opties ul{columns:2;column-gap:1.5rem;padding-left:1.1rem;font-size:.92rem}
.opties li{break-inside:avoid;margin-bottom:.25rem}
.terrein-ook{padding-top:clamp(3rem,6vw,5rem)}
@media (max-width:60rem){.detail{grid-template-columns:1fr}.detail-info{position:static}.detail-meer{grid-template-columns:1fr}}
@media (max-width:40rem){.duimen{display:flex;overflow-x:auto;scrollbar-width:none;gap:.35rem}.duimen::-webkit-scrollbar{display:none}.dum{flex:0 0 4.6rem}}
@media (max-width:30rem){.opties ul{columns:1}.rdw dl{grid-template-columns:1fr}}

/* faq */
.faqs{max-width:none;display:grid;grid-template-columns:minmax(0,1fr);padding-inline:var(--g)}
.faq{border-bottom:1px solid var(--lijn);max-width:60rem}
.faq summary{list-style:none;display:flex;justify-content:space-between;gap:1.5rem;align-items:center;padding:1.4rem 0;cursor:pointer;
  font:700 clamp(1.25rem,2.2vw,1.7rem)/1.2 "Display",sans-serif;letter-spacing:-.015em}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex:0 0 1rem;height:1rem;background:linear-gradient(var(--rood),var(--rood)) center/100% 3px no-repeat,linear-gradient(var(--rood),var(--rood)) center/3px 100% no-repeat;transition:transform .3s}
.faq[open] summary::after{transform:rotate(45deg)}
.faq-a{padding:0 0 1.4rem;max-width:44rem}
.faq-a p{margin-bottom:.4rem}
.faq-lijst{margin:0 0 .8rem;padding-left:1.1rem}.faq-lijst li::marker{color:var(--rood)}
.faq-bel{margin-top:2.5rem;font-size:1.2rem;font-weight:600}.faq-bel a{color:var(--rood)}

/* onthullen */
.js .inloop{opacity:0;transform:translateY(1.4rem);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.js .inloop.zichtbaar{opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .js .inloop{opacity:1;transform:none}}
html:not(.js) .h-morgen{color:var(--rood)}

/* tikdoelen >= 40px */
.logo{min-height:2.75rem}
.voet-tel,.faq-bel a,.kruimel a,.voet li a{display:inline-flex;align-items:center;min-height:2.6rem}
.aanv-wie label{position:relative}
.aanv-wie input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.aanv-wie label::before{content:"";width:.95rem;height:.95rem;border-radius:50%;border:2px solid currentColor;box-sizing:border-box}
.aanv-wie label:has(:checked)::before{border:5px solid var(--rood)}
.aanv-wie label:has(:focus-visible){outline:2px solid var(--rood);outline-offset:3px}
.vink{position:relative;min-height:2.75rem}
.vink input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.vink::before{content:"";width:1.2rem;height:1.2rem;border-radius:.2rem;border:2px solid var(--inkt);box-sizing:border-box;background:#fff}
.vink:has(:checked)::before{background:var(--rood) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='10'%3E%3Cpath d='M1 5l3.5 3.5L11 1' fill='none' stroke='%23fff' stroke-width='2.4'/%3E%3C/svg%3E") center/70% no-repeat;border-color:var(--rood)}
.vink:has(:focus-visible){outline:2px solid var(--rood);outline-offset:3px}
.budget{min-width:17.5rem}.budget input{height:2.6rem}
.aanv-tel{min-height:2.75rem;line-height:1.25}
.budget input{margin:0}
@media (max-width:40rem){.hero h1{font-size:clamp(2.2rem,11.5vw,3.6rem)}
  .hero-datum{gap:.5rem;font-size:.9rem;white-space:nowrap}.hero-pijl{width:1.6rem;flex-shrink:0}}