/* SETVISION — website (stijl afgestemd op de oorspronkelijke site) */
:root{
  --zwart:#000; --zwart2:#0b0c0e; --wit:#fff; --licht:#f4f4f2;
  --lijn:rgba(255,255,255,.28); --lijnD:rgba(0,0,0,.14);
  --tx2:rgba(255,255,255,.78); --tx2D:#3d3d3d;
  --r:23px; --max:100%; --gut:max(16px,6vw);
  --helv:Helvetica,"Helvetica Neue",Arial,sans-serif;
  --grot:"Space Grotesk","Helvetica Neue",Arial,sans-serif;
  color-scheme:dark;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--zwart);color:var(--wit);font:400 17px/1.55 var(--helv);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,video{max-width:100%;display:block}
a{color:inherit}
b,strong{font-weight:700}
.wrap{max-width:var(--max);margin:0 auto;padding-left:var(--gut);padding-right:var(--gut)}
.smal{max-width:1500px}

/* ── kop ── */
.kop{position:fixed;top:0;left:0;right:0;z-index:50;transition:background .35s,padding .35s}
.kop .wrap{display:flex;align-items:flex-start;justify-content:space-between;height:104px;padding-top:26px;transition:height .35s,padding .35s}
.kop .menu{padding-top:12px;transition:padding .35s}
.kop.vast{background:rgba(0,0,0,.92)}
.kop.vast .wrap{height:64px;padding-top:18px}.kop.vast .menu{padding-top:2px}
.logo{display:inline-flex;align-items:center;text-decoration:none}
.logo img{height:34px;width:auto;transition:height .35s}
.logo .ster{margin-left:10px;transform-origin:50% 50%}
.logo .ster.draai{animation:sterdraai .9s cubic-bezier(.3,.1,.2,1)}
@keyframes sterdraai{to{transform:rotate(360deg)}}
.kop.vast .logo img{height:26px}
.menu{display:flex;gap:30px;list-style:none;align-items:center}
.menu a{text-decoration:none;font-size:16px;position:relative;padding:4px 0}
.menu a::after{content:"";position:absolute;left:0;right:100%;bottom:-2px;height:1px;background:#fff;transition:right .3s}
.menu a:hover::after,.menu a[aria-current]::after{right:0}
.menuknop{display:none;background:none;border:0;cursor:pointer;width:32px;height:24px;position:relative}
.menuknop span,.menuknop::before,.menuknop::after{content:"";position:absolute;left:0;right:0;height:2px;background:#fff;transition:transform .3s,opacity .3s}
.menuknop::before{top:2px}.menuknop span{top:11px}.menuknop::after{top:20px}
.menuknop[aria-expanded=true]::before{transform:translateY(9px) rotate(45deg)}
.menuknop[aria-expanded=true] span{opacity:0}
.menuknop[aria-expanded=true]::after{transform:translateY(-9px) rotate(-45deg)}
@media(max-width:860px){
  .menuknop{display:block}
  .menu{position:fixed;inset:0;z-index:-1;flex-direction:column;justify-content:flex-start;align-items:flex-end;text-align:right;gap:18px;padding:100px var(--gut) 40px;background:#000;opacity:0;pointer-events:none;transition:opacity .35s}
  .menu.open{opacity:1;pointer-events:auto}
  .menu a{font-size:32px;font-weight:300}
}

/* ── held (beeldvullend, film of foto) ── */
.held{position:relative;min-height:100svh;display:flex;align-items:center;overflow:hidden;background:#000}
.held.kort{min-height:82svh}
.held.laag{min-height:66svh}
.held.zwart.laag{min-height:58svh}.held.laag .wrap{padding-top:120px}
.held .bg,.held video{max-width:none;position:absolute;inset:-4%;width:108%;height:108%;object-fit:cover;object-position:50% 30%;background-size:cover;background-position:50% 30%;will-change:transform;transform:translateZ(0)}
.held .bg.wazig{inset:-6%;width:112%;height:112%}
.held .bg,.held video{z-index:0}
.held::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(0,0,0,.30),rgba(0,0,0,.12) 40%,rgba(0,0,0,.45))}
.held .wrap{position:relative;z-index:2;transform:translateZ(0);width:100%;padding-top:90px;padding-bottom:60px}
h1{font-weight:300;font-size:clamp(44px,6.4vw,82px);line-height:1.04;letter-spacing:-.02em;text-wrap:balance}
h1 strong,h1 b{font-weight:400}
.held .lead{margin-top:clamp(28px,4vw,52px);max-width:820px;font:400 clamp(14px,1.05vw,16px)/1.65 var(--grot);letter-spacing:.07em;text-transform:uppercase}
/* Netflix-logo: alleen het bovenste deel van het bestand (N + FILMS) tonen */
.held .netflix{display:block;width:clamp(120px,11.5vw,166px);aspect-ratio:166/56;overflow:hidden;margin-bottom:clamp(26px,3vw,44px)}
.held .netflix img{width:100%;height:auto;display:block}
.held.zwart{background:#000}.held.zwart::after{display:none}
.scrollpijl{position:fixed;z-index:55;left:50%;bottom:calc(max(20px,env(safe-area-inset-bottom,0px)) + 4px);transition:opacity .4s,transform .4s;width:26px;height:42px;border:1.5px solid rgba(255,255,255,.7);border-radius:14px;transform:translateX(-50%)}
.scrollpijl::after{content:"";position:absolute;left:50%;top:8px;width:3px;height:8px;margin-left:-1.5px;border-radius:2px;background:#fff;animation:scrol 1.8s infinite}
@keyframes scrol{0%{opacity:0;transform:translateY(0)}30%{opacity:1}100%{opacity:0;transform:translateY(14px)}}

/* ── secties ── */
.blok{padding:clamp(70px,9vw,120px) 0;position:relative}
.blok.licht{background:var(--wit);color:#111}
.blok.grijs{background:var(--licht);color:#111}
/* de lijn met het korte witte streepje bovenaan elke sectie */
.streep{position:relative;height:1px;background:var(--lijn);margin-bottom:22px}
.streep::before{content:"";position:absolute;left:0;top:-1px;height:3px;width:56px;background:#fff;transform-origin:left;transition:transform 1.1s cubic-bezier(.2,.7,.2,1)}
.licht .streep,.grijs .streep{background:var(--lijnD)}
.licht .streep::before,.grijs .streep::before{background:#111}
.js .streep{transform-origin:left;transform:scaleX(0);transition:transform 1.4s cubic-bezier(.2,.7,.2,1)}
.js .streep.zien{transform:none}
.label{font:400 clamp(14px,1.2vw,17px)/1.3 var(--grot);letter-spacing:.1em;text-transform:uppercase;margin-bottom:clamp(20px,3vw,34px)}
.label b{font-weight:700}
h2{font-weight:300;font-size:clamp(38px,5.6vw,74px);line-height:1.06;letter-spacing:-.02em;margin-bottom:clamp(30px,5vw,60px);text-wrap:balance}
h2.mid{font-size:clamp(32px,4.2vw,53px)}
h2 b{font-weight:700}
h3{font-weight:700;font-size:clamp(26px,2.8vw,36px);line-height:1.15;letter-spacing:-.01em;margin-bottom:8px}
h3+.sub{font-weight:700;font-size:16px;margin-bottom:22px}
p+p{margin-top:18px}
.intro{font-weight:400}
.zacht{color:var(--tx2)}
.licht .zacht,.grijs .zacht{color:var(--tx2D)}

.twee{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:clamp(30px,6vw,90px);align-items:center}
.twee.gelijk{grid-template-columns:1fr 1fr}
.twee.boven{align-items:start}
@media(max-width:860px){.twee,.twee.gelijk{grid-template-columns:1fr}}

/* foto's: ronde hoeken, zoom bij hover */
.foto{border-radius:var(--r);overflow:hidden;position:relative;background:#111}
.foto img,.foto video{width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.foto:hover img{transform:scale(1.04)}
.foto.rand-r{border-radius:20px 0 0 20px;margin-right:calc(var(--gut)*-1)}
.foto.rand-l{border-radius:0 20px 20px 0;margin-left:calc(var(--gut)*-1)}
@media(max-width:860px){.foto.rand-r,.foto.rand-l{margin:0;border-radius:var(--r)}}
.ratio{aspect-ratio:16/10}
.breed{aspect-ratio:2/1}

/* volle breedte film */
.filmband{position:relative;height:clamp(320px,62vh,640px);overflow:hidden}
.filmband video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* opsomming met ronde iconen en lijnen */
.punten{list-style:none;max-width:640px}
.punten li{display:grid;grid-template-columns:28px 1fr;gap:18px;align-items:start;padding:22px 0;border-top:1px solid var(--lijn);font:400 17px/1.55 var(--grot)}
.punten li:last-child{border-bottom:1px solid var(--lijn)}
.punten .ic{width:26px;height:26px;border-radius:50%;background:#fff;color:#000;display:flex;align-items:center;justify-content:center;margin-top:1px}
.punten .ic svg{width:15px;height:15px;fill:none;stroke:#000;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.punten b{font-weight:700}

/* gewone opsomming met bolletjes */
.bol{margin:18px 0 0 22px}
.bol li{padding:3px 0}
.bol li::marker{font-size:.9em}

/* producties / logo-strook */
.credits{display:flex;flex-wrap:wrap;align-items:center;gap:20px 46px;margin-top:40px;padding-top:28px;border-top:1px solid var(--lijn)}
.credits img{height:34px;width:auto;opacity:.95}
.credits span{font:500 15px/1.4 var(--grot);letter-spacing:.04em}
.credits span small{display:block;font-weight:400;opacity:.65;font-size:13px}

/* resultaat-galerij: zoals het origineel — volle breedte, rijen staand+liggend die elkaar afwisselen */
.mozaiek{display:flex;flex-direction:column;gap:25px;margin-top:10px}
.mrij{display:grid;grid-template-columns:1fr 2fr;gap:25px}.mrij.om{grid-template-columns:2fr 1fr}
.mozaiek button{all:unset;cursor:zoom-in;position:relative;border-radius:var(--r);overflow:hidden;background:#111;height:40vw;max-height:820px}
.mozaiek img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.2,.7,.2,1),filter .5s}
.mozaiek button:hover img{transform:scale(1.04);filter:brightness(1.08)}
.mozaiek button:focus{outline:none}
.mozaiek .bijschrift{position:absolute;left:20px;bottom:18px;right:20px;font:500 13px/1.3 var(--grot);letter-spacing:.06em;text-transform:uppercase;opacity:0;transform:translateY(8px);transition:opacity .4s,transform .4s;text-shadow:0 1px 8px rgba(0,0,0,.7)}
.mozaiek button:hover .bijschrift{opacity:1;transform:none}
@media(max-width:860px){.mozaiek,.mrij{gap:12px}.mrij,.mrij.om{grid-template-columns:1fr 1.6fr}.mrij.om{grid-template-columns:1.6fr 1fr}.mozaiek button{height:58vw}}

/* lightbox */
.lb{position:fixed;inset:0;z-index:100;background:rgba(0,0,0,.94);display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .35s}
.lb.open{opacity:1;pointer-events:auto}
.lb img{max-width:92vw;max-height:86vh;border-radius:14px;transform:scale(.96);transition:transform .35s}
.lb.open img{transform:none}
.lb button{position:absolute;background:none;border:0;outline:none;color:#fff;cursor:pointer;width:48px;height:48px;padding:12px;opacity:.75;-webkit-tap-highlight-color:transparent}
.lb button svg{width:24px;height:24px;display:block;stroke:#fff;stroke-width:1.6;fill:none;stroke-linecap:round}
.lb button:hover{opacity:1}
.lb .sluit{top:14px;right:14px}.lb .vorige{left:10px;top:50%;margin-top:-24px}.lb .volgende{right:10px;top:50%;margin-top:-24px}
.lb .lbtekst{position:absolute;bottom:22px;left:0;right:0;text-align:center;font:500 13px var(--grot);letter-spacing:.08em;text-transform:uppercase;opacity:.8}

/* kaarten (workflow, licht) */
.kaarten{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,34px);align-items:start}
.kaarten .kaart:nth-child(2){margin-top:clamp(0px,8vw,110px)}
.kaart{background:#fff;color:#111;border-radius:14px;box-shadow:0 10px 40px rgba(0,0,0,.08),0 1px 3px rgba(0,0,0,.06);overflow:hidden;transition:transform .5s cubic-bezier(.2,.7,.2,1),box-shadow .5s}
.kaart:hover{transform:translateY(-6px);box-shadow:0 22px 60px rgba(0,0,0,.13),0 1px 3px rgba(0,0,0,.06)}
.kaart .in-k{padding:clamp(24px,3vw,36px)}
.kaart .label{font-size:14px;margin-bottom:14px;padding-bottom:16px;border-bottom:1px solid var(--lijnD)}
.kaart p{font-size:15.5px}
.kaart .foto{border-radius:0 0 14px 14px;aspect-ratio:16/10}
@media(max-width:860px){.kaarten{grid-template-columns:1fr}.kaarten .kaart:nth-child(2){margin-top:0}}

/* specs (set case) */
.spec{display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(30px,6vw,90px);align-items:center;padding:clamp(50px,7vw,90px) 0;border-top:1px solid var(--lijn)}
.spec.om .tekst{order:2}
.spec .foto{aspect-ratio:16/10}
@media(max-width:860px){.spec{grid-template-columns:1fr}.spec.om .tekst{order:0}}
.feiten{display:grid;gap:18px;font-size:15px}
.feiten dt{font-weight:700}
.feiten dd{margin-top:2px}

/* knoppen */
.knop{display:inline-flex;align-items:center;gap:10px;margin-top:34px;padding:14px 26px;border-radius:999px;background:#fff;color:#000;text-decoration:none;font:500 15px var(--grot);letter-spacing:.02em;border:0;cursor:pointer;transition:transform .25s,background .25s}
.knop:hover{transform:translateY(-2px);background:#e8e8e8}
.knop .pijl{transition:transform .25s}
.knop:hover .pijl{transform:translateX(4px)}
.knop.donker{background:#000;color:#fff}.knop.donker:hover{background:#222}
.knop.rand{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.6)}.knop.rand:hover{background:#fff;color:#000}

/* afsluiter */
.cta{text-align:center}
.cta h2{margin-left:auto;margin-right:auto;max-width:900px;margin-bottom:22px}
.cta p{max-width:640px;margin:0 auto}

/* verhuur */
.strook{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:clamp(40px,6vw,70px)}
.strook .foto{aspect-ratio:4/3}
@media(max-width:860px){.strook{grid-template-columns:1fr 1fr}}

/* formulier */
form.contact{display:grid;grid-template-columns:1fr 1fr;gap:20px}
form.contact .vol{grid-column:1/-1}
form.contact label{display:block;font:500 13px var(--grot);letter-spacing:.08em;text-transform:uppercase;margin-bottom:8px}
form.contact input,form.contact textarea{width:100%;background:transparent;border:0;border-bottom:1px solid var(--lijn);color:#fff;font:400 17px var(--helv);padding:10px 0;transition:border-color .25s}
form.contact input:focus,form.contact textarea:focus{outline:none;border-color:#fff}
form.contact textarea{min-height:140px;resize:vertical}
form.contact .hp{position:absolute;left:-9999px}
@media(max-width:620px){form.contact{grid-template-columns:1fr}}
.melding{padding:16px 20px;border:1px solid #fff;border-radius:12px;margin-bottom:24px}

/* voorwaarden */
.tekst-lang{max-width:780px}
.tekst-lang h3{font-size:20px;margin:42px 0 12px}
.tekst-lang p{font-size:16px;color:var(--tx2)}

/* voet */
footer{background:#fff;color:#111;border-top:0;padding:70px 0 40px;font:400 14px/1.7 var(--helv)}
footer .wrap{display:grid;grid-template-columns:1.4fr repeat(4,1fr);gap:30px}
footer h4{font:500 14px var(--grot);letter-spacing:.1em;text-transform:uppercase;margin-bottom:14px}
footer ul{list-style:none}
footer a{text-decoration:none;opacity:.8;transition:opacity .2s}footer a:hover{opacity:1;text-decoration:underline}
footer .logo img{height:26px;filter:invert(1)}
footer .logo .ster{margin-left:8px}
footer .klein{grid-column:1/-1;margin-top:30px;font-size:12px;opacity:.6}
@media(max-width:860px){footer .wrap{grid-template-columns:1fr 1fr}footer .wrap>div:first-child{grid-column:1/-1}}

/* WhatsApp-chatknop */
.wa{position:fixed;right:max(20px,env(safe-area-inset-right,0px));bottom:max(20px,env(safe-area-inset-bottom,0px));z-index:60;display:flex;align-items:center;gap:10px;padding:12px 20px 12px 14px;border-radius:999px;background:rgba(34,34,34,.96);color:#fff;text-decoration:none;font:500 15px var(--grot);box-shadow:0 6px 24px rgba(0,0,0,.35);transition:transform .25s,background .25s}
.wa:hover{transform:translateY(-3px);background:#25d366}
.wa svg{width:24px;height:24px;fill:#fff}

/* rustig binnenkomen bij scrollen */
.js .in{opacity:0;transform:translateY(34px);transition:opacity 1s cubic-bezier(.2,.7,.2,1),transform 1s cubic-bezier(.2,.7,.2,1)}
.js .in.zien{opacity:1;transform:none}
.js .in.d1{transition-delay:.12s}.js .in.d2{transition-delay:.24s}.js .in.d3{transition-delay:.36s}
.held .opkomst{opacity:0;transform:translateY(30px);animation:op 1.2s cubic-bezier(.2,.7,.2,1) forwards}
.held .opkomst.d1{animation-delay:.15s}.held .opkomst.d2{animation-delay:.35s}.held .opkomst.d3{animation-delay:.55s}
@keyframes op{to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){
  .js .in,.held .opkomst{opacity:1!important;transform:none!important;animation:none!important}
  .js .streep{transform:none}
  .scrollpijl::after{animation:none}
}
/* alleen voor testschermafbeeldingen (?shot=1) */
.shot .held{min-height:900px!important}.shot .held.kort{min-height:740px!important}.shot .held.laag{min-height:600px!important}

/* taalkeuze */
.menu .taal a{font:500 14px var(--grot);letter-spacing:.06em;opacity:.75}
.menu .taal a::after{display:none}
.menu .taal .aan{font-weight:700;opacity:1}
.menu .taal a:hover{opacity:1}

/* set case — opbouw zoals het origineel */
.breedbeeld{aspect-ratio:1350/500;max-width:100%}
.opdracht{font-family:"Wix Madefor Display","Helvetica Neue",Arial,sans-serif;font-size:clamp(34px,3.6vw,52px)!important}
.madefor,.spec2 .tekst{font-family:"Wix Madefor Text","Helvetica Neue",Arial,sans-serif}
.specs{border-top:1px solid var(--lijn)}
.spec2{display:grid;grid-template-columns:1fr 1fr;align-items:center;border-bottom:1px solid var(--lijn);padding:45px 0}
.spec2 .tekst{padding:0 6vw;font-size:15px}
.spec2 .tekst p{color:var(--tx2)}
.spec2 h3{font-family:"Wix Madefor Display","Helvetica Neue",Arial,sans-serif;font-weight:700;font-size:clamp(26px,2.5vw,36px);margin-bottom:6px}
.spec2 .sub{font-weight:700;font-size:15px;margin-bottom:22px}
.spec2 .foto{height:clamp(260px,34.7vw,560px);border-radius:20px 0 0 20px}
.spec2.fl .foto{order:-1;border-radius:0 20px 20px 0}
@media(max-width:860px){.spec2{grid-template-columns:1fr;gap:26px}.spec2 .foto,.spec2.fl .foto{order:-1;border-radius:0;height:62vw}.spec2 .tekst{padding:0 var(--gut)}}

/* contact: wit blok met formulier zoals het origineel */
.contactblok .label{margin-bottom:14px}
.contactblok p{margin-top:6px}
.contactblok a{color:#111}
form.contact label{color:inherit}
.licht form.contact label{font:400 15px var(--helv);letter-spacing:0;text-transform:none;color:#333}
.licht form.contact input,.licht form.contact textarea{border:1px solid #bdbdbd;border-radius:6px;padding:12px 14px;color:#111;background:#fff}
.licht form.contact input:focus,.licht form.contact textarea:focus{border-color:#111}
.licht .melding{border-color:#111}

/* foto-vergroter: kleinere sluitknop, geen blauwe focusrand bij muisklik */
.lb button:focus,.lb button:focus-visible{outline:none;box-shadow:none}

/* afsluiter: kaart met setfoto */
.ctakaart{position:relative;border-radius:var(--r);overflow:hidden;min-height:clamp(420px,42vw,560px);display:flex;align-items:flex-end;background:#111;color:#fff;text-align:left}
.ctabg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.6s cubic-bezier(.2,.7,.2,1)}
.ctakaart:hover .ctabg{transform:scale(1.04)}
.ctakaart::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.86) 0%,rgba(0,0,0,.62) 42%,rgba(0,0,0,.08) 85%),linear-gradient(0deg,rgba(0,0,0,.45),transparent 50%)}
.ctatekst{position:relative;z-index:1;max-width:640px;padding:clamp(28px,5vw,64px)}
.ctatekst .label{margin-bottom:16px}
.cta .ctatekst h2{margin:0 0 18px;max-width:none}
.cta .ctatekst p{margin:0;max-width:520px;color:rgba(255,255,255,.85)}
.ctaknoppen{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.ctaknoppen .knop{margin-top:0}
.ctadirect{position:absolute;z-index:1;right:clamp(20px,3vw,40px);bottom:clamp(20px,3vw,36px);display:flex;flex-direction:column;align-items:flex-end;gap:4px;font:400 14px var(--grot);letter-spacing:.04em}
.ctadirect a{text-decoration:none;opacity:.85}.ctadirect a:hover{opacity:1;text-decoration:underline}
@media(max-width:860px){.ctakaart{flex-direction:column;align-items:stretch;justify-content:flex-end}.ctakaart::after{background:linear-gradient(0deg,rgba(0,0,0,.9) 0%,rgba(0,0,0,.55) 60%,rgba(0,0,0,.2))}.ctadirect{position:relative;right:auto;bottom:auto;align-items:flex-start;padding:0 clamp(28px,5vw,64px) 28px}}

/* verhuur: wat je huurt, stappen, werkgebied, veelgestelde vragen */
.huurkaarten{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:clamp(30px,4vw,50px)}
.huurkaart{background:#fff;border-radius:14px;padding:26px 24px;box-shadow:0 6px 24px rgba(0,0,0,.05);transition:transform .4s,box-shadow .4s}
.huurkaart:hover{transform:translateY(-4px);box-shadow:0 14px 40px rgba(0,0,0,.09)}
.huurkaart h3{font-size:19px;margin:16px 0 6px}
.huurkaart p{font-size:15px;color:var(--tx2D)}
.hic{display:inline-flex;width:44px;height:44px;border-radius:50%;background:#111;align-items:center;justify-content:center}
.hic svg{width:22px;height:22px;fill:none;stroke:#fff;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:960px){.huurkaarten{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.huurkaarten{grid-template-columns:1fr}}
.stappen{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,40px);counter-reset:none}
.stappen li{border-top:1px solid var(--lijnD);padding-top:22px}
.stappen .nr{display:inline-flex;width:38px;height:38px;border-radius:50%;border:1px solid #111;align-items:center;justify-content:center;font:500 16px var(--grot)}
.stappen h3{font-size:21px;margin:16px 0 8px}
.stappen p{color:var(--tx2D);font-size:15.5px}
@media(max-width:860px){.stappen{grid-template-columns:1fr}}
.werkgebied{margin-top:clamp(40px,5vw,64px);padding:26px 30px;border-radius:14px;background:var(--licht);max-width:880px}
.werkgebied .label{margin-bottom:8px}
.faq{max-width:900px;border-top:1px solid var(--lijnD)}
.faq details{border-bottom:1px solid var(--lijnD)}
.faq summary{cursor:pointer;list-style:none;padding:22px 40px 22px 0;font-size:18px;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:6px;top:50%;transform:translateY(-50%);font:300 26px var(--helv);transition:transform .3s}
.faq details[open] summary::after{transform:translateY(-50%) rotate(45deg)}
.faq details p{padding:0 40px 22px 0;color:var(--tx2D)}
.filmlink{margin-top:30px;font-size:15px}.filmlink a{color:inherit}

/* scroll-knopje verdwijnt zodra er gescrold is */
.gescrold .scrollpijl{opacity:0;transform:translate(-50%,10px);pointer-events:none}

/* stockfoto's: één kleurbewerking zodat ze als serie ogen en passen bij de setfoto's */
img[src*="pexels-"],img[src*="adobe-"],.bg[style*="pexels-"]{filter:saturate(.72) contrast(1.06) brightness(.96) sepia(.08)}
.strook.drie{grid-template-columns:repeat(3,1fr)}
.strook.drie .foto{aspect-ratio:4/5}
@media(max-width:860px){.strook.drie{grid-template-columns:1fr 1fr}}
.held .bg[style*="pexels-"]{filter:saturate(.65) brightness(.5) contrast(1.08)}
.stadlinks{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}.stadlinks a{display:inline-block;padding:8px 14px;border:1px solid #111;border-radius:999px;font:500 14px var(--grot);text-decoration:none;color:#111}.stadlinks a:hover{background:#111;color:#fff}
.licht-punten li{border-color:var(--lijnD)!important}
.licht-punten li:last-child{border-bottom:1px solid var(--lijnD)}
.licht-punten .ic{background:#111}.licht-punten .ic svg{stroke:#fff;width:15px;height:15px}

/* homepage: bescheiden blok voor zakelijke verhuur */
.ookvoor{padding-top:0}
.ookkaart{display:grid;grid-template-columns:1.4fr 1fr;gap:clamp(24px,5vw,80px);align-items:center;padding:clamp(28px,4vw,48px) 0;border-top:1px solid var(--lijn);border-bottom:1px solid var(--lijn)}
.ookkaart h3{font-weight:300;font-size:clamp(26px,2.6vw,38px);margin-bottom:12px}
.ookkaart .label{margin-bottom:12px}
.ooklinks{display:flex;flex-direction:column;gap:2px}
.ooklinks a{display:flex;justify-content:space-between;align-items:center;padding:16px 0;border-bottom:1px solid var(--lijn);text-decoration:none;font:400 17px var(--helv);transition:padding .3s}
.ooklinks a:hover{padding-left:8px}
.ooklinks a:first-child{border-top:1px solid var(--lijn)}
@media(max-width:860px){.ookkaart{grid-template-columns:1fr}}
.formnoot{font-size:14px;color:#555;margin:0}.formnoot a{color:inherit}
.eenkolom{max-width:820px}
/* kop: knoppen + klantlogo's */
.heldknoppen{display:flex;flex-wrap:wrap;gap:12px;margin-top:clamp(26px,3vw,38px)}
.heldknoppen .knop{margin-top:0}
.logoregel{margin-top:clamp(40px,6vw,70px);display:flex;flex-direction:column;gap:16px}
.logoregel>span{font:400 12px var(--grot);letter-spacing:.14em;text-transform:uppercase;opacity:.65}
.logoregel>div{display:flex;flex-wrap:wrap;align-items:center;gap:clamp(22px,3.4vw,44px)}
.logoregel img{height:clamp(18px,2vw,26px);width:auto;max-width:130px;object-fit:contain;filter:brightness(0) invert(1);opacity:.78}
.logoregel img.hoog{height:clamp(26px,2.8vw,36px)}
@media(max-width:560px){.logoregel>div{gap:18px 24px}.logoregel img{height:16px;max-width:96px}.logoregel img.hoog{height:24px}}
/* donkere kaarten (film) */
.huurkaarten.zes{grid-template-columns:repeat(3,1fr)}
.huurkaarten.donker .huurkaart{background:#111;border:1px solid rgba(255,255,255,.1);box-shadow:none}
.huurkaarten.donker .huurkaart p{color:rgba(255,255,255,.68)}
.huurkaarten.donker .hic{background:#fff}.huurkaarten.donker .hic svg{stroke:#000}
@media(max-width:960px){.huurkaarten.zes{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.huurkaarten.zes{grid-template-columns:1fr}}
.stappen.vier{grid-template-columns:repeat(4,1fr)}
@media(max-width:960px){.stappen.vier{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.stappen.vier{grid-template-columns:1fr}}
/* cases */
.casekaarten{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2vw,28px)}
.casekaart{position:relative;display:block;border-radius:23px;overflow:hidden;aspect-ratio:4/3;color:#fff;text-decoration:none;background:#111}
.casekaart img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .8s}
.casekaart:hover img{transform:scale(1.04)}
.casekaart::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.85),rgba(0,0,0,.1) 60%)}
.casetekst{position:absolute;left:0;right:0;bottom:0;z-index:1;padding:clamp(22px,3vw,36px);display:flex;flex-direction:column;gap:8px}
.casetekst .label{margin:0;font-size:13px}
.casetitel{font:300 clamp(28px,3.4vw,44px)/1.1 var(--helv)}
.casetekst .zacht{font-size:15px;max-width:440px}
.caselink{font:500 14px var(--grot);margin-top:6px}
@media(max-width:760px){.casekaarten{grid-template-columns:1fr}.casekaart{aspect-ratio:4/3.4}}
.volgendecase{display:flex;flex-direction:column;gap:6px;padding:clamp(26px,3vw,40px) 0;border-top:1px solid var(--lijn);border-bottom:1px solid var(--lijn);color:#fff;text-decoration:none}
.volgendecase .label{margin:0;font-size:13px;opacity:.7}
.volgendecase .pijl{transition:transform .25s}.volgendecase:hover .pijl{transform:translateX(6px)}
.logoregel img.lg-avrotros,.logoregel img.lg-nlfilm{height:clamp(26px,2.8vw,36px)}
.logoregel img.lg-horizonfilm{height:clamp(30px,3.2vw,42px);max-width:150px}
.logoregel img.lg-belastingdienst{height:clamp(22px,2.3vw,30px);max-width:150px}
@media(max-width:560px){.logoregel img.lg-avrotros,.logoregel img.lg-nlfilm{height:24px}.logoregel img.lg-horizonfilm{height:28px;max-width:110px}.logoregel img.lg-belastingdienst{height:20px;max-width:100px}}
.logoregel{margin-top:clamp(70px,15vh,170px)}
.logoregel img.lg-jelierschaaf{height:clamp(22px,2.4vw,32px);max-width:150px}
@media(max-width:560px){.logoregel{margin-top:56px}.logoregel img.lg-jelierschaaf{height:22px;max-width:100px}}
.logoregel>div{gap:clamp(16px,2.3vw,34px)}
.logoregel img{height:clamp(16px,1.7vw,23px)}
.logoregel img.lg-jelierschaaf{height:clamp(20px,2.1vw,28px)}
.bouwkaarten{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(12px,1.6vw,22px)}
.bouwkaarten .casekaart{aspect-ratio:4/3.1}
.bouwkaarten .casetitel{font-size:clamp(22px,2.2vw,30px)}
.bouwkaarten .casetekst .zacht{font-size:14px}
@media(max-width:960px){.bouwkaarten{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.bouwkaarten{grid-template-columns:1fr}}
.huurkaarten.drie{grid-template-columns:repeat(3,1fr)}
@media(max-width:860px){.huurkaarten.drie{grid-template-columns:1fr}}
.modi{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,28px);margin-top:clamp(30px,4vw,50px)}
.modus{border-top:1px solid var(--lijn);padding-top:24px}
.modnr{font:400 13px var(--grot);letter-spacing:.14em;opacity:.6}
.modus h3{font:300 clamp(22px,2vw,28px)/1.2 var(--helv);margin:14px 0 12px}
.modus p{color:rgba(255,255,255,.72);font-size:15.5px}
@media(max-width:860px){.modi{grid-template-columns:1fr}}
.held.mini{min-height:0!important;padding:clamp(150px,18vh,200px) 0 clamp(10px,2vw,30px)}
.held.mini .wrap{padding-top:0}
.logorij{display:flex;flex-wrap:wrap;align-items:center;gap:clamp(24px,4vw,56px);margin-top:clamp(26px,3vw,40px)}
.logorij img{height:clamp(20px,2vw,28px);width:auto;max-width:170px;filter:brightness(0) invert(1);opacity:.8}
.logorij img.lg-belastingdienst{height:clamp(24px,2.4vw,32px)}
.logorij img.lg-jelierschaaf{height:clamp(26px,2.6vw,34px)}
.held .kopogos{display:flex;align-items:center;gap:clamp(20px,2.4vw,34px);margin-bottom:clamp(26px,3vw,44px)}
.held .kopogos img{height:clamp(34px,3.4vw,50px);width:auto;filter:brightness(0) invert(1)}
.held .kopogos img.lg-avrotros{height:clamp(38px,3.8vw,56px)}
a[href^="mailto:"],a[href^="tel:"]{text-decoration:none}a[href^="mailto:"]:hover,a[href^="tel:"]:hover{opacity:.7}
.held.mini+.blok{padding-top:clamp(10px,2vw,30px)}
.logorij.alle{gap:clamp(28px,4.4vw,64px) clamp(30px,5vw,72px);margin-top:10px}
.logorij img.lg-avrotros,.logorij img.lg-nlfilm,.logorij img.lg-loi{height:clamp(30px,3vw,40px)}
.logorij img.lg-horizonfilm{height:clamp(34px,3.4vw,46px)}
.logorij img.lg-netflix{height:clamp(22px,2.2vw,30px)}
.bouwkaarten .casetekst{gap:6px}
.bouwkaarten .casetekst .zacht{line-height:1.45;min-height:2.9em}
.logorij.alle{display:grid;grid-template-columns:repeat(5,auto);justify-content:space-between;align-items:center;row-gap:clamp(30px,4vw,54px);column-gap:24px}
@media(max-width:760px){.logorij.alle{grid-template-columns:repeat(3,auto)}}
@media(max-width:420px){.logorij.alle{grid-template-columns:repeat(2,auto)}}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:clamp(10px,1.4vw,18px)}
.duo .foto{border-radius:23px;overflow:hidden;aspect-ratio:16/10}
.duo .foto img{width:100%;height:100%;object-fit:cover;display:block}
.bijschrift-r{font:400 12px var(--grot);letter-spacing:.12em;text-transform:uppercase;opacity:.55;margin-top:12px;text-align:right}
@media(max-width:640px){.duo{grid-template-columns:1fr}}
/* groen <-> beeld */
.wipe{position:relative;border-radius:14px;overflow:hidden;background:#000;box-shadow:0 0 0 6px #111,0 0 0 7px rgba(255,255,255,.12);aspect-ratio:820/245;touch-action:pan-y}
.wipe img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;filter:none!important}
.wipegroen{position:absolute;inset:0;background:#00b140;clip-path:inset(0 calc(100% - var(--p)) 0 0)}
.wipegreep{position:absolute;top:0;bottom:0;left:var(--p);width:2px;margin-left:-1px;background:#fff;pointer-events:none}
.wipegreep::after{content:"⟷";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:38px;height:38px;border-radius:50%;background:#fff;color:#000;display:flex;align-items:center;justify-content:center;font:600 17px var(--grot)}
.wipe input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;margin:0}
.wipelab{position:absolute;top:10px;font:500 11px var(--grot);letter-spacing:.14em;text-transform:uppercase;background:rgba(0,0,0,.55);padding:4px 9px;border-radius:99px;pointer-events:none}
.wipelab.l{left:10px}.wipelab.r{right:10px}
/* tellers */
.tellers{padding-top:clamp(20px,3vw,40px);padding-bottom:clamp(20px,3vw,40px)}
.telrij{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,2vw,30px);border-top:1px solid var(--lijn);border-bottom:1px solid var(--lijn);padding:clamp(26px,3.4vw,46px) 0}
.tel b{font:300 clamp(46px,5.4vw,78px)/1 var(--helv)}.tel span{font:300 clamp(34px,4vw,56px)/1 var(--helv);opacity:.7}
.tel p{margin-top:10px;font:400 14px/1.45 var(--grot);color:rgba(255,255,255,.66);max-width:210px}
@media(max-width:760px){.telrij{grid-template-columns:1fr 1fr}}
/* showreel */
.showreelknop .speel{font-size:11px}
.showreel{position:fixed;inset:0;z-index:300;background:rgba(0,0,0,.92);display:flex;align-items:center;justify-content:center;padding:4vw}
.showreel video{width:100%;max-width:1400px;max-height:88vh;border-radius:10px;background:#000}
.showreel button{position:absolute;top:18px;right:20px;width:44px;height:44px;border-radius:50%;border:0;background:#fff;color:#000;font-size:20px;cursor:pointer}
.groenkop{display:grid;grid-template-columns:1fr;gap:clamp(20px,3vw,34px)}
.groenkop>.in:first-child{max-width:760px}
.wipe{aspect-ratio:2000/1124;box-shadow:none;border-radius:23px}
.wipe img.wipegroen{background:none;clip-path:inset(0 calc(100% - var(--p)) 0 0)}
.wipegreep{background:rgba(255,255,255,.85)}
.strook.drie{grid-template-columns:repeat(3,1fr)}
.fotobijschrift figure{margin:0}
.fotobijschrift .foto{aspect-ratio:auto}
.fotobijschrift img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:16px;display:block}
.fotobijschrift figcaption{font:400 13px/1.4 var(--grot);opacity:.65;margin-top:10px}
@media(max-width:700px){.strook.drie{grid-template-columns:1fr}}
.fotobijschrift .foto img{height:auto!important;aspect-ratio:4/3!important;position:static!important}.fotobijschrift .foto{overflow:visible;border-radius:0}
.bouwlijst{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);column-gap:clamp(20px,3vw,44px);margin-top:clamp(10px,2vw,20px)}
.bouwlijst li{border-top:1px solid var(--lijn);padding:clamp(22px,2.4vw,32px) 0 clamp(26px,3vw,40px)}
.bouwlijst .bnr{font:400 12px var(--grot);letter-spacing:.14em;opacity:.5}
.bouwlijst h3{font:300 clamp(24px,2.3vw,32px)/1.15 var(--helv);margin:12px 0 10px}
.bouwlijst p{color:rgba(255,255,255,.66);font-size:15px;max-width:300px}
@media(max-width:900px){.bouwlijst{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.bouwlijst{grid-template-columns:1fr}}
.lijstkop{font:500 13px var(--grot);letter-spacing:.1em;text-transform:uppercase;margin-top:24px!important;opacity:.75}
.lijstkop+.bol{margin-top:8px}
.contentblok{padding-top:clamp(30px,4vw,60px)}
.foto.koel{position:relative}
.foto.koel::after{content:"";position:absolute;inset:0;background:#1d4f9a;mix-blend-mode:soft-light;opacity:.75;pointer-events:none;border-radius:inherit}
.foto.koel img{filter:saturate(.9) brightness(.97)}
.merkkaarten{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(12px,1.6vw,22px);margin-top:clamp(30px,4vw,50px)}
.merkkaart{position:relative;border-radius:23px;overflow:hidden;aspect-ratio:4/3;background:#111}
.merkkaart img:first-child{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .8s}
.merkkaart:hover img:first-child{transform:scale(1.04)}
.merkkaart::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.75),rgba(0,0,0,0) 55%)}
.merkkaart .merklogo{position:absolute;left:clamp(18px,2vw,26px);bottom:clamp(18px,2vw,24px);z-index:1;height:clamp(18px,1.8vw,24px);width:auto;max-width:60%;filter:brightness(0) invert(1)}
.merkkaart .merklogo.lg-belastingdienst{height:clamp(24px,2.4vw,32px)}
@media(max-width:760px){.merkkaarten{grid-template-columns:1fr}}
.logorij.alle{display:flex;flex-wrap:nowrap;justify-content:space-between;gap:clamp(14px,2vw,30px)}
.logorij.alle img{height:clamp(14px,1.5vw,22px);max-width:clamp(60px,9vw,130px)}
.logorij.alle img.lg-avrotros,.logorij.alle img.lg-nlfilm,.logorij.alle img.lg-loi{height:clamp(20px,2vw,30px)}
.logorij.alle img.lg-horizonfilm{height:clamp(24px,2.5vw,36px)}
.logorij.alle img.lg-belastingdienst,.logorij.alle img.lg-jelierschaaf{height:clamp(18px,1.9vw,26px)}
@media(max-width:760px){.logorij.alle{flex-wrap:wrap;justify-content:flex-start;gap:20px 26px}}
.uitgelicht{padding-bottom:clamp(20px,3vw,40px)}
.setintro{max-width:720px;margin-top:-6px;margin-bottom:clamp(14px,2vw,24px);color:rgba(255,255,255,.75)}
.drieluik .banner{border-radius:23px;overflow:hidden;aspect-ratio:21/8;margin-top:clamp(10px,2vw,20px)}
.drieluik .banner img{width:100%;height:100%;object-fit:cover;object-position:50% 45%;display:block}
.drie-kol{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,44px);margin-top:clamp(30px,4vw,50px)}
.drie-kol .kol{border-top:1px solid var(--lijn);padding-top:22px}
.drie-kol .bnr{font:400 12px var(--grot);letter-spacing:.14em;opacity:.5}
.drie-kol h3{font:300 clamp(24px,2.3vw,32px)/1.15 var(--helv);margin:12px 0 12px}
.drie-kol p{color:rgba(255,255,255,.72);font-size:15.5px}
.chips{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.chips li{font:400 13px/1 var(--grot);padding:8px 12px;border:1px solid rgba(255,255,255,.22);border-radius:99px;color:rgba(255,255,255,.85)}
@media(max-width:860px){.drie-kol{grid-template-columns:1fr}.drieluik .banner{aspect-ratio:16/9}}
.drieluik .banner.koel::after{opacity:.35}.drieluik .banner.koel img{filter:saturate(.85) brightness(.95)}
.drie-kol .kol{border-top:0;padding-top:0}
.kolfoto{border-radius:16px;overflow:hidden;aspect-ratio:4/3;margin-bottom:20px}
.kolfoto img{width:100%;height:100%;object-fit:cover;display:block}
/* fotostrook: bijschrift óp de foto, geen blok eronder */
.fotobijschrift figure.foto{background:none;aspect-ratio:4/3!important;border-radius:16px;overflow:hidden;position:relative}
.fotobijschrift figure.foto img{position:absolute!important;inset:0;width:100%;height:100%!important;aspect-ratio:auto!important;border-radius:0}
.fotobijschrift figure.foto::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.7),rgba(0,0,0,0) 45%);pointer-events:none}
.fotobijschrift figcaption{position:absolute;left:18px;right:18px;bottom:14px;z-index:1;margin:0;opacity:.9;color:#fff}
.stapels{margin-top:clamp(18px,2.4vw,30px)}
.stapels>div{border-top:1px solid var(--lijn);padding:18px 0 20px}
.stapels .bnr{font:400 12px var(--grot);letter-spacing:.14em;opacity:.5}
.stapels h3{font:300 clamp(22px,2vw,28px)/1.15 var(--helv);margin:8px 0 8px}
.stapels p{color:rgba(255,255,255,.72);font-size:15.5px}
.drieluik .foto.koel::after{opacity:.35}
.drieluik .twee{align-items:stretch}
.drieluik .foto.hoogvol{height:auto;min-height:420px;margin-top:0}
.drieluik .foto.hoogvol img{position:absolute;inset:0;height:100%}
.chips li:last-child{border-style:dashed;opacity:.75}
@media(max-width:860px){.drieluik .foto.hoogvol{aspect-ratio:16/10;min-height:0}}
.merkkaarten.vier{grid-template-columns:repeat(4,1fr)}
@media(max-width:960px){.merkkaarten.vier{grid-template-columns:1fr 1fr}}
.merkkaart .merklogo.lg-loi{height:clamp(26px,2.6vw,34px)}
.visietekst{margin-bottom:clamp(40px,6vw,80px)}
.visietekst{align-items:start}
.visietekst .foto{aspect-ratio:auto!important;height:clamp(380px,48vw,720px)}
.visietekst .foto img{position:absolute;inset:0;height:100%}
.visietekst p{font-size:clamp(16px,1.35vw,20px);line-height:1.6}
@media(max-width:860px){.visietekst .foto{height:auto;aspect-ratio:4/3!important}}
.setkop{font:300 clamp(24px,2.4vw,34px)/1.2 var(--helv);margin:0 0 clamp(14px,2vw,22px)}
.ennog{margin-top:clamp(20px,2.4vw,30px);font-size:15px}
.drieluik .banner{border-radius:23px;overflow:hidden;aspect-ratio:21/8;margin-top:clamp(10px,2vw,20px)}
.drieluik .banner img{width:100%;height:100%;object-fit:cover;object-position:50% 50%;display:block}
.rijen{margin-top:clamp(30px,4vw,50px)}
.rij{display:grid;grid-template-columns:minmax(200px,1fr) 2fr;gap:clamp(20px,4vw,60px);align-items:start;border-top:1px solid var(--lijn);padding:clamp(22px,2.6vw,34px) 0}
.rij:last-child{border-bottom:1px solid var(--lijn)}
.rijkop{display:flex;align-items:baseline;gap:16px}
.rijkop .bnr{font:400 12px var(--grot);letter-spacing:.14em;opacity:.5}
.rijkop h3{font:300 clamp(26px,2.6vw,38px)/1.1 var(--helv);margin:0}
.rij>p{color:rgba(255,255,255,.75);font-size:clamp(15.5px,1.2vw,18px);margin:6px 0 0}
.rij .chips{margin-top:4px}
@media(max-width:760px){.rij{grid-template-columns:1fr;gap:12px}.drieluik .banner{aspect-ratio:16/10}}
.visietekst>.in:first-child{max-width:480px}
.setsub{margin:-8px 0 clamp(16px,2vw,24px);font-size:15.5px}
.leveren .stapels>div{border-top-color:var(--lijnD)}
.leveren .stapels p{color:#444}
.leveren .chips li{border-color:rgba(0,0,0,.2);color:#222}
.leveren .chips li:last-child{opacity:.65}
.leveren .twee{align-items:stretch}
.leveren .foto.hoogvol{min-height:420px}
.leveren .foto.hoogvol img{position:absolute;inset:0;height:100%}
.gemakkop{font:300 clamp(26px,2.6vw,38px)/1.15 var(--helv);margin:clamp(60px,8vw,110px) 0 clamp(20px,2.6vw,34px)}
.ctakaart::after{background:linear-gradient(90deg,rgba(0,0,0,.62) 0%,rgba(0,0,0,.34) 45%,rgba(0,0,0,0) 85%),linear-gradient(0deg,rgba(0,0,0,.4),transparent 45%)}
.ctabg{filter:brightness(1.18) contrast(1.05)}
.cta .ctatekst h2,.cta .ctatekst p{text-shadow:0 2px 18px rgba(0,0,0,.55)}
.cuitleg{margin-bottom:12px}
.leveren .cuitleg{margin-bottom:22px}
.leveren .foto.hoogvol img{object-position:72% 50%}
.leveren .foto.hoogvol{min-height:0;height:auto;aspect-ratio:5/4;align-self:start}.leveren .foto.hoogvol img{object-position:78% 50%}
.leveren .foto.hoogvol{aspect-ratio:3/2}.leveren .foto.hoogvol img{object-position:100% 50%}
.visietekst>.in:first-child{max-width:560px}
.nw{white-space:nowrap}
.ctatekst .label{margin-bottom:26px!important}
.logoregel img.lg-jelierschaaf{position:relative;top:4px}
.leveren .stapels .cuitleg{margin-bottom:34px!important}
.wagenext{border-radius:23px;overflow:hidden;aspect-ratio:16/8;margin:clamp(10px,2vw,20px) 0 clamp(10px,1.4vw,18px)}.wagenext img{width:100%;height:100%;object-fit:cover;display:block}
/* content-labels als rustige lijst */
.leveren .chips{display:block;columns:2;column-gap:clamp(18px,2.4vw,34px);margin-top:4px}
.leveren .chips li{display:block;break-inside:avoid;border:0!important;border-radius:0;padding:7px 0;border-bottom:1px solid var(--lijnD)!important;font:400 14px/1.35 var(--grot);color:#333;opacity:1}
.leveren .chips li:last-child{border-bottom:0!important;font-style:italic;opacity:.6}
@media(max-width:420px){.leveren .chips{columns:1}}
.wagenext{aspect-ratio:21/8}.wagenext img{object-position:50% 22%}@media(max-width:760px){.wagenext{aspect-ratio:16/8}}
.wagenkaart{position:relative;border-radius:23px;overflow:hidden;aspect-ratio:21/9;background:#111;display:flex;align-items:flex-end}
.wagenkaart>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 30%}
.wagenkaart::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.72) 0%,rgba(0,0,0,.35) 50%,rgba(0,0,0,0) 80%),linear-gradient(0deg,rgba(0,0,0,.55),transparent 55%)}
.wagentekst{position:relative;z-index:1;max-width:620px;padding:clamp(24px,4vw,56px)}
.wagentekst .label{margin-bottom:14px}
.wagentekst h2{margin:0 0 14px}
.wagentekst p{color:rgba(255,255,255,.85);text-shadow:0 2px 14px rgba(0,0,0,.5)}
.wagenrij{display:grid;grid-template-columns:1fr 1fr 1fr;gap:clamp(10px,1.4vw,18px);margin-top:clamp(10px,1.4vw,18px)}
.wagenrij .foto{border-radius:23px;aspect-ratio:4/3;position:relative}
.wagenrij .foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.fotolab{position:absolute;left:14px;bottom:12px;z-index:1;font:400 11px var(--grot);letter-spacing:.12em;text-transform:uppercase;opacity:.75}
.wagenlijst{border-radius:23px;background:#111;border:1px solid rgba(255,255,255,.1);padding:clamp(20px,2.4vw,30px);display:flex;align-items:center}
.wagenlijst ul{list-style:none;margin:0;padding:0}
.wagenlijst li{padding:9px 0;border-bottom:1px solid rgba(255,255,255,.12);font-size:15px;color:rgba(255,255,255,.85)}
.wagenlijst li:last-child{border-bottom:0}
@media(max-width:900px){.wagenkaart{aspect-ratio:auto;min-height:440px}.wagenrij{grid-template-columns:1fr 1fr}.wagenlijst{grid-column:1/-1}}
@media(max-width:560px){.wagenrij{grid-template-columns:1fr}}
.wagentekst{max-width:520px}.wagentekst h2{font-size:clamp(24px,2.4vw,34px)!important;line-height:1.15}.wagentekst p{font-size:15px}.wagenkaart>img{object-position:60% 30%}
.wagenkaart{display:grid;grid-template-columns:minmax(300px,34%) 1fr;align-items:stretch;aspect-ratio:auto;min-height:clamp(340px,30vw,460px);background:#0b0d10}
.wagenkaart::after{display:none}
.wagenkaart>img{position:relative;inset:auto;grid-column:2;grid-row:1;width:100%;height:100%;object-fit:cover;object-position:35% 30%}
.wagentekst{grid-column:1;grid-row:1;align-self:center;max-width:none;padding:clamp(24px,3vw,44px)}
.wagentekst p{text-shadow:none}
@media(max-width:900px){.wagenkaart{grid-template-columns:1fr;min-height:0}.wagenkaart>img{grid-column:1;grid-row:1;aspect-ratio:16/9;height:auto}.wagentekst{grid-row:2}}
.foto.breedfoto{aspect-ratio:16/10!important}
.wagenkol .foto.rand-l{margin-left:calc(var(--gut)*-1)}
.duimen{display:flex;gap:10px;align-items:center;margin-top:12px}
.duim{width:clamp(90px,10vw,140px);aspect-ratio:16/10;border:0;padding:0;border-radius:10px;overflow:hidden;cursor:zoom-in;background:#111}
.duim img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s}
.duim:hover img{transform:scale(1.06)}
.duimlab{font:400 11px var(--grot);letter-spacing:.12em;text-transform:uppercase;opacity:.55;margin-left:6px}
.foto.breedfoto{aspect-ratio:2/1!important}
.foto.breedfoto{aspect-ratio:16/10!important}.wagenkol .foto.breedfoto{width:calc(100% + var(--gut))}
.twee.spiegel{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr)}.wagenkol .foto.breedfoto{width:auto}@media(max-width:860px){.twee.spiegel{grid-template-columns:1fr}}
.wagenkol .duimen{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-left:calc(var(--gut)*-1);margin-top:10px}
.wagenkol .duim{width:100%;aspect-ratio:16/10;border-radius:12px}
.wagenkol .duim:first-child{border-radius:0 12px 12px 0}
@media(max-width:860px){.wagenkol .duimen{margin-left:0}.wagenkol .duim:first-child{border-radius:12px}}
/* === opschoonronde: vaste bouwstenen === */
.huurkaarten.twee-k{grid-template-columns:1fr 1fr;margin-bottom:0}
.huurkaarten.twee-k .huurkaart h3{font-size:17px;margin:14px 0 6px}
@media(max-width:560px){.huurkaarten.twee-k{grid-template-columns:1fr}}
/* genummerde punten: overal dezelfde maat */
.bouwlijst h3,.modus h3,.stapels h3{font:300 clamp(22px,2.1vw,30px)/1.15 var(--helv)!important;margin:10px 0 8px!important}
.bouwlijst .bnr,.modnr,.stapels .bnr{font:400 12px var(--grot)!important;letter-spacing:.14em!important;opacity:.5!important}
.bouwlijst p,.modus p,.stapels p{font-size:15.5px!important;line-height:1.55}
.bouwlijst li,.modus,.stapels>div{padding-top:22px!important}
/* fotokaarten: cases en merken gelijk */
.merkkaart,.casekaart{border-radius:23px}
.merkkaart::after,.casekaart::after{background:linear-gradient(to top,rgba(0,0,0,.8),rgba(0,0,0,.05) 60%)}
/* kopjes en afstanden */
h2.mid{margin-bottom:clamp(22px,2.6vw,34px)}
.blok .kopje+h2,.streep+.label{margin-top:0}
.huurkaarten.prijzen .huurkaart h3{margin:0 0 6px}
.prijs{font:400 15px var(--grot);color:#111!important;margin:0 0 10px}
.prijs b{font:300 clamp(28px,2.6vw,36px) var(--helv);font-weight:300;color:#111}
.prijsnoot{font-size:14px;margin-top:6px;max-width:760px}
.leveren .chips.ingeklapt li:nth-child(n+9){display:none}
.meerknop{margin-top:14px;background:none;border:0;padding:0;font:500 14px var(--grot);color:#111;cursor:pointer;text-decoration:underline;text-underline-offset:4px}
.visietekst h2{margin-bottom:clamp(22px,2.6vw,34px)}
