/* Paginakleur van elk formulier = de warme tint van de rest van de site (24 sep 2026) */
body:has(.aanvraag-main){background:var(--warm2)}
.aanvraag-main{padding:112px 20px 64px;max-width:940px;margin:auto}
.aanvraag-head{text-align:center;margin:0 auto 28px;max-width:620px}
.aanvraag-head h1{font-size:clamp(28px,4vw,40px);margin-bottom:12px}
.aanvraag-head p{color:var(--t2)}
/* Stappenbalk — één component voor alle formulieren (besluit Sen 24 sep 2026: rondjes met lijntjes).
   Markup: <ol class="voortgang"><li aria-current="step"><span class="nr">1</span>Label</li>…</ol>
   JS zet alleen aria-current; 'klaar' (vinkje) volgt uit de volgorde via :has(). */
.voortgang{display:flex;justify-content:center;align-items:flex-start;list-style:none;margin:26px auto 28px;padding:0;max-width:560px}
.voortgang li{position:relative;flex:1;display:flex;flex-direction:column;align-items:center;gap:7px;
  font-size:13px;font-weight:600;color:var(--t2);text-align:center;line-height:1.3}
.voortgang li+li::before{content:"";position:absolute;top:15px;right:calc(50% + 22px);width:calc(100% - 44px);height:2px;background:var(--rand)}
.voortgang .nr{position:relative;z-index:1;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;
  border:2px solid var(--rand);background:#fff;font:700 13px/1 var(--body);color:var(--t2)}
.voortgang [aria-current=step]{color:var(--navy);font-weight:700}
.voortgang [aria-current=step] .nr{background:var(--blauw-h);border-color:var(--blauw-h);color:#fff}
.voortgang li:has(~ li[aria-current=step]){color:var(--blauw-d)}
.voortgang li:has(~ li[aria-current=step]) .nr{background:var(--licht);border-color:var(--blauw-h);color:transparent}
.voortgang li:has(~ li[aria-current=step]) .nr::after{content:"✓";position:absolute;color:var(--blauw-h);font-size:14px}
.voortgang li:has(~ li[aria-current=step]) + li::before,.voortgang [aria-current=step]::before{background:var(--blauw-h)}
.formulierkaart{background:white;border-radius:18px;padding:32px;box-shadow:0 4px 20px #0f1b2d08}
.formulierkaart h2{font-size:25px;margin-bottom:12px}.formulierkaart .sub{color:var(--t2);margin-bottom:24px}
.velden{display:grid;grid-template-columns:1fr 1fr;gap:18px}.veld-breed{grid-column:1/-1}
.aanvraag-main label{display:block;font-size:14px;font-weight:600;margin-bottom:6px}
.aanvraag-main input:not([type=checkbox]),.aanvraag-main select,.aanvraag-main textarea{width:100%;min-height:48px;border:1px solid #aebbc9;border-radius:8px;padding:11px 12px;background:white;color:var(--navy);font:inherit;font-size:16px}
.aanvraag-main textarea{min-height:100px;resize:vertical}.aanvraag-main input[type=file]{border-style:dashed;font-size:14px}
/* Safari tekent een <select> met eigen macOS-stijl en negeert dan hoogte en padding (24 sep 2026):
   eigen uiterlijk + pijltje, zodat keuzelijsten even hoog zijn als invulvakken in elke browser. */
.aanvraag-main select{-webkit-appearance:none;appearance:none;padding-right:40px;cursor:pointer;
  background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%233D7A9E' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 14px center}
.aanvraag-main input:focus,.aanvraag-main select:focus,.aanvraag-main textarea:focus{outline:3px solid #c8e1ef;outline-offset:0;border-color:var(--blauw-h)}
/* Bestandsknop in huisstijl i.p.v. de grijze browserknop */
.aanvraag-main input[type=file]{cursor:pointer;padding:9px 12px}
.aanvraag-main input[type=file]::file-selector-button{font:600 14px var(--body);color:var(--blauw-d);background:var(--licht);
  border:1px solid var(--blauw-h);border-radius:8px;padding:8px 14px;margin-right:12px;cursor:pointer}
.aanvraag-main input[type=file]::file-selector-button:hover{background:#fff}
.aanvraag-main :disabled{opacity:.65;cursor:wait}.veld-hint{font-size:13px;color:var(--t2);margin:6px 0 0}
.tekstknop{border:0;background:none;color:var(--blauw-d);text-decoration:underline;font:inherit;cursor:pointer;min-height:44px}
.form-acties{display:flex;gap:16px;justify-content:space-between;align-items:center;margin-top:24px;flex-wrap:wrap}
.knop.secundair{background:white;color:var(--blauw-d)!important;border:1px solid var(--blauw-h)}
.foutmelding{border-left:4px solid #b32e2e;background:#fff2f1;color:#822020;padding:16px;margin:16px 0;border-radius:6px}
.prijsresultaat{background:var(--licht);padding:24px;border-radius:12px;margin:24px 0}
.prijsresultaat strong{display:block;font:800 clamp(28px,6vw,40px)/1.2 Satoshi,sans-serif;margin:6px 0 12px}
.samenvatting{list-style:none}.samenvatting li{padding:14px 0;border-bottom:1px solid var(--rand)}.samenvatting small{display:block;color:var(--t2);font-size:14px}
.vervolgkeuze{display:grid;gap:12px}.vervolgkeuze button{text-align:left;display:block;width:100%;padding:18px;border:1px solid var(--rand);background:white;border-radius:10px;font:inherit;cursor:pointer;color:var(--navy)}
.vervolgkeuze button:hover{border-color:var(--blauw-h);background:var(--warm)}.vervolgkeuze b{display:block}.vervolgkeuze span{font-size:14px;color:var(--t2)}
.form-zeker{font-size:14px;color:var(--t2);margin-top:20px;text-align:center}.formulierkaart[hidden],.aanvraag-main [hidden]{display:none!important}
.valstrik{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.ontvangst{text-align:center;padding:30px 0}.ontvangst h2{margin-bottom:16px}.ontvangst p{margin:14px 0}.ontvangst .knop{margin-top:18px}
/* Configurator /offerte (spec OFFERTE.md, A7) — overgenomen uit de rolluikroute (keuzekaarten, chips,
   drie-weg vervolgkeuze) zodat er één formulierstijl blijft (besluit Sen 24 sep 2026). */
.keuzes{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px}
.keuzekaart{position:relative;display:flex;flex-direction:column;text-align:left;font:inherit;color:var(--navy);background:#fff;
  border:1px solid #aebbc9;border-radius:12px;padding:20px;cursor:pointer;transition:border-color .15s ease,background .15s ease}
.keuzekaart:hover{border-color:var(--blauw-h)}
.keuzekaart:focus-visible,.chipknoppen button:focus-visible,.tegels .tegel:focus-visible{outline:3px solid var(--blauw-h);outline-offset:2px}
.keuzekaart[aria-pressed=true]{border-color:var(--blauw-h);background:var(--licht);box-shadow:inset 0 0 0 1px var(--blauw-h)}
.keuzekaart h3{font-size:19px;margin:0 28px 3px 0}
.keuzekaart .sub{font-size:14px;color:var(--blauw-h);font-weight:600;margin:0 0 12px}
.keuzekaart ul{list-style:none;padding:0;margin:0 0 12px}
.keuzekaart li{position:relative;color:var(--t2);font-size:14px;padding:0 0 6px 18px;line-height:1.4}
.keuzekaart li::before{content:"✓";position:absolute;left:0;color:var(--blauw-h);font-weight:800}
.keuzekaart .prijs{margin:auto 0 0;padding-top:8px;font:800 19px/1.3 var(--kop);color:var(--navy)}
.keuzekaart .reden{margin:auto 0 0;padding-top:8px;font-size:14px;font-weight:600;color:var(--t2)}
.keuzekaart .vink{position:absolute;right:13px;top:13px;width:24px;height:24px;display:none;place-items:center;border-radius:50%;
  background:var(--blauw-h);color:#fff;font-size:13px;font-style:normal}
.keuzekaart[aria-pressed=true] .vink{display:grid}
/* Niet leverbaar: blijft zichtbaar, grijs, met de reden eronder — niet verbergen (spec) */
.keuzekaart[aria-disabled=true]{cursor:not-allowed;background:#f4f5f7;border-color:var(--rand);color:var(--t2)}
.keuzekaart[aria-disabled=true]:hover{border-color:var(--rand)}
.keuzekaart[aria-disabled=true] li::before{color:var(--t2)}
.keuzekaart[aria-disabled=true] .sub{color:var(--t2)}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}.chips:empty{display:none}
.chips .chip{border:1px solid var(--rand);background:#fff;border-radius:54px;padding:4px 11px;font-size:13px;color:var(--t2)}
.maatregel{display:grid;grid-template-columns:.7fr 1fr 1fr auto;gap:14px;align-items:end;padding:16px;background:var(--warm);
  border:1px solid var(--rand);border-radius:12px;margin-bottom:12px}
.maat-weg{justify-self:start}
.samenvatting li{display:flex;justify-content:space-between;align-items:center;gap:12px}
.regel-acties{display:flex;gap:14px;flex-shrink:0}
.zonder-prijs{list-style:none;margin:10px 0 0;font-size:14px;color:var(--t2)}.zonder-prijs:empty{display:none}
.zonder-prijs li{padding:2px 0}
.tegels{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:26px;padding-top:18px;border-top:1px solid var(--rand);font-size:14px;color:var(--t2)}
.tegels>div{display:flex;flex-wrap:wrap;gap:8px}
.tegels .tegel,.chipknoppen button{font:600 14px var(--body);color:var(--blauw-d);background:#fff;border:1px solid var(--rand);border-radius:8px;
  padding:8px 14px;min-height:44px;cursor:pointer}
.tegels .tegel:hover,.chipknoppen button:hover{border-color:var(--blauw-h)}
.dagdeel{margin:0 0 22px;padding:16px;background:var(--warm);border:1px solid var(--rand);border-radius:12px}
.chipknoppen{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.chipknoppen button[aria-pressed=true]{border-color:var(--blauw-h);background:var(--licht);box-shadow:inset 0 0 0 1px var(--blauw-h);color:var(--navy)}
@media(prefers-reduced-motion:reduce){.keuzekaart{transition:none}}
/* Kop krijgt focus bij elke stapwissel (schermlezer); geen ring, want het is geen bedieningselement */
.formulierkaart h2[tabindex="-1"]:focus{outline:none}
@media(max-width:600px){.keuzes{grid-template-columns:1fr}.maatregel{grid-template-columns:.8fr 1fr 1fr;gap:10px;padding:14px}.maat-weg{grid-column:1/-1}.samenvatting li{flex-direction:column;align-items:flex-start}.aanvraag-main{padding:98px 16px 40px}.formulierkaart{padding:22px 16px}.velden{grid-template-columns:1fr}.voortgang li{font-size:12px}.form-acties>.knop{width:100%;text-align:center}.aanvraag-head{text-align:left}.aanvraag-head p{font-size:15px}}

/* Inmeten plannen in het formulier (7 okt 2026) */
.inmeetkeuze .veld-hint{margin:6px 0 0}
.inmeetdag{margin-top:14px}
.inmeetdag>b{font-size:15px}
.inmeetdag .chipknoppen button{display:flex;flex-direction:column;align-items:flex-start;min-width:150px;text-align:left}
.inmeetdag .chipknoppen small{font-size:13px;color:var(--t2)}
#inmeet-alternatief .tekstknop{padding:0;font:inherit;text-decoration:underline}