/* Auto van Jansen – zwart en chroom
 *
 * Opbouw (de volgorde bepaalt welke regel wint, dus nieuwe regels onderaan het juiste blok zetten):
 *   1. Variabelen, basis en typografie        5. Kaartjes, hero, USP's, budget, stappen, reviews, FAQ (homepage)
 *   2. Knoppen, topbalk, kop en navigatie     6. Autodetailpagina, galerij en lightbox
 *   3. Algemene blokken en voorraadraster     7. Over ons, contact en privacy
 *   4. Aanbodpagina met filters               8. Huisstijl-overschrijvingen zwart en chroom (laatste woord)
 * Mobiele regels staan per onderdeel in @media (max-width:1100px / 900px / 760px).
 * Opgeschoond in november 2026: overschreven declaraties en ongebruikte selectors verwijderd;
 * de berekende opmaak van alle pagina's is gecontroleerd en ongewijzigd.
 */
:root{
  /* Zwart en chroom: 60% bijna-zwart (basis) · 30% antraciet/diep (vlakken) · 10% chroom (knoppen, prijzen, accenten) */
  --bg:#1B1C1E; --diep:#111213; --inkt:#F2F4F6; --licht:#F2F4F6; --op-chroom:#141414;
  --wit:#1B1C1E; --zwart:#F2F4F6; --zwart-diep:#0C0D0E;
  --rood:#D9DDE2; --rood-hover:#FFFFFF; --rood-licht:#FFFFFF;
  --amber:#D9DDE2; --amber-hover:#FFFFFF; --op-amber:#141414; --puur-wit:#26282B; --vlak:#232528;
  /* Tekst */
  --tekst2:#C4C9CF; --tekst3:#9EA4AC; --tekst-op-zwart:#E6E9EC;
  --lijn:#34373B; --lijn-sterk:#6B7178; --fout:#FF7A6E; --fout-vlak:#3A1F1D; --grijs:#232528; --foto:#27292C;
  /* Koppen breed en technisch, tekst rustig */
  --kop:Michroma, "Arial Black", Arial, sans-serif;
  --tekst:Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  /* Eén radius, één schaduw */
  --radius:4px; --schaduw:0 1px 4px rgba(0,0,0,.5);
  /* Witruimte */
  --sectie:clamp(56px,8vw,96px);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--tekst);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;color:var(--inkt);background:var(--bg)}
img{max-width:100%;height:auto;display:block}
a{color:var(--inkt)} a:hover{color:var(--rood)}
h1,h2,h3{font-family:var(--kop);margin:0;line-height:1.15;letter-spacing:-.02em;color:var(--inkt)}
.cta-balk strong{color:var(--licht)}
h2{font-weight:800}
p{margin:0}
.wrap{max-width:1200px;margin:0 auto;padding:0 20px}
.smal{max-width:860px}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;left:-9999px}.skip:focus{left:12px;top:12px;z-index:99;background:var(--bg);padding:8px 12px}
.klein{font-size:14px}
.sub{font-size:16px;color:var(--tekst2)}


/* Responsive foto's in <picture> (WebP met JPG als terugval): de wrapper zelf telt niet mee voor de opmaak */
picture{display:contents}

/* Knoppen */
.knoppen{display:flex;flex-wrap:wrap;gap:10px}
.knop{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:14px 22px;border-radius:var(--radius);font:700 18px/1.2 var(--tekst);text-decoration:none;border:0;cursor:pointer}

 
.knop-rand{border:2px solid var(--lijn-sterk)}

/* Topbar + kop */
.topbar{color:var(--tekst-op-zwart);font-size:14px}
.topbar-in{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-top:8px;padding-bottom:8px}
.topbar a{color:var(--licht);font-weight:600;text-decoration:none}

.kop-in{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;padding-top:14px;padding-bottom:14px}
.logo{display:block;line-height:0}

.menu{display:flex;gap:28px;font-weight:600;font-size:17px}
.menu-knop{display:none;align-items:center;gap:8px;min-height:48px;padding:0 16px;border:2px solid var(--licht);border-radius:var(--radius);background:transparent;color:var(--licht);font:700 17px var(--tekst);cursor:pointer}
.menu-knop svg{flex:none}
.menu a{text-decoration:none;color:var(--licht)}

.menu a[aria-current="page"]{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:8px}

/* Intro */






.sterren{display:inline-flex;gap:2px;color:var(--inkt)}




/* Blokken */
.blok{padding:var(--sectie) 0}




/* Reviews */
#reviews{padding:var(--sectie) 0}





.review{flex:2 1 480px;margin:0;border-left:4px solid var(--lijn-sterk);padding:4px 0 4px 24px;display:flex;flex-direction:column;gap:12px}
.review blockquote{margin:0;font-size:18px;line-height:1.6}
.review figcaption{font-size:16px;color:var(--tekst3)}
.review strong{color:var(--inkt)}

/* Review-slideshow */
.slider{flex:2 1 480px;min-width:0;display:flex;flex-direction:column;gap:16px}
.slider .review{flex:none}
.slide{animation:infaden .5s ease}
.slider-baan{display:grid}
.slider-baan>.slide{grid-area:1/1}
.slide[hidden]{display:flex;visibility:hidden}
@keyframes infaden{from{opacity:0;transform:translateX(12px)}to{opacity:1;transform:none}}
.slider-bediening{display:flex;align-items:center;gap:10px;padding-left:28px}
.slider-knop{width:44px;height:44px;border:2px solid var(--lijn-sterk);background:var(--bg);border-radius:50%;font-size:22px;line-height:1;cursor:pointer;color:var(--inkt)}
.slider-knop:hover{background:var(--diep);color:var(--licht)}
.slider-stippen{display:flex;gap:4px}
.stip{width:24px;height:44px;border:0;background:transparent;cursor:pointer;position:relative;padding:0}
.stip::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:var(--bg);border:2px solid var(--lijn-sterk);box-sizing:border-box}
.stip.actief::after{background:var(--rood);border-color:var(--rood);width:14px;height:14px;margin:-7px 0 0 -7px}
@media (prefers-reduced-motion:reduce){.slide{animation:none}}

/* Voorraad */



.filters{display:flex;flex-wrap:wrap;gap:12px}
.filters label{display:flex;flex-direction:column;gap:4px;font-size:14px;font-weight:600;color:var(--tekst3)}
.filters select{font:15px var(--tekst);padding:10px 12px;min-height:44px;min-width:150px;border:1px solid var(--lijn-sterk);border-radius:var(--radius);background:var(--bg);color:var(--inkt)}
.raster{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:40px 24px}
.kaart{display:flex;flex-direction:column;gap:4px;text-decoration:none;color:var(--inkt)}
.kaart[hidden]{display:none}
.kaart-foto{position:relative;aspect-ratio:4/3;background:var(--foto);margin-bottom:8px;overflow:hidden;border-radius:var(--radius)}
.kaart-foto img{width:100%;height:100%;object-fit:cover}
.kaart:hover .kaart-foto img{transform:scale(1.03)}
.kaart h3{font-size:20px;font-weight:700;line-height:1.2}
.kaart-uitv{font-size:16px;color:var(--tekst2)}
.kaart-regel{font-size:15px;color:var(--tekst3)}

.geen-foto{display:flex;width:100%;height:100%;align-items:center;justify-content:center;font-size:13px;font-weight:600}




.leeg-melding{padding:24px 0;font-size:16px;color:var(--tekst3)}
.leeg-melding a{font-weight:700}
.cta-balk{background:var(--diep);color:var(--licht);padding:32px;border-radius:var(--radius);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;margin-top:48px}
.cta-balk > div:first-child{display:flex;flex-direction:column;gap:4px}
.cta-balk strong{font:800 26px/1.2 var(--tekst);letter-spacing:-.02em}
.cta-balk > div:first-child span{font-size:16px;color:var(--tekst-op-zwart)}

/* Aanbod-pagina */
.pagina-titel{font-size:clamp(36px,5vw,52px);font-weight:800}
.meer{text-align:center;margin-top:28px}
.filter-open{display:none}
.filter-kop,.filter-voet{display:none}





.prijs-filter{grid-column:1/-1;display:flex;flex-direction:column;gap:6px;max-width:520px}
.prijs-kop{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.prijs-kop label{font:600 16px var(--tekst)}
.prijs-kop output{font:800 22px var(--tekst);color:var(--inkt)}
.prijs-schaal{display:flex;justify-content:space-between;font-size:14px;color:var(--tekst3)}
.prijs-filter input[type=range]{--vul:100%;-webkit-appearance:none;appearance:none;width:100%;height:44px;background:transparent;cursor:pointer;margin:0}
.prijs-filter input[type=range]::-webkit-slider-runnable-track{height:6px;border-radius:var(--radius);background:linear-gradient(to right,var(--rood) var(--vul),var(--lijn) var(--vul))}
.prijs-filter input[type=range]::-moz-range-track{height:6px;border-radius:var(--radius);background:var(--lijn)}
.prijs-filter input[type=range]::-moz-range-progress{height:6px;border-radius:var(--radius);background:var(--rood)}
.prijs-filter input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:28px;height:28px;margin-top:-11px;border-radius:50%;background:var(--bg);border:3px solid var(--rood);box-shadow:var(--schaduw)}
.prijs-filter input[type=range]::-moz-range-thumb{width:24px;height:24px;border-radius:50%;background:var(--bg);border:3px solid var(--rood)}
.prijs-filter input[type=range]:focus-visible{outline:2px solid var(--rood);outline-offset:4px}
@media (max-width:760px){
  .filter-open{display:inline-flex;gap:6px;width:100%;margin-bottom:20px}
  .filter-paneel{display:none;position:fixed;inset:0;z-index:60;background:var(--grijs);margin:0;flex-direction:column;overflow-y:auto}
  .filter-paneel.open{display:flex}
  .filter-kop{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--lijn)}
  .filter-kop h2{font:700 26px var(--tekst);text-transform:none}
  .filter-sluit{width:52px;height:52px;border-radius:50%;border:0;background:var(--diep);color:var(--licht);display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
  
  .filter-voet{display:flex;gap:12px;align-items:center;justify-content:space-between;margin-top:auto;padding:16px 20px calc(16px + env(safe-area-inset-bottom));border-top:1px solid var(--lijn);background:var(--bg)}
  .filter-voet .knop{flex:1;gap:.3em}
  .filter-wis{background:none;border:0;font:600 16px var(--tekst);text-decoration:underline;color:var(--inkt);min-height:44px;cursor:pointer}
  body.filter-actief{overflow:hidden}
  body.filter-actief .sticky-cta{display:none}
}

/* FAQ */
#faq h2{margin-bottom:20px}
.faq{border-top:2px solid var(--lijn-sterk);margin-bottom:20px}
.faq details{border-bottom:1px solid var(--lijn)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px 0;min-height:56px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:26px;color:var(--inkt);width:24px;text-align:center;flex:none}
.faq details[open] summary::after{content:"–"}
.faq summary h3{font:700 18px var(--tekst);text-transform:none}
.faq details p{padding:0 40px 20px 0;line-height:1.65;color:var(--tekst2)}

/* Inruil */








.honing{position:absolute;left:-9999px}
.fout{grid-column:1/-1;background:var(--bg);padding:10px 12px;font-weight:600}
.bedankt{flex:1 1 420px;background:var(--bg);color:var(--inkt);padding:20px;font-size:17px}

/* Contact */

.over{flex:1 1 420px;display:flex;flex-direction:column;gap:12px}
.over p{font-size:17px;line-height:1.65;color:var(--tekst2)}
.contact{flex:1 1 360px;display:flex;flex-direction:column;gap:12px}
.contact h2,.over h2{font-size:32px}
.contact p{font-size:17px;line-height:1.65}


/* Contactpagina */







.contact-formulier{background:var(--grijs);padding:32px;border-radius:var(--radius)}
.formulier{display:flex;flex-direction:column;gap:20px}
.veld{display:flex;flex-direction:column;gap:6px}
.veld label{font-weight:600;font-size:16px}
.veld .ster,.formulier .ster{margin-left:2px}
.veld input,.veld textarea{font:17px var(--tekst);color:var(--inkt);background:var(--bg);border:1.5px solid var(--lijn-sterk);border-radius:var(--radius);padding:12px 14px;min-height:52px;width:100%}
.veld textarea{min-height:150px;resize:vertical;line-height:1.5}
.veld input:focus,.veld textarea:focus{outline:2px solid var(--zwart);outline-offset:1px;border-color:var(--lijn-sterk)}

.veld-fout{color:var(--fout);font-size:15px;font-weight:600}
.fout-blok{background:var(--fout-vlak);border-left:4px solid var(--rood);padding:12px 14px;margin:0;font-weight:600}
.bedankt-blok{background:var(--bg);border-left:4px solid var(--lijn-sterk);padding:20px;font-size:17px}
.knop.breed{width:100%}
@media (max-width:760px){
  
  .contact-formulier{padding:24px 16px;margin:0 -4px}
  
  
}

/* Detail */
.detail{padding-top:16px;padding-bottom:56px}
.kruimel{font-size:14px;color:var(--tekst3);margin-bottom:16px}
.kruimel a{color:var(--tekst3)}









.duimen{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.duim{padding:0;border:3px solid var(--licht);background:var(--foto);cursor:pointer;aspect-ratio:4/3;overflow:hidden}
.duim img{width:100%;height:100%;object-fit:cover}
.duim.actief{border-color:var(--lijn-sterk)}
.tekst{font-size:17px;line-height:1.65;color:var(--tekst2)}
.opties{margin:0;padding-left:20px;columns:2;font-size:16px;line-height:1.8}





.specs{border-collapse:collapse;width:100%;font-size:15px}
.specs th{text-align:left;font-weight:400;color:var(--tekst3);padding:9px 10px}
.specs td{text-align:right;font-weight:600;padding:9px 10px}
.specs tr:nth-child(odd){background:var(--grijs)}



/* Footer + sticky */
.voet{color:var(--licht);padding:48px 0 24px;font-size:16px}
.voet-in{display:flex;flex-wrap:wrap;align-items:flex-start;gap:32px 64px}
.voet-logo{display:block;line-height:0}

.voet-info{display:flex;flex-direction:column;gap:6px;font-style:normal;line-height:1.5}
.voet-info a{color:var(--licht);text-decoration:none}
.voet-info a:hover{color:var(--licht);text-decoration:underline}
.voet-info strong{margin-top:8px;font-weight:700}
.voet-onder{display:flex;flex-wrap:wrap;justify-content:flex-start;gap:8px 24px;margin-top:40px;padding-top:20px;border-top:1px solid rgba(255,255,255,.15);font-size:14px;color:var(--tekst-op-zwart)}
.sticky-cta{display:none}

@media (max-width:760px){
  .hide-sm{display:none}
  .sticky-cta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;position:fixed;left:0;right:0;bottom:0;z-index:20;padding:10px 12px;background:var(--bg);border-top:1px solid var(--lijn)}
  .sticky-cta .knop{min-height:52px}
  .voet{padding-bottom:104px}
  .voet-logo img{height:64px}
  h2{font-size:32px}
  
  .kop-in{flex-wrap:wrap}
  .menu-knop{display:inline-flex}
  .menu{display:none;width:100%;flex-direction:column;gap:8px;padding:4px 0 14px}
  .kop.open .menu{display:flex}
  .menu a{display:block;padding:14px 16px;border-radius:var(--radius);background:rgba(255,255,255,.08);font-size:18px}
  .menu a[aria-current="page"]{background:var(--bg);color:var(--inkt);text-decoration:none}
  .opties{columns:1}
  .duimen{grid-template-columns:repeat(4,minmax(0,1fr))}
}

/* =========================================================
   Homepage (versie 2): wit als basis, zwart voor structuur,
   rood alleen waar het moet opvallen.
   ========================================================= */
:root{--u-grijs:#232528;--u-rand:#34373B}

/* Kaartjes: prijs als rood prijsbord op de foto (homepage en aanbod) */
.kaart{transition:transform .2s ease}
.kaart:hover{transform:translateY(-2px)}
.kaart-foto img{transition:transform .3s ease}
.knop{transition:transform .12s ease,background-color .15s ease,color .15s ease}
.knop:active{transform:translateY(1px)}
.prijsbord{position:absolute;right:10px;top:10px;background:var(--rood);color:var(--op-chroom);font:800 19px/1 var(--tekst);letter-spacing:-.01em;padding:9px 12px;border-radius:var(--radius);box-shadow:0 2px 6px rgba(0,0,0,.18)}

.kaart h3{margin-top:6px}

/* Hero */
.u-hero{padding:clamp(40px,6vw,88px) 0 clamp(48px,6vw,96px);border-bottom:1px solid var(--u-rand)}
.u-hero-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,80px);align-items:center}
.u-hero h1{font-size:clamp(40px,5.4vw,72px);line-height:1.03;letter-spacing:-.035em;font-weight:800;margin:0 0 24px}
.u-boventitel{display:block;font-size:15px;font-weight:700;text-transform:uppercase;color:var(--tekst3);margin-bottom:20px;line-height:1.4}

.u-lead{font-size:19px;line-height:1.6;color:var(--tekst2);max-width:520px;margin:0 0 32px}
.u-knop-groot{min-height:56px;padding:0 26px;font-size:18px;gap:10px}
.u-feiten{display:flex;margin:40px 0 0;border-top:1px solid var(--u-rand);padding-top:24px}
.u-feiten div{flex:1;padding-right:20px}
.u-feiten div + div{padding-left:20px;border-left:1px solid var(--u-rand)}
.u-feiten dt{font-size:14px;color:var(--tekst3);margin-bottom:4px}
.u-feiten dd{margin:0;font:800 28px/1.1 var(--tekst);letter-spacing:-.02em;color:var(--inkt)}
.u-ster{color:var(--rood)}
.u-hero-beeld img{width:100%;aspect-ratio:5/4;object-fit:cover;object-position:45% 70%;border-radius:var(--radius);display:block;background:var(--foto)}

/* USP's */
.u-usp{border-bottom:1px solid var(--u-rand);padding:36px 0}
.u-usp-in{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.u-usp-item{display:flex;align-items:center;gap:14px}
.u-usp-icoon{flex:none;width:56px;height:56px;border-radius:50%;background:var(--u-grijs);color:var(--rood);display:inline-flex;align-items:center;justify-content:center}
.u-usp-item h2{font-size:18px;line-height:1.3;letter-spacing:-.01em;font-weight:700}

/* Prijscategorieën */
.u-budget{background:var(--diep);color:var(--licht);padding:clamp(40px,5vw,64px) 0}
.u-budget-in{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,2.3fr);gap:40px;align-items:center}
.u-budget h2{color:var(--licht);font-size:clamp(28px,3vw,40px)}
.u-budget-tegels{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.u-tegel{display:flex;flex-direction:column;gap:2px;padding:20px 22px;border-radius:var(--radius);border:1.5px solid rgba(255,255,255,.22);color:var(--licht);text-decoration:none;transition:transform .2s ease,border-color .2s ease,background-color .2s ease}
.u-tegel:hover{transform:translateY(-2px);border-color:var(--licht);color:var(--licht)}

.u-tegel-label{font-size:15px}

.u-tegel-bedrag{font:800 clamp(28px,2.8vw,40px)/1.05 var(--tekst);letter-spacing:-.03em}
.u-tegel-aantal{font-weight:600;font-size:16px;margin-top:8px}

/* Nieuw binnen */
.u-sectie-kop{display:flex;justify-content:space-between;align-items:flex-end;gap:16px 32px;flex-wrap:wrap;margin-bottom:32px}
.u-sectie-kop h2{font-size:clamp(32px,3.4vw,48px);letter-spacing:-.03em}
.u-sectie-kop .sub{margin:8px 0 0;max-width:560px}
.u-link-pijl{font-weight:700;font-size:17px;text-decoration:none;border-bottom:2px solid var(--rood);padding-bottom:2px}
.u-link-pijl:hover{color:var(--rood)}
.u-voorraad .meer{margin-top:40px;text-align:center}

/* Stappen */
.u-stappen{background:var(--u-grijs);padding:var(--sectie) 0}
.u-stappen h2{font-size:clamp(32px,3.4vw,48px);letter-spacing:-.03em;margin-bottom:48px}
.u-stappen-lijst{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.u-stappen-lijst li{background:var(--bg);border-radius:var(--radius);padding:32px 28px}
.u-nr{display:block;font:800 72px/1 var(--tekst);color:var(--rood);letter-spacing:-.04em;margin-bottom:20px}
.u-stappen-lijst h3{font-size:22px;margin-bottom:8px}
.u-stappen-lijst p{margin:0;color:var(--tekst2);font-size:17px}

/* Reviews */
.u-review-in{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,2fr);gap:clamp(32px,6vw,96px);align-items:start}
.u-score{display:flex;flex-direction:column;align-items:flex-start;gap:10px;border-top:4px solid var(--lijn-sterk);padding-top:20px}
.u-score h2{font-size:clamp(26px,2.4vw,34px);letter-spacing:-.02em}
.u-score-cijfer{font:800 clamp(64px,7vw,104px)/.9 var(--tekst);letter-spacing:-.05em}
.u-score .sterren{color:var(--rood)}
.u-score-bron{color:var(--tekst3);font-weight:600}
.u-citaat{margin:0}
.u-aanhaling{display:block;font:800 140px/.6 var(--tekst);color:var(--rood);height:56px}
.u-citaat blockquote{margin:0 0 20px;font-size:clamp(21px,2.1vw,29px);line-height:1.45;font-weight:500;letter-spacing:-.015em;color:var(--inkt)}
.u-citaat figcaption{color:var(--tekst3);font-size:17px}

/* FAQ */
.u-faq{border-top:1px solid var(--u-rand)}
.u-faq-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:clamp(32px,6vw,96px);align-items:start}
.u-faq-kop h2{font-size:clamp(32px,3.4vw,48px);letter-spacing:-.03em;margin-bottom:16px}
.u-faq-kop p{color:var(--tekst2);margin:0 0 24px;max-width:380px}
.u-faq .faq summary::after{color:var(--rood)}

/* Afsluitende contactsectie */
.u-bezoek{background:var(--diep);color:var(--licht);padding:var(--sectie) 0}
.u-bezoek-in{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:clamp(32px,6vw,96px);align-items:center}
.u-bezoek h2{color:var(--licht);font-size:clamp(32px,3.6vw,52px);letter-spacing:-.03em;margin:20px 0 12px}
.u-bezoek-lead{color:var(--tekst-op-zwart);font-size:18px;max-width:480px;margin:0 0 24px}
.u-stempel{display:inline-block;margin:0;border:2px solid var(--rood);border-radius:var(--radius);padding:6px 12px;font-weight:800;font-size:14px;letter-spacing:.12em;text-transform:uppercase}
.u-adres{font:800 clamp(28px,3vw,40px)/1.1 var(--tekst);letter-spacing:-.03em;margin:0 0 32px}
.u-bezoek-knoppen{gap:12px}
.u-knop-licht{background:var(--bg);color:var(--inkt)}
.u-knop-licht:hover{background:var(--u-grijs);color:var(--inkt)}
.u-knop-rand-licht{background:transparent;color:var(--licht);border:2px solid rgba(255,255,255,.55)}
.u-knop-rand-licht:hover{border-color:var(--licht);color:var(--licht)}
.u-bezoek-foto{border-radius:var(--radius);overflow:hidden;aspect-ratio:4/5}
.u-bezoek-foto img{width:100%;height:100%;object-fit:cover;object-position:50% 40%;display:block}

/* Tablet */
@media (max-width:1100px){
  .u-usp-in{grid-template-columns:repeat(2,minmax(0,1fr))}
  .u-budget-in{grid-template-columns:1fr;gap:24px}
}
@media (max-width:900px){
  .u-hero-in,.u-review-in,.u-faq-in,.u-bezoek-in{grid-template-columns:1fr}
  .u-bezoek-foto{aspect-ratio:4/3}
}
/* Telefoon */
@media (max-width:760px){
  .u-hero{padding:28px 0 40px}
  .u-hero h1{font-size:40px}
  .u-boventitel{font-size:13px;margin-bottom:14px}
  .u-lead{font-size:17px;margin-bottom:24px}
  .u-hero .knop,.u-bezoek .knop,.u-voorraad .meer .knop{width:100%}
  .u-feiten{margin-top:28px}
  .u-feiten dd{font-size:21px}
  .u-feiten div{padding-right:10px}.u-feiten div + div{padding-left:10px}
  .u-hero-beeld img{aspect-ratio:16/10}
  .u-usp{padding:24px 0}
  .u-usp-in{gap:16px 12px}
  .u-usp-item{flex-direction:column;align-items:flex-start;gap:8px}
  .u-usp-icoon{width:44px;height:44px}
  .u-usp-item h2{font-size:15px}
  .u-budget-tegels{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .u-tegel{padding:14px}
  .u-tegel-bedrag{font-size:26px}
  .u-tegel-aantal{font-size:14px}
  .raster{grid-template-columns:1fr 1fr;gap:24px 14px}
  .kaart h3{font-size:16px}.kaart-uitv{font-size:14px}.kaart-regel{font-size:13px}
  .prijsbord{font-size:15px;padding:6px 8px;right:6px;top:auto;bottom:6px}
  
  
  .u-sectie-kop{flex-direction:column;align-items:flex-start}
  .u-stappen h2{margin-bottom:28px}
  .u-stappen-lijst{grid-template-columns:1fr;gap:12px}
  .u-stappen-lijst li{padding:22px 20px;display:grid;grid-template-columns:auto 1fr;column-gap:18px}
  .u-nr{font-size:48px;margin:0;grid-row:span 2}
  .u-aanhaling{font-size:110px;height:44px}
}

/* =========================================================
   Aanbodpagina (versie 2)
   ========================================================= */
.aanbod-intro{display:flex;justify-content:space-between;align-items:flex-end;gap:16px 40px;flex-wrap:wrap;margin-bottom:28px}
.aanbod-intro .u-lead{margin:14px 0 0;max-width:620px}
.aanbod-teller{margin:0;font-size:17px;color:var(--tekst2);white-space:nowrap}
.aanbod-teller strong{display:inline-block;background:var(--rood);color:var(--op-chroom);font:800 20px/1 var(--tekst);padding:8px 12px;border-radius:var(--radius);margin-right:6px}
.aanbod-balk{display:flex;align-items:center;gap:12px 20px;flex-wrap:wrap;padding:16px 0;border-top:1px solid var(--u-rand);border-bottom:1px solid var(--u-rand);margin-bottom:28px}
.aanbod-gevonden{font:700 18px var(--tekst);letter-spacing:0;margin:0;color:var(--inkt)}
.filter-wis-link{font-weight:700;font-size:16px;color:var(--rood)}
.sorteer{margin-left:auto;display:flex;align-items:center;gap:10px;font-weight:600;font-size:15px;color:var(--tekst3)}
.sorteer select,.filters-uitgebreid select{min-height:48px;padding:10px 40px 10px 14px;border:1.5px solid var(--lijn-sterk);border-radius:var(--radius);background:var(--bg) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23292929' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center;-webkit-appearance:none;appearance:none;font:600 16px var(--tekst);color:var(--inkt);width:100%;min-width:0}
.sorteer select{width:auto}
.sorteer select:focus,.filters-uitgebreid select:focus{outline:2px solid var(--zwart);outline-offset:1px;border-color:var(--lijn-sterk)}
.filters-uitgebreid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;align-items:end}
.filters-uitgebreid > label,.filters-uitgebreid legend{display:flex;flex-direction:column;gap:6px;font-weight:600;font-size:14px;color:var(--tekst2)}
.filters-uitgebreid fieldset{border:0;margin:0;padding:0;min-width:0;grid-column:span 2;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.filters-uitgebreid legend{grid-column:1/-1;padding:0;margin-bottom:6px}
.filters-uitgebreid .prijs-filter{grid-column:1/-1;max-width:none}
.filter-paneel{background:var(--u-grijs);border-radius:var(--radius);padding:24px;margin-bottom:32px}
.geen-resultaat{text-align:center;padding:48px 20px;border:1.5px dashed var(--lijn-sterk);border-radius:var(--radius);margin-bottom:24px}
.geen-resultaat p{font-size:19px;margin:0 0 18px}

/* Badges op de foto */
.badge{position:absolute;left:10px;top:10px;padding:5px 10px;border-radius:var(--radius);font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;line-height:1.3}
.badge-nieuw{background:var(--bg);color:var(--inkt);box-shadow:0 1px 3px rgba(0,0,0,.15)}
.badge-gereserveerd{background:var(--diep);color:var(--licht)}
.badge-verkocht{background:var(--diep);color:var(--licht)}
.kaart.is-verkocht .kaart-foto img,.kaart.is-verkocht .geen-foto{filter:grayscale(1);opacity:.65}
.kaart.is-verkocht .prijsbord{background:var(--tekst3)}
.geen-foto{background:var(--foto)}
.kaart-uitv,.kaart-regel{overflow-wrap:anywhere}

@media (max-width:760px){
  .aanbod-intro{margin-bottom:20px}
  .aanbod-teller{font-size:15px}
  .aanbod-balk{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:12px 0}
  .aanbod-balk .filter-open{display:inline-flex;width:100%;margin:0;min-height:48px;gap:8px}
  .sorteer{margin:0}
  .sorteer span{display:none}
  .sorteer select{width:100%;min-height:48px;font-size:15px}
  .aanbod-gevonden{grid-column:1/-1;font-size:16px;order:3}
  .filter-wis-link{order:4;grid-column:1/-1}
  .filter-paneel{border-radius:0;padding:0}
  .filters-uitgebreid{grid-template-columns:1fr;padding:24px 20px;gap:18px}
  .filters-uitgebreid fieldset{grid-column:auto}
  .filters-uitgebreid select{min-height:52px;font-size:17px}
  .badge{left:6px;top:6px;font-size:10px;padding:4px 6px}
}
@media (max-width:760px){
  .filter-paneel.open{background:var(--u-grijs);height:100%;height:100dvh}
  .filter-voet{position:sticky;bottom:0;z-index:2}
}

/* =========================================================
   Autopagina (versie 2)
   ========================================================= */
.d-kop{display:flex;justify-content:space-between;align-items:flex-end;gap:16px 32px;flex-wrap:wrap;padding:8px 0 24px;border-bottom:1px solid var(--u-rand);margin-bottom:28px}
.d-titel{min-width:0;flex:1 1 480px}
.d-titel h1{font-size:clamp(34px,4.4vw,56px);line-height:1.05;letter-spacing:-.035em;margin:8px 0 14px}
.d-uitvoering{display:block;font-size:.45em;font-weight:600;letter-spacing:-.01em;color:var(--tekst2);margin-top:8px}
.d-kenmerken{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.d-kenmerken li{background:var(--u-grijs);border-radius:var(--radius);padding:7px 12px;font-weight:600;font-size:15px}
.d-prijs{background:var(--rood);color:var(--op-chroom);font:800 clamp(32px,3.6vw,48px)/1 var(--tekst);letter-spacing:-.02em;padding:16px 22px;border-radius:var(--radius);white-space:nowrap}
.d-prijs.is-verkocht{background:var(--tekst3)}
.badge-inline{display:inline-block;padding:5px 10px;border-radius:var(--radius);font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.badge-inline.badge-nieuw{background:var(--diep);color:var(--licht);box-shadow:none}
.d-in{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(300px,1fr);gap:40px;align-items:start}
.d-links{min-width:0}
.d-galerij{position:relative;border-radius:var(--radius);overflow:hidden;background:var(--foto);aspect-ratio:4/3}
.d-hoofd{display:block;width:100%;height:100%;padding:0;border:0;background:none;cursor:zoom-in;position:relative}
.d-hoofd img{width:100%;height:100%;object-fit:cover;display:block}
.d-teller{position:absolute;left:12px;bottom:12px;background:rgba(0,0,0,.7);color:var(--licht);font-weight:700;font-size:14px;padding:5px 10px;border-radius:var(--radius)}
.d-vergroot{position:absolute;right:12px;bottom:12px;width:40px;height:40px;border-radius:50%;background:rgba(0,0,0,.7);color:var(--licht);display:flex;align-items:center;justify-content:center}
.d-pijl{position:absolute;top:50%;transform:translateY(-50%);width:48px;height:48px;border-radius:50%;border:0;background:rgba(255,255,255,.92);color:var(--inkt);font-size:30px;line-height:1;cursor:pointer;box-shadow:var(--schaduw);display:flex;align-items:center;justify-content:center}
.d-vorige{left:12px}.d-volgende{right:12px}
.d-duimen{display:flex;gap:8px;overflow-x:auto;margin-top:10px;padding-bottom:4px;scrollbar-width:thin}
.d-duimen .duim{flex:0 0 96px;border:3px solid transparent;border-radius:var(--radius)}
.d-duimen .duim.actief{border-color:var(--rood)}
.geen-foto.groot{display:flex;align-items:center;justify-content:center;aspect-ratio:4/3;height:100%}
.d-sectie{margin-top:40px}
.d-sectie h2,.d-rechts h2{font-size:clamp(24px,2.2vw,30px);letter-spacing:-.02em;margin-bottom:16px}
.d-opties{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 24px}
.d-opties li{display:flex;align-items:center;gap:10px;font-weight:600;font-size:16px}
.d-onderhoud{margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.d-onderhoud div{background:var(--u-grijs);border-radius:var(--radius);padding:14px 16px}
.d-onderhoud dt{font-size:14px;color:var(--tekst3);margin-bottom:2px}
.d-onderhoud dd{margin:0;font-weight:600}
.d-rechts{display:flex;flex-direction:column;gap:20px;position:sticky;top:20px}
.d-acties{display:flex;flex-direction:column;gap:10px}
.d-acties .knop{width:100%}
.d-acties .klein{color:var(--tekst2);margin:0}
.d-verkocht-tekst{margin:0 0 6px}
.d-raamkaart{position:static;width:auto;box-shadow:none;border:1.5px solid var(--u-rand);border-radius:var(--radius);overflow:hidden}
.u-raamkaart-kop{background:var(--rood);color:var(--op-chroom);font-weight:800;font-size:14px;letter-spacing:.1em;text-transform:uppercase;padding:10px 18px}
.u-raamkaart ul{list-style:none;margin:0;padding:10px 18px 14px;background:var(--bg)}
.u-raamkaart li{display:flex;align-items:center;gap:10px;padding:8px 0;font-weight:600;font-size:16px;border-bottom:1px solid var(--u-rand)}
.u-raamkaart li:last-child{border-bottom:0}
.u-vink{flex:none;width:20px;height:20px;border-radius:50%;background:var(--diep);position:relative}
.u-vink::after{content:"";position:absolute;left:6px;top:3px;width:5px;height:10px;border:solid var(--licht);border-width:0 2.5px 2.5px 0;transform:rotate(45deg)}
.d-interesse{margin-top:var(--sectie);padding:clamp(48px,6vw,80px) 0}
.d-interesse-in{display:grid;grid-template-columns:minmax(0,1.2fr) auto;gap:24px 48px;align-items:end}
.d-interesse h2{color:var(--licht);font-size:clamp(30px,3.4vw,48px);margin:18px 0 10px}

/* Lightbox */
.lightbox{position:fixed;inset:0;z-index:100;background:rgba(15,15,15,.96);display:flex;align-items:center;justify-content:center}
.lightbox[hidden]{display:none}
.lb-foto{max-width:92vw;max-height:84vh;object-fit:contain;border-radius:var(--radius)}
.lb-sluit{position:absolute;top:16px;right:16px;width:52px;height:52px;border-radius:50%;border:0;background:var(--bg);color:var(--inkt);display:flex;align-items:center;justify-content:center;cursor:pointer}
.lb-pijl{position:absolute;top:50%;transform:translateY(-50%);width:56px;height:56px;border-radius:50%;border:0;background:rgba(255,255,255,.92);color:var(--inkt);font-size:34px;cursor:pointer;display:flex;align-items:center;justify-content:center}
.lb-vorige{left:16px}.lb-volgende{right:16px}
.lb-teller{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);color:var(--licht);font-weight:700}
body.lb-open{overflow:hidden}

@media (max-width:900px){
  .d-in{grid-template-columns:1fr}
  .d-rechts{position:static}
  .d-interesse-in{grid-template-columns:1fr}
}
@media (max-width:760px){
  .d-kop{padding-bottom:18px;margin-bottom:18px}
  .d-titel h1{font-size:32px}
  .d-kenmerken li{font-size:14px;padding:6px 10px}
  .d-prijs{font-size:32px;padding:12px 16px}
  .d-galerij{margin:0 -20px;border-radius:0}
  .d-pijl{width:40px;height:40px;font-size:26px}
  .d-duimen .duim{flex-basis:76px}
  .d-opties,.d-onderhoud{grid-template-columns:1fr}
  .d-interesse .knop{width:100%}
  .lb-pijl{width:44px;height:44px;font-size:28px}
  .lb-vorige{left:8px}.lb-volgende{right:8px}
}

@media (max-width:900px){
  .d-in{display:flex;flex-direction:column;gap:0}
  .d-links{display:contents}
  .d-galerij,.d-duimen{order:1}
  .d-rechts{order:2;margin-top:24px}
  .d-sectie{order:3}
}

/* =========================================================
   Over ons (versie 2) en locatieblok
   ========================================================= */
.o-intro{padding-bottom:clamp(32px,4vw,56px)}
.o-intro .pagina-titel{max-width:820px}
.o-intro .u-lead{max-width:680px;margin-top:20px}
.o-persoon{padding-bottom:var(--sectie)}
.o-persoon-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,6vw,80px);align-items:center}
.o-foto{border-radius:var(--radius);overflow:hidden;aspect-ratio:4/3;background:var(--foto)}
.o-foto img{width:100%;height:100%;object-fit:cover;object-position:50% 35%;display:block}
.o-rol{margin:0 0 10px;font-size:14px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--rood)}
.o-persoon-tekst h2{font-size:clamp(28px,3vw,40px);letter-spacing:-.03em;margin-bottom:18px}
.o-persoon-tekst p{font-size:18px;color:var(--tekst2);margin:0 0 14px;max-width:520px}
.o-waarden{background:var(--u-grijs)}
.o-waarden h2,.o-waarom h2{font-size:clamp(30px,3.2vw,44px);letter-spacing:-.03em;margin-bottom:36px}
.o-waarden-raster{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.o-waarde{background:var(--bg);border-radius:var(--radius);padding:28px 24px}
.o-waarde .u-usp-icoon{margin-bottom:18px}
.o-waarde h3{font-size:21px;margin-bottom:6px}
.o-waarde p{margin:0;color:var(--tekst2)}
.o-waarom-in{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.4fr);gap:clamp(24px,5vw,80px);align-items:start}
.o-lijst{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.o-lijst li{display:flex;gap:14px;align-items:flex-start;padding:16px 0;border-bottom:1px solid var(--u-rand);font-size:18px}
.o-lijst li:first-child{border-top:1px solid var(--u-rand)}
.o-lijst .u-vink{margin-top:4px;background:var(--rood)}
.o-cta{padding:clamp(48px,6vw,80px) 0}
.o-cta h2{color:var(--licht);font-size:clamp(30px,3.4vw,48px);margin:0 0 10px}

.locatie{border-top:1px solid var(--u-rand)}
.locatie-in{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.4fr);gap:clamp(24px,5vw,64px);align-items:center}
.locatie h2{font-size:clamp(30px,3.2vw,44px);letter-spacing:-.03em;margin-bottom:18px}
.locatie address{font-style:normal;font-size:22px;line-height:1.45;margin-bottom:18px}
.u-stempel-licht{color:var(--rood);margin-bottom:24px}
.kaart-vak{position:relative;aspect-ratio:16/10;border-radius:var(--radius);overflow:hidden;background:var(--u-grijs) repeating-linear-gradient(45deg,transparent 0 22px,rgba(0,0,0,.025) 22px 44px)}
.kaart-vak iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.kaart-laad{position:absolute;inset:0;width:100%;border:0;background:none;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:14px;font:16px var(--tekst);color:var(--inkt);text-align:left}
.kaart-laad svg{color:var(--rood)}
.kaart-laad small{color:var(--tekst3)}
.kaart-laad:hover strong{text-decoration:underline}

@media (max-width:1100px){ .o-waarden-raster{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:900px){ .o-persoon-in,.o-waarom-in,.locatie-in{grid-template-columns:1fr} }
@media (max-width:760px){
  .o-waarden-raster{grid-template-columns:1fr;gap:12px}
  .o-waarde{padding:22px 20px;display:grid;grid-template-columns:auto 1fr;column-gap:16px}
  .o-waarde .u-usp-icoon{grid-row:span 2;margin:0}
  .o-lijst li{font-size:17px}
  .o-cta .knop,.locatie .knop{width:100%}
  .kaart-vak{aspect-ratio:4/3}
  .locatie address{font-size:20px}
}

/* =========================================================
   Contact (versie 2)
   ========================================================= */
.k-lead{max-width:680px;margin:18px 0 40px}
.k-raster{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr);gap:clamp(28px,5vw,64px);align-items:start}
.k-knoppen{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:28px}
.k-lijst{margin:0;display:flex;flex-direction:column}
.k-lijst div{padding:16px 0;border-bottom:1px solid var(--u-rand)}
.k-lijst div:first-child{border-top:1px solid var(--u-rand)}
.k-lijst dt{font-size:14px;color:var(--tekst3);margin-bottom:2px}
.k-lijst dd{margin:0;font-size:20px;font-weight:700;overflow-wrap:anywhere}
.k-lijst a{text-decoration:none;border-bottom:2px solid var(--rood)}
.k-formulier{background:var(--u-grijs);border-radius:var(--radius);padding:clamp(22px,3vw,36px)}
.k-formulier h2{font-size:28px;letter-spacing:-.02em;margin-bottom:20px}
.k-formulier .veld input,.k-formulier .veld textarea{min-height:54px;font-size:17px}
.k-formulier .klein a{font-weight:700}
.knop[disabled]{opacity:.7;cursor:progress}
.k-afspraak{padding:clamp(48px,6vw,80px) 0}
.k-afspraak h2{color:var(--licht);font-size:clamp(28px,3.2vw,44px);margin:18px 0 10px}
@media (max-width:900px){ .k-raster{grid-template-columns:1fr} }
@media (max-width:760px){
  .k-knoppen{display:grid;grid-template-columns:1fr;gap:10px}
  .k-knoppen .knop,.k-afspraak .knop{width:100%}
  .k-lijst dd{font-size:18px}
  .k-formulier{margin:0 -20px;border-radius:0;padding:28px 20px}
}

/* Privacy */
.privacy{max-width:760px}
.privacy h2{font-size:24px;margin:36px 0 10px;letter-spacing:-.02em}
.privacy p,.privacy li{font-size:17px;color:var(--tekst2)}
.voet-onder a{color:var(--tekst-op-zwart)} .voet-onder a:hover{color:var(--licht)}
@media (max-width:900px){ .d-galerij,.d-duimen,.d-rechts,.d-sectie{width:100%} }
@media (max-width:760px){ .d-galerij{width:calc(100% + 40px)} }

/* ===== Huisstijl-overschrijvingen (zwart en chroom). Volgorde is belangrijk: deze regels winnen van de basis hierboven ===== */
/* Hoofdknop (bellen, appen, proefrit): amber met donkere tekst */

.knop-wit,.knop-rand{background:var(--puur-wit)}
/* Fouten blijven rood: dat is een waarschuwing, geen merkkleur */
.fout{color:var(--fout)} .veld .ster,.formulier .ster{color:var(--fout)}
.heeft-fout input{border-color:var(--fout)} .fout-blok{border-left-color:var(--fout)}
/* Prijs als groen prijsbord */
.prijsbord,.d-prijs,.aanbod-teller strong,.u-raamkaart-kop{background:var(--diep);color:var(--licht)}

/* Budgettegels in het groene blok */
.u-tegel-label{color:#B9BEC5}
 .u-tegel-rood:hover{background:var(--puur-wit);border-color:var(--puur-wit)}
 
/* Stempel op groen */
.u-stempel{border-color:#6B7178;color:#E4ECE7}
.u-bezoek-foto{background:var(--zwart-diep)}
.menu a:hover{color:var(--rood-licht)}
.geen-foto{color:#8A9099}

/* ===== Zwart en chroom: logo, koppen en accenten ===== */
h1,h2,.pagina-titel{font-family:var(--kop);font-weight:400;letter-spacing:-.005em;line-height:1.18}
h3,summary{font-family:var(--tekst)}
h1{font-size:clamp(28px,4.2vw,54px)} h2{font-size:clamp(22px,2.8vw,34px)}
.u-boventitel{font-family:var(--tekst);letter-spacing:.2em}
/* Hoofdknop chroom met donkere tekst */
.knop-rood{background:var(--amber);color:var(--op-amber)} .knop-rood:hover{background:var(--amber-hover);color:var(--op-amber)}
.knop-wit{background:var(--amber);color:var(--op-amber);border-color:var(--amber)} .knop-wit:hover{background:#FFFFFF;color:var(--op-amber)}
.knop-zwart{background:#2C2E32;color:var(--licht);border:1px solid var(--lijn-sterk)} .knop-zwart:hover{background:#3A3D42;color:var(--licht)}
.knop-rand{background:transparent;color:var(--licht);border-color:var(--lijn-sterk)} .knop-rand:hover{border-color:var(--licht);color:var(--licht)}
/* Prijzen als chroom plaatje */
.prijsbord,.d-prijs,.aanbod-teller strong,.u-raamkaart-kop{background:var(--rood);color:var(--op-chroom)}
/* Kop, topbalk en voet */
.kop{background:var(--bg);border-bottom:1px solid var(--lijn)}
.topbar{background:var(--diep);border-bottom:1px solid var(--lijn)}
.voet{background:var(--diep);border-top:1px solid var(--lijn)}
.logo img{width:auto} .voet-logo img{height:64px;width:auto}

/* Formulieren */
input,select,textarea{background-color:#232528;color:var(--licht);border-color:#4A4E54}
input::placeholder,textarea::placeholder{color:#8A9099}
/* Foto's iets rustiger, zodat de chroomkleurige prijzen opvallen */
.kaart img{filter:saturate(.9)}
.u-tegel-rood,.u-tegel-rood *{color:var(--op-chroom)} .u-tegel-rood{background:var(--rood);border-color:var(--rood)}
.u-tegel-rood .u-tegel-label{color:#3C4046}
/* Michroma heeft één dikte: nooit kunstmatig vet maken */
h1,h2,.pagina-titel,h1 *,h2 *{font-weight:400!important}
.logo img{height:84px} @media (max-width:760px){.logo img{height:56px}}
/* Bedragen en cijfers altijd in Inter: Michroma heeft geen goed eurosymbool */
.prijsbord,.d-prijs,.aanbod-teller strong,.u-tegel-bedrag,.u-feiten dd,.prijs-kop output{font-family:var(--tekst);font-variant-numeric:tabular-nums}

/* Veelgestelde vragen: Bel (chroom) en WhatsApp (antraciet) naast elkaar, net als de balk onderin */
.u-faq-knoppen{display:grid;grid-template-columns:1fr 1fr;gap:10px;max-width:420px}
.u-faq-knoppen .knop{width:100%;min-width:0}