/* Leadsite (klusknop-leadsite-1): eigen laag bovenop het zilver-ontwerp (assets/zilver/css/style.css, letterlijk uit
   zilver-volledige-website-1). Hier alleen wat een leadsite anders nodig heeft: het snelformulier in de stijl van
   de offertecalculator, de compacte mobiele hero (eerste keuze boven de vouw), leesblokken met bronnen, kaders,
   tabellen, het label Illustratie en de eerlijke bemiddelingszin. Kleuren uit config.KLEUREN (genereer.py schrijft
   assets/css/merk.css met dezelfde variabelen; dat bestand komt na dit bestand en wint). */
:root{--sg-knop:#B4552F;--sg-knop-licht:#C0603A;--sg-knop-diep:#9A4524;--sg-knop-tekst:#fff;--sg-knop-rgb:180,85,47;--sg-op-donker:#E9A27E;--sg-inkt:#15171C;--sg-petrol:#2F6F73;--sg-petrol-diep:#245659;
  --sg-drager:#12383A;--sg-drager-diep:#0B2527;--sg-groen:#1F8A4C;--sg-lijn:#DCE7E6;--sg-grond:#EEF4F3}
[hidden]{display:none!important}
.sg-sprong{position:absolute;left:-9999px;top:0;z-index:9999;background:var(--sg-drager);color:#fff;padding:10px 14px}
.sg-sprong:focus{left:12px;top:12px}
.sg-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- logo: het EIGEN logo van de site (tools/maak-logo.py), overal hetzelfde bestand, nooit een andere kleurversie ---------- */
.sg-logo{display:inline-flex;align-items:center;line-height:0}
.sg-logo-img{display:block;height:46px;width:auto;max-width:none}
.nav-logo .sg-logo-img{height:46px}
.mmx-logo{display:inline-flex;align-items:center;text-decoration:none}
.mmx-logo .sg-logo-img{height:38px}
/* het logo is licht (leesbaar op de donkere header, de hero en de zwarte footer): de kop van het mobiele menu krijgt
   daarom de donkere dragerkleur in plaats van wit (CLAUDE.md: pas de ondergrond aan, nooit het logo) */
html body .mobile-menu .mmx-head{background:var(--sg-drager-diep)!important;border-bottom-color:rgba(255,255,255,.08)!important}
html body .mobile-menu .mmx-head .mobile-menu-close{color:#fff!important;border-color:rgba(255,255,255,.25)!important;background:transparent!important}
.footer-logo .sg-logo-img{height:52px}
@media (max-width:768px){
  .nav-logo .sg-logo-img{height:40px}
}
/* de header dekt nooit iets af: over de hero doorzichtig, na scrollen een eigen donkere grond (CLAUDE.md 14-10-2026) */
html body nav.nav.scrolled{background:rgba(11,37,39,.96)!important;backdrop-filter:blur(8px)!important;-webkit-backdrop-filter:blur(8px)!important;box-shadow:0 6px 24px -10px rgba(0,0,0,.45)!important}
html body nav.nav.scrolled::before{opacity:0}
@media (max-width:768px){html body nav.nav.scrolled{padding:12px 16px!important}}

/* ---------- knoppen: een knopklasse in de eigen knopkleur (config.KLEUREN knop / knop_tekst) ---------- */
.dps-cta-gold,.btn.dps-cta-gold,.hp-hs-btn,.sg-knop,.rucalc-next,.rucalc-submit,.nav-cta>.btn.btn-primary,.agbot-launch{
  background:linear-gradient(135deg,var(--sg-knop-licht),var(--sg-knop))!important;color:var(--sg-knop-tekst)!important;border:0!important;
  box-shadow:0 12px 26px -10px rgba(var(--sg-knop-rgb),.55)!important}
.dps-cta-gold svg,.hp-hs-btn svg,.sg-knop svg,.rucalc-next svg,.rucalc-submit svg,.agbot-launch svg{stroke:var(--sg-knop-tekst)!important;color:var(--sg-knop-tekst)!important}
.sg-knop{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:14px 26px;border-radius:999px;font-family:var(--font-heading);font-weight:800;font-size:16px;text-decoration:none;cursor:pointer;transition:transform .35s cubic-bezier(.22,.61,.36,1),box-shadow .35s}
.sg-knop:hover{transform:translateY(-2px)}
.sg-knop svg{width:18px;height:18px}
.nav-cta>.btn.btn-primary{white-space:nowrap}

/* ---------- eyebrow-pills: overal identiek, gouden rand met donkere tekst ---------- */
.eyebrow:not(.hp-hs-eyebrow){background:transparent!important;border:1px solid var(--sg-knop)!important;color:var(--sg-drager)!important;-webkit-text-fill-color:var(--sg-drager)!important;border-radius:999px;padding:8px 20px!important;letter-spacing:.12em!important;font-size:13px!important}
.eyebrow:not(.hp-hs-eyebrow)::before{display:none!important}
section.hp-waarom .eyebrow,.sg-donker .eyebrow,.footer .eyebrow{color:#fff!important;-webkit-text-fill-color:#fff!important}

/* =====================================================================================================
   HERO + FORMULIER. HTML: <div class="sg-hero">[hero-sectie][formuliersectie]</div>.
   Mobiel en tablet: hero compact, de formulierkaart schuift eroverheen; de eerste keuze staat boven de vouw.
   Desktop (>=1024): beide in dezelfde gridcel, de kaart rechts.
   ===================================================================================================== */
.sg-hero{position:relative;background:var(--sg-drager-diep)}
.sg-hero .hp-hero-slider,.sg-hero .subhero{height:auto!important;min-height:0!important;max-height:none!important;margin-top:0!important;display:block!important}
.sg-hero .hp-hs-static-content,.sg-hero .subhero-content{position:relative!important;left:auto!important;top:auto!important;right:auto!important;bottom:auto!important;transform:none!important;
  max-width:1264px!important;width:100%!important;margin:0 auto!important;text-align:center;z-index:3}
.sg-hero .hp-hs-slides{position:absolute;inset:0}
.sg-hero .hp-hs-overlay{background:linear-gradient(180deg,rgba(11,37,39,.78) 0%,rgba(11,37,39,.62) 45%,rgba(11,37,39,.9) 100%)!important}
.sg-hero .subhero::before{background:linear-gradient(180deg,rgba(11,37,39,.8) 0%,rgba(11,37,39,.66) 50%,rgba(11,37,39,.92) 100%)!important}
.sg-hero .hp-hs-eyebrow,.sg-hero .sg-hero-eyebrow{display:inline-block!important;opacity:1!important;transform:none!important;font-size:11.5px!important;letter-spacing:.16em!important;padding:7px 14px!important;
  border:1px solid var(--sg-op-donker)!important;color:#fff!important;-webkit-text-fill-color:#fff!important;background:rgba(0,0,0,.22)!important;border-radius:999px!important;margin:0 0 12px!important;text-transform:uppercase;font-weight:700}
.sg-hero h1{font-family:var(--font-heading);font-weight:800;color:#fff!important;-webkit-text-fill-color:#fff!important;letter-spacing:-.025em;margin:0 auto 10px!important;
  font-size:clamp(25px,6.6vw,34px)!important;line-height:1.1!important;max-width:760px;text-shadow:0 2px 20px rgba(0,0,0,.35)}
.sg-hero h1 em{font-style:normal;color:var(--sg-op-donker)}
.sg-hero .sg-kort{color:rgba(255,255,255,.9)!important;font-size:15.5px!important;line-height:1.55!important;max-width:640px;margin:0 auto!important;text-shadow:0 1px 10px rgba(0,0,0,.4)}
.sg-hero .sg-kort a{color:#fff;text-decoration:underline;text-decoration-color:var(--sg-op-donker);text-underline-offset:3px}
.sg-hero .breadcrumb{display:none}
.sg-hero-vinkjes{display:none}
.sg-hero .hp-hs-btn,.sg-hero .hp-hero-usps{display:none!important}
/* mobiel: compacte hero met ruimte voor de header, kaart eroverheen */
.sg-hero .hp-hs-static-content,.sg-hero .subhero-content{padding:calc(var(--topbar-h,36px) + 76px) 18px 64px!important}
.sg-formsectie{position:relative;z-index:4;padding:0 14px 36px;margin-top:-50px}
.sg-formsectie>.container{padding:0!important;max-width:620px}
.sg-kaart{background:#fff;border-radius:22px;box-shadow:0 30px 70px -30px rgba(11,37,39,.55),0 2px 6px rgba(11,37,39,.08);padding:18px 16px 18px}
.sg-hero-onder{list-style:none;margin:14px auto 0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:8px 18px;max-width:620px}
.sg-hero-onder li{display:flex;align-items:center;gap:8px;font-weight:700;font-size:14px;color:var(--sg-drager)}
.sg-vink{flex:none;display:inline-flex;width:22px;height:22px;border-radius:50%;align-items:center;justify-content:center;background:rgba(31,138,76,.14)}
.sg-vink svg{width:13px;height:13px;stroke:var(--sg-groen);fill:none;stroke-width:3}

@media (min-width:600px) and (max-width:1023px){
  .sg-hero h1{font-size:clamp(30px,5vw,42px)!important}
  .sg-hero .sg-kort{font-size:17px!important}
}
@media (min-width:1024px){
  .sg-hero{display:grid;grid-template-columns:minmax(0,1fr)}
  .sg-hero>section{grid-area:1/1;min-width:0}
  .sg-hero>.hp-hero-slider,.sg-hero>.subhero{position:relative;z-index:1;display:flex!important;align-items:center;min-height:min(100svh,860px)!important}
  .sg-hero>.subhero{min-height:640px!important}
  .sg-hero .hp-hs-static-content,.sg-hero .subhero-content{text-align:left;padding:150px 560px 80px 32px!important}
  .sg-hero h1{font-size:clamp(40px,3.7vw,56px)!important;margin:0 0 16px!important;max-width:640px}
  .sg-hero .sg-kort{font-size:18px!important;margin:0!important;max-width:600px}
  .sg-hero .breadcrumb{display:flex;justify-content:flex-start;margin-bottom:14px}
  .sg-hero-vinkjes{display:grid;gap:12px;list-style:none;padding:0;margin:26px 0 0}
  .sg-hero-vinkjes li{display:flex;align-items:center;gap:12px;color:#fff;font-weight:700;font-size:16px;text-align:left}
  .sg-hero-vinkjes .sg-vink{width:26px;height:26px;background:rgba(95,208,142,.2)}
  .sg-hero-vinkjes .sg-vink svg{stroke:#5FD08E;width:14px;height:14px}
  .sg-formsectie{grid-area:1/1;z-index:3;margin:0;padding:140px 0 60px;display:flex;align-items:center;pointer-events:none;background:none}
  .sg-formsectie>.container{width:100%;max-width:1264px!important;margin:0 auto;padding:0 32px!important;display:flex;justify-content:flex-end}
  .sg-kaart{width:480px;flex:0 0 480px;padding:26px 28px 22px;border-radius:24px;pointer-events:auto}
  .sg-hero-onder{display:none}
}

/* ---------- het formulier in de stijl van de offertecalculator (rucalc) ---------- */
.sg-calc .rucalc-head{text-align:center;margin-bottom:12px}
.sg-calc .rucalc-head .eyebrow{margin-bottom:8px!important;font-size:11.5px!important;padding:6px 14px!important}
.sg-calc .sg-calc-kop{font-family:var(--font-heading);font-weight:800;font-size:22px;line-height:1.15;margin:4px 0 4px;color:var(--sg-drager)}
.sg-calc .hp-calc-sub{font-size:13.5px;line-height:1.45;margin:0;color:#4a5a5c;display:none}
.sg-calc .rucalc-progress{margin:0 0 12px}
.sg-calc .rucalc-prog-track{height:6px;border-radius:999px;background:#E7EFEE;overflow:hidden}
.sg-calc .rucalc-prog-track span{display:block;height:100%;width:25%;background:linear-gradient(90deg,var(--sg-petrol),var(--sg-knop));border-radius:999px;transition:width .6s cubic-bezier(.22,.61,.36,1)}
.sg-calc .rucalc-steps-lbl{display:flex;justify-content:space-between;margin-top:7px;font-size:12px;color:#5a6a6c}
.sg-calc .rucalc-steps-lbl span{text-transform:none;letter-spacing:0}
.sg-calc .of-stap{display:none;border:0;margin:0;padding:0;min-width:0}
.sg-calc .of-stap.actief{display:block;animation:sg-stap-in .32s cubic-bezier(.22,.61,.36,1) both}
@keyframes sg-stap-in{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.sg-calc .of-stap.actief{animation:none}}
.sg-calc .sg-vraagrij{display:flex;align-items:center;justify-content:center;gap:8px;position:relative;margin:0 0 4px}
.sg-calc .of-vraag{font-family:var(--font-heading);font-weight:800;font-size:17px;color:var(--sg-drager);margin:0;text-align:center;outline:none}
.sg-calc .of-hint{font-size:13px;color:#5a6a6c;margin:0 0 10px;text-align:center}
.sg-calc .of-terug{position:absolute;left:-4px;top:50%;transform:translateY(-50%);width:44px;height:44px;border-radius:50%;border:1px solid var(--sg-lijn);background:#fff;color:var(--sg-drager);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;z-index:2}
.sg-calc .of-terug svg{width:18px;height:18px}
.sg-calc .rucalc-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.sg-calc .of-tegel{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:6px;min-height:76px;padding:10px 6px;border:1.5px solid #E1EAE9;border-radius:15px;background:#fff;cursor:pointer;transition:border-color .3s,background .3s,box-shadow .3s,transform .3s}
.sg-calc .of-tegel:hover{border-color:var(--sg-petrol);box-shadow:0 10px 24px -16px rgba(18,56,58,.5)}
.sg-calc .of-tegel input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.sg-calc .of-tegel:focus-within{outline:3px solid rgba(47,111,115,.45);outline-offset:2px}
.sg-calc .rucalc-card-ic{display:inline-flex;width:38px;height:38px;border-radius:12px;align-items:center;justify-content:center;background:#EAF3F2;color:var(--sg-petrol);transition:background .3s,color .3s}
.sg-calc .rucalc-card-ic svg{width:21px;height:21px}
.sg-calc .of-label{font-weight:700;font-size:14px;line-height:1.25;color:var(--sg-drager)}
.sg-calc .rucalc-card-check{position:absolute;top:7px;right:7px;width:20px;height:20px;border-radius:50%;background:var(--sg-knop);display:inline-flex;align-items:center;justify-content:center;opacity:0;transform:scale(.6);transition:opacity .25s,transform .25s}
.sg-calc .rucalc-card-check svg{width:12px;height:12px;stroke:var(--sg-knop-tekst)}
.sg-calc .of-tegel:has(input:checked){border-color:var(--sg-petrol);background:#F2F8F7}
.sg-calc .of-tegel:has(input:checked) .rucalc-card-ic{background:var(--sg-petrol);color:#fff}
.sg-calc .of-tegel:has(input:checked) .rucalc-card-check{opacity:1;transform:scale(1)}
.sg-calc .of-veld{display:block;margin:0 0 10px;text-align:left}
.sg-calc .of-veldnaam{display:block;font-weight:700;font-size:13.5px;color:var(--sg-drager);margin:0 0 5px}
.sg-calc .of-veld input{width:100%;box-sizing:border-box;min-height:48px;border:1.5px solid #DCE6E5;border-radius:13px;padding:12px 14px;font:inherit;font-size:16px;color:var(--sg-inkt);background:#fff}
.sg-calc .of-veld input:focus{outline:none;border-color:var(--sg-petrol);box-shadow:0 0 0 3px rgba(47,111,115,.18)}
.sg-calc .of-veld input[aria-invalid="true"]{border-color:#C0392B}
.sg-calc .of-veld .of-hint{text-align:left;margin:5px 0 0;font-size:12.5px}
.sg-calc .of-optioneel{font-weight:500;color:#6a7a7c;font-size:12.5px}
.sg-calc .of-foto{margin:4px 0 10px;text-align:left}
.sg-calc .foto-knop{min-height:48px;border-color:var(--sg-petrol);color:var(--sg-petrol-diep)}
.sg-calc .foto-knop svg{width:20px;height:20px}
.sg-calc .of-foto .of-optioneel{display:block;margin-top:6px;line-height:1.45}
.sg-calc .of-knop{width:100%;min-height:52px;border-radius:999px;font-family:var(--font-heading);font-weight:800;font-size:16px;display:inline-flex;align-items:center;justify-content:center;gap:10px;cursor:pointer;margin-top:4px}
.sg-calc .of-knop svg{width:18px;height:18px}
.sg-calc .of-knop:disabled{opacity:.7;cursor:wait}
.sg-calc .fout{background:#FCEBEB;color:#7A1C1C;border-radius:10px;padding:9px 12px;font-size:13.5px;margin:0 0 10px;text-align:left}
.sg-calc .of-samen{display:flex;align-items:center;justify-content:space-between;gap:10px;background:#F2F8F7;border:1px solid #D7E8E6;border-radius:12px;padding:6px 6px 6px 12px;margin:0 0 10px}
.sg-calc .of-samenvatting{margin:0;font-size:13.5px;font-weight:600;color:var(--sg-drager);text-align:left}
.sg-calc .of-wijzig{flex:none;min-height:44px;padding:0 14px;border-radius:10px;border:1px solid #C9DEDB;background:#fff;color:var(--sg-petrol-diep);font-weight:700;cursor:pointer}
.sg-calc .of-doorgeef{font-size:12.5px;line-height:1.5;color:#4f5f61;margin:10px 0 0;text-align:center}
.sg-calc .of-doorgeef a{color:var(--sg-petrol-diep);text-decoration:underline}
.sg-calc .honing{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.sg-calc .of-labels{display:none}
@media (min-width:1024px){
  .sg-calc .sg-calc-kop{font-size:26px}
  .sg-calc .hp-calc-sub{display:block}
  .sg-calc .rucalc-cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
  .sg-calc .of-stap[data-veld="omvang"] .rucalc-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sg-calc .of-tegel{min-height:98px}
  .sg-calc .of-stap .rucalc-cards{min-height:208px;align-content:center}
  .sg-calc .of-vraag{font-size:18px}
}
html.no-js .sg-calc .of-stap{display:block;margin-bottom:18px}
html.no-js .sg-calc [data-volgende],html.no-js .sg-calc [data-terug]{display:none}
html.no-js .sg-calc .of-tegel input{position:static;opacity:1;width:auto;height:auto;pointer-events:auto}

/* adres en foto's (adres-foto.js): de lijst loopt mee in de pagina */
.veld,.rucalc-f,.foto-veld{position:relative}
.adres-suggesties{position:static!important;margin:6px 0 0!important;padding:6px 0;list-style:none;background:#fff;border:1px solid var(--sg-lijn);border-radius:10px;text-align:left}
.adres-suggesties li{min-height:44px;display:flex;align-items:center;padding:8px 14px;font-size:15px;cursor:pointer;color:var(--sg-inkt)}
.adres-suggesties li:hover{background:#F2F8F7}
.adres-suggesties li:nth-child(n+5){display:none}
.foto-rij{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.foto-kaart{position:relative;width:64px;height:64px;border-radius:8px;overflow:hidden;border:1px solid var(--sg-lijn);background:#f6f6f6}
.foto-kaart img{width:100%;height:100%;object-fit:cover;display:block}
.foto-weg{position:absolute;top:2px;right:2px;width:22px;height:22px;border:0;border-radius:50%;background:rgba(0,0,0,.65);color:#fff;font-size:16px;line-height:22px;cursor:pointer;padding:0}
.foto-melding{margin:6px 0 0;font-size:13px;color:#5a6a6c}
.foto-melding:empty{display:none}
.foto-knop{position:relative;display:inline-flex;align-items:center;gap:8px;padding:11px 16px;border:1.5px dashed var(--sg-petrol);border-radius:12px;background:#fff;font-size:15px;font-weight:700;cursor:pointer}
.foto-knop input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.foto-knop:focus-within{outline:2px solid var(--sg-petrol);outline-offset:2px}

/* ---------- zwevende knop "Aanvraag doen" linksonder (zilver agbot-launcher), alleen als het formulier uit beeld is ---------- */
.sg-zweef{position:fixed;left:16px;bottom:16px;z-index:90;opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity .35s,transform .35s,visibility .35s}
.sg-zweef.toon,.sg-zweef.sg-zweef-vast{opacity:1;visibility:visible;transform:none}
.sg-zweef .agbot-launch{display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:0 22px 0 18px;border-radius:999px;font-family:var(--font-heading);font-weight:800;font-size:15.5px;text-decoration:none;position:static!important}
.sg-zweef .agbot-launch svg{width:20px;height:20px}
.agbot:not(.sg-zweef){display:none!important}

/* ---------- secties en leesblokken ---------- */
.sg-sectie{padding:84px 0}
.sg-sectie.alt{background:var(--sg-grond)}
.sg-kop{text-align:center;max-width:760px;margin:0 auto 34px}
.sg-kop h2{font-size:clamp(28px,3.4vw,44px);margin:12px 0 10px;color:var(--sg-drager)}
.sg-kop p{font-size:17px;line-height:1.65;color:#4b5b5d;margin:0}
.sg-smal{max-width:820px;margin:0 auto}
.sg-tekst{font-size:17px;line-height:1.78;color:#33403f;text-align:left}
.sg-tekst h2{font-size:clamp(24px,2.6vw,32px);margin:0 0 16px;color:var(--sg-drager);text-align:left}
.sg-tekst h3{font-size:20px;margin:26px 0 10px;color:var(--sg-drager)}
.sg-tekst p{margin:0 0 16px}
.sg-tekst ul,.sg-tekst ol{padding-left:1.25em;margin:0 0 18px}
.sg-tekst li{margin-bottom:8px}
.sg-tekst a,.faq-a-inner a,.sg-bronnen a,.sg-kader a{color:var(--sg-petrol-diep);font-weight:700;text-decoration:underline;text-underline-offset:3px}
.sg-tekst strong{color:var(--sg-drager)}
.sg-blok{padding:64px 0}
.sg-blok:nth-of-type(even){background:var(--sg-grond)}
.sg-2kol{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:56px;align-items:center;max-width:1180px;margin:0 auto}
.sg-2kol.omgekeerd .sg-figuur{order:-1}
.sg-figuur{margin:0}
.sg-figuur img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:22px;box-shadow:0 30px 60px -36px rgba(11,37,39,.6);display:block}
.sg-figuur figcaption{font-size:13.5px;color:#5a6a6c;margin-top:10px;text-align:left;line-height:1.5}
.sg-label{display:inline-block;background:var(--sg-drager);color:#fff;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;border-radius:999px;padding:3px 9px;margin-right:6px;vertical-align:1px}
.sg-kader{background:#fff;border:1px solid var(--sg-lijn);border-radius:22px;padding:30px 32px;box-shadow:0 24px 50px -36px rgba(11,37,39,.45);position:relative}
.sg-kader>.sg-kader-kop{display:flex;align-items:center;gap:12px;margin:0 0 14px}
.sg-kader>.sg-kader-kop h2{margin:0!important;font-size:clamp(22px,2.2vw,28px)}
.sg-kader-ic{flex:none;display:inline-flex;width:44px;height:44px;border-radius:14px;align-items:center;justify-content:center;background:#EAF3F2;color:var(--sg-petrol)}
.sg-kader-ic svg{width:22px;height:22px}
.sg-kader-kosten{border-top:4px solid var(--sg-knop)}
.sg-kader-regio{border-top:4px solid var(--sg-petrol)}
.sg-kader-zelf{border-top:4px solid #8FB9B6}
.sg-kader-let-op{border-top:4px solid #D97D08}
.tabelwrap{overflow-x:auto;margin:16px 0 22px;border:1px solid var(--sg-lijn);border-radius:14px;background:#fff}
.tabelwrap table,.sg-tekst table{width:100%;border-collapse:collapse;font-size:15px}
.sg-tekst th{background:var(--sg-drager);color:#fff;text-align:left;padding:11px 14px;font-weight:700;font-size:14px}
.sg-tekst td{padding:10px 14px;border-top:1px solid var(--sg-lijn);vertical-align:top}
.sg-tekst tr:nth-child(even) td{background:#F7FAFA}
.sg-tekst caption{caption-side:bottom;text-align:left;font-size:13px;color:#5a6a6c;padding:8px 14px}

/* tussen-cta */
.sg-tussen{padding:30px 0}
.sg-tussen-in{display:flex;align-items:center;justify-content:space-between;gap:24px;background:var(--sg-drager);border-radius:24px;padding:30px 36px;box-shadow:0 30px 60px -30px rgba(11,37,39,.6);max-width:1180px;margin:0 auto}
.sg-tussen h2{color:#fff!important;font-size:clamp(21px,2.3vw,27px);margin:0 0 6px;text-align:left}
.sg-tussen p{color:rgba(255,255,255,.82);margin:0;font-size:15px;text-align:left}
.sg-tussen .sg-knop{flex:none}

/* faq */
.sg-faq .faq{max-width:860px;margin:0 auto}
.sg-faq .faq-q span:first-child{text-align:left}

/* werkwijze in drie of vier stappen (hp-werkwijze) */
.hp-werkwijze .hp-werk-step p{color:#4b5b5d!important}
.hp-werkwijze h2,.hp-werkwijze h3{color:var(--sg-drager)!important;-webkit-text-fill-color:var(--sg-drager)!important}
.sg-werk-knop{text-align:center;margin-top:34px}

/* verder lezen */
.sg-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;max-width:1180px;margin:0 auto}
.sg-links a{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:60px;padding:14px 18px;border-radius:16px;background:#fff;border:1px solid var(--sg-lijn);color:var(--sg-drager);font-weight:700;font-size:15.5px;text-decoration:none;transition:border-color .35s,transform .35s,box-shadow .35s}
.sg-links a:hover{border-color:var(--sg-petrol);transform:translateY(-2px);box-shadow:0 14px 30px -22px rgba(11,37,39,.6)}
.sg-links a span{color:var(--sg-petrol);font-size:20px}

/* bronnen */
.sg-bronnen{font-size:14.5px;line-height:1.6;color:#4b5b5d}
.sg-bronnen h2{font-size:22px;color:var(--sg-drager);margin:0 0 12px}
.sg-bronnen h3{font-size:17px;color:var(--sg-drager);margin:22px 0 6px}
.sg-bronnen ol{padding-left:1.2em;margin:0}
.sg-bronnen li{margin-bottom:6px}

/* kaartgrids (vragen, regio, kosten): hp-tips-kaarten, gecentreerd, nooit een gat */
.hp-tips-grid.sg-grid{display:flex!important;flex-wrap:wrap;justify-content:center;gap:22px}
.hp-tips-grid.sg-grid>*{flex:0 0 calc((100% - 44px)/3);max-width:calc((100% - 44px)/3)}
.hp-tips-grid.sg-grid.k4>*{flex-basis:calc((100% - 66px)/4);max-width:calc((100% - 66px)/4)}
.hp-tips-card .hp-tips-card-body{text-align:center}
.hp-tips-tag{background:rgba(47,111,115,.12)!important;color:var(--sg-petrol-diep)!important}
.sg-meer{text-align:center;margin-top:40px}
.hp-svc-img .sg-label,.hp-tips-img .sg-label,.project-card .sg-label{position:absolute;left:12px;bottom:12px;z-index:3}
.hp-tips-img{position:relative}

/* cijfers (count-up uit de template: [class*="-stat"] strong) */
.sg-cijfers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;max-width:1100px;margin:0 auto}
.sg-cijfer-stat{background:#fff;border:1px solid var(--sg-lijn);border-radius:22px;padding:30px 22px;text-align:center;box-shadow:0 24px 50px -38px rgba(11,37,39,.5)}
.sg-cijfer-stat strong{display:block;font-family:var(--font-heading);font-weight:800;font-size:clamp(36px,4vw,52px);color:var(--sg-petrol);line-height:1;margin-bottom:10px}
.sg-cijfer-stat span{display:block;font-size:15px;line-height:1.5;color:#3d4b4c}
.sg-cijfer-stat small{display:block;margin-top:8px;font-size:12.5px;color:#6a7a7c}

/* prijzen */
.sg-prijzen{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;max-width:1180px;margin:0 auto}
.sg-prijs{background:#fff;border:1px solid var(--sg-lijn);border-top:4px solid var(--sg-knop);border-radius:20px;padding:26px 20px;text-align:center}
.sg-prijs b{display:block;font-family:var(--font-heading);font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:#5a6a6c;margin-bottom:6px}
.sg-prijs strong{display:block;font-family:var(--font-heading);font-weight:800;font-size:34px;color:var(--sg-drager);line-height:1.1}
.sg-prijs span{display:block;font-size:14.5px;color:#3d4b4c;margin-top:6px}
.sg-prijs small{display:block;font-size:12.5px;color:#6a7a7c;margin-top:10px;line-height:1.45}

/* bouwjaarwijzer (maatwerk, data-wow) */
.sg-wijzer{max-width:1100px;margin:0 auto;background:#fff;border:1px solid var(--sg-lijn);border-radius:26px;padding:30px;box-shadow:0 30px 70px -44px rgba(11,37,39,.55)}
.sg-wijzer-knoppen{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:0 0 24px}
.sg-wijzer-knoppen button{min-height:48px;padding:10px 18px;border-radius:999px;border:1.5px solid var(--sg-lijn);background:#fff;font-family:var(--font-heading);font-weight:800;font-size:15px;color:var(--sg-drager);cursor:pointer;transition:all .35s cubic-bezier(.22,.61,.36,1)}
.sg-wijzer-knoppen button[aria-pressed="true"]{background:var(--sg-drager);border-color:var(--sg-drager);color:#fff}
.sg-wijzer-paneel{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:30px;align-items:start}
.sg-wijzer-paneel[hidden]{display:none!important}
.sg-wijzer-cijfer{background:var(--sg-grond);border-radius:20px;padding:24px;text-align:center}
.sg-wijzer-cijfer strong{display:block;font-family:var(--font-heading);font-weight:800;font-size:46px;color:var(--sg-petrol);line-height:1}
.sg-wijzer-cijfer span{display:block;margin-top:8px;font-size:15px;color:#3d4b4c}
.sg-wijzer-cijfer small{display:block;margin-top:8px;font-size:12.5px;color:#6a7a7c}
.sg-wijzer-lijst{list-style:none;padding:0;margin:0}
.sg-wijzer-lijst li{display:flex;gap:12px;align-items:flex-start;margin:0 0 14px;font-size:15.5px;line-height:1.55;color:#33403f;text-align:left}
.sg-wijzer-lijst li .sg-vink{margin-top:2px}
.sg-wijzer-lijst a{color:var(--sg-petrol-diep);font-weight:700}
@media (prefers-reduced-motion:no-preference){.sg-wijzer-paneel:not([hidden]){animation:sg-stap-in .45s cubic-bezier(.22,.61,.36,1) both}}

/* zo werkt het (hp-overons): label op de foto */
.hp-overons-photo{position:relative}
.hp-overons-photo .sg-label{position:absolute;left:14px;bottom:14px}
.sg-bemiddeling{display:flex;gap:12px;align-items:flex-start;background:#F2F8F7;border:1px solid #D7E8E6;border-radius:16px;padding:14px 16px;margin:18px 0 22px;font-size:15px;line-height:1.55;color:var(--sg-drager);text-align:left}

/* footer: puur zwart, eigen logo, Klusknop alleen als tekstregel (footer-veo) */
.footer{background:#000!important}
.footer-veo{margin:0;font-size:13.5px;line-height:1.6;color:rgba(255,255,255,.6)}
.footer .footer-bottom{flex-direction:column;align-items:center;text-align:center;gap:6px}
.footer-col ul li a{color:rgba(255,255,255,.78)}
.footer-benefits li{color:rgba(255,255,255,.85)}

/* juridisch en over */
.sg-juridisch h2{font-size:22px;margin:28px 0 10px}

@media (max-width:1023px){
  .sg-2kol{grid-template-columns:minmax(0,1fr);gap:28px}
  .sg-2kol.omgekeerd .sg-figuur{order:0}
  .sg-links{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hp-tips-grid.sg-grid>*,.hp-tips-grid.sg-grid.k4>*{flex-basis:calc((100% - 22px)/2);max-width:calc((100% - 22px)/2)}
  .sg-prijzen{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sg-wijzer-paneel{grid-template-columns:minmax(0,1fr)}
  .sg-tussen-in{flex-direction:column;align-items:flex-start;padding:26px 22px}
}
@media (max-width:640px){
  .sg-sectie,.sg-blok{padding:56px 0}
  .sg-tekst{font-size:16.5px}
  .sg-kader{padding:24px 18px}
  .sg-links{grid-template-columns:minmax(0,1fr)}
  .hp-tips-grid.sg-grid>*,.hp-tips-grid.sg-grid.k4>*{flex-basis:100%;max-width:100%}
  .sg-cijfers{grid-template-columns:minmax(0,1fr)}
  .sg-prijzen{grid-template-columns:minmax(0,1fr)}
  .sg-wijzer{padding:20px 14px}
  .sg-tekst table{display:block;overflow-x:auto;max-width:100%}
  .sg-tussen-in{align-items:center}
  .sg-tussen h2,.sg-tussen p{text-align:center}
}
@media print{
  .hp-topbar,.nav,.mobile-menu,.sg-formsectie,.sg-zweef,.footer,.sg-tussen,.hp-werkwijze{display:none!important}
  .sg-hero{background:#fff}.sg-hero h1,.sg-hero .sg-kort{color:#000!important;-webkit-text-fill-color:#000!important;text-shadow:none}
}
/* kaarten zonder beeld (overzichten): rustig, met een accentlijn */
.hp-tips-card.sg-zonderbeeld{border-top:4px solid var(--sg-petrol);min-height:0}
.hp-tips-card.sg-zonderbeeld .hp-tips-card-body{padding-top:24px}
.sg-sectie .sg-kop h2:only-child{margin-top:0}
/* hero: de hero-sectie onder de kaart in de stapel, subhero zonder eigen padding, tekst altijd zichtbaar */
.sg-hero>section:first-child{position:relative;z-index:1}
.sg-hero .subhero{padding:0!important}
.sg-hero .subhero-content>*{opacity:1!important;transform:none!important}
.sg-hero .subhero-content h1{text-align:center}
@media (min-width:1024px){.sg-hero .subhero-content h1{text-align:left}}
.sg-calc .of-tegel:has(input:checked) .rucalc-card-ic svg{stroke:#fff!important;color:#fff!important}
html body .nav .nav-cta>a.btn.btn-primary{background:linear-gradient(135deg,var(--sg-knop-licht),var(--sg-knop))!important;background-image:linear-gradient(135deg,var(--sg-knop-licht),var(--sg-knop))!important;color:var(--sg-knop-tekst)!important;text-shadow:none!important}
/* mobiel compacter, zodat de eerste keuze boven de vouw staat */
@media (max-width:1023px){
  .sg-hero .hp-hs-static-content,.sg-hero .subhero-content{padding:calc(var(--topbar-h,36px) + 70px) 18px 56px!important}
  .sg-formsectie{margin-top:-44px}
  .sg-calc .rucalc-head{margin-bottom:8px}
  .sg-calc .rucalc-head .eyebrow{margin-bottom:4px!important}
  .sg-calc .sg-calc-kop{font-size:21px;margin:2px 0 2px}
  .sg-calc .rucalc-progress{margin-bottom:8px}
  .sg-calc .rucalc-steps-lbl{margin-top:5px}
  .sg-calc .of-hint{margin-bottom:8px}
  .sg-calc .of-tegel{min-height:70px;padding:8px 6px;gap:4px}
  .sg-calc .rucalc-card-ic{width:34px;height:34px;border-radius:11px}
}
/* logo-verloop op alle knoppen (zilver-mechaniek --grad-btn): in de eigen knopkleur met de eigen knoptekstkleur */
:root{--grad-btn:linear-gradient(100deg,var(--sg-knop-diep) 0%,var(--sg-knop) 50%,var(--sg-knop-licht) 100%);--grad-btn-hover:linear-gradient(100deg,var(--sg-knop-diep) 0%,var(--sg-knop) 70%,var(--sg-knop-licht) 100%);
  --grad-btn-vert:linear-gradient(180deg,var(--sg-knop-licht) 0%,var(--sg-knop) 55%,var(--sg-knop-diep) 100%);--grad-btn-vert-hover:linear-gradient(180deg,var(--sg-knop) 0%,var(--sg-knop-diep) 100%);
  --cta-shadow:rgba(var(--sg-knop-rgb),.5)}
html body .btn-primary,html body .btn.btn-primary,html body .hp-hs-btn,html body .agbot-launch,html body .rucalc-next,html body .rucalc-submit,
html body .nav .nav-cta>a.btn.btn-primary,html body .sg-knop{color:var(--sg-knop-tekst)!important;-webkit-text-fill-color:var(--sg-knop-tekst)!important}
html body .btn-primary svg,html body .btn.btn-primary svg,html body .agbot-launch svg,html body .sg-knop svg{stroke:var(--sg-knop-tekst)!important}
/* de menuwaas valt niet over de bovenkant van de formulierkaart */
html body .nav::before{height:100%!important}
@media (min-width:1024px){
  .sg-formsectie{padding-top:150px}
  .sg-hero>.subhero{min-height:700px!important}
}
html body .nav .nav-logo .sg-logo.logo-on-dark{display:inline-flex!important;flex-direction:row!important}
.hp-overons h2,.sg-kop h2,.hp-services h2,.hp-tips h2,.hp-portfolio h2,.sg-tekst h2,.sg-faq h2,.sg-bronnen h2,.hp-svc-body h3,.hp-tips-card h3{color:var(--sg-drager)!important;-webkit-text-fill-color:var(--sg-drager)!important}

.project-card .sg-label{left:12px;top:12px;bottom:auto!important}
@media (min-width:1024px){.sg-zweef{display:none!important}}
@media (max-width:1023px){.footer .footer-bottom{padding-bottom:88px!important}}
html body .sg-hero .hp-hero-slider{padding:0!important}
@media (max-width:1023px){
  html body .sg-hero .sg-kort{font-size:15px!important;line-height:1.5!important}
  .sg-hero .hp-hs-static-content,.sg-hero .subhero-content{padding-bottom:50px!important}
  .sg-formsectie{margin-top:-40px}
}

/* ===== Review OPTIMALISATIE-1 (20-10-2026) ===== */
/* M5: verborgen mobiel menu geeft geen schaduwwaas rechts op desktop */
.mobile-menu:not(.open){box-shadow:none!important;visibility:hidden;transition:transform .4s cubic-bezier(.22,.61,.36,1),visibility 0s linear .4s}
.mobile-menu.open{visibility:visible;transition:transform .4s cubic-bezier(.22,.61,.36,1)}
/* M12: na scrollen de topbalk weg, nav naar boven, logo blijft (ook mobiel), smallere header */
.hp-topbar{transition:transform .3s ease}
body:has(nav.nav.scrolled) .hp-topbar{transform:translateY(-100%)}
html body nav.nav.scrolled{top:0!important}
@media (max-width:768px){
  html body nav.nav.scrolled{padding:8px 14px!important;background:rgba(11,37,39,.96)!important}
  html body nav.nav.scrolled .nav-logo{opacity:1!important;transform:none!important;pointer-events:auto!important}
}
/* M7: verder-lezen in volle rijen */
.sg-links.k4{grid-template-columns:repeat(4,minmax(0,1fr))}
.sg-links.k1{grid-template-columns:minmax(0,1fr);max-width:420px}
.sg-links.k2{grid-template-columns:repeat(2,minmax(0,1fr));max-width:820px}
@media (max-width:1023px){.sg-links.k4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.sg-links.k4,.sg-links.k2{grid-template-columns:minmax(0,1fr)}}
/* M11: mobiele homepage korter: dienstkaarten 2 naast elkaar, compacte werkwijze */
@media (max-width:640px){
  .hp-services .hp-svc-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important;max-width:none!important}
  .hp-services .hp-svc-img{aspect-ratio:4/3!important}
  .hp-services .hp-svc-badge{top:8px!important;left:8px!important;padding:5px 9px!important;font-size:9px!important;letter-spacing:1px!important}
  .hp-services .hp-svc-body{padding:14px 12px 16px!important;text-align:center}
  .hp-services .hp-svc-body h3{font-size:16px!important;line-height:1.25!important;margin:0 0 8px!important}
  .hp-services .hp-svc-body>p{display:none!important}
  .hp-services .hp-svc-features{margin:0 auto 10px!important;width:fit-content;text-align:left}
  .hp-services .hp-svc-features li{font-size:13px!important;padding:2px 0!important}
  .hp-services .hp-svc-features li:nth-child(n+3){display:none!important}
  .hp-services .hp-svc-body .btn{width:100%;padding:10px 8px!important;font-size:13px!important;min-height:44px}
  .hp-werkwijze .hp-werk-steps{gap:18px!important;margin-bottom:28px!important}
  .hp-werkwijze .hp-werk-step{flex-direction:row!important;align-items:flex-start!important;text-align:left!important;gap:14px!important}
  .hp-werkwijze .hp-werk-num{width:44px!important;height:44px!important;font-size:16px!important;flex:none}
  .hp-werkwijze .hp-werk-step h3{font-size:17px!important}
  .hp-werkwijze .hp-werk-step p{font-size:14px!important}
}
/* M11 vervolg: compactere mobiele homepage (doel onder 11.000 px op 390 breed) */
@media (max-width:640px){
  body.sg-type-home .hp-overons-photo{display:none!important}
  body.sg-type-home .hp-overons{padding:48px 0!important}
  body.sg-type-home .hp-waarom{padding:44px 0!important}
  body.sg-type-home .hp-waarom-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
  body.sg-type-home .hp-waarom-card{padding:16px 12px!important;text-align:center}
  body.sg-type-home .hp-waarom-card h3{font-size:15px!important;line-height:1.25!important;margin:8px 0 6px!important}
  body.sg-type-home .hp-waarom-card p{font-size:13px!important;line-height:1.45!important}
  body.sg-type-home .hp-waarom-ic{margin:0 auto!important}
  body.sg-type-home .sg-prijzen{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
  body.sg-type-home .sg-prijs{padding:16px 10px!important}
  body.sg-type-home .sg-cijfers{grid-template-columns:minmax(0,1fr)!important;gap:10px!important}
  body.sg-type-home .sg-cijfer-stat{padding:16px 14px!important}
  body.sg-type-home .sg-cijfer-stat strong{font-size:32px!important;margin-bottom:4px!important}
  body.sg-type-home .sg-sectie,body.sg-type-home .hp-tips,body.sg-type-home .hp-services,body.sg-type-home .hp-werkwijze{padding-top:44px!important;padding-bottom:44px!important}
  body.sg-type-home .hp-tips-card .hp-tips-card-body{padding:16px!important}
  body.sg-type-home .hp-tips-card p{font-size:14px!important}
}
@media (max-width:640px){
  .hp-services .hp-svc-badge{display:none!important}
  .hp-services .hp-svc-img .sg-label{font-size:9px!important;padding:3px 7px!important;left:8px!important;bottom:8px!important}
  .hp-services .hp-svc-body h3{font-size:15px!important;hyphens:none!important;-webkit-hyphens:none!important;word-break:normal!important;overflow-wrap:normal!important}
  .hp-services .hp-svc-features li{font-size:12.5px!important;line-height:1.35!important}
  .hp-services .hp-svc-features li:nth-child(n+2){display:none!important}
  .hp-services .hp-svc-card{display:flex!important;flex-direction:column!important}
  .hp-services .hp-svc-body{flex:1;display:flex!important;flex-direction:column!important;justify-content:space-between}
}
@media (max-width:640px){
  .footer .footer-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:22px 14px!important}
  .footer .footer-grid>.footer-col:first-child{grid-column:1/-1}
  .footer .footer-col h4{font-size:14px!important;margin-bottom:8px!important}
  .footer .footer-col li{font-size:13px!important;margin:0 0 6px!important}
  .footer{padding-top:44px!important}
}
@media (max-width:640px){
  body.sg-type-home #vragen .container>p{display:none}
  body.sg-type-home .hp-tips-grid.sg-grid{gap:12px!important}
  body.sg-type-home .hp-werkwijze .hp-werk-step p{font-size:13.5px!important;line-height:1.45!important}
  body.sg-type-home .sg-kop{margin-bottom:22px!important}
}
/* M12: logo blijft na scrollen ook op mobiel zichtbaar (template verbergt het; lege donkere balk was het gevolg) */
@media (max-width:768px){
  html body nav.nav.scrolled .nav-logo{display:inline-flex!important;opacity:1!important;transform:none!important;pointer-events:auto!important}
  html body nav.nav.scrolled .nav-logo .sg-logo.logo-on-dark{opacity:1!important}
  html body nav.nav.scrolled .nav-logo .sg-logo-img{height:36px}
}

/* aircomonteurlimburg 22-10-2026 (kwaliteitscontrole): zichtbare knop in de home-hero, en dichte FAQ-antwoorden echt verborgen */
.sg-hero-knop{display:inline-flex;align-items:center;gap:8px;min-height:44px;margin-top:14px;padding:10px 20px;border:1px solid rgba(255,255,255,.55);border-radius:999px;color:#fff;font-weight:700;font-size:15px;text-decoration:none;background:rgba(255,255,255,.08);transition:background-color .3s ease,border-color .3s ease}
.sg-hero-knop:hover{background:rgba(255,255,255,.18);border-color:#fff}
.sg-hero-knop svg{width:16px;height:16px}
@media(min-width:900px){.sg-hero-knop{margin-top:24px}}
.faq-item:not(.open) .faq-a{visibility:hidden}
.faq-item.open .faq-a{visibility:visible}
html.no-js .faq-a{max-height:none!important;visibility:visible!important}
/* lopende topbalk: vinkje als CSS in plaats van svg, zodat er geen half afgeknipt icoon aan de schermrand staat */
.hp-topbar-item svg{display:none}
.hp-topbar-item:not(.sep)::before{content:"";flex-shrink:0;width:10px;height:5px;border-left:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(-45deg) translateY(-2px);color:var(--bronze-light,#8FD0E8)}
/* menu-items zonder intro-animatie: die speelde opnieuw af bij een paginascreenshot en liet het menu leeg lijken */
.nav .nav-links > li{animation:none!important;opacity:1!important}
/* kwaliteitscontrole 22-10-2026: USP-rij onder de offertekaart viel weg tegen de donkere ondergrond (staat al in de topbalk en de hero) */
.sg-hero-onder{display:none!important}
/* bronnenlijst: altijd links uitgelijnd met hangende nummering */
.sg-bronnen,.sg-bronnen ol,.sg-bronnen li,.sg-bronnen p{text-align:left!important}
.sg-bronnen ol{padding-left:1.4em!important}
/* stappen 'Van vraag naar offerte': op mobiel net als op desktop gecentreerd onder elkaar */
@media (max-width:899px){
  .hp-werkwijze .hp-werk-step{flex-direction:column!important;align-items:center!important;text-align:center!important;gap:8px!important}
  .hp-werkwijze .hp-werk-step h3,.hp-werkwijze .hp-werk-step p{text-align:center!important}
}