@import url('https://fonts.googleapis.com/css2?family=Archivo:ital,wght@0,500;0,600;0,700;1,600&family=Karla:wght@400;500;700&display=swap');
#brx-header,#brx-footer,.hentry>h1{display:none!important}
html{scroll-behavior:smooth}
body{background:#fff!important;margin:0}
body>article,body>main,body>#brx-content,.hentry{width:100%!important;flex:1 1 100%!important}
#brx-content,main,.hentry{background:#fff!important;padding:0!important;max-width:none!important;margin:0!important}
.hentry section,section.hentry{margin:0!important}

.vg{--ink:#1B2430;--ink2:#454B5E;--zacht:#6E7488;--zand:#F4F3F0;--zand2:#E9E7E2;
    --lijn:#E2E1DD;--brons:#A9762F;--brons2:#C08F45;--vuur:#E9A13B;--vuur2:#F2B357;
    --diep:#111922;
    font-family:'Karla','Segoe UI',system-ui,sans-serif;color:var(--ink);
    font-size:17px;line-height:1.62;-webkit-font-smoothing:antialiased}
.vg *{box-sizing:border-box}
/* Rasterkolommen krimpen standaard niet onder de breedte van hun inhoud
   (min-width:auto). Een tabel met min-width:520px duwde daardoor de hele kolom
   en dus de pagina breder dan het scherm; de scrollbalk om de tabel deed dan
   niets meer. Gemeten op 19 aug: 158 tot 295 pixels overloop op bijna elke
   pagina bij 390px breed. Dit is de vaste oplossing. */
.vg .duo>*,.vg .wij>*,.vg .rondwerk>*,.vg .revwerk>*,.vg .hero .in>*,
.vg .kantlijn>*,.vg .titelrij>*,.vg .tegels>*,.vg .prijzen>*,.vg .routes>*,
.vg .vkaarten>*,.vg .teamrij>*,.vg .erkrij>*,.vg .strip>*,.vg .cases>*,
.vg .stappenrij>*,.vg .band>*,.vg .springnav .in>*{min-width:0}
.vg .tabelwrap{max-width:100%;min-width:0}
.vg .springnav .in{min-width:0}
/* ── vertrouwensband boven de voet ─────────────────────────────────────── */
.vg .vtband{background:var(--zand);border-top:1px solid var(--lijn);padding:38px 0}
.vg .vtrij{display:grid;grid-template-columns:repeat(6,1fr);gap:26px}
.vg .vtrij>*{min-width:0}
.vg .vt{border-left:3px solid var(--vuur);padding-left:14px}
.vg .vt b{display:block;font-family:'Archivo',sans-serif;font-weight:700;font-size:17px;
    letter-spacing:-.02em;color:var(--ink);margin-bottom:5px}
.vg .vt span{display:block;font-size:13.5px;line-height:1.5;color:var(--ink2)}

/* ── de voet: donkere grond, dus witte tekst ───────────────────────────── */
.vg .voet{background:var(--diep);color:#E8EAEE;padding:0 0 30px;margin-top:0}
.vg .voet a{color:#fff;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.22)}
.vg .voet a:hover{border-bottom-color:var(--vuur);color:var(--vuur)}

/* contactblok met formulier */
.vg .voetkop-blok{display:grid;grid-template-columns:1.05fr .95fr;gap:60px;
    padding:68px 0 56px;border-bottom:1px solid rgba(255,255,255,.13)}
.vg .voetkop-blok>*{min-width:0}
.vg .voet .oog{color:var(--vuur)!important}
.vg .voet .vk-links h2{color:#fff!important;font-size:clamp(28px,3.2vw,40px)!important;
    line-height:1.1!important;margin:10px 0 18px!important}
.vg .voet .vk-lood{font-size:17px!important;line-height:1.6!important;color:#BFC5CF!important;
    max-width:44ch;margin:0 0 26px!important}
.vg .vk-direct{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;margin-bottom:22px}
.vg .voet .vk-groot{font-family:'Archivo',sans-serif;font-weight:700;font-size:clamp(24px,2.6vw,32px);
    letter-spacing:-.02em;color:#fff;border-bottom:0}
.vg .voet .vk-groot:hover{color:var(--vuur)}
.vg .vk-tijd{font-size:14px;color:#98A0AC}
.vg .vk-knoppen{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:26px}
.vg .voet .knop.rand{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.32)}
.vg .voet .knop.rand:hover{border-color:var(--vuur);color:var(--vuur)}
.vg .voet .knop{border-bottom:0}
.vg .voet .vk-adres{font-size:14.5px!important;color:#98A0AC!important;line-height:1.6!important;
    margin:0!important}

/* het formulier */
.vg .vk-form{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.13);
    border-radius:16px;padding:28px}
.vg .voet .vf-kop{font-family:'Archivo',sans-serif;font-weight:700;font-size:18px!important;
    color:#fff!important;margin:0 0 18px!important}
.vg .vk-form .veld{margin-bottom:13px}
.vg .vk-form label{display:block;font-size:12.5px;font-weight:600;color:#BFC5CF;
    margin-bottom:5px;letter-spacing:.02em}
.vg .vk-form label span{font-weight:400;color:#7F8794}
.vg .voet .vk-form input,.vg .voet .vk-form select,.vg .voet .vk-form textarea{
    width:100%;padding:12px 14px;border-radius:9px;border:1px solid rgba(255,255,255,.28);
    background:#fff;color:var(--ink);font-family:'Karla',sans-serif;font-size:15px;
    resize:vertical;box-shadow:none}
.vg .voet .vk-form input::placeholder,.vg .voet .vk-form textarea::placeholder{color:#8A909C}
.vg .voet .vk-form input:focus,.vg .voet .vk-form select:focus,
.vg .voet .vk-form textarea:focus{outline:0;background:#fff;color:var(--ink);
    border-color:var(--vuur);box-shadow:0 0 0 3px rgba(233,161,59,.28)}
.vg .voet .vk-form select option{background:#fff;color:var(--ink)}
.vg .knop.breed{width:100%;justify-content:center;margin-top:4px}
.vg .voet .vf-fout{display:none;font-size:13.5px!important;color:#FFB4A8!important;
    margin:0 0 10px!important}
.vg .voet .vf-fout.aan{display:block}
.vg .voet .vf-melding{display:none;margin:14px 0 0!important;font-size:14.5px!important;
    color:#BFC5CF!important;line-height:1.5!important}
.vg .voet .vf-melding.aan{display:block}
.vg .voet .vf-melding b{display:block;color:var(--vuur);font-family:'Archivo',sans-serif;
    font-size:16px;margin-bottom:3px}
.vg .voet .vf-fijn{font-size:12.5px!important;color:#79818E!important;line-height:1.5!important;
    margin:14px 0 0!important}

/* linkkolommen */
.vg .voet .kol{display:grid;grid-template-columns:repeat(5,1fr);gap:34px;padding:48px 0 40px;
    border-bottom:1px solid rgba(255,255,255,.13)}
.vg .voet .kol>*{min-width:0}
.vg .voet .voetkop{font-family:'Archivo',sans-serif;font-weight:700;font-size:13px!important;
    letter-spacing:.08em;text-transform:uppercase;color:var(--vuur)!important;
    margin:0 0 14px!important}
.vg .voet .kol ul{list-style:none;margin:0;padding:0}
.vg .voet .kol li{margin-bottom:9px;font-size:14.5px!important;line-height:1.45!important}
.vg .voet .kol a{color:#C6CCD5;border-bottom:0}
.vg .voet .kol a:hover{color:var(--vuur)}

/* onderbalk */
.vg .onderbalk{display:grid;grid-template-columns:1fr 1.25fr;gap:44px;padding-top:26px}
.vg .onderbalk>*{min-width:0}
.vg .voet .onderbalk p{font-size:13px!important;line-height:1.6!important;color:#79818E!important;
    margin:0!important}
.vg .voet .onderbalk b{color:#BFC5CF}

@media(max-width:1180px){
.vg .vtrij{grid-template-columns:repeat(3,1fr);gap:22px}
.vg .voet .kol{grid-template-columns:repeat(3,1fr);gap:28px}
}
@media(max-width:900px){
.vg .voetkop-blok{grid-template-columns:1fr;gap:36px;padding:48px 0 40px}
.vg .onderbalk{grid-template-columns:1fr;gap:16px}
}
@media(max-width:640px){
.vg .vtband{padding:30px 0}
.vg .vtrij{grid-template-columns:1fr 1fr;gap:18px}
.vg .vt{padding-left:11px}
.vg .vt b{font-size:15.5px}
.vg .vt span{font-size:12.5px}
.vg .voet .kol{grid-template-columns:1fr 1fr;gap:24px;padding:36px 0 30px}
.vg .vk-form{padding:22px}
}
@media(max-width:420px){
.vg .vtrij{grid-template-columns:1fr}
.vg .voet .kol{grid-template-columns:1fr}
}

.vg .vk-beeld{margin:30px 0 0}
.vg .vk-beeld img{width:100%;height:230px;object-fit:cover;object-position:55% 36%;
    border-radius:14px;display:block}
.vg .voet .vk-beeld figcaption{font-size:13px!important;color:#79818E!important;
    margin:10px 0 0!important;line-height:1.5!important}
@media(max-width:900px){.vg .vk-beeld img{height:190px}}

@media(max-width:760px){
.vg .hero .heroFoto{object-position:48% 26%!important}
}

.vg .taalwissel{font-family:'Archivo',sans-serif;font-weight:700;font-size:13px;
    letter-spacing:.06em;border:1px solid var(--lijn);border-radius:999px;padding:5px 11px}
.vg .kop.opFoto .taalwissel{border-color:rgba(255,255,255,.35)}

/* ── zoeken ────────────────────────────────────────────────────────────── */
.vg .zoekbalk{position:relative;margin:0 0 10px}
.vg .zoekbalk input{width:100%;padding:20px 22px 20px 56px;font-size:19px;
    font-family:'Karla',sans-serif;color:var(--ink);background:#fff;
    border:2px solid var(--lijn);border-radius:14px}
.vg .zoekbalk input:focus{outline:0;border-color:var(--vuur);
    box-shadow:0 0 0 4px rgba(233,161,59,.2)}
.vg .zoekbalk svg{position:absolute;left:20px;top:50%;transform:translateY(-50%);
    color:var(--zacht);pointer-events:none}
.vg .zsnelrij{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 26px}
.vg .zsnel{font-size:14px;padding:7px 14px;border:1px solid var(--lijn);border-radius:999px;
    background:#fff;color:var(--ink2);text-decoration:none;cursor:pointer}
.vg .zsnel:hover{border-color:var(--vuur);color:var(--ink)}
.vg .ztel{font-size:14.5px!important;color:var(--zacht)!important;margin:0 0 18px!important}
.vg .zuit{display:grid;gap:12px}
.vg .ztreffer{display:block;padding:18px 20px;border:1px solid var(--lijn);border-radius:13px;
    background:#fff;text-decoration:none;transition:border-color .15s}
.vg .ztreffer:hover{border-color:var(--vuur)}
.vg .ztreffer b{display:block;font-family:'Archivo',sans-serif;font-size:18px;
    letter-spacing:-.015em;color:var(--ink);margin-bottom:5px}
.vg .ztaal{display:inline-block;margin-left:9px;font-family:'Karla',sans-serif;font-size:11.5px;
    font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--brons);
    border:1px solid var(--lijn);border-radius:999px;padding:2px 8px;vertical-align:middle}
.vg .zom{display:block;font-size:15px;line-height:1.5;color:var(--ink2);margin-bottom:7px}
.vg .zurl{display:block;font-size:12.5px;color:var(--zacht)}
@media(max-width:600px){
.vg .zoekbalk input{padding:16px 16px 16px 48px;font-size:17px}
.vg .zoekbalk svg{left:16px}
.vg .ztreffer{padding:15px 16px}
}

.vg .topzoek{display:inline-flex;align-items:center;gap:6px;margin-right:16px}

.vg .topzoek svg{opacity:.85}

/* De kaarttitel is de link; .lees is nu alleen nog een visueel duwtje en de
   .dek-laag vangt de klik op de hele kaart. */
.vg .vkaart h3 a{color:inherit;text-decoration:none}
.vg .vkaart:hover h3 a{color:var(--brons)}

/* ── thema-reset ───────────────────────────────────────────────────────────
   Bricks zet met "section > div:where(...)" elke sectie-container in een
   flexbox met align-items:flex-start en een eigen gap. Dat sloopt de breedte
   van alles met een min-width erin (tabellen) en voegt ruimte toe die wij
   nergens vragen. Hun selector weegt 0,0,2; deze weegt 0,1,2 en wint dus,
   terwijl al onze eigen .hero .in / .top .in / .rail .in (0,3,0) er overheen
   blijven gaan. Daarom staat hier geen !important. */
.vg section>div{display:block;align-items:normal;gap:0}
.vg .in{max-width:1200px;margin:0 auto;padding:0 26px}
.vg .in-s{max-width:830px;margin:0 auto;padding:0 26px}
.vg h1,.vg h2,.vg h3,.vg h4{font-family:'Archivo','Segoe UI',system-ui,sans-serif!important;
    font-weight:700!important;letter-spacing:-0.025em!important;line-height:1.06!important;
    margin:0 0 .5em!important;text-wrap:balance;color:var(--ink)}
.vg h1{font-size:clamp(36px,5vw,72px)!important;line-height:1.02!important;
    letter-spacing:-0.032em!important}
.vg h2{font-size:clamp(26px,2.6vw,34px)!important}
/* kernsecties krijgen een grotere kop dan tussensecties */
.vg .sec.kern h2,.vg .slot h2{font-size:clamp(30px,3.8vw,52px)!important;
    letter-spacing:-0.032em!important}
.vg h3{font-size:clamp(19px,1.5vw,23px)!important;letter-spacing:-0.014em!important}
.vg h1 em,.vg h2 em{font-style:italic;font-weight:600!important}
.vg p,.vg li{font-size:17px!important;line-height:1.62!important;font-family:'Karla','Segoe UI',sans-serif!important}
.vg p{margin:0 0 1.05em!important}
.vg a{color:inherit}
.vg .oog{font-family:'Archivo',sans-serif!important;font-size:12px!important;font-weight:700;
    letter-spacing:.14em;text-transform:uppercase;color:var(--brons);margin:0 0 15px;display:block}
.vg .oog:before{content:"";display:inline-block;width:22px;height:2px;
    background:currentColor;vertical-align:middle;margin-right:11px;transform:translateY(-1px)}
.vg .lood{font-size:18.5px!important;line-height:1.62!important;color:var(--ink2);max-width:60ch}

/* knoppen - leisteen als hoofdactie, Varel houdt het monochroom */
.vg .knop{display:inline-flex;align-items:center;gap:9px;background:var(--ink);color:#fff;
    text-decoration:none;font-family:'Archivo',sans-serif;font-weight:600;font-size:16px;
    padding:15px 28px;border-radius:8px;border:1px solid var(--ink);transition:.18s;cursor:pointer}
.vg .knop:hover{background:#3B4256;border-color:#3B4256}
.vg .knop.rand{background:#fff;color:var(--ink);border-color:#C9C7C1}
.vg .knop.rand:hover{border-color:var(--ink)}
.vg .knop.vuur{background:var(--vuur);color:#20180A;border-color:var(--vuur);font-weight:700}
.vg .knop.vuur:hover{background:var(--vuur2);border-color:var(--vuur2)}
.vg .knop.glas{background:transparent;color:#fff;border-color:rgba(255,255,255,.55);font-weight:600}
.vg .knop.glas:hover{background:rgba(255,255,255,.12);border-color:#fff}
.vg .knop.groot{padding:18px 34px;font-size:17px}
.vg .knop.wit{background:#fff;color:var(--ink);border-color:#fff}
.vg .knop.wit:hover{background:var(--zand)}
.vg .knop.vol{width:100%;justify-content:center}
.vg .knop.klein{padding:11px 20px;font-size:15px}
.vg .knop:after{content:"\2192";font-size:15px;opacity:.72}
.vg .knop.geen:after{content:none}

/* kop */
.vg .top{background:var(--ink);color:#B7BBC7;font-size:13.5px}
.vg .top .in{display:flex;justify-content:space-between;align-items:center;min-height:40px;gap:20px}
.vg .top .pt{color:var(--brons2);margin-right:8px}
.vg .top a{color:#fff;text-decoration:none;font-weight:700}
.vg .topacties{display:flex;align-items:center;gap:16px}
.vg .top .wa{display:inline-flex;align-items:center;gap:7px;color:#fff;font-weight:600;
    background:#1E8E4E;padding:5px 12px;border-radius:999px;font-size:12.5px}
.vg .top .wa:hover{background:#23A25A}
.vg .top .wa svg{flex:none}
.vg .kop{background:#fff;border-bottom:1px solid var(--lijn);position:sticky;top:0;z-index:60}
.vg .kop.opFoto{background:transparent;border-bottom-color:rgba(255,255,255,.16);position:absolute;
    left:0;right:0;top:40px;z-index:40}
.vg .kop.opFoto .merk{color:#fff}
.vg .kop.opFoto .merk i{color:var(--vuur)}
.vg .kop.opFoto .nav a{color:#E4E8EE}
.vg .kop.opFoto .nav a:hover,.vg .kop.opFoto .nav a.nu{color:#fff;border-color:var(--vuur)}
.vg .kop.opFoto .knop{background:var(--vuur);border-color:var(--vuur);color:#20180A;font-weight:700}
.vg .kop.opFoto .knop:hover{background:var(--vuur2);border-color:var(--vuur2)}
.vg .metFoto{position:relative}
.vg .kop .in{display:flex;align-items:center;gap:28px;height:76px}
.vg .merk{font-family:'Archivo',sans-serif;font-weight:700;font-size:21px;letter-spacing:-.035em;
    text-decoration:none;color:var(--ink);white-space:nowrap}
.vg .merk i{font-style:italic;font-weight:600;color:var(--brons)}
.vg .nav{display:flex;gap:24px;margin-left:auto}
.vg .nav a{text-decoration:none;font-size:15.5px;color:var(--ink2);font-weight:500;padding:5px 0;
    border-bottom:2px solid transparent;white-space:nowrap}
.vg .nav a:hover,.vg .nav a.nu{color:var(--ink);border-color:var(--brons)}
.vg .hamb{display:none;margin-left:auto;background:none;border:1px solid var(--lijn);
    border-radius:9px;width:46px;height:44px;cursor:pointer;padding:0;align-items:center;
    justify-content:center;flex-direction:column;gap:5px}
.vg .hamb i{display:block;width:20px;height:2px;background:var(--ink);border-radius:2px;transition:.2s}
.vg .kop.opFoto .hamb{border-color:rgba(255,255,255,.4)}
.vg .kop.opFoto .hamb i{background:#fff}
.vg .mobmenu{display:none;position:fixed;inset:0;z-index:200;background:rgba(17,25,34,.55)}
.vg .mobmenu.aan{display:block}
.vg .mobmenu .vak{position:absolute;top:0;right:0;bottom:0;width:min(340px,86vw);background:#fff;
    padding:22px;overflow-y:auto;display:flex;flex-direction:column}
.vg .mobmenu .sluit{align-self:flex-end;background:none;border:0;font-size:30px;line-height:1;
    cursor:pointer;color:var(--ink);padding:4px 8px}
.vg .mobmenu nav{display:flex;flex-direction:column;margin:10px 0 20px}
.vg .mobmenu nav a{padding:15px 4px;border-bottom:1px solid var(--lijn);text-decoration:none;
    font-family:'Archivo',sans-serif;font-weight:600;font-size:18px;color:var(--ink)}
.vg .mobmenu .knop{margin-bottom:10px}
.vg .mobmenu .mfijn{font-size:14px;color:var(--zacht);margin-top:auto;padding-top:18px}
.vg .mobmenu .mfijn a{color:var(--ink);font-weight:700;text-decoration:none}

/* een vaste balk onderaan op mobiel: de volgende stap altijd binnen duimbereik */
.vg .mobbalk{display:none;position:fixed;left:0;right:0;bottom:0;z-index:120;background:#fff;
    border-top:1px solid var(--lijn);padding:8px 10px calc(8px + env(safe-area-inset-bottom));
    box-shadow:0 -8px 24px rgba(17,25,34,.14)}
.vg .mobbalk .rijtje{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.vg .mobbalk a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
    padding:9px 4px;border-radius:10px;text-decoration:none;font-family:'Archivo',sans-serif;
    font-size:11.5px;font-weight:600;color:var(--ink);background:var(--zand);border:1px solid var(--lijn);
    line-height:1.15;text-align:center;min-height:56px}
.vg .mobbalk a svg{width:19px;height:19px;flex:none}
.vg .mobbalk a.hoofd{background:var(--vuur);border-color:var(--vuur);color:#20180A}
.vg .mobbalk a.wa{background:#1E8E4E;border-color:#1E8E4E;color:#fff}
.vg .mobbalk a:active{transform:scale(.97)}

/* hero - schermvullende foto met onze eigen mensen erin.
   Marc: "niet het stoere en opvallende zoals CameraInstallatie wel heeft".
   Dat komt daar van vol-bleed beeld, een witte kop eroverheen en een knop die
   knalt. Hier hetzelfde principe, maar warmer: geen koud marineblauw maar een
   diepe warme schaduw, en onze monteurs levensgroot in beeld. */
.vg .hero{position:relative;background:var(--diep);color:#fff;overflow:hidden;isolation:isolate;
    min-height:min(760px,86vh);display:flex;align-items:center}
.vg .heroFoto{position:absolute;inset:0;z-index:-3;width:100%;height:100%;object-fit:cover;
    object-position:60% 45%}
.vg .hero:before{content:"";position:absolute;inset:0;z-index:-2;
    background:linear-gradient(96deg,rgba(17,25,34,.93) 0%,rgba(17,25,34,.86) 38%,
    rgba(17,25,34,.55) 62%,rgba(17,25,34,.30) 100%)}
.vg .hero:after{content:"";position:absolute;left:0;right:0;bottom:0;height:34%;z-index:-2;
    background:linear-gradient(to top,rgba(17,25,34,.72),rgba(17,25,34,0))}
.vg .hero .in{position:relative;display:grid;grid-template-columns:1.15fr .85fr;gap:40px;
    align-items:end;padding-top:118px;padding-bottom:0;width:100%}
.vg .hero h1{color:#fff;margin-bottom:.42em!important}
.vg .hero .lood{color:#DDE2E9;font-size:19px!important;max-width:52ch}
.vg .hero .oog{color:var(--vuur)}
.vg .hero .oog:before{background:var(--vuur);width:26px}
.vg .hero .acties{display:flex;gap:13px;flex-wrap:wrap;margin-top:30px}
.vg .heroTekst{padding-bottom:52px}
/* de vier claims staan IN de hero, niet in een balk eronder */
.vg .heroClaims{display:grid;grid-template-columns:1fr 1fr;gap:16px 26px;margin-top:34px;
    padding-top:26px;border-top:1px solid rgba(255,255,255,.2)}
.vg .heroClaims div{display:flex;gap:11px;font-size:14.5px;line-height:1.4;color:#DDE2E9}
.vg .heroClaims b{color:#fff;font-weight:700}
.vg .heroClaims i{flex:none;width:19px;height:10px;margin-top:5px;border-left:2.5px solid var(--vuur);
    border-bottom:2.5px solid var(--vuur);transform:rotate(-45deg)}
/* onze monteurs, uitgeknipt, levensgroot rechts in beeld */
.vg .heroMensen{align-self:end;display:block;margin:0}
.vg .heroMensen img{width:100%;max-height:600px;object-fit:contain;object-position:bottom;
    display:block;filter:drop-shadow(0 24px 44px rgba(0,0,0,.55))}

/* beoordeling, massief - geen matglas */
.vg .beoordeling{display:inline-flex;align-items:center;gap:13px;background:var(--zand);
    border:1px solid var(--lijn);border-radius:10px;padding:11px 18px;margin-top:26px;text-decoration:none}
.vg .hero .beoordeling{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.24)}
.vg .hero .beoordeling .cijfer{color:#fff}
.vg .hero .beoordeling .sterren{color:var(--vuur)}
.vg .hero .beoordeling small{color:#B9C0CA}
.vg .beoordeling .cijfer{font-family:'Archivo',sans-serif;font-weight:700;font-size:20px;
    color:var(--ink);font-variant-numeric:tabular-nums;line-height:1}
.vg .beoordeling .sterren{color:var(--vuur);font-size:13px;letter-spacing:2px;line-height:1}
.vg .beoordeling small{display:block;font-size:12.5px;color:var(--zacht);margin-top:3px}

/* claimrail */
.vg .rail{background:var(--zand);border-bottom:1px solid var(--lijn)}
.vg .rail .in{display:grid;grid-template-columns:repeat(4,1fr);gap:34px;padding-top:30px;padding-bottom:30px}
.vg .rail b{display:block;font-family:'Archivo',sans-serif;font-size:15.5px;margin-bottom:3px}
.vg .rail span{font-size:14px;color:var(--zacht);line-height:1.45;display:block}
.vg .rail b:before{content:"";display:inline-block;width:14px;height:7px;margin-right:11px;
    border-left:2.5px solid var(--brons);border-bottom:2.5px solid var(--brons);
    transform:rotate(-45deg) translateY(-2px)}

/* secties */
.vg .sec{padding:84px 0;overflow-x:clip}
.vg .sec.kern{padding:124px 0}
.vg .sec.krap{padding:60px 0}
.vg .sec.zand{background:var(--zand)}
.vg .sec.donker{background:var(--ink);color:#fff}
.vg .sec.donker h2,.vg .sec.donker h3{color:#fff}
.vg .sec.donker .lood,.vg .sec.donker p,.vg .sec.donker li{color:#C8CBD4}
.vg .sec.donker .oog{color:var(--brons2)}
.vg .titelrij{display:flex;justify-content:space-between;align-items:flex-end;gap:34px;margin-bottom:46px}
.vg .titelrij .lood{margin:0!important}
.vg .titelrij h2{margin-bottom:0!important}

/* keuzehulp-schakelaar: laat de bezoeker zichzelf meteen herkennen */
.vg .schakel{display:inline-flex;background:#fff;border:1px solid var(--lijn);border-radius:10px;padding:4px;gap:4px;flex-wrap:wrap}
.vg .schakel button{border:0;background:none;font-family:'Archivo',sans-serif;font-weight:600;font-size:15px;
    padding:10px 20px;border-radius:7px;cursor:pointer;color:var(--ink2);transition:.15s}
.vg .schakel button.nu{background:var(--ink);color:#fff}

/* fototegels */
.vg .tegels{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.vg .tegel{position:relative;background:#fff;border:1px solid var(--lijn);border-radius:14px;
    overflow:hidden;display:flex;flex-direction:column;color:inherit;transition:.2s}
.vg .tegel:hover{border-color:#C3C1BA;transform:translateY(-3px);box-shadow:0 16px 30px -22px rgba(44,49,64,.45)}
.vg .tegel .beeld{aspect-ratio:4/3;overflow:hidden;background:var(--zand)}
.vg .tegel .beeld img{width:100%;height:100%;object-fit:cover;display:block}
.vg .tegel .tekst{padding:22px 22px 24px;flex:1;display:flex;flex-direction:column}
.vg .tegel h3{margin-bottom:8px!important}
.vg .tegel p{font-size:15.5px!important;color:var(--ink2);margin:0 0 14px!important;flex:1}
.vg .tegel .lees{font-family:'Archivo',sans-serif;font-weight:600;font-size:14.5px;
    color:var(--ink);text-decoration:none;align-self:flex-start}
.vg .dek:after{content:"";position:absolute;inset:0;z-index:1}
.vg .tegel:focus-within{outline:2px solid var(--brons);outline-offset:2px}
.vg .tegel .lees:after{content:" \2192";color:var(--brons)}

/* realisaties: groot beeld, massief label op een verloop */
.vg .cases{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.vg .case{position:relative;border-radius:14px;overflow:hidden;aspect-ratio:16/11;display:block;
    background:var(--zand)}
.vg .case:focus-within{outline:2px solid var(--brons);outline-offset:3px}
.vg .case img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s cubic-bezier(.2,.7,.3,1)}
.vg .case:hover img{transform:scale(1.04)}
.vg .case .band{position:absolute;left:0;right:0;bottom:0;padding:56px 22px 20px;color:#fff;
    background:linear-gradient(to top,rgba(28,32,42,.88),rgba(28,32,42,.44) 55%,rgba(28,32,42,0))}
.vg .case .band b{display:block;font-family:'Archivo',sans-serif;font-size:18px;font-weight:600;line-height:1.2}
.vg .case .band span{font-size:13.5px;color:rgba(255,255,255,.85)}
.vg .case.breed{grid-column:span 2;aspect-ratio:21/8}

/* beeld naast tekst */
.vg .duo{display:grid;grid-template-columns:1fr 1fr;gap:58px;align-items:center}
.vg .duo.om .fig{order:2}
.vg .fig{margin:0}
.vg .fig img{width:100%;display:block;border-radius:14px}
.vg .fig figcaption{font-size:13.5px;color:var(--zacht);margin-top:11px;padding-left:13px;
    border-left:2px solid var(--brons)}
.vg .sec.donker .fig figcaption{color:#9EA3B1}

/* lijstjes */
.vg .vink{list-style:none;padding:0;margin:0 0 22px}
.vg .vink li{padding-left:30px;position:relative;margin-bottom:11px;font-size:16.5px!important}
.vg .vink li:before{content:"";position:absolute;left:1px;top:8px;width:15px;height:8px;
    border-left:2.5px solid var(--brons);border-bottom:2.5px solid var(--brons);transform:rotate(-45deg)}
.vg .sec.donker .vink li:before{border-color:var(--brons2)}

/* pakketten */
.vg .prijzen{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;align-items:stretch}
.vg .prijs{background:#fff;border:1px solid var(--lijn);border-radius:14px;overflow:hidden;
    display:flex;flex-direction:column;position:relative}
.vg .prijs.uit{border-color:var(--ink);box-shadow:0 18px 36px -26px rgba(44,49,64,.5)}
.vg .prijs .pbeeld{height:168px;background:#fff;border-bottom:1px solid var(--lijn);display:flex;align-items:center;justify-content:center;padding:18px}
.vg .prijs .pbeeld img{max-height:100%;max-width:100%;object-fit:contain}
.vg .prijs .pin{padding:24px;display:flex;flex-direction:column;flex:1}
.vg .prijs .merk2{font-size:12px!important;letter-spacing:.12em;text-transform:uppercase;
    color:var(--zacht);font-family:'Archivo',sans-serif;margin:0 0 6px!important}
.vg .prijs .bedrag{display:block;font-family:'Archivo',sans-serif;font-size:52px;
    font-weight:700;letter-spacing:-.04em;margin:14px 0 0;font-variant-numeric:tabular-nums;
    line-height:.95}
.vg .prijs .bedrag small{display:block;font-size:13px;font-weight:500;color:var(--zacht);
    letter-spacing:.02em;margin-top:8px;line-height:1.3}
.vg .prijs .vink{flex:1;margin-bottom:18px}
.vg .prijs .vink li{font-size:15.5px!important;margin-bottom:8px}
.vg .lint{position:absolute;top:14px;right:14px;z-index:2;background:var(--brons);color:#fff;
    font-family:'Archivo',sans-serif;font-size:11.5px;font-weight:700;letter-spacing:.1em;
    text-transform:uppercase;padding:6px 12px;border-radius:6px}

/* middelenstrip - product groot en scherp op een rustige grond */
.vg .strip{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.vg .mid{position:relative;background:#fff;border:1px solid var(--lijn);border-radius:12px;
    padding:18px 14px 18px;text-align:center;color:inherit;transition:.18s}
.vg .mid a{text-decoration:none}
.vg .mid:focus-within{outline:2px solid var(--brons);outline-offset:2px}
.vg .mid:hover{border-color:var(--ink);transform:translateY(-2px)}
.vg .mid img{width:100%;height:92px;object-fit:contain;margin-bottom:11px}
.vg .mid b{display:block;font-family:'Archivo',sans-serif;font-size:14.5px;margin-bottom:3px}
.vg .mid span{font-size:13px;color:var(--zacht);line-height:1.35;display:block}

/* wie wij zijn */
.vg .wij{display:grid;grid-template-columns:.78fr 1.22fr;gap:52px;align-items:center}
.vg .wij .port img{width:100%;max-height:460px;object-fit:contain;object-position:bottom;display:block}
.vg .cijfers{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-top:36px;
    padding-top:26px;border-top:1px solid rgba(255,255,255,.18)}
.vg .cijfers b{display:block;font-family:'Archivo',sans-serif;font-size:60px;color:#fff;font-weight:700;
    letter-spacing:-.035em;font-variant-numeric:tabular-nums;line-height:1}
.vg .cijfers span{font-size:13.5px;color:#9EA3B1;display:block;margin-top:7px;line-height:1.4}

/* vraag en antwoord */
.vg .qa{border-top:1px solid var(--lijn)}
.vg .qa details{border-bottom:1px solid var(--lijn)}
.vg .qa summary{cursor:pointer;padding:21px 46px 21px 0;font-family:'Archivo',sans-serif;
    font-weight:600;font-size:17.5px;position:relative;list-style:none}
.vg .qa summary::-webkit-details-marker{display:none}
.vg .qa summary:after{content:"+";position:absolute;right:8px;top:16px;font-size:26px;
    color:var(--brons);font-weight:500;line-height:1}
.vg .qa details[open] summary:after{content:"\2013"}
.vg .qa .antw{padding:0 46px 22px 0;color:var(--ink2)}
.vg .qa .antw p{margin:0 0 .8em!important}
.vg .qa .antw p:last-child{margin-bottom:0!important}

/* de check */
.vg .kaart{background:#fff;border:1px solid var(--lijn);border-radius:14px;padding:30px}
.vg .kaart.diep{box-shadow:0 18px 40px -30px rgba(44,49,64,.55)}
.vg .veld{margin-bottom:15px}
.vg .veld label{display:block;font-size:13.5px;font-weight:700;margin-bottom:7px;color:var(--ink2)}
.vg .veld input,.vg .veld select,.vg .veld textarea{width:100%;padding:12px 14px;border:1px solid #D6D4CE;
    border-radius:8px;font-family:inherit;font-size:15.5px;background:#fff;color:var(--ink)}
.vg .veld textarea{min-height:88px;resize:vertical}
.vg input:focus,.vg select:focus,.vg textarea:focus,.vg .knop:focus-visible,
.vg .nav a:focus-visible,.vg summary:focus-visible,.vg .schakel button:focus-visible,
.vg .keus:focus-within{outline:2px solid var(--brons);outline-offset:2px}
.vg .tweeop{display:grid;grid-template-columns:1.35fr 1fr;gap:12px}
.vg .keuzes{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:6px}
.vg .keus{display:flex;align-items:center;gap:11px;border:1px solid #D6D4CE;border-radius:9px;
    padding:13px 15px;cursor:pointer;font-size:15.5px;transition:.15s;background:#fff}
.vg .keus:hover{border-color:var(--ink)}
.vg .keus input{width:auto;margin:0;accent-color:var(--brons)}
.vg .keus.aan{border-color:var(--ink);background:var(--zand)}
.vg .stap{display:none}
.vg .stap.aan{display:block}
.vg .stappen{display:flex;gap:6px;margin-bottom:20px}
.vg .stappen i{height:3px;flex:1;background:var(--lijn);border-radius:2px}
.vg .stappen i.aan{background:var(--brons)}
.vg .terug{background:none;border:0;color:var(--zacht);font-size:13.5px;cursor:pointer;
    padding:12px 0 0;font-family:inherit;text-decoration:underline}
.vg .uitslag{display:none}
.vg .uitslag.aan{display:block}
.vg .uitslag .vak{background:var(--zand);border-left:3px solid var(--brons);border-radius:0 10px 10px 0;
    padding:20px 22px;margin-bottom:20px}
.vg .uitslag .vak b{display:block;font-family:'Archivo',sans-serif;font-size:20px;margin-bottom:6px}
.vg .uitslag .vak .bed{font-family:'Archivo',sans-serif;font-size:29px;font-weight:700;
    letter-spacing:-.03em;margin:12px 0 2px;font-variant-numeric:tabular-nums;display:block}
.vg .fout{color:#9B2C2C;font-size:14px;margin-top:8px;display:none}
.vg .fout.aan{display:block}

/* meelopende subnavigatie voor lange pagina's */
.vg .springnav{position:sticky;top:76px;z-index:50;background:#fff;border-bottom:1px solid var(--lijn)}
.vg .springnav .in{display:flex;gap:6px;overflow-x:auto;padding-top:10px;padding-bottom:10px;scrollbar-width:none}
.vg .springnav .in::-webkit-scrollbar{display:none}
.vg .springnav a{white-space:nowrap;text-decoration:none;font-family:'Archivo',sans-serif;
    font-size:14.5px;font-weight:500;color:var(--ink2);padding:8px 15px;border-radius:7px;transition:.15s}
.vg .springnav a:hover{background:var(--zand);color:var(--ink)}
.vg .springnav a.nu{background:var(--ink);color:#fff}
.vg [id^="deel-"]{scroll-margin-top:142px}

/* merkenstrip */
.vg .merken{display:flex;flex-wrap:wrap;gap:14px 38px;align-items:center;justify-content:center}
.vg .merken span{font-family:'Archivo',sans-serif;font-weight:600;font-size:16.5px;color:#8E8C86}
.vg .merken em{font-style:normal;font-size:12px;color:var(--zacht);width:100%;text-align:center;
    font-family:'Karla',sans-serif;letter-spacing:.12em;text-transform:uppercase;margin-bottom:2px}

/* afsluiter */
.vg .slot{background:var(--ink);color:#fff;text-align:center}
.vg .slot .in-s{padding-top:78px;padding-bottom:78px}
.vg .slot h2{color:#fff}
.vg .slot p{color:#C8CBD4}
.vg .slot .acties{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:26px}

/* auteur en voet */
.vg .auteur{display:flex;gap:16px;align-items:flex-start;padding:22px;background:var(--zand);
    border-radius:12px;font-size:14.5px;color:var(--ink2);line-height:1.55}
.vg .auteur img{width:58px;height:58px;border-radius:50%;object-fit:cover;object-position:top;flex:none;background:#fff}
.vg .auteur b{color:var(--ink)}
    color:#fff;letter-spacing:.09em;text-transform:uppercase;margin:0 0 15px!important}

/* ── het rondje om je huis ─────────────────────────────────────────────── */
.vg .rondje{background:var(--zand);border-top:1px solid var(--lijn);border-bottom:1px solid var(--lijn)}
.vg .rondwerk{display:grid;grid-template-columns:1fr 1.18fr;gap:46px;align-items:start}
.vg .plattegrond{position:relative;background:#fff;border:1px solid var(--lijn);border-radius:16px;
    padding:20px;position:sticky;top:104px;box-shadow:0 18px 40px -32px rgba(27,36,48,.6)}
.vg .plat{width:100%;height:auto;display:block}
.vg .punt{position:absolute;transform:translate(-50%,-50%);width:38px;height:38px;border-radius:50%;
    border:2.5px solid var(--ink);background:#fff;color:var(--ink);cursor:pointer;padding:0;
    font-family:'Archivo',sans-serif;font-weight:700;font-size:15px;transition:.18s;
    box-shadow:0 4px 12px -2px rgba(27,36,48,.4)}
.vg .punt span{display:block;line-height:1}
.vg .punt:hover{transform:translate(-50%,-50%) scale(1.12)}
.vg .punt.nu{background:var(--ink);color:#fff}
.vg .punt.nu:after{content:"";position:absolute;inset:-7px;border-radius:50%;
    border:2.5px solid var(--vuur);opacity:.95}
.vg .punt:focus-visible{outline:3px solid var(--brons);outline-offset:3px}

.vg .tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}
.vg .tab{display:inline-flex;align-items:center;gap:9px;border:1px solid var(--lijn);background:#fff;
    border-radius:999px;padding:8px 16px 8px 9px;cursor:pointer;font-family:'Karla',sans-serif;
    font-size:14.5px;color:var(--ink2);transition:.15s}
.vg .tab i{font-style:normal;width:23px;height:23px;border-radius:50%;background:var(--zand2);
    color:var(--ink);display:grid;place-items:center;font-family:'Archivo',sans-serif;
    font-weight:700;font-size:12.5px}
.vg .tab:hover{border-color:#C3C1BA}
.vg .tab.nu{background:var(--ink);border-color:var(--ink);color:#fff}
.vg .tab.nu i{background:var(--vuur);color:#20180A}

.vg .paneel{display:none;background:#fff;border:1px solid var(--lijn);border-radius:14px;overflow:hidden}
.vg .paneel.aan{display:grid;grid-template-columns:.9fr 1.1fr}
.vg .pfoto{background:var(--zand)}
.vg .pfoto.render{background:#fff;display:grid;place-items:center;padding:26px}
.vg .pfoto.render img{object-fit:contain;min-height:0;max-height:290px;width:auto;max-width:100%}
.vg .pfoto img{width:100%;height:100%;min-height:300px;object-fit:cover;display:block}
.vg .ptekst{padding:26px}
.vg .pnr{display:block;font-family:'Archivo',sans-serif;font-size:11.5px;font-weight:600;
    letter-spacing:.13em;text-transform:uppercase;color:var(--brons);margin-bottom:10px}
.vg .punt:focus-visible{outline:3px solid var(--vuur);outline-offset:3px}
.vg .paneel h3{margin-bottom:12px!important}
.vg .paneel p{font-size:15.5px!important;color:var(--ink2);margin:0 0 14px!important}
.vg .paneel p b{color:var(--ink)}
.vg .pvoet{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
    border-top:1px solid var(--lijn);padding-top:16px;margin-top:4px}
.vg .pvanaf{font-size:14px;color:var(--zacht)}
.vg .pvanaf b{font-family:'Archivo',sans-serif;font-size:21px;color:var(--ink);
    letter-spacing:-.02em;font-variant-numeric:tabular-nums}

@media(max-width:980px){
 .vg .rondwerk{grid-template-columns:1fr;gap:26px}
 .vg .plattegrond{position:relative;top:auto;max-width:520px;margin:0 auto}
 .vg .paneel.aan{grid-template-columns:1fr}
 .vg .pfoto img{min-height:220px;max-height:280px}
}
@media(max-width:640px){
 .vg .punt{width:32px;height:32px;font-size:13.5px}
 .vg .tab{font-size:13.5px;padding:7px 13px 7px 8px}
}
@media(prefers-reduced-motion:reduce){
 .vg .punt,.vg .tab,.vg .tegel,.vg .case img{transition:none!important}
 .vg .case:hover img{transform:none}
}

/* ── werkwijze: vier stappen met echt beeld ────────────────────────────── */
/* Marc: "dit is onze brochure, mensen zien dit, dit is het eerste moment van
   spreken". Dus niet vier iconen met een zin, maar vier foto's van ons eigen
   werk met wat er die stap ��cht gebeurt. De nummers kloppen: het is een volgorde. */
.vg .stappenrij{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;counter-reset:stap}
.vg .stapkaart{background:#fff;border:1px solid var(--lijn);border-radius:14px;overflow:hidden;
    display:flex;flex-direction:column}
.vg .stapkaart .sbeeld{position:relative;aspect-ratio:5/4;overflow:hidden;background:var(--zand)}
.vg .stapkaart .sbeeld img{width:100%;height:100%;object-fit:cover;display:block}
.vg .stapkaart .snr{position:absolute;left:14px;top:14px;width:38px;height:38px;border-radius:50%;
    background:var(--vuur);color:#20180A;display:grid;place-items:center;
    font-family:'Archivo',sans-serif;font-weight:700;font-size:17px;
    box-shadow:0 4px 12px -2px rgba(0,0,0,.35)}
.vg .stapkaart .stekst{padding:20px 20px 22px}
.vg .stapkaart h3{font-size:18px!important;margin-bottom:7px!important}
.vg .stapkaart p{font-size:15px!important;color:var(--ink2);margin:0!important}
.vg .stapkaart .wanneer{display:block;font-family:'Archivo',sans-serif;font-size:11.5px;
    font-weight:600;letter-spacing:.11em;text-transform:uppercase;color:var(--brons);margin-bottom:8px}

/* ── fotoband: vol-bleed strook eigen werk ─────────────────────────────── */
.vg .band{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.vg .band figure{position:relative;margin:0;aspect-ratio:1/1;overflow:hidden}
.vg .band img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s cubic-bezier(.2,.7,.3,1)}
.vg .band figure:hover img{transform:scale(1.05)}
.vg .band figcaption{position:absolute;left:0;right:0;bottom:0;padding:40px 18px 15px;color:#fff;
    font-size:13.5px;line-height:1.35;
    background:linear-gradient(to top,rgba(17,25,34,.9),rgba(17,25,34,0))}
@media(max-width:980px){.vg .stappenrij{grid-template-columns:1fr 1fr}.vg .band{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.vg .stappenrij{grid-template-columns:1fr}}

/* ── de echte prijsladder van CameraInstallatie ────────────────────────── */
.vg .ladder{margin-top:40px;background:#fff;border:1px solid var(--lijn);border-radius:14px;padding:30px}
.vg .ladderkop{max-width:62ch;margin-bottom:24px}
.vg .ladderkop h3{margin-bottom:8px!important}
.vg .ladderkop p{font-size:15.5px!important;color:var(--ink2);margin:0!important}
.vg .ladderrij{display:grid;grid-template-columns:repeat(8,1fr);gap:1px;background:var(--lijn);
    border:1px solid var(--lijn);border-radius:10px;overflow:hidden}
.vg .trede{background:#fff;padding:16px 10px;text-align:center}
.vg .trede b{display:block;font-size:12.5px;font-weight:600;color:var(--zacht);
    font-family:'Archivo',sans-serif;margin-bottom:6px;letter-spacing:.02em}
.vg .trede span{display:block;font-family:'Archivo',sans-serif;font-weight:700;font-size:19px;
    letter-spacing:-.03em;font-variant-numeric:tabular-nums;color:var(--ink)}
.vg .ladderfijn{font-size:14px!important;color:var(--zacht);margin:18px 0 0!important}
.vg .ladderfijn a{color:var(--ink);font-weight:700}
@media(max-width:980px){.vg .ladderrij{grid-template-columns:repeat(4,1fr)}}
@media(max-width:520px){.vg .ladderrij{grid-template-columns:repeat(2,1fr)}}

/* ── vier routes naar contact ──────────────────────────────────────────── */
.vg .routes{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;align-items:stretch}
.vg .route{background:#fff;border:1px solid var(--lijn);border-radius:14px;padding:26px 24px;
    display:flex;flex-direction:column}
.vg .route.uit{border-color:var(--ink);box-shadow:0 18px 36px -26px rgba(27,36,48,.55)}
.vg .rnr{display:block;font-family:'Archivo',sans-serif;font-size:11.5px;font-weight:600;
    letter-spacing:.13em;text-transform:uppercase;color:var(--brons);margin-bottom:9px}
.vg .route h3{margin-bottom:9px!important}
.vg .route p{font-size:15px!important;color:var(--ink2);margin:0 0 16px!important}
.vg .route .vink{flex:1;margin-bottom:18px}
.vg .route .vink li{font-size:14.5px!important;margin-bottom:7px;padding-left:26px}
.vg .route .vink li:before{top:7px;width:13px;height:7px}
.vg .route .veld{margin-bottom:11px}
.vg .route .veld label{font-size:12.5px}
.vg .route .veld input,.vg .route .veld select{padding:10px 12px;font-size:14.5px}
.vg .routesvoet{text-align:center;margin:30px 0 0!important;font-size:15.5px!important;color:var(--ink2)}
.vg .routesvoet a{color:var(--ink)}
/* ── inhoudspagina's ───────────────────────────────────────────────────── */
.vg .hero.licht{background:#fff;color:var(--ink);min-height:0;display:block;border-bottom:1px solid var(--lijn)}
.vg .hero.licht:before,.vg .hero.licht:after{content:none}
.vg .hero.licht .in{grid-template-columns:1.05fr .95fr;align-items:center;
    padding-top:56px;padding-bottom:56px;gap:52px}
.vg .hero.licht h1{color:var(--ink)}
.vg .hero.licht .lood{color:var(--ink2)}
.vg .hero.licht .oog{color:var(--brons)}
.vg .hero.licht .oog:before{content:none}
.vg .hero.licht .heroBeeld{aspect-ratio:4/3;border-radius:14px;overflow:hidden;background:var(--zand)}

.vg .kruimel{font-size:13.5px;color:var(--zacht);margin-bottom:18px}
.vg .kruimel a{color:var(--ink2);text-decoration:none;border-bottom:1px solid var(--lijn)}
.vg .kruimel a:hover{border-color:var(--ink)}
.vg .kruimel span{margin:0 7px;color:#C0BEB8}
.vg .kruimel b{color:var(--ink);font-weight:600}

.vg .sec .in-s h2{margin-top:0!important}
.vg .sec .in-s h3{margin-top:1.6em!important;margin-bottom:.5em!important}
.vg .sec .in-s p:last-child{margin-bottom:0!important}
.vg .sec .in-s .duo{margin:30px 0}
.vg .sec .in-s ol{padding-left:22px;margin:0 0 1.1em}
.vg .sec .in-s ol li{margin-bottom:9px}

/* tabellen: op mobiel schuiven ze zelf, de pagina nooit */
.vg .tabelwrap{overflow-x:auto;border:1px solid var(--lijn);border-radius:12px;margin:0 0 12px}
.vg .tabelveeg{display:none}
@media(max-width:575px){
.vg .tabelveeg{display:block;margin:-4px 0 12px;font-size:12.5px;color:var(--zacht);
    letter-spacing:.02em}
.vg .tabelveeg::before{content:'94';margin-right:6px;opacity:.75}
}
.vg table{width:100%;border-collapse:collapse;min-width:520px;background:#fff}
.vg th{text-align:left;font-family:'Archivo',sans-serif;font-size:13px;letter-spacing:.06em;
    text-transform:uppercase;color:var(--zacht);padding:14px 16px;border-bottom:1px solid var(--lijn);
    white-space:nowrap}
.vg td{padding:14px 16px;border-bottom:1px solid var(--lijn);font-size:15.5px;vertical-align:top}
.vg tbody tr:last-child td{border-bottom:0}
.vg td:last-child,.vg th:last-child{font-variant-numeric:tabular-nums}
.vg .tabelvoet{font-size:13.5px!important;color:var(--zacht);margin:0 0 1.1em!important}

/* uitgelicht kader */
.vg .kader{border-radius:12px;padding:20px 22px;margin:26px 0;background:var(--zand);
    border-left:3px solid var(--brons)}
.vg .kader b{display:block;font-family:'Archivo',sans-serif;font-size:16px;margin-bottom:6px}
.vg .kader div{font-size:15.5px;color:var(--ink2);line-height:1.6}
.vg .kader div p{font-size:15.5px!important;margin:0 0 .7em!important}
.vg .kader div p:last-child{margin-bottom:0!important}
.vg .kader.let{border-left-color:var(--vuur);background:#FDF6EA}
.vg .kader.mis{border-left-color:#9B7B5B;background:#F6F1EA}

/* doorverwijzingen */
.vg .vkaarten{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.vg .vkaart{position:relative;background:#fff;border:1px solid var(--lijn);border-radius:14px;
    padding:24px;display:flex;flex-direction:column;transition:.18s}
.vg .vkaart:hover{border-color:#C3C1BA;transform:translateY(-3px)}
.vg .vkaart h3{margin-bottom:8px!important}
.vg .vkaart p{font-size:15px!important;color:var(--ink2);flex:1;margin:0 0 14px!important}
.vg .vkaart .lees{font-family:'Archivo',sans-serif;font-weight:600;font-size:14.5px;
    color:var(--ink);text-decoration:none;align-self:flex-start}
.vg .vkaart .lees:after{content:" 92";color:var(--brons)}
.vg .vkaart:focus-within{outline:2px solid var(--brons);outline-offset:2px}

.vg .fig.render{background:#fff;border:1px solid var(--lijn);border-radius:14px;padding:26px;
    display:grid;place-items:center}
.vg .fig.render img{max-height:300px;width:auto;max-width:100%;border-radius:0}
.vg .fig.render figcaption{grid-column:1;margin-top:16px;text-align:left;justify-self:start}

@media(max-width:980px){
 .vg .hero.licht .in{grid-template-columns:1fr;gap:30px;padding-top:38px;padding-bottom:38px}
 .vg .vkaarten{grid-template-columns:1fr 1fr}
}
@media(max-width:640px){.vg .vkaarten{grid-template-columns:1fr}}

/* ── beoordelingen ─────────────────────────────────────────────────────── */
.vg .revwerk{display:grid;grid-template-columns:.78fr 1.22fr;gap:44px;align-items:start}
.vg .revcijfer{background:var(--zand);border-radius:14px;padding:30px;position:sticky;top:104px}
.vg .revcijfer>b{display:block;font-family:'Archivo',sans-serif;font-size:78px;font-weight:700;
    line-height:.9;letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.vg .revcijfer .sterren{display:block;color:var(--vuur);font-size:19px;letter-spacing:3px;margin:10px 0 6px}
.vg .revuit{display:block;font-size:14.5px;color:var(--ink2)}
.vg .revuit b{color:var(--ink)}
.vg .revfijn{font-size:14.5px!important;color:var(--ink2);margin:18px 0 20px!important;
    padding-left:14px;border-left:2px solid var(--vuur)}
.vg .revlijst{display:flex;flex-direction:column;gap:18px}
.vg .rev{margin:0;background:#fff;border:1px solid var(--lijn);border-radius:14px;padding:26px 28px}
.vg .rev blockquote{margin:0 0 12px;font-size:17px;line-height:1.6;color:var(--ink)}
.vg .rev figcaption{font-size:13.5px;color:var(--zacht);padding-left:13px;border-left:2px solid var(--vuur)}
@media(max-width:980px){
 .vg .revwerk{grid-template-columns:1fr;gap:26px}
 .vg .revcijfer{position:static}
 .vg .revcijfer>b{font-size:60px}
}

/* ── drie tekstpatronen om af te wisselen ──────────────────────────────── */
/* Fable: "maximaal twee blokken van hetzelfde patroon per pagina, en nooit
   twee dezelfde achter elkaar". Dat is wat veel content van eenheidsworst
   scheidt. Drie patronen, elk voor een ander soort tekst. */

/* 1. Kantlijn - voor uitleg en wetgeving. Leest als een naslagwerk. */
.vg .kantlijn{display:grid;grid-template-columns:184px minmax(0,62ch);gap:0 40px;margin:0 0 34px}
.vg .kantlijn>.tk{grid-column:2}
.vg .kantlijn>aside{grid-column:1;font-size:14px;line-height:1.5;color:var(--zacht);
    text-align:right;padding-top:5px}
.vg .kantlijn>aside b{display:block;font-family:'Archivo',sans-serif;font-size:30px;
    font-weight:700;color:var(--ink);line-height:1;letter-spacing:-.03em;
    font-variant-numeric:tabular-nums;margin-bottom:6px}
.vg .kantlijn>.tk p:last-child{margin-bottom:0!important}

/* 2. Vraagreeks - voor tips en kosten. Geen accordeon: alles meteen leesbaar,
      en precies het formaat dat AI-zoekmachines letterlijk citeren. */
.vg .reeks h3{font-size:21px!important;border-top:1px solid var(--lijn);padding-top:26px;
    margin:32px 0 10px!important;letter-spacing:-.012em!important}
.vg .reeks h3:first-child{border-top:0;padding-top:0;margin-top:0!important}
.vg .reeks p{max-width:64ch}

/* 3. Genummerde gang - alleen waar de volgorde echt informatie draagt. */
.vg .gang{counter-reset:g;list-style:none;padding:0;margin:0 0 30px}
.vg .gang li{counter-increment:g;position:relative;padding:0 0 28px 62px;font-size:16.5px!important}
.vg .gang li:before{content:counter(g);position:absolute;left:0;top:-3px;width:38px;height:38px;
    border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;
    font-family:'Archivo',sans-serif;font-weight:700;font-size:16px}
.vg .gang li:after{content:"";position:absolute;left:18px;top:42px;bottom:0;width:2px;background:var(--lijn)}
.vg .gang li:last-child{padding-bottom:0}
.vg .gang li:last-child:after{display:none}
.vg .gang li b{display:block;font-family:'Archivo',sans-serif;font-size:17.5px;margin-bottom:5px}

/* een citaat van een monteur: eigen waarneming, dus amber lijn */
.vg blockquote.monteur{margin:26px 0;padding:0 0 0 18px;border-left:2px solid var(--vuur);
    font-size:19px;line-height:1.55;color:var(--ink)}
.vg blockquote.monteur cite{display:block;font-style:normal;font-size:14px;color:var(--zacht);
    margin-top:10px}
@media(max-width:900px){
 .vg .kantlijn{display:block}
 .vg .kantlijn>aside{text-align:left;border-left:2px solid var(--vuur);padding:2px 0 2px 14px;
     margin:0 0 20px}
 .vg .kantlijn>aside b{display:inline;font-size:20px;margin-right:8px}
}

/* ── het team met gezichten ────────────────────────────────────────────── */
.vg .teamrij{display:grid;grid-template-columns:repeat(5,1fr);gap:18px;margin:8px 0 30px}
.vg .persoon{background:#fff;border:1px solid var(--lijn);border-radius:14px;overflow:hidden;
    display:flex;flex-direction:column}
.vg .persoon .pf{background:#fff;aspect-ratio:4/5;overflow:hidden;display:flex;
    align-items:flex-end;justify-content:center;border-bottom:1px solid var(--lijn)}
.vg .persoon.werkfoto .pf{background:var(--zand)}
.vg .persoon .pf img{width:100%;height:100%;object-fit:contain;object-position:bottom;display:block}
.vg .persoon.werkfoto .pf img{object-fit:cover;object-position:50% 28%}
.vg .persoon .pt{padding:20px 22px 22px}
.vg .persoon b{display:block;font-family:'Archivo',sans-serif;font-size:19px;letter-spacing:-.02em}
.vg .persoon em{display:block;font-style:normal;font-size:12.5px;font-weight:700;
    letter-spacing:.11em;text-transform:uppercase;color:var(--brons);margin:4px 0 9px}
.vg .persoon p{font-size:15px!important;color:var(--ink2);margin:0!important}
@media(max-width:1100px){.vg .teamrij{grid-template-columns:repeat(3,1fr)}}
@media(max-width:800px){.vg .teamrij{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.vg .teamrij{grid-template-columns:1fr}}

/* ── erkenningen en partnerschappen ────────────────────────────────────── */
.vg .erkrij{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.vg .erk{background:#fff;border:1px solid var(--lijn);border-radius:12px;padding:20px 22px}
.vg .erk b{display:block;font-family:'Archivo',sans-serif;font-size:17px;letter-spacing:-.015em;
    margin-bottom:5px}
.vg .erk em{display:block;font-style:normal;font-size:11.5px;font-weight:700;letter-spacing:.11em;
    text-transform:uppercase;color:var(--brons);margin-bottom:9px}
.vg .erk p{font-size:14.5px!important;color:var(--ink2);margin:0!important}
@media(max-width:900px){.vg .erkrij{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.vg .erkrij{grid-template-columns:1fr}}

/* ── kort antwoord: het blok dat AI-zoekmachines citeren ───────────────── */
.vg .kort{background:var(--zand);border-left:3px solid var(--vuur);border-radius:0 12px 12px 0;
    padding:24px 26px;margin:0 0 34px}
.vg .kort b{display:block;font-family:'Archivo',sans-serif;font-size:12px;font-weight:700;
    letter-spacing:.13em;text-transform:uppercase;color:var(--brons);margin-bottom:10px}
.vg .kort p{font-size:18px!important;line-height:1.55!important;color:var(--ink);margin:0!important}

/* ── bronvermelding ────────────────────────────────────────────────────── */
.vg .bron{border-top:1px solid var(--lijn);margin-top:34px;padding-top:20px}
.vg .bron h3{font-size:15px!important;letter-spacing:.06em!important;text-transform:uppercase;
    color:var(--zacht);margin-bottom:12px!important}
.vg .bron ol{padding-left:20px;margin:0}
.vg .bron li{font-size:14.5px!important;color:var(--ink2);margin-bottom:9px}
.vg .bron a{color:var(--ink)}

/* ── situatieblokken ───────────────────────────────────────────────────── */
.vg .situatie{background:#fff;border:1px solid var(--lijn);border-radius:16px;padding:28px 30px;
    margin-bottom:22px}
.vg .skop{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:22px}
.vg .schip{display:inline-block;background:var(--zand2);color:var(--ink);border-radius:999px;
    padding:7px 15px;font-family:'Archivo',sans-serif;font-size:11.5px;font-weight:700;
    letter-spacing:.1em;text-transform:uppercase;white-space:nowrap}
.vg .skop h3{margin:0!important;flex:1;min-width:240px}
.vg .skolommen{display:grid;grid-template-columns:repeat(4,1fr);gap:26px;
    padding-bottom:22px;border-bottom:1px solid var(--lijn)}
.vg .slabel{display:block;font-family:'Archivo',sans-serif;font-size:11px;font-weight:700;
    letter-spacing:.12em;text-transform:uppercase;color:var(--zacht);margin-bottom:8px}
.vg .skolommen p{font-size:15px!important;color:var(--ink2);margin:0!important;line-height:1.55!important}
.vg .skolommen .sgoed{color:#1F6B45;font-weight:500}
.vg .cijferrij{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:20px}
.vg .cijfertegel{background:var(--zand);border-radius:10px;padding:14px 16px}
.vg .cijfertegel b{display:block;font-family:'Archivo',sans-serif;font-size:26px;font-weight:700;
    letter-spacing:-.03em;line-height:1;font-variant-numeric:tabular-nums;color:var(--ink)}
.vg .cijfertegel span{display:block;font-size:13px;color:var(--zacht);margin-top:6px;line-height:1.3}
.vg .situatievoet{font-size:14px!important;color:var(--zacht);margin:18px 0 0!important;
    padding-left:14px;border-left:2px solid var(--vuur)}
@media(max-width:900px){
 .vg .skolommen{grid-template-columns:1fr 1fr;gap:20px}
 .vg .cijferrij{grid-template-columns:1fr 1fr}
}
@media(max-width:560px){
 .vg .situatie{padding:22px 20px}
 .vg .skolommen{grid-template-columns:1fr}
}

/* ── cta-band midden in de pagina ──────────────────────────────────────── */
.vg .ctaband{background:var(--ink);color:#fff;border-radius:16px;padding:30px 34px;
    display:grid;grid-template-columns:1.3fr auto;gap:28px;align-items:center}
.vg .ctaband h3{color:#fff;margin:0 0 7px!important}
.vg .ctaband p{color:#C8CBD4;margin:0!important;font-size:15.5px!important;max-width:58ch}
.vg .ctaknoppen{display:flex;gap:11px;flex-wrap:wrap}
.vg .ctaband .knop.glas{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}
.vg .ctaband .knop.glas:hover{background:rgba(255,255,255,.1);border-color:#fff}
@media(max-width:820px){.vg .ctaband{grid-template-columns:1fr;padding:26px 24px}}

/* ── eigen illustraties ────────────────────────────────────────────────── */
.vg .illwrap{margin:30px 0;background:#fff;border:1px solid var(--lijn);border-radius:16px;
    padding:16px 16px 0;overflow:hidden}
.vg .ill{width:100%;height:auto;display:block;border-radius:10px}
.vg .illwrap figcaption{font-size:14px;color:var(--ink2);padding:16px 6px 18px;line-height:1.55;
    border-left:2px solid var(--vuur);margin:16px 0 0;padding-left:14px}
.vg .illmerk{display:block;font-size:12.5px;color:var(--zacht);margin-top:6px}

/* ── uitklapmenu in de vaste balk ──────────────────────────────────────── */
.vg .nav ul{list-style:none;display:flex;gap:2px;margin:0;padding:0}
.vg .nav li{position:relative}
.vg .nav li>a{display:flex;align-items:center;gap:6px;padding:10px 13px;border-radius:8px;
    border-bottom:0}
.vg .nav li>a:hover,.vg .nav li>a.nu{background:var(--zand);color:var(--ink);border-color:transparent}
.vg .kop.opFoto .nav li>a:hover,.vg .kop.opFoto .nav li>a.nu{background:rgba(255,255,255,.14);color:#fff}
.vg .pijl{width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;
    transform:rotate(45deg) translateY(-2px);opacity:.55;transition:.18s}
.vg .heeftsub:hover .pijl,.vg .heeftsub:focus-within .pijl{opacity:1;transform:rotate(225deg) translateY(-2px)}
.vg .sub{position:absolute;top:100%;left:-8px;z-index:70;min-width:520px;background:#fff;
    border:1px solid var(--lijn);border-radius:14px;padding:14px;margin-top:8px;
    box-shadow:0 26px 50px -26px rgba(27,36,48,.55);opacity:0;visibility:hidden;
    transform:translateY(-6px);transition:opacity .16s,transform .16s,visibility .16s}
.vg .heeftsub:hover .sub,.vg .heeftsub:focus-within .sub{opacity:1;visibility:visible;transform:none}
.vg .sub ul{display:grid;grid-template-columns:1fr 1fr;gap:2px;list-style:none;margin:0;padding:0}
.vg .sub li>a{display:block;padding:11px 13px;border-radius:9px;text-decoration:none}
.vg .sub li>a:hover{background:var(--zand)}
.vg .sub b{display:block;font-family:'Archivo',sans-serif;font-size:14.5px;font-weight:600;
    color:var(--ink);margin-bottom:2px}
.vg .sub span{display:block;font-size:12.5px;color:var(--zacht);line-height:1.35}
.vg .suballes{display:block;margin:10px 4px 2px;padding-top:12px;border-top:1px solid var(--lijn);
    font-family:'Archivo',sans-serif;font-size:13.5px;font-weight:600;color:var(--brons);
    text-decoration:none}
.vg .suballes:hover{color:var(--ink)}

/* mobiel menu met groepen */
.vg .mnav{display:flex;flex-direction:column;margin:10px 0 20px}
.vg .mnav .mhoofd{padding:15px 4px 12px;border-bottom:1px solid var(--lijn);text-decoration:none;
    font-family:'Archivo',sans-serif;font-weight:700;font-size:18px;color:var(--ink)}
.vg .msub{display:flex;flex-direction:column;padding:8px 0 12px 14px;
    border-left:2px solid var(--vuur);margin:8px 0 10px 4px}
.vg .msub a{padding:8px 0;text-decoration:none;font-size:15.5px;color:var(--ink2)}
.vg .msub a:hover{color:var(--ink)}

/* ── merkkaarten ───────────────────────────────────────────────────────── */
.vg .merk-k{display:grid;grid-template-columns:250px 1fr;gap:30px;background:#fff;
    border:1px solid var(--lijn);border-radius:16px;padding:26px 30px;margin-bottom:18px;
    align-items:start}
.vg .merk-k>*{min-width:0}
.vg .mk-beeld{background:var(--zand);border-radius:12px;padding:20px;display:grid;place-items:center;
    min-height:170px}
.vg .mk-beeld img{max-width:100%;max-height:150px;object-fit:contain;display:block}
.vg .mk-soort{display:block;font-family:'Archivo',sans-serif;font-size:11.5px;font-weight:700;
    letter-spacing:.11em;text-transform:uppercase;color:var(--brons);margin-bottom:7px}
.vg .merk-k h3{margin:0 0 11px!important;font-size:26px!important}
.vg .merk-k>.mk-tekst>p{font-size:16px!important;color:var(--ink2);margin:0 0 18px!important}
.vg .mk-twee{display:grid;grid-template-columns:1fr 1fr;gap:24px;padding-top:18px;
    border-top:1px solid var(--lijn)}
.vg .mk-twee>*{min-width:0}
.vg .mk-twee p{font-size:14.5px!important;color:var(--ink2);margin:0!important;line-height:1.55!important}
.vg .merk-k .lees{display:inline-block;margin-top:16px;font-family:'Archivo',sans-serif;
    font-weight:600;font-size:14.5px;color:var(--ink);text-decoration:none}
.vg .merk-k .lees:hover{color:var(--brons)}
@media(max-width:860px){
 .vg .merk-k{grid-template-columns:1fr;gap:20px;padding:22px 22px}
 .vg .mk-beeld{min-height:130px}
 .vg .mk-twee{grid-template-columns:1fr;gap:16px}
}

/* ── contenthub ────────────────────────────────────────────────────────── */
.vg .hubgroep{display:grid;grid-template-columns:300px 1fr;gap:44px;align-items:start}
.vg .hubgroep>*{min-width:0}
.vg .hubkop{position:sticky;top:104px}
.vg .hubkop h2{margin-bottom:12px!important}
.vg .hubkop p{font-size:15.5px!important;color:var(--ink2);margin:0!important}
.vg .hubrij{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.vg .hubitem{display:block;background:#fff;border:1px solid var(--lijn);border-radius:12px;
    padding:20px 22px;text-decoration:none;transition:.18s}
.vg .hubitem:hover{border-color:var(--ink);transform:translateY(-2px);
    box-shadow:0 14px 28px -22px rgba(27,36,48,.5)}
.vg .hubitem b{display:block;font-family:'Archivo',sans-serif;font-size:17px;font-weight:600;
    color:var(--ink);margin-bottom:6px;letter-spacing:-.012em}
.vg .hubitem b:after{content:" 92";color:var(--brons);opacity:0;transition:.18s}
.vg .hubitem:hover b:after{opacity:1}
.vg .hubitem span{display:block;font-size:14.5px;color:var(--ink2);line-height:1.5}
@media(max-width:1000px){
 .vg .hubgroep{grid-template-columns:1fr;gap:24px}
 .vg .hubkop{position:static}
}
@media(max-width:620px){.vg .hubrij{grid-template-columns:1fr}}

@media(max-width:1080px){.vg .routes{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.vg .routes{grid-template-columns:1fr}}

/* ── ingesloten agenda ─────────────────────────────────────────────────── */
.vg .agenda{background:#fff;border:1px solid var(--lijn);border-radius:14px;overflow:hidden}
.vg .agenda iframe{display:block;width:100%;border:0;min-height:1400px}

/* ── inhoudspagina's ───────────────────────────────────────────────────── */
.vg .hero.licht{background:#fff;color:var(--ink);min-height:0;display:block;border-bottom:1px solid var(--lijn)}
.vg .hero.licht:before,.vg .hero.licht:after{content:none}
.vg .hero.licht .in{grid-template-columns:1.05fr .95fr;align-items:center;
    padding-top:56px;padding-bottom:56px;gap:52px}
.vg .hero.licht h1{color:var(--ink)}
.vg .hero.licht .lood{color:var(--ink2)}
.vg .hero.licht .oog{color:var(--brons)}
.vg .hero.licht .oog:before{content:none}
.vg .hero.licht .heroBeeld{aspect-ratio:4/3;border-radius:14px;overflow:hidden;background:var(--zand)}

.vg .kruimel{font-size:13.5px;color:var(--zacht);margin-bottom:18px}
.vg .kruimel a{color:var(--ink2);text-decoration:none;border-bottom:1px solid var(--lijn)}
.vg .kruimel a:hover{border-color:var(--ink)}
.vg .kruimel span{margin:0 7px;color:#C0BEB8}
.vg .kruimel b{color:var(--ink);font-weight:600}

.vg .sec .in-s h2{margin-top:0!important}
.vg .sec .in-s h3{margin-top:1.6em!important;margin-bottom:.5em!important}
.vg .sec .in-s p:last-child{margin-bottom:0!important}
.vg .sec .in-s .duo{margin:30px 0}
.vg .sec .in-s ol{padding-left:22px;margin:0 0 1.1em}
.vg .sec .in-s ol li{margin-bottom:9px}

/* tabellen: op mobiel schuiven ze zelf, de pagina nooit */
.vg .tabelwrap{overflow-x:auto;border:1px solid var(--lijn);border-radius:12px;margin:0 0 12px}
.vg .tabelveeg{display:none}
@media(max-width:575px){
.vg .tabelveeg{display:block;margin:-4px 0 12px;font-size:12.5px;color:var(--zacht);
    letter-spacing:.02em}
.vg .tabelveeg::before{content:'94';margin-right:6px;opacity:.75}
}
.vg table{width:100%;border-collapse:collapse;min-width:520px;background:#fff}
.vg th{text-align:left;font-family:'Archivo',sans-serif;font-size:13px;letter-spacing:.06em;
    text-transform:uppercase;color:var(--zacht);padding:14px 16px;border-bottom:1px solid var(--lijn);
    white-space:nowrap}
.vg td{padding:14px 16px;border-bottom:1px solid var(--lijn);font-size:15.5px;vertical-align:top}
.vg tbody tr:last-child td{border-bottom:0}
.vg td:last-child,.vg th:last-child{font-variant-numeric:tabular-nums}
.vg .tabelvoet{font-size:13.5px!important;color:var(--zacht);margin:0 0 1.1em!important}

/* uitgelicht kader */
.vg .kader{border-radius:12px;padding:20px 22px;margin:26px 0;background:var(--zand);
    border-left:3px solid var(--brons)}
.vg .kader b{display:block;font-family:'Archivo',sans-serif;font-size:16px;margin-bottom:6px}
.vg .kader div{font-size:15.5px;color:var(--ink2);line-height:1.6}
.vg .kader div p{font-size:15.5px!important;margin:0 0 .7em!important}
.vg .kader div p:last-child{margin-bottom:0!important}
.vg .kader.let{border-left-color:var(--vuur);background:#FDF6EA}
.vg .kader.mis{border-left-color:#9B7B5B;background:#F6F1EA}

/* doorverwijzingen */
.vg .vkaarten{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.vg .vkaart{position:relative;background:#fff;border:1px solid var(--lijn);border-radius:14px;
    padding:24px;display:flex;flex-direction:column;transition:.18s}
.vg .vkaart:hover{border-color:#C3C1BA;transform:translateY(-3px)}
.vg .vkaart h3{margin-bottom:8px!important}
.vg .vkaart p{font-size:15px!important;color:var(--ink2);flex:1;margin:0 0 14px!important}
.vg .vkaart .lees{font-family:'Archivo',sans-serif;font-weight:600;font-size:14.5px;
    color:var(--ink);text-decoration:none;align-self:flex-start}
.vg .vkaart .lees:after{content:" 92";color:var(--brons)}
.vg .vkaart:focus-within{outline:2px solid var(--brons);outline-offset:2px}

.vg .fig.render{background:#fff;border:1px solid var(--lijn);border-radius:14px;padding:26px;
    display:grid;place-items:center}
.vg .fig.render img{max-height:300px;width:auto;max-width:100%;border-radius:0}
.vg .fig.render figcaption{grid-column:1;margin-top:16px;text-align:left;justify-self:start}

@media(max-width:980px){
 .vg .hero.licht .in{grid-template-columns:1fr;gap:30px;padding-top:38px;padding-bottom:38px}
 .vg .vkaarten{grid-template-columns:1fr 1fr}
}
@media(max-width:640px){.vg .vkaarten{grid-template-columns:1fr}}

/* ── beoordelingen ─────────────────────────────────────────────────────── */
.vg .revwerk{display:grid;grid-template-columns:.78fr 1.22fr;gap:44px;align-items:start}
.vg .revcijfer{background:var(--zand);border-radius:14px;padding:30px;position:sticky;top:104px}
.vg .revcijfer>b{display:block;font-family:'Archivo',sans-serif;font-size:78px;font-weight:700;
    line-height:.9;letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.vg .revcijfer .sterren{display:block;color:var(--vuur);font-size:19px;letter-spacing:3px;margin:10px 0 6px}
.vg .revuit{display:block;font-size:14.5px;color:var(--ink2)}
.vg .revuit b{color:var(--ink)}
.vg .revfijn{font-size:14.5px!important;color:var(--ink2);margin:18px 0 20px!important;
    padding-left:14px;border-left:2px solid var(--vuur)}
.vg .revlijst{display:flex;flex-direction:column;gap:18px}
.vg .rev{margin:0;background:#fff;border:1px solid var(--lijn);border-radius:14px;padding:26px 28px}
.vg .rev blockquote{margin:0 0 12px;font-size:17px;line-height:1.6;color:var(--ink)}
.vg .rev figcaption{font-size:13.5px;color:var(--zacht);padding-left:13px;border-left:2px solid var(--vuur)}
@media(max-width:980px){
 .vg .revwerk{grid-template-columns:1fr;gap:26px}
 .vg .revcijfer{position:static}
 .vg .revcijfer>b{font-size:60px}
}

/* ── drie tekstpatronen om af te wisselen ──────────────────────────────── */
/* Fable: "maximaal twee blokken van hetzelfde patroon per pagina, en nooit
   twee dezelfde achter elkaar". Dat is wat veel content van eenheidsworst
   scheidt. Drie patronen, elk voor een ander soort tekst. */

/* 1. Kantlijn - voor uitleg en wetgeving. Leest als een naslagwerk. */
.vg .kantlijn{display:grid;grid-template-columns:184px minmax(0,62ch);gap:0 40px;margin:0 0 34px}
.vg .kantlijn>.tk{grid-column:2}
.vg .kantlijn>aside{grid-column:1;font-size:14px;line-height:1.5;color:var(--zacht);
    text-align:right;padding-top:5px}
.vg .kantlijn>aside b{display:block;font-family:'Archivo',sans-serif;font-size:30px;
    font-weight:700;color:var(--ink);line-height:1;letter-spacing:-.03em;
    font-variant-numeric:tabular-nums;margin-bottom:6px}
.vg .kantlijn>.tk p:last-child{margin-bottom:0!important}

/* 2. Vraagreeks - voor tips en kosten. Geen accordeon: alles meteen leesbaar,
      en precies het formaat dat AI-zoekmachines letterlijk citeren. */
.vg .reeks h3{font-size:21px!important;border-top:1px solid var(--lijn);padding-top:26px;
    margin:32px 0 10px!important;letter-spacing:-.012em!important}
.vg .reeks h3:first-child{border-top:0;padding-top:0;margin-top:0!important}
.vg .reeks p{max-width:64ch}

/* 3. Genummerde gang - alleen waar de volgorde echt informatie draagt. */
.vg .gang{counter-reset:g;list-style:none;padding:0;margin:0 0 30px}
.vg .gang li{counter-increment:g;position:relative;padding:0 0 28px 62px;font-size:16.5px!important}
.vg .gang li:before{content:counter(g);position:absolute;left:0;top:-3px;width:38px;height:38px;
    border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;
    font-family:'Archivo',sans-serif;font-weight:700;font-size:16px}
.vg .gang li:after{content:"";position:absolute;left:18px;top:42px;bottom:0;width:2px;background:var(--lijn)}
.vg .gang li:last-child{padding-bottom:0}
.vg .gang li:last-child:after{display:none}
.vg .gang li b{display:block;font-family:'Archivo',sans-serif;font-size:17.5px;margin-bottom:5px}

/* een citaat van een monteur: eigen waarneming, dus amber lijn */
.vg blockquote.monteur{margin:26px 0;padding:0 0 0 18px;border-left:2px solid var(--vuur);
    font-size:19px;line-height:1.55;color:var(--ink)}
.vg blockquote.monteur cite{display:block;font-style:normal;font-size:14px;color:var(--zacht);
    margin-top:10px}
@media(max-width:900px){
 .vg .kantlijn{display:block}
 .vg .kantlijn>aside{text-align:left;border-left:2px solid var(--vuur);padding:2px 0 2px 14px;
     margin:0 0 20px}
 .vg .kantlijn>aside b{display:inline;font-size:20px;margin-right:8px}
}

/* ── het team met gezichten ────────────────────────────────────────────── */
.vg .teamrij{display:grid;grid-template-columns:repeat(5,1fr);gap:18px;margin:8px 0 30px}
.vg .persoon{background:#fff;border:1px solid var(--lijn);border-radius:14px;overflow:hidden;
    display:flex;flex-direction:column}
.vg .persoon .pf{background:#fff;aspect-ratio:4/5;overflow:hidden;display:flex;
    align-items:flex-end;justify-content:center;border-bottom:1px solid var(--lijn)}
.vg .persoon.werkfoto .pf{background:var(--zand)}
.vg .persoon .pf img{width:100%;height:100%;object-fit:contain;object-position:bottom;display:block}
.vg .persoon.werkfoto .pf img{object-fit:cover;object-position:50% 28%}
.vg .persoon .pt{padding:20px 22px 22px}
.vg .persoon b{display:block;font-family:'Archivo',sans-serif;font-size:19px;letter-spacing:-.02em}
.vg .persoon em{display:block;font-style:normal;font-size:12.5px;font-weight:700;
    letter-spacing:.11em;text-transform:uppercase;color:var(--brons);margin:4px 0 9px}
.vg .persoon p{font-size:15px!important;color:var(--ink2);margin:0!important}
@media(max-width:1100px){.vg .teamrij{grid-template-columns:repeat(3,1fr)}}
@media(max-width:800px){.vg .teamrij{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.vg .teamrij{grid-template-columns:1fr}}



/* ── kort antwoord: het blok dat AI-zoekmachines citeren ───────────────── */
.vg .kort{background:var(--zand);border-left:3px solid var(--vuur);border-radius:0 12px 12px 0;
    padding:24px 26px;margin:0 0 34px}
.vg .kort b{display:block;font-family:'Archivo',sans-serif;font-size:12px;font-weight:700;
    letter-spacing:.13em;text-transform:uppercase;color:var(--brons);margin-bottom:10px}
.vg .kort p{font-size:18px!important;line-height:1.55!important;color:var(--ink);margin:0!important}

/* ── bronvermelding ────────────────────────────────────────────────────── */
.vg .bron{border-top:1px solid var(--lijn);margin-top:34px;padding-top:20px}
.vg .bron h3{font-size:15px!important;letter-spacing:.06em!important;text-transform:uppercase;
    color:var(--zacht);margin-bottom:12px!important}
.vg .bron ol{padding-left:20px;margin:0}
.vg .bron li{font-size:14.5px!important;color:var(--ink2);margin-bottom:9px}
.vg .bron a{color:var(--ink)}

/* ── situatieblokken ───────────────────────────────────────────────────── */
.vg .situatie{background:#fff;border:1px solid var(--lijn);border-radius:16px;padding:28px 30px;
    margin-bottom:22px}
.vg .skop{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:22px}
.vg .schip{display:inline-block;background:var(--zand2);color:var(--ink);border-radius:999px;
    padding:7px 15px;font-family:'Archivo',sans-serif;font-size:11.5px;font-weight:700;
    letter-spacing:.1em;text-transform:uppercase;white-space:nowrap}
.vg .skop h3{margin:0!important;flex:1;min-width:240px}
.vg .skolommen{display:grid;grid-template-columns:repeat(4,1fr);gap:26px;
    padding-bottom:22px;border-bottom:1px solid var(--lijn)}
.vg .slabel{display:block;font-family:'Archivo',sans-serif;font-size:11px;font-weight:700;
    letter-spacing:.12em;text-transform:uppercase;color:var(--zacht);margin-bottom:8px}
.vg .skolommen p{font-size:15px!important;color:var(--ink2);margin:0!important;line-height:1.55!important}
.vg .skolommen .sgoed{color:#1F6B45;font-weight:500}
.vg .cijferrij{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:20px}
.vg .cijfertegel{background:var(--zand);border-radius:10px;padding:14px 16px}
.vg .cijfertegel b{display:block;font-family:'Archivo',sans-serif;font-size:26px;font-weight:700;
    letter-spacing:-.03em;line-height:1;font-variant-numeric:tabular-nums;color:var(--ink)}
.vg .cijfertegel span{display:block;font-size:13px;color:var(--zacht);margin-top:6px;line-height:1.3}
.vg .situatievoet{font-size:14px!important;color:var(--zacht);margin:18px 0 0!important;
    padding-left:14px;border-left:2px solid var(--vuur)}
@media(max-width:900px){
 .vg .skolommen{grid-template-columns:1fr 1fr;gap:20px}
 .vg .cijferrij{grid-template-columns:1fr 1fr}
}
@media(max-width:560px){
 .vg .situatie{padding:22px 20px}
 .vg .skolommen{grid-template-columns:1fr}
}

/* ── cta-band midden in de pagina ──────────────────────────────────────── */
.vg .ctaband{background:var(--ink);color:#fff;border-radius:16px;padding:30px 34px;
    display:grid;grid-template-columns:1.3fr auto;gap:28px;align-items:center}
.vg .ctaband h3{color:#fff;margin:0 0 7px!important}
.vg .ctaband p{color:#C8CBD4;margin:0!important;font-size:15.5px!important;max-width:58ch}
.vg .ctaknoppen{display:flex;gap:11px;flex-wrap:wrap}
.vg .ctaband .knop.glas{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}
.vg .ctaband .knop.glas:hover{background:rgba(255,255,255,.1);border-color:#fff}
@media(max-width:820px){.vg .ctaband{grid-template-columns:1fr;padding:26px 24px}}

/* ── eigen illustraties ────────────────────────────────────────────────── */
.vg .illwrap{margin:30px 0;background:#fff;border:1px solid var(--lijn);border-radius:16px;
    padding:16px 16px 0;overflow:hidden}
.vg .ill{width:100%;height:auto;display:block;border-radius:10px}
.vg .illwrap figcaption{font-size:14px;color:var(--ink2);padding:16px 6px 18px;line-height:1.55;
    border-left:2px solid var(--vuur);margin:16px 0 0;padding-left:14px}
.vg .illmerk{display:block;font-size:12.5px;color:var(--zacht);margin-top:6px}

/* ── uitklapmenu in de vaste balk ──────────────────────────────────────── */
.vg .nav ul{list-style:none;display:flex;gap:2px;margin:0;padding:0}
.vg .nav li{position:relative}
.vg .nav li>a{display:flex;align-items:center;gap:6px;padding:10px 13px;border-radius:8px;
    border-bottom:0}
.vg .nav li>a:hover,.vg .nav li>a.nu{background:var(--zand);color:var(--ink);border-color:transparent}
.vg .kop.opFoto .nav li>a:hover,.vg .kop.opFoto .nav li>a.nu{background:rgba(255,255,255,.14);color:#fff}
.vg .pijl{width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;
    transform:rotate(45deg) translateY(-2px);opacity:.55;transition:.18s}
.vg .heeftsub:hover .pijl,.vg .heeftsub:focus-within .pijl{opacity:1;transform:rotate(225deg) translateY(-2px)}
.vg .sub{position:absolute;top:100%;left:-8px;z-index:70;min-width:520px;background:#fff;
    border:1px solid var(--lijn);border-radius:14px;padding:14px;margin-top:8px;
    box-shadow:0 26px 50px -26px rgba(27,36,48,.55);opacity:0;visibility:hidden;
    transform:translateY(-6px);transition:opacity .16s,transform .16s,visibility .16s}
.vg .heeftsub:hover .sub,.vg .heeftsub:focus-within .sub{opacity:1;visibility:visible;transform:none}
.vg .sub ul{display:grid;grid-template-columns:1fr 1fr;gap:2px;list-style:none;margin:0;padding:0}
.vg .sub li>a{display:block;padding:11px 13px;border-radius:9px;text-decoration:none}
.vg .sub li>a:hover{background:var(--zand)}
.vg .sub b{display:block;font-family:'Archivo',sans-serif;font-size:14.5px;font-weight:600;
    color:var(--ink);margin-bottom:2px}
.vg .sub span{display:block;font-size:12.5px;color:var(--zacht);line-height:1.35}
.vg .suballes{display:block;margin:10px 4px 2px;padding-top:12px;border-top:1px solid var(--lijn);
    font-family:'Archivo',sans-serif;font-size:13.5px;font-weight:600;color:var(--brons);
    text-decoration:none}
.vg .suballes:hover{color:var(--ink)}

/* mobiel menu met groepen */
.vg .mnav{display:flex;flex-direction:column;margin:10px 0 20px}
.vg .mnav .mhoofd{padding:15px 4px 12px;border-bottom:1px solid var(--lijn);text-decoration:none;
    font-family:'Archivo',sans-serif;font-weight:700;font-size:18px;color:var(--ink)}
.vg .msub{display:flex;flex-direction:column;padding:8px 0 12px 14px;
    border-left:2px solid var(--vuur);margin:8px 0 10px 4px}
.vg .msub a{padding:8px 0;text-decoration:none;font-size:15.5px;color:var(--ink2)}
.vg .msub a:hover{color:var(--ink)}

@media(max-width:1180px){.vg .nav li>a{padding:10px 9px;font-size:14.5px}.vg .sub{min-width:440px}}
@media(max-width:980px){
 .vg .hero{min-height:0}
 .vg .hero .in{grid-template-columns:1fr;gap:0;padding-top:132px;padding-bottom:0}
 .vg .heroTekst{padding-bottom:44px}
 .vg .heroMensen{display:none}
 .vg .heroClaims{grid-template-columns:1fr}
 .vg .tegels,.vg .prijzen{grid-template-columns:1fr 1fr}
 .vg .duo,.vg .wij{grid-template-columns:1fr;gap:34px}
 .vg .duo.om .fig{order:0}
 .vg .rail .in{grid-template-columns:1fr 1fr;gap:24px}
 .vg .strip{grid-template-columns:repeat(3,1fr)}
 .vg .voet .kol{grid-template-columns:1fr 1fr}
 .vg .nav{display:none}
 .vg .hamb{display:flex}
 .vg .cases{grid-template-columns:1fr}
 .vg .case.breed{grid-column:span 1;aspect-ratio:16/11}
}
@media(max-width:760px){
 .vg .mobbalk{display:flex}
 .vg .voet{padding-bottom:70px}
}
@media(max-width:640px){
 .vg .sec{padding:58px 0}
 .vg .kop .in{gap:12px;height:66px}
 .vg .merk{font-size:19px}
 .vg .kop .knop.klein{display:none}
 .vg .tegels,.vg .prijzen{grid-template-columns:1fr}
 .vg .strip{grid-template-columns:1fr 1fr}
 .vg .titelrij{flex-direction:column;align-items:flex-start;gap:16px;margin-bottom:32px}
 .vg .top .cl{display:none}
 .vg .cijfers{grid-template-columns:1fr;gap:18px}
 .vg .voet .kol{grid-template-columns:1fr;gap:28px}
 .vg .rail .in{grid-template-columns:1fr}
 .vg .tweeop,.vg .keuzes{grid-template-columns:1fr}
}