/* ==========================================================================
   SUBSIDIE EXPERTISE — subsidieadvies verduurzaming vastgoed
   Huisstijl (aangeleverd door Stan, 18-09-2026): hoofdkleur blauw #1E90FF,
   accentkleur oranje #FF7800, lettertype Open Sans — overal, ook voor cijfers
   en labels (geen monospace meer). Het merkblauw is te licht voor witte tekst
   op knoppen (3,2:1); daarom is er een verdiepte variant (#0B6FD6, AA 4,96)
   voor links en tekst-op-blauw. Knoppen zijn oranje met donkere tekst (6,9:1).
   Groen blijft "toegekend / uitbetaald" (bedragen). Eén radius-schaal.
   ========================================================================== */
:root{
  /* z-index als betekenislaag, niet als willekeurig getal */
  --z-sticky:100;
  --z-nav:200;
  --z-drijvend:300;
  --z-balk:400;

  --brand:#1E90FF;         /* hoofdkleur Stan: vlakken, accenten, grote koppen */
  --blue:#0B6FD6;          /* verdiept merkblauw voor links/tekst (AA op wit: 4,96) */
  --blue-700:#0959B0;
  --blue-800:#07458A;
  --blue-300:#8EC5FF;
  --blue-050:#EAF4FF;      /* zachte tint */
  --orange:#FF7800;        /* accentkleur Stan: knoppen, highlights */
  --orange-700:#E06A00;
  --orange-050:#FFF1E6;
  --ink:#0C1526;           /* near-black navy: koppen, dark secties, footer */
  --ink-2:#131E36;
  --slate:#465166;         /* bodytekst */
  --muted:#646F87;      /* AA op wit (5,04) en op --bg-2 (4,69) */
  --line:#E4E8F0;          /* koele hairline */
  --line-2:#EEF1F6;
  --bg:#FFFFFF;
  --bg-2:#F4F7FC;          /* alt sectie */
  --white:#FFFFFF;
  --green:#0E9457;         /* toegekend bedrag / proof — spaarzaam */
  --green-700:#0B7A45;
  --green-050:#E6F6EE;
  --amber:#9C6A08;         /* sterren — AA op wit (4,69) */
  --amber-vlak:#E0A325;    /* zelfde amber als VLAK/rand, niet als tekst */
  --radius:16px;
  --radius-sm:10px;
  --radius-lg:22px;
  --shadow-sm:0 2px 8px -3px rgba(12,21,38,.10);
  --shadow:0 18px 44px -22px rgba(12,21,38,.28);
  --shadow-blue:0 22px 50px -24px rgba(11,111,214,.45);
  --shadow-orange:0 18px 40px -20px rgba(255,120,0,.55);
  --container:1180px;
  --ff-head:'Open Sans',-apple-system,Segoe UI,Roboto,sans-serif;  /* huisstijl: één lettertype */
  --ff-body:'Open Sans',-apple-system,Segoe UI,Roboto,sans-serif;
  --ff-mono:'Open Sans',-apple-system,Segoe UI,Roboto,sans-serif;  /* labels/cijfers: geen monospace (Stan) */
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:84px}/* sticky header niet over ankersecties (#check) heen */
body{margin:0;font-family:var(--ff-body);color:var(--slate);background:var(--bg);
  font-size:17px;line-height:1.62;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,h2,h3,h4{font-family:var(--ff-head);color:var(--ink);line-height:1.1;margin:0 0 .5em;
  font-weight:800;letter-spacing:-.02em;overflow-wrap:break-word}
h1{font-size:clamp(2.2rem,4.9vw,3.8rem);letter-spacing:-.028em;line-height:1.06;text-wrap:balance}
h2{font-size:clamp(1.7rem,3.3vw,2.55rem);text-wrap:balance}
h3{font-size:1.2rem;font-weight:700;letter-spacing:-.012em;text-wrap:balance}
p{margin:0 0 1rem;text-wrap:pretty}
a{color:var(--blue);text-decoration:none;transition:color .15s}
a:hover{color:var(--blue-700)}
img{max-width:100%;display:block}
strong,b{color:var(--ink);font-weight:700}
:focus-visible{outline:2px solid var(--blue);outline-offset:2px;border-radius:4px}
.container{width:100%;max-width:var(--container);margin:0 auto;padding:0 24px}
.section{padding:88px 0}
.section--tint{background:var(--bg-2)}
.section--fee-example{padding-bottom:36px}
.section--audience-reviews{padding-top:36px}
.section--ink{background:var(--ink);color:#C5CCE0;line-height:1.7}
.section--ink h2,.section--ink h3,.section--ink h4{color:#fff}
.eyebrow{display:inline-block;font-family:var(--ff-mono);font-weight:700;letter-spacing:.1em;
  text-transform:uppercase;font-size:.74rem;color:var(--blue)}
.section--ink .eyebrow{color:var(--blue-300)}
.lead{font-size:1.18rem;color:var(--slate);line-height:1.58}
.section--ink .lead{color:#AEB7CF}
.center{text-align:center}
.measure{max-width:720px}
.measure-center{max-width:740px;margin-left:auto;margin-right:auto}
.sec-head{margin-bottom:48px}
.sec-head .lead{margin-top:.6rem}

/* ---- buttons ---- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55em;font-family:var(--ff-body);
  font-weight:700;font-size:1rem;padding:.92em 1.5em;border-radius:12px;border:1.5px solid transparent;
  cursor:pointer;transition:transform .16s,box-shadow .16s,background .16s,border-color .16s;
  white-space:nowrap;line-height:1.15;letter-spacing:-.01em}
.btn svg{width:18px;height:18px;flex:0 0 auto}
.btn--primary,.btn--gold{background:var(--orange);color:var(--ink)}
.btn--primary:hover,.btn--gold:hover{background:var(--orange-700);color:var(--ink);transform:translateY(-2px);box-shadow:var(--shadow-orange)}
.btn--green{background:var(--green);color:#fff}
.btn--green:hover{background:var(--green-700);color:#fff;transform:translateY(-2px);box-shadow:0 18px 40px -20px rgba(18,183,106,.7)}
.btn--ghost{background:#fff;color:var(--ink);border-color:var(--line)}
.btn--ghost:hover{border-color:var(--blue);color:var(--blue)}
.btn--light{background:#fff;color:var(--blue)}
.btn--light:hover{color:var(--blue-700);transform:translateY(-2px);box-shadow:var(--shadow-sm)}
.btn--outline-light{background:transparent;color:#fff;border-color:rgba(255,255,255,.35)}
.btn--outline-light:hover{border-color:#fff;color:#fff;background:rgba(255,255,255,.08)}
.btn--lg{padding:1.04em 1.9em;font-size:1.04rem}
.btn--block{display:flex;width:100%}

/* ---- header ---- */
.site-header{position:sticky;top:0;z-index:var(--z-nav);background:rgba(255,255,255,.86);
  backdrop-filter:saturate(160%) blur(12px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;height:72px;gap:1.2rem}
.brand{display:flex;align-items:center;gap:.6rem;font-family:var(--ff-head);font-weight:800;
  color:var(--ink);font-size:1.16rem;letter-spacing:-.03em}
.brand:hover{color:var(--ink)}
.brand .brand-logo{width:34px;height:34px;border-radius:9px;object-fit:contain;flex:0 0 auto;background:#fff;padding:4px;border:1px solid var(--line)}
/* wordmark-logo (breed) i.p.v. vierkante tegel + tekst */
.brand-wordmark{height:26px;width:auto;max-width:min(200px,52vw);object-fit:contain;flex:0 0 auto}
/* het telefoonnummer past pas naast logo + menu + CTA vanaf ~1100px */
.nav-phone{display:none;align-items:center;gap:.4rem;font-weight:700;font-size:.93rem;color:var(--ink);
  padding:.5rem .7rem;border-radius:9px;white-space:nowrap}
@media(min-width:1100px){.nav-phone{display:inline-flex}}
.nav-phone:hover{color:var(--blue);background:var(--bg-2)}
.nav-phone svg{color:var(--blue);flex:0 0 auto}
.brand small{display:block;font-family:var(--ff-mono);font-weight:500;font-size:.6rem;color:var(--muted);
  letter-spacing:.06em;text-transform:uppercase;margin-top:2px}
.nav-links{display:flex;align-items:center;gap:.15rem;list-style:none;margin:0;padding:0}
.nav-links a{font-family:var(--ff-body);font-weight:600;font-size:.95rem;color:var(--ink);padding:.5rem .8rem;border-radius:9px}
.nav-links a:hover{background:var(--bg-2);color:var(--blue)}
.nav-links a.active{color:var(--blue)}
.nav-cta{display:flex;align-items:center;gap:.6rem}
.nav-cta .btn{padding:.68em 1.5em}
.dropdown{position:relative}
.dropdown-menu{position:absolute;top:calc(100% + 8px);left:0;min-width:290px;background:#fff;border:1px solid var(--line);
  border-radius:14px;box-shadow:var(--shadow);padding:8px;opacity:0;visibility:hidden;transform:translateY(6px);transition:.16s}
.dropdown:hover .dropdown-menu,.dropdown:focus-within .dropdown-menu{opacity:1;visibility:visible;transform:translateY(0)}
.dropdown-menu a{display:block;padding:.6rem .8rem;border-radius:9px;font-size:.92rem;color:var(--ink);font-weight:600}
.dropdown-menu a:hover{background:var(--bg-2)}
.dropdown-menu a small{display:block;color:var(--muted);font-weight:400;font-size:.78rem;margin-top:1px;font-family:var(--ff-body)}
.hamburger{display:none;background:none;border:0;cursor:pointer;padding:8px}
.hamburger span{display:block;width:24px;height:2px;background:var(--ink);margin:5px 0;transition:.2s;border-radius:2px}

/* ---- hero (light, lead-magnet) ---- */
.hero{position:relative;background:
  radial-gradient(820px 460px at 12% -8%,var(--blue-050),transparent 60%),
  radial-gradient(680px 420px at 100% 0,rgba(18,183,106,.07),transparent 55%),var(--bg);
  overflow:hidden;isolation:isolate;border-bottom:1px solid var(--line)}
.hero .container{padding-top:70px;padding-bottom:84px}
.hero-grid{display:grid;grid-template-columns:1.06fr .94fr;gap:56px;align-items:center}
.hero h1{margin-bottom:.45em}
.hero h1 .hl{color:var(--brand)}
.hero .lead{max-width:46ch}
.hero-cta{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.7rem}
.hero-trust{display:flex;flex-wrap:wrap;align-items:center;gap:1.3rem;margin-top:1.7rem;color:var(--muted);font-size:.9rem}
.hero-trust .stars{color:var(--amber);letter-spacing:2px;font-size:1rem}
.hero-trust b{color:var(--ink)}
.hero-trust img{height:38px;width:auto;display:inline-block}
.trust-div{width:1px;height:30px;background:var(--line)}

/* lead-magnet form card in hero */
.lead-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);padding:30px;
  box-shadow:var(--shadow);position:relative}
.lead-card::before{content:"";position:absolute;top:0;right:0;width:90px;height:90px;
  background:linear-gradient(135deg,transparent 50%,var(--green) 50%);
  border-radius:0 var(--radius-lg) 0 0;opacity:.14}
.lead-card .lc-tag{display:inline-flex;align-items:center;gap:.45rem;font-family:var(--ff-mono);font-weight:600;
  font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--green-700);
  background:var(--green-050);border-radius:999px;padding:.35rem .8rem;margin-bottom:.9rem}
.lead-card h3{font-size:1.4rem;margin-bottom:.3rem}
.lead-card .lc-sub{font-size:.95rem;color:var(--muted);margin-bottom:1.1rem}

/* ---- logo / trust strip ---- */
.logostrip{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px 38px}
.logostrip .lg{font-family:var(--ff-head);font-weight:800;letter-spacing:-.02em;color:#9aa3b8;font-size:1.18rem;
  filter:grayscale(1);transition:color .2s}
.logostrip .lg:hover{color:var(--ink)}

/* ---- generic grid / cards ---- */
.grid{display:grid;gap:24px}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:28px;
  transition:transform .2s,box-shadow .2s,border-color .2s;display:block}
.card:hover{box-shadow:var(--shadow);transform:translateY(-4px);border-color:#D9DCEA}
.card .ic{width:48px;height:48px;border-radius:12px;background:var(--blue-050);color:var(--blue);
  display:grid;place-items:center;margin-bottom:18px}
.card .ic svg{width:24px;height:24px}
.card h3{margin-bottom:.4rem}
.card p{font-size:.97rem;margin-bottom:.7rem}
.card .more{font-family:var(--ff-body);font-weight:700;font-size:.92rem;color:var(--blue);display:inline-flex;align-items:center;gap:.3rem}
a.card:hover .more{gap:.55rem}
.card--feature{position:relative;overflow:hidden;background:var(--ink);color:#C5CCE0;border-color:transparent}
.card--feature::after{content:"";position:absolute;bottom:0;right:0;width:130px;height:130px;
  background:linear-gradient(135deg,transparent 50%,var(--green) 50%);opacity:.85}
.card--feature h3{color:#fff}.card--feature .ic{background:rgba(255,255,255,.08);color:#fff}
.card--feature p{color:#AEB7CF}.card--feature .more{color:#fff}

/* ---- metric / case cards ---- */
.metric{font-family:var(--ff-mono);font-weight:800;font-variant-numeric:tabular-nums;font-size:clamp(2rem,4vw,2.8rem);color:var(--ink);
  line-height:1;letter-spacing:-.03em}
.metric .up{color:var(--green);font-size:.6em;vertical-align:.12em;margin-left:.1em}
.metric-label{color:var(--muted);font-size:.9rem;margin-top:8px;line-height:1.4}
.section--ink .metric{color:#fff}.section--ink .metric-label{color:#9AA6C2}
.statband{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid var(--line);
  border-radius:var(--radius);overflow:hidden;background:#fff}
.statband .sb{padding:26px 24px;border-right:1px solid var(--line)}
.statband .sb:last-child{border-right:0}
.statband .sb .tick{width:26px;height:3px;background:var(--green);border-radius:3px;margin-bottom:14px}

.case{display:block;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;
  transition:transform .2s,box-shadow .2s,border-color .2s}
.case:hover{box-shadow:var(--shadow);transform:translateY(-4px);border-color:#D9DCEA}
.case .case-img{aspect-ratio:16/10;overflow:hidden;background:var(--bg-2)}
.case .case-img img{width:100%;height:100%;object-fit:cover}
.case .case-body{padding:24px}
.case .case-tag{font-family:var(--ff-mono);font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.case .case-metrics{display:flex;gap:26px;margin:12px 0 6px}
.case .case-metrics .metric{font-size:1.9rem}
.case .more{font-weight:700;color:var(--blue);font-size:.92rem;display:inline-flex;gap:.3rem;align-items:center;margin-top:.5rem}

/* ---- klantbezoek proof gallery ---- */
.visits{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.visit{position:relative;border-radius:var(--radius);overflow:hidden;aspect-ratio:3/4;background:var(--bg-2);margin:0}
.visit img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.visit:hover img{transform:scale(1.05)}
.visit figcaption{position:absolute;left:0;right:0;bottom:0;padding:24px 16px 12px;color:#fff;font-weight:700;font-size:.92rem;
  background:linear-gradient(transparent,rgba(15,20,38,.82))}

/* ---- steps / framework ---- */
.steps{display:grid;gap:18px}
.steps-carousel{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.steps-dots{display:none}
.step{position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:26px}
.step .num{font-family:var(--ff-mono);font-weight:700;font-size:.95rem;color:var(--blue);
  background:var(--blue-050);width:38px;height:38px;border-radius:10px;display:grid;place-items:center;margin-bottom:16px}
.step h3{margin-bottom:.3rem;font-size:1.1rem}
.step p{font-size:.95rem;margin:0}

/* ---- USP / checks ---- */
.checks{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.checks li{display:flex;gap:.75rem;align-items:flex-start}
.checks li svg{flex:0 0 auto;margin-top:3px;color:var(--green);width:20px;height:20px}
.checks li b{display:block;color:var(--ink)}
.checks li span{font-size:.95rem}
.section--ink .checks li span{color:#AEB7CF}

/* ---- why split ---- */
.why-split{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}

/* ---- named contact ---- */
.contact-card{display:grid;grid-template-columns:auto 1fr;gap:24px;align-items:center;
  background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);padding:28px;box-shadow:var(--shadow-sm)}
.contact-card .ava{width:96px;height:96px;border-radius:50%;overflow:hidden;flex:0 0 auto;background:var(--bg-2)}
.contact-card .ava img{width:100%;height:100%;object-fit:cover}
.contact-card .role{font-family:var(--ff-mono);font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--blue)}
.contact-card h3{margin:.2rem 0 .1rem}
.contact-actions{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:.9rem}

/* ---- team ---- */
.team-card{text-align:center}
.team-card .avatar{width:120px;height:120px;border-radius:50%;margin:0 auto 16px;overflow:hidden;background:var(--bg-2)}
.team-card .avatar img{width:100%;height:100%;object-fit:cover}
.team-card h3{margin:0 0 .1rem;font-size:1.1rem}
.team-card .role{color:var(--blue);font-family:var(--ff-mono);font-weight:600;font-size:.78rem;text-transform:uppercase;letter-spacing:.05em}

/* ---- forms ---- */
.form{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:30px;box-shadow:var(--shadow-sm)}
.field{margin-bottom:14px}
.field label{display:block;font-weight:600;font-size:.86rem;color:var(--ink);margin-bottom:6px}
.field input,.field textarea,.field select{width:100%;padding:.82rem .9rem;border:1.5px solid var(--line);border-radius:10px;
  font-family:var(--ff-body);font-size:16px;color:var(--ink);background:#fff;transition:.15s}
.field input::placeholder,.field textarea::placeholder{color:#A4AdC0}
.field input:focus,.field textarea:focus,.field select:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px rgba(30,144,255,.18)}
.field textarea{min-height:120px;resize:vertical}
.contactvoorkeur{min-width:0;margin:0 0 14px;padding:0;border:0;border-radius:0;background:transparent}
.contactvoorkeur-titel{margin:0 0 6px;font-size:.86rem;font-weight:600;color:var(--ink);text-align:left}
.contactvoorkeur-keuzes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.contactvoorkeur-keuzes label{display:flex;align-items:center;justify-content:center;gap:7px;min-width:0;padding:8px 6px;border:1px solid var(--line);border-radius:9px;background:#fff;color:var(--slate);font-size:.82rem;font-weight:600;cursor:pointer;transition:background .15s,border-color .15s,color .15s}
.contactvoorkeur-keuzes label:has(input:checked){border-color:var(--brand);background:#EAF4FF;color:var(--ink)}
.contactvoorkeur-keuzes label:focus-within{outline:3px solid rgba(30,144,255,.2);outline-offset:2px}
.contactvoorkeur-keuzes input{margin:0;accent-color:var(--brand)}
@media(max-width:400px){.contactvoorkeur-keuzes{grid-template-columns:repeat(2,minmax(0,1fr))}.contactvoorkeur-keuzes label:last-child{grid-column:1/-1}}
.form-note{font-size:.82rem;color:var(--muted)}
.form-note a{text-decoration:underline}

/* ---- FAQ ---- */
.faq details{background:#fff;border:1px solid var(--line);border-radius:12px;margin-bottom:12px;overflow:hidden}
.faq summary{cursor:pointer;list-style:none;padding:18px 22px;font-family:var(--ff-head);font-weight:700;
  color:var(--ink);font-size:1.04rem;display:flex;justify-content:space-between;align-items:center;gap:12px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-weight:400;color:var(--blue);font-size:1.6rem;line-height:1;transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details[open] summary{border-bottom:1px solid var(--line)}
.faq details p{margin:0;padding:16px 22px 20px;color:var(--slate);font-size:.97rem}
.faq--expandable .faq-extra{display:none}
.faq--expandable.is-expanded .faq-extra{display:block}
.faq-toggle{display:block;margin:22px auto 0}

/* ---- CTA band ---- */
.cta-band{position:relative;background:var(--blue);border-radius:24px;padding:52px;color:#fff;overflow:hidden;
  display:flex;align-items:center;justify-content:space-between;gap:32px;flex-wrap:wrap;box-shadow:var(--shadow-blue)}
.cta-band::after{content:"";position:absolute;bottom:0;right:0;width:200px;height:200px;
  background:linear-gradient(135deg,transparent 50%,rgba(255,255,255,.10) 50%)}
.cta-band>*{position:relative;z-index:1}
.cta-band h2{color:#fff;margin:0}
.cta-band p{color:#D7D9F0;margin:.5rem 0 0;max-width:46ch}

/* ---- page hero (interne pagina's) ---- */
.page-hero{position:relative;background:
  radial-gradient(700px 360px at 12% -10%,var(--blue-050),transparent 60%),var(--bg);
  padding:64px 0 56px;border-bottom:1px solid var(--line)}
.page-hero h1{max-width:20ch}
.page-hero .lead{max-width:60ch}
.crumb{font-family:var(--ff-mono);font-size:.76rem;color:var(--muted);margin-bottom:14px;letter-spacing:.04em}
.crumb a{color:var(--muted)}.crumb a:hover{color:var(--blue)}

/* ---- footer ---- */
.site-footer{background:var(--ink);color:#9AA6C2;padding:66px 0 28px;font-size:.95rem;line-height:1.7}
.site-footer h4,.site-footer .foot-h{color:#fff;font-family:var(--ff-mono);font-weight:600;font-size:.72rem;
  letter-spacing:.1em;text-transform:uppercase;margin:0 0 1rem}
.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:36px}
.site-footer a{color:#9AA6C2;display:block;padding:.28rem 0}
.site-footer a:hover{color:#fff}
.footer-brand .brand{color:#fff}
.footer-brand .brand small{color:#7E89A6}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1);margin-top:44px;padding-top:22px;display:flex;
  justify-content:space-between;gap:14px;flex-wrap:wrap;font-size:.85rem;color:#6E7A98}

/* ---- floating WhatsApp + mobile CTA ---- */
.wa-float{position:fixed;right:22px;bottom:22px;z-index:var(--z-drijvend);display:flex;align-items:center;gap:10px;
  background:#25D366;color:#fff;border-radius:999px;padding:13px 18px 13px 15px;font-weight:700;
  box-shadow:0 14px 30px -8px rgba(37,211,102,.55);transition:transform .2s,box-shadow .2s}
.wa-float:hover{color:#fff;transform:translateY(-2px)}
.wa-float span{font-size:.92rem}
.wa-avatar{position:relative;flex:0 0 auto;width:36px;height:36px}
.wa-avatar img{width:36px;height:36px;border-radius:50%;object-fit:cover;display:block;border:2px solid rgba(255,255,255,.85)}
.wa-avatar svg{position:absolute;right:-5px;bottom:-4px;width:13px;height:13px;background:#0F7A6D;color:#fff;border-radius:50%;padding:3px;box-sizing:content-box;border:2px solid #25D366}
@media(max-width:560px){.wa-float .wa-float-txt{display:none}.wa-float{padding:15px}}
.mobile-cta{display:none}
@media(max-width:760px){
  .mobile-cta{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:var(--z-balk);gap:10px;padding:10px 14px;
    padding-bottom:calc(10px + env(safe-area-inset-bottom));
    background:rgba(255,255,255,.97);backdrop-filter:saturate(160%) blur(10px);border-top:1px solid var(--line);
    box-shadow:0 -10px 26px -14px rgba(15,20,38,.3);
    transform:translateY(130%);transition:transform .32s cubic-bezier(.22,.61,.36,1);will-change:transform}
  .mobile-cta.is-visible{transform:none}
  .mobile-cta .btn{flex:1;padding:.92em 1em;font-size:.98rem}
  .mobile-cta .btn--wa{flex:0 0 auto;width:52px;padding:0;background:#25D366;color:#fff;border:0}
  .mobile-cta .btn--wa svg{width:24px;height:24px}
  .wa-float{display:none}
  body{padding-bottom:74px}
}
@media (prefers-reduced-motion:reduce){.mobile-cta{transition:none}}

/* ---- scroll-reveal ---- */
.reveal{opacity:0;transform:translateY(16px);transition:opacity .6s ease,transform .6s ease}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1!important;transform:none!important;transition:none!important}}
.mt-1{margin-top:1rem}.mt-2{margin-top:1.6rem}

/* ==========================================================================
   Responsive
   ========================================================================== */
@media(max-width:980px){
  .hero-grid{grid-template-columns:1fr;gap:38px}
  .grid-4{grid-template-columns:repeat(2,1fr)}
  .statband{grid-template-columns:repeat(2,1fr)}
  .statband .sb:nth-child(2){border-right:0}
  .statband .sb:nth-child(1),.statband .sb:nth-child(2){border-bottom:1px solid var(--line)}
  .visits{grid-template-columns:repeat(2,1fr)}
  .footer-grid{grid-template-columns:1fr 1fr;gap:30px}
  /* nav klapt al op tablet in zodat de desktop-nav nooit overloopt (>760 paste niet) */
  .nav-links,.nav-cta .btn{display:none}
  .hamburger{display:block}
  .nav-mobile-open .nav-links{display:flex;position:absolute;top:72px;left:0;right:0;flex-direction:column;align-items:stretch;
    background:#fff;border-bottom:1px solid var(--line);padding:14px 18px;gap:.2rem;box-shadow:var(--shadow)}
  .nav-mobile-open .nav-links a{padding:.7rem .6rem;border-radius:9px}
  .nav-mobile-open .dropdown-menu{display:none;position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:0;padding:.2rem 0 .2rem 1rem}
  .nav-mobile-open .dropdown.open .dropdown-menu{display:block}
}
@media(max-width:760px){
  .nav-mobile-open .nav-links{display:flex;position:absolute;top:72px;left:0;right:0;flex-direction:column;align-items:stretch;
    background:#fff;border-bottom:1px solid var(--line);padding:14px 18px;gap:.2rem;box-shadow:var(--shadow)}
  .nav-mobile-open .nav-links a{padding:.7rem .6rem;border-radius:9px}
  .nav-mobile-open .dropdown-menu{display:none;position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:0;padding:.2rem 0 .2rem 1rem}
  .nav-mobile-open .dropdown.open .dropdown-menu{display:block}
  .section{padding:54px 0}
  .grid-2,.grid-3,.grid-4{grid-template-columns:1fr}
  .statband{grid-template-columns:1fr 1fr}
  .steps-carousel{display:flex;overflow-x:auto;gap:14px;scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:6px}
  .steps-carousel::-webkit-scrollbar{display:none}
  .steps-carousel>.step{flex:0 0 82%;scroll-snap-align:center}
  .steps-dots{display:flex;justify-content:center;gap:9px;margin-top:18px}
  .steps-dots button{width:8px;height:8px;border-radius:50%;background:rgba(15,20,38,.2);border:0;padding:0;cursor:pointer;transition:.25s}
  .steps-dots button.on{background:var(--blue);width:22px;border-radius:5px}
  .cta-band{padding:34px;flex-direction:column;align-items:flex-start}
  .why-split{grid-template-columns:1fr;gap:26px}
  .contact-card{grid-template-columns:1fr;text-align:center}
  .contact-card .ava{margin:0 auto}
  .contact-actions{justify-content:center}
  .footer-grid{grid-template-columns:1fr}
  .hero .container{padding-top:46px;padding-bottom:54px}
  .hero-trust{gap:.7rem 1.1rem}.trust-div{display:none}
  .hero-cta .btn{flex:1 1 100%}
}
@media(max-width:400px){
  /* op zeer smalle telefoons mogen lange CTA-labels netjes afbreken i.p.v. overlopen */
  .btn{white-space:normal}
}
@media(max-width:640px){
  /* 2-koloms check-lijsten (inline gezet op pagina's) altijd stacken op mobiel */
  .checks{grid-template-columns:1fr!important}
}
@media(max-width:380px){
  .statband{grid-template-columns:1fr}
  .statband .sb{border-right:0;border-bottom:1px solid var(--line)}
  .statband .sb:last-child{border-bottom:0}
}

/* ==========================================================================
   SUBSIDIECHECK — interactieve rekentool (assets/js/subsidiecheck.js)
   ========================================================================== */
.sc{margin:0}
.sc-wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:0;background:#fff;border:1px solid var(--line);
  border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow)}
.sc-form{padding:30px;border-right:1px solid var(--line);min-width:0}
.sc-paneel{background:var(--bg-2);padding:30px;min-width:0}

.sc-head{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap;margin-bottom:22px}
.sc-head h3{margin:0;font-size:1.2rem}
.sc-tag{font-family:var(--ff-mono);font-weight:700;font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;
  color:var(--blue-700);background:var(--blue-050);border-radius:999px;padding:.34rem .7rem}
.sc-wissel{margin-left:auto;background:none;border:0;padding:.4rem .1rem;font-family:var(--ff-body);font-weight:600;
  font-size:.86rem;color:var(--muted);cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.sc-wissel:hover{color:var(--blue)}

.sc-block{border:0;padding:0;margin:0 0 22px;min-width:0}
.sc-block legend{padding:0;font-family:var(--ff-head);font-weight:700;font-size:.95rem;color:var(--ink);margin-bottom:12px}
.sc-grid{display:grid;gap:10px}
.sc-row{margin-bottom:20px}
.sc-hint{font-size:.84rem;color:var(--muted);margin:.5rem 0 0}

.sc-m2,.sc-num{display:flex;align-items:center;gap:10px;min-width:0}
.sc-m2>span,.sc-num>span{flex:1 1 auto;min-width:0;font-size:.93rem;color:var(--slate)}
.sc-m2 input,.sc-num input{flex:0 0 92px;width:92px;padding:.6rem .7rem;border:1.5px solid var(--line);border-radius:9px;
  font-family:var(--ff-mono);font-size:16px;font-weight:600;color:var(--ink);text-align:right;background:#fff}
.sc-m2 input:focus,.sc-num input:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(27,95,217,.14)}
.sc-m2 i{flex:0 0 auto;font-style:normal;font-family:var(--ff-mono);font-size:.8rem;color:var(--muted);width:22px}
.sc-num{display:block}
.sc-num>span{display:block;font-weight:600;color:var(--ink);font-size:.88rem;margin-bottom:6px}
.sc-num input{width:100%;flex:none;text-align:left}

.sc-check{display:flex;gap:.7rem;align-items:flex-start;padding:.6rem 0;cursor:pointer}
.sc-check input{flex:0 0 auto;width:20px;height:20px;margin-top:2px;accent-color:var(--blue)}
.sc-check span{font-size:.93rem;color:var(--slate)}
.sc-check b{display:block;color:var(--ink);font-size:.95rem}
.sc-check small{display:block;color:var(--muted);font-size:.83rem}
.sc-sub{display:none;padding:.2rem 0 .6rem 2.3rem}

.sc-kies{padding:34px 30px}
.sc-kies-h{font-family:var(--ff-head);font-weight:800;color:var(--ink);font-size:1.15rem;margin-bottom:18px;text-align:center}
.sc-kies-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.sc-kies-btn{position:relative;text-align:left;background:#fff;border:1.5px solid var(--line);border-radius:var(--radius);
  padding:20px 18px 18px;cursor:pointer;font-family:var(--ff-body);transition:.16s;min-width:0}
.sc-kies-btn:hover{border-color:var(--blue);transform:translateY(-3px);box-shadow:var(--shadow-sm)}
.sc-kies-btn b{display:block;font-family:var(--ff-head);font-size:1.02rem;color:var(--ink);margin-bottom:.25rem}
.sc-kies-btn small{display:block;color:var(--muted);font-size:.84rem;line-height:1.4;margin-bottom:.7rem}
.sc-kies-btn i{font-style:normal;font-family:var(--ff-mono);font-weight:700;font-size:.7rem;letter-spacing:.08em;
  color:var(--blue-700);background:var(--blue-050);border-radius:999px;padding:.26rem .6rem}

.sc-uitkomst{margin-bottom:24px}
.sc-leeg{color:var(--muted);font-size:.95rem;background:#fff;border:1px dashed var(--line);border-radius:12px;padding:22px;margin:0}
.sc-bedrag{background:var(--ink);color:#fff;border-radius:var(--radius);padding:22px 24px;margin-bottom:16px}
.sc-bedrag-label{display:block;font-family:var(--ff-mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:#9AA6C2}
.sc-bedrag strong{display:block;font-family:var(--ff-mono);font-weight:700;font-size:clamp(2rem,5vw,2.6rem);
  letter-spacing:-.03em;line-height:1.1;margin:.2rem 0 .3rem;color:#fff}
.sc-bedrag-sub{display:block;font-size:.83rem;color:#9AA6C2}
.sc-regels{list-style:none;margin:0 0 14px;padding:0;background:#fff;border:1px solid var(--line);border-radius:12px}
.sc-regels li{display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding:12px 16px;border-bottom:1px solid var(--line-2)}
.sc-regels li:last-child{border-bottom:0}
.sc-regels li span{font-size:.92rem;color:var(--ink);font-weight:600;min-width:0}
.sc-regels li small{display:block;font-weight:400;color:var(--muted);font-size:.79rem;line-height:1.35}
.sc-regels li b{font-family:var(--ff-mono);font-size:.95rem;color:var(--ink);white-space:nowrap}

.sc-badge{font-size:.86rem;color:var(--slate);background:#fff;border:1px solid var(--line);
  border-radius:10px;padding:10px 14px;margin-bottom:8px}
.sc-badge--goed{border-color:#B7E3CC;background:var(--green-050);color:var(--green-700)}
.sc-badge--let{border-color:#E8CE8E;background:#FDF6E7;color:#7A5A0E}
.sc-waarschuwing{list-style:none;margin:8px 0 0;padding:12px 14px;background:#FDF6E7;border-radius:10px;
  font-size:.85rem;color:#8A6410}
.sc-waarschuwing li+li{margin-top:.4rem}

.sc-moment{background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px 16px;margin:14px 0}
.sc-moment.is-urgent{border-color:#F0C15A;background:#FDF6E7}
.sc-moment-tag{display:block;font-family:var(--ff-mono);font-weight:700;font-size:.7rem;letter-spacing:.08em;
  text-transform:uppercase;color:var(--muted);margin-bottom:.35rem}
.sc-moment.is-urgent .sc-moment-tag{color:#8A6410}
.sc-moment p{margin:0;font-size:.9rem;color:var(--slate)}

.sc-fee{background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px 18px;margin-top:14px}
.sc-fee>span{display:block;font-family:var(--ff-head);font-weight:700;color:var(--ink);font-size:.95rem;margin-bottom:10px}
.sc-fee-rij{display:flex;justify-content:space-between;gap:12px;font-size:.9rem;color:var(--slate);padding:.3rem 0}
.sc-fee-rij b{font-family:var(--ff-mono);color:var(--ink);white-space:nowrap}
.sc-fee-rij--totaal{border-top:1px solid var(--line);margin-top:.4rem;padding-top:.6rem}
.sc-fee-rij--totaal b{color:var(--green-700);font-size:1.05rem}
.sc-fee-note{font-size:.8rem;color:var(--muted);margin:.7rem 0 0}

.sc-cta{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:22px}
.sc-cta-h{font-family:var(--ff-head);font-weight:800;color:var(--ink);font-size:1.06rem;margin:0 0 .3rem}
.sc-cta-sub{font-size:.89rem;color:var(--muted);margin-bottom:1rem}
.sc-fallback{padding:26px;display:block}
.sc-fallback a{text-decoration:underline}

@media(max-width:900px){
  .sc-wrap{grid-template-columns:1fr}
  .sc-form{border-right:0;border-bottom:1px solid var(--line)}
  .sc-kies-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:560px){
  .sc-form,.sc-paneel,.sc-kies{padding:22px 18px}
  .sc-kies-grid{grid-template-columns:1fr}
  .sc-m2>span{font-size:.89rem}
  .sc-m2 input,.sc-num input{flex-basis:80px;width:80px}
}

/* ==========================================================================
   SUBSIDIE EXPERTISE — eigen componenten
   ========================================================================== */
/* hero-beeld naast de tekst */
.hero-beeld{margin:0;border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow);background:var(--bg-2)}
.hero-beeld img{width:100%;height:100%;object-fit:cover;aspect-ratio:16/10}

/* doelgroep-routing onder de hero */
.routes{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:52px}
.route{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:20px;display:block;
  transition:transform .18s,box-shadow .18s,border-color .18s;min-width:0}
.route:hover{transform:translateY(-3px);box-shadow:var(--shadow-sm);border-color:var(--blue-300)}
.route-reg{display:inline-block;font-family:var(--ff-mono);font-weight:700;font-size:.68rem;letter-spacing:.09em;
  color:var(--blue-700);background:var(--blue-050);border-radius:999px;padding:.26rem .6rem;margin-bottom:.7rem}
.route b{display:block;font-family:var(--ff-head);font-size:1.05rem;color:var(--ink);letter-spacing:-.02em}
.route small{display:block;color:var(--muted);font-size:.86rem;line-height:1.4;margin-top:.15rem}

/* "vóór of ná uitvoering"-lijst */
.momentlijst{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.momentlijst li{display:flex;gap:14px;align-items:flex-start;background:#fff;border:1px solid var(--line);
  border-radius:12px;padding:16px 18px}
.ml-code{flex:0 0 auto;font-family:var(--ff-mono);font-weight:700;font-size:.72rem;letter-spacing:.06em;
  color:var(--blue-700);background:var(--blue-050);border-radius:8px;padding:.4rem .55rem;min-width:56px;text-align:center}
.momentlijst b{display:block;color:var(--ink);font-size:.98rem}
.momentlijst small{display:block;color:var(--slate);font-size:.88rem;line-height:1.5;margin-top:.15rem}

.more-link{font-weight:700;color:var(--blue);font-size:.96rem}
.bron-note{font-size:.84rem;color:var(--muted);margin-top:22px;max-width:70ch;margin-left:auto;margin-right:auto}
.strip-h{font-family:var(--ff-mono);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:26px}

/* klantlogo-strip */
.klantlogos{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:22px 44px}
.klantlogos img{height:auto;max-height:52px;width:auto;max-width:130px;object-fit:contain;
  filter:grayscale(1);opacity:.62;transition:filter .2s,opacity .2s}
.klantlogos img:hover{filter:none;opacity:1}

/* projectkaarten */
.pj-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.pj{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;display:flex;
  flex-direction:column;transition:transform .2s,box-shadow .2s,border-color .2s;min-width:0}
.pj:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:#D9DEEA}
.pj-img{position:relative;aspect-ratio:3/2;overflow:hidden;background:var(--bg-2)}
.pj-img img{width:100%;height:100%;object-fit:cover}
.pj--foto-gedraaid .pj-img img{transform:rotate(180deg)}
.pj-img .pj-regs{position:absolute;top:12px;right:12px;z-index:1;justify-content:flex-end;max-width:calc(100% - 24px)}
.pj-body{padding:22px;display:flex;flex-direction:column;flex:1 1 auto;min-width:0}
.pj-meta{display:flex;gap:10px;font-family:var(--ff-mono);font-size:.7rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:.6rem}
.pj-meta span+span::before{content:"·";margin-right:10px}
.pj h3{font-size:1.06rem;margin-bottom:.5rem;line-height:1.25}
.pj p{font-size:.93rem;margin-bottom:1rem}
.pj p[hidden]{display:none}
.pj-beschrijving{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.pj-beschrijving.is-expanded{display:block;-webkit-line-clamp:unset;overflow:visible}
.pj-leesmeer{align-self:flex-start;margin:0 0 1rem;padding:0;border:0;background:none;color:#1e90ff;font:inherit;font-size:.9rem;font-weight:400;text-decoration:underline;cursor:pointer}
.pj-leesmeer[hidden]{display:none}
.pj-foot{margin-top:auto;display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;
  border-top:1px solid var(--line-2);padding-top:.9rem}
.pj-regs{display:flex;gap:6px;flex-wrap:wrap}
.pj-reg{font-family:var(--ff-mono);font-weight:600;font-size:.66rem;letter-spacing:.06em;color:#fff;
  background:#1e90ff;clip-path:polygon(7px 0,100% 0,calc(100% - 7px) 100%,0 100%);padding:.3rem .65rem}
.pj-opdr{display:flex;flex-direction:column;align-items:flex-start;font-size:.8rem;color:var(--muted);text-align:left;min-width:0}
.pj-opdr-label{color:#000;font-weight:700}

.pj-filter{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:30px;justify-content:center}
.pj-filter-btn{background:#fff;border:1.5px solid var(--line);border-radius:999px;padding:.55rem 1.05rem;cursor:pointer;
  font-family:var(--ff-body);font-weight:600;font-size:.92rem;color:var(--slate);transition:.15s;min-height:44px}
.pj-filter-btn:hover{border-color:var(--blue);color:var(--blue)}
.pj-filter-btn.on{background:#1e90ff;border-color:#1e90ff;color:#fff}
.pj-filter-btn i{font-style:normal;font-family:var(--ff-mono);font-size:.78rem;opacity:.6;margin-left:.2rem}
.projecten-meer-wrap{margin-top:26px}

/* reviewkaarten */
.review-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:26px;margin:0;
  display:flex;flex-direction:column}
.review-card .stars{color:var(--amber);letter-spacing:2px;font-size:.95rem;margin-bottom:.7rem}
.review-card p{font-size:.98rem;color:var(--slate);margin-bottom:1.1rem;flex:1 1 auto}
.review-card cite{font-style:normal;font-weight:700;color:var(--ink);font-size:.94rem}
.review-card cite small{display:block;font-weight:400;color:var(--muted);font-size:.82rem;margin-top:.1rem}
.hero-trust .stars{color:var(--amber);letter-spacing:2px}

/* Trustpilot-reviewgrid */
.reviews-toolbar{display:flex;align-items:center;gap:10px;margin:0 0 26px;padding:0 0 18px;
  border:0;border-bottom:1px solid var(--line-2);background:transparent}
.reviews-toolbar label{font-size:.84rem;font-weight:600;color:var(--muted)}
.reviews-filter{min-height:38px;max-width:100%;padding:.45rem 2.25rem .45rem 1rem;border:1px solid transparent;border-radius:999px;
  appearance:none;-webkit-appearance:none;cursor:pointer;background-color:var(--bg-2);color:var(--ink);font:inherit;font-size:.88rem;font-weight:600;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%230B6FD6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right .85rem center;transition:background-color .16s,border-color .16s,box-shadow .16s}
.reviews-filter:hover{background-color:var(--blue-050);border-color:rgba(30,144,255,.18)}
.reviews-filter:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.reviews-count{margin:0 0 0 auto;color:var(--muted);font-size:.86rem}
.reviews-grid{align-items:stretch}
.review-card__stars{color:#00b67a;font-size:1.12rem;letter-spacing:.1em;line-height:1;margin:0 0 16px}
.review-card__title{font-size:1.04rem;line-height:1.4;margin:0 0 .75rem;color:var(--ink)}
.review-card__text{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;overflow:hidden;
  margin:0 0 .6rem!important;color:var(--slate);font-size:.93rem!important;line-height:1.55}
.review-card__text.is-expanded{display:block;-webkit-line-clamp:unset;overflow:visible}
.review-card__more{align-self:flex-start;padding:0;margin:0 0 1rem;border:0;background:none;color:#1e90ff;
  font:inherit;font-size:.88rem;text-decoration:underline;cursor:pointer}
.review-card__more[hidden]{display:none}
.review-card__footer{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-top:auto;padding-top:12px;
  border-top:1px solid var(--line-2)}
.review-card__footer cite{min-width:0}
.review-card__source{flex:0 0 auto;color:#1e90ff;font-size:.82rem;text-decoration:underline}
.reviews-empty{margin:20px 0;padding:20px;border:1px solid var(--line);border-radius:var(--radius);background:#fff;text-align:center;color:var(--slate)}
.reviews-load-more-wrap{display:flex;justify-content:center;margin-top:28px}
.reviews-load-more-wrap [hidden]{display:none}
@media(min-width:761px) and (max-width:980px){.reviews-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.reviews-toolbar{flex-wrap:wrap}.reviews-count{width:100%;margin-left:0}.reviews-filter{font-size:.82rem}}

/* Contactpagina: formulier als hoofdactie, contactgegevens daarnaast. */
.contact-page-layout{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr);grid-template-areas:"details form";
  gap:clamp(28px,4vw,52px);align-items:stretch}
.contact-page-details{grid-area:details;display:flex;flex-direction:column;padding:clamp(24px,2.6vw,32px) 0 0}
.contact-page-details h2,.contact-page-form h2{font-size:clamp(1.55rem,2.5vw,2rem);margin-bottom:.55rem}
.contact-details-list{display:flex;flex:1;flex-direction:column;gap:18px;margin:24px 0 0}
.contact-office-group{display:grid;gap:18px;margin-top:22px;margin-bottom:0;padding-top:0}
.contact-office-group .contact-detail dt svg{stroke:var(--orange)}
.contact-detail{display:grid;grid-template-columns:22px minmax(0,1fr);column-gap:11px;margin:0;align-items:start}
.contact-detail dt{grid-column:2;position:relative;font-size:.88rem;font-weight:700;color:var(--ink);line-height:1.4}
.contact-detail dt svg{position:absolute;left:-33px;top:1px;width:19px;height:19px;fill:none;stroke:var(--blue);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.contact-detail dd{grid-column:2;margin:2px 0 0;font-size:.92rem;line-height:1.5;color:var(--slate);overflow-wrap:anywhere}
.contact-detail dd span{font-size:.86rem;color:var(--muted)}
.contact-detail a{color:var(--slate);text-decoration:none}
.contact-detail a:hover{color:var(--blue);text-decoration:underline;text-underline-offset:3px}
.contact-page-form{grid-area:form;padding:clamp(24px,2.6vw,32px);box-shadow:var(--shadow);border-color:var(--line)}
.contact-page-form h2{margin-bottom:.4rem}
.contact-page-form__intro{margin:0 0 16px;color:var(--slate);font-size:.94rem;line-height:1.5}
.contact-page-form .field{margin-bottom:10px}
.contact-page-form .field label span{font-size:.84em;font-weight:400;color:var(--muted)}
.contact-page-form .field input{min-height:46px}
.contact-page-form .contactvoorkeur{min-width:0;margin:0 0 10px;padding:0;border:0}
.contact-page-form .contactvoorkeur-titel{padding:0;margin:0 0 7px;font-size:.86rem;font-weight:600;color:var(--ink)}
.contact-page-form .contactvoorkeur-keuzes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.contact-page-form .contactvoorkeur-keuzes label{min-height:42px;padding:7px 8px}
.contact-page-form .field textarea{min-height:76px}
.contact-page-form .form-note{margin:12px 0 0;line-height:1.5}
body[data-contact-page] .wa-float,body[data-contact-page] .wa-bubble{display:none!important}
@media(max-width:760px){
  .contact-kanalen{padding:44px 0 56px}
  .contact-page-layout{grid-template-columns:minmax(0,1fr);grid-template-areas:"form" "details";gap:30px}
  .contact-page-form{padding:22px 18px}
  .contact-page-details{padding:0 4px}
  .contact-details-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 18px;margin-top:20px}
  .contact-office-group{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 18px;margin:10px 0 0;padding-top:18px;border-top:1px solid var(--line)}
}
@media(max-width:480px){.contact-details-list{grid-template-columns:1fr}.contact-page-form .contactvoorkeur-keuzes{grid-template-columns:1fr}
  .contact-page-form .contactvoorkeur-keuzes label:last-child{grid-column:auto}.contact-office-group{grid-template-columns:1fr;gap:18px}}

/* inhoudsblokken op de regelingspagina's */
.prose{max-width:72ch}
.prose h2{margin-top:2.2rem}
.prose h3{margin-top:1.8rem;font-size:1.12rem}
.prose ul{padding-left:1.1rem;margin:0 0 1.2rem}
.prose li{margin-bottom:.45rem}
.tabel-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line);border-radius:var(--radius);background:#fff}
table.bedragen{width:100%;border-collapse:collapse;min-width:520px;font-size:.94rem}
table.bedragen th,table.bedragen td{padding:12px 16px;text-align:left;border-bottom:1px solid var(--line-2)}
table.bedragen thead th{font-family:var(--ff-mono);font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;
  color:var(--muted);font-weight:600;background:var(--bg-2);white-space:nowrap}
table.bedragen tbody tr:last-child td{border-bottom:0}
table.bedragen td.num{font-family:var(--ff-mono);white-space:nowrap;color:var(--ink);font-weight:600}
table.bedragen td.num-sterk{color:var(--green-700)}
.vergoeding-disclaimer{margin:12px auto 0;color:var(--muted);font-size:.84rem;line-height:1.5;text-align:center}
.tabel-bron{font-size:.82rem;color:var(--muted);margin-top:.8rem}
.tabel-bron a{text-decoration:underline}

/* bedragentabellen op smalle schermen: rij wordt kaart, kolomkop komt uit data-label */
@media(max-width:900px){
  .tabel-wrap{overflow-x:visible;border:0;background:transparent;border-radius:0}
  table.bedragen{display:block;min-width:0;font-size:.94rem}
  table.bedragen thead{display:none}
  table.bedragen tbody{display:block}
  table.bedragen tr{display:block;background:#fff;border:1px solid var(--line);border-radius:var(--radius);
    padding:4px 0;margin-bottom:12px}
  table.bedragen tbody tr:last-child{margin-bottom:0}
  table.bedragen td{display:block;width:auto;padding:10px 16px;border-bottom:1px solid var(--line-2)}
  table.bedragen tr td:last-child{border-bottom:0}
  table.bedragen tr td:first-child{font-weight:700;color:var(--ink)}
  table.bedragen td[data-label]::before{content:attr(data-label);display:block;
    font-family:var(--ff-mono);font-size:.68rem;letter-spacing:.06em;text-transform:uppercase;
    color:var(--muted);font-weight:600;margin-bottom:2px}
  table.bedragen td.num{white-space:normal}
}
@media(min-width:641px) and (max-width:900px){
  table.bedragen td{display:flex;justify-content:space-between;align-items:baseline;gap:20px}
  table.bedragen td[data-label]::before{margin-bottom:0;flex:0 1 auto}
}

/* let-op-blok */
.note-box{position:relative;background:#FDF6E7;border:1px solid #E8CE8E;border-radius:12px;
  padding:18px 20px 18px 54px;margin:1.6rem 0}
.note-box::before{content:"";position:absolute;left:18px;top:19px;width:22px;height:22px;border-radius:50%;
  background:var(--amber-vlak) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M12 8v5'/%3E%3Cpath d='M12 17h.01'/%3E%3C/svg%3E") center/15px no-repeat}
.note-box p:last-child{margin-bottom:0}
.note-box b{color:#7A5A0E}
.note-box--blauw{background:var(--blue-050);border-color:#BBD0F7}
.note-box--blauw::before{background:var(--blue) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/14px no-repeat}
.note-box--blauw b{color:var(--blue-800)}

@media(max-width:980px){
  .routes{grid-template-columns:repeat(2,1fr);margin-top:38px}
  .pj-grid{grid-template-columns:repeat(2,1fr)}
  .hero-beeld img{aspect-ratio:16/9}
}
@media(max-width:760px){
  .routes{grid-template-columns:1fr}
  .pj-grid{grid-template-columns:1fr}
  .klantlogos{gap:18px 30px}
  .klantlogos img{max-height:40px;max-width:104px}
  .momentlijst li{padding:14px}
}

/* ---- correcties na visuele review ---- */
/* navigatie-items nooit over twee regels ("Zakelijk vastgoed", "Over ons ▾") */
.nav-links a{white-space:nowrap;padding:.5rem .62rem}
.nav{gap:.9rem}
/* het telefoonnummer past pas naast het volledige menu vanaf 1280px */
@media(min-width:1100px) and (max-width:1279px){.nav-phone{display:none}}
/* footer: knop op eigen breedte, en ruimte zodat de WhatsApp-bel de legal-links niet afdekt */
.footer-brand .btn{width:fit-content}
@media(min-width:761px){.footer-bottom{padding-bottom:52px}}

/* ==========================================================================
   CONTRAST-FIX: kaarten binnen een donkere sectie
   .step/.card zijn standaard wit; binnen .section--ink werden h3/h4 wit
   gekleurd → witte tekst op een witte kaart = onleesbaar. Binnen een donkere
   sectie worden kaarten daarom zélf donker, met lichte tekst.
   ========================================================================== */
.section--ink .step,
.section--ink .card{background:var(--ink-2);border-color:rgba(255,255,255,.12)}
.section--ink .step h3,
.section--ink .card h3{color:#fff}
.section--ink .step p,
.section--ink .card p{color:#AEB7CF}
.section--ink .step .num{background:rgba(143,178,245,.16);color:#BFD3FA}
.section--ink .card .ic{background:rgba(255,255,255,.08);color:#fff}
.section--ink .checks li b{color:#fff}
.section--ink .note-box{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.18);color:#C5CCE0}
.section--ink .note-box b{color:#fff}
.section--ink table.bedragen tbody tr{background:var(--ink-2)}
.section--ink table.bedragen td{color:#C5CCE0;border-color:rgba(255,255,255,.10)}
.section--ink table.bedragen td:first-child,
.section--ink table.bedragen td.num{color:#fff}

/* --------------------------------------------------------------------------
   FOOTER-FIX: `.site-footer a` (0,1,1) won van `.btn` (0,1,0), waardoor de
   footer-CTA de grijze linkkleur (contrast 2,3:1 op blauw) én de smalle
   link-padding kreeg. Knoppen in de footer moeten knoppen blijven.
   -------------------------------------------------------------------------- */
.site-footer a.btn{display:inline-flex;color:var(--ink);padding:.92em 1.5em;line-height:1.15}
.site-footer a.btn:hover{color:var(--ink)}
/* legal-regel stond op 4,26:1 — net onder AA */
.footer-bottom{color:#8B97B4}
.footer-bottom a{color:#8B97B4}

/* --------------------------------------------------------------------------
   CONTRAST-CORRECTIES (gevonden met scripts/check_design.py)
   -------------------------------------------------------------------------- */
/* tekst op de blauwe CTA-band stond op 4,09:1 */
.cta-band p{color:#E4E9FB}
/* WhatsApp-knop: wit op #25D366 is 1,98:1. Het donkere WhatsApp-groen haalt
   wel AA en blijft herkenbaar als WhatsApp. */
.wa-float{background:#0F7A6D;box-shadow:0 14px 30px -8px rgba(15,122,109,.55)}
.wa-float:hover{background:#0C6558}
.mobile-cta .btn--wa{background:#0F7A6D}


/* ==========================================================================
   V2 (18-09-2026) — homepage-herziening op Stans feedback
   Hero-kaart met foto + terugbelformulier · Trustpilot-badge · stappen met
   persoonlijke foto's op een merkblauwe band · groot portret bij het
   contactblok. Zie BRAND.md, kop "Versie 2".
   ========================================================================== */
/* --- hero: tekst links, kaart (foto + formulier) rechts --- */
.hero-grid{grid-template-columns:1.02fr .98fr;gap:52px;align-items:start}
.hero .lead{max-width:48ch}
.hero-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow);overflow:hidden}
.hero-card-foto{margin:0;aspect-ratio:16/9;background:var(--bg-2);overflow:hidden}
.hero-card-foto img{width:100%;height:100%;object-fit:cover;object-position:50% 35%}
.hero-form{padding:22px 24px 24px}
.hero-form h2{font-size:1.18rem;margin:0 0 .2rem;letter-spacing:-.015em}
.hero-form .hf-sub{font-size:.9rem;color:var(--muted);margin:0 0 .95rem;line-height:1.45}
.hero-form .field{margin-bottom:10px}
.hero-form .field label{font-size:.82rem;margin-bottom:4px}
.hero-form .field input{padding:.7rem .85rem}
.hero-form .hf-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.hero-form .btn{margin-top:4px}
.hero-form .form-note{margin:.65rem 0 0;font-size:.78rem;line-height:1.45}
.hero-cta{margin-top:1.5rem}

/* --- Trustpilot-badge (hero + reviews) --- */
.tp{display:inline-flex;align-items:center;gap:.55rem;flex-wrap:wrap;color:var(--slate);font-size:.92rem}
.tp a{color:var(--ink);font-weight:700;text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:3px}
.tp a:hover{text-decoration-color:var(--blue)}
.tp-stars{display:inline-flex;gap:2px}
.tp-stars i{width:18px;height:18px;background:#00B67A;border-radius:3px;display:grid;place-items:center}
.tp-stars i svg{width:12px;height:12px;fill:#fff;display:block}
.tp-logo{display:inline-flex;align-items:center;gap:.3rem;font-weight:800;color:var(--ink);letter-spacing:-.02em;font-size:.98rem}
.tp-logo svg{width:16px;height:16px;fill:#00B67A}
.tp b{color:var(--ink);font-weight:800}
.hero-trust{margin-top:1.4rem;gap:.8rem 1.1rem}
.tp--groot{justify-content:center;font-size:1rem;margin-top:.8rem}
.tp--groot .tp-stars i{width:22px;height:22px}.tp--groot .tp-stars i svg{width:14px;height:14px}
.tp--form{display:flex;justify-content:center;margin:.8rem 0 0;font-size:.85rem}
.terugbel>div .tp--contact-left{justify-content:flex-start}
.form-quote{margin:1.2rem 0 0;padding-left:1rem;border-left:3px solid var(--blue);color:var(--slate);font-size:.95rem}
.form-quote cite{display:block;margin-top:.5rem;font-style:normal;font-weight:700;color:var(--ink);font-size:.85rem}
.form-quote cite a{font-weight:400;text-decoration:underline}
.tp--form .tp-stars i{width:15px;height:15px}.tp--form .tp-stars i svg{width:10px;height:10px}
.review-card .tp-stars{margin-bottom:.75rem}
.review-card .via{display:flex;align-items:center;gap:.4rem;font-size:.78rem;color:var(--muted);margin-top:.7rem}
.review-card .via svg{width:13px;height:13px;fill:#00B67A}

/* --- stappen op merkblauwe band, met persoonlijke foto's --- */
.steps-band{background:var(--brand);color:#fff}
.steps-band h2{color:#fff}
.steps-band .eyebrow{color:#fff;opacity:.9}
.steps--foto::before{display:none!important}
.step--foto{padding:0;overflow:hidden;border-color:transparent;box-shadow:0 18px 44px -26px rgba(7,69,138,.55)}
.step--foto .step-img{margin:0;aspect-ratio:4/3;background:var(--bg-2);overflow:hidden}
.step--foto .step-img img{width:100%;height:100%;object-fit:cover}
.step--foto .step-body{padding:22px 24px 26px}
.step--foto .num{margin-bottom:12px}
.steps-band .steps .step.step-actief{border-color:transparent;transform:translateY(-4px)}
.steps-band .center .btn{margin-top:34px}
.steps-band .steps-dots button{background:rgba(255,255,255,.45)}
.steps-band .steps-dots button.on{background:#fff}

/* contrast: de band erft wit op alle tekst, de witte kaarten moeten donker blijven */
.step--foto .step-body{color:var(--slate)}
.step--foto .step-body p{color:var(--slate)}
.step--foto .step-body h3{color:var(--ink)}
.steps-band .eyebrow{background:#fff;color:var(--blue);opacity:1;padding:.32rem .75rem;border-radius:999px}
.cta-band p{color:#fff}

/* --- logostrip: alle opdrachtgevers, twee rijen op desktop --- */
.klantlogos--alle{gap:22px 40px;max-width:980px;margin:0 auto}

/* --- contactblok met groot portret --- */
.contact-split{display:grid;grid-template-columns:minmax(220px,320px) 1fr;gap:clamp(18px,4vw,56px);align-items:end;
  background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);overflow:hidden}
.contact-split-foto{margin:0;align-self:end;padding:26px 0 0 26px}
.contact-split-foto img{width:100%;height:auto;display:block}
.contact-split-body{padding:38px 40px 38px 0}
.contact-split-body .role{display:block;font-weight:700;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;color:var(--blue);margin-bottom:.35rem}
.contact-split-body h3{font-size:clamp(1.35rem,2.3vw,1.75rem);margin:0 0 .5rem}
.contact-split-body p{max-width:56ch}

/* --- responsive V2 --- */
@media(max-width:980px){
  .hero-grid{grid-template-columns:1fr;gap:34px}
  .hero-card{max-width:640px}
}
@media(max-width:760px){
  .contact-split{grid-template-columns:1fr;gap:0;align-items:stretch}
  .contact-split-foto{padding:22px 22px 0;max-width:300px;margin:0 auto}
  .contact-split-body{padding:22px 22px 28px;text-align:center}
  .contact-split-body p{margin-left:auto;margin-right:auto}
  .contact-actions{justify-content:center}
  .hero-form{padding:18px 18px 20px}
}
@media(max-width:560px){
  .hero-form .hf-row{grid-template-columns:1fr}
  .hero-card-foto{aspect-ratio:4/3}
}

/* --- terugbel-blok op contentpagina's --- */
.terugbel{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.terugbel .form.hero-form{padding:26px 28px 28px}
.terugbel .tp{margin-top:.4rem}
@media(max-width:860px){.terugbel{grid-template-columns:1fr;gap:26px}}


/* ==========================================================================
   V3 (18-09-2026) — adviseur-hero volgens blauwdruk blok 1a
   Donkere band (sfeer mv-aanbesteding.nl), grote echte foto van Stan rechts
   (55% breedte, overlay ±40% naar navy), naam en functie in beeld, kop links,
   het korte formulier als kaart over de foto. Mobiel: kop, compacte foto
   (max 40% scherm), knop, formulier eronder.
   ========================================================================== */
.hero--adviseur{background:var(--ink);color:#C5CCE0;border-bottom:0;position:relative;overflow:hidden;isolation:isolate}
.hero--adviseur .container{padding-top:64px;padding-bottom:72px}
.hero-tekst>*:not(.hero-foto),.hero-form--kaart{position:relative;z-index:2}
.hero-grid--adviseur{grid-template-columns:minmax(0,1.15fr) minmax(300px,380px);gap:48px;align-items:center}
.hero--adviseur h1{color:#fff}
.hero--adviseur h1 .hl{color:var(--brand)}
.hero--adviseur .lead{color:#DCE3F2;max-width:44ch}
.hero--adviseur .eyebrow{color:#9CCBFF;margin-bottom:.9rem}
.hero-twijfel{margin:.9rem 0 0;font-size:.92rem;color:#C5CCE0}
.hero--adviseur .hero-trust{margin-top:1.1rem}
.hero--adviseur .tp{color:#DCE3F2}
.hero--adviseur .tp b,.hero--adviseur .tp a{color:#fff}
.hero--adviseur .tp a{text-decoration-color:rgba(255,255,255,.35)}
.hero--adviseur .btn--outline-light{border-color:rgba(255,255,255,.45)}

/* foto: op desktop als achtergrond van de rechterhelft, met overlay naar de navy */
.hero-foto{margin:0;position:absolute;inset:0 0 0 auto;width:55%;z-index:0}
.hero-foto img{width:100%;height:100%;object-fit:cover;object-position:38% 18%}
.hero-foto::after{content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,var(--ink) 0%,rgba(12,21,38,.72) 22%,rgba(12,21,38,.38) 55%,rgba(12,21,38,.45) 100%),
             linear-gradient(180deg,rgba(12,21,38,.0) 55%,rgba(12,21,38,.7) 100%)}
.hero-naam{position:absolute;left:22%;bottom:26px;z-index:1;display:inline-flex;flex-direction:column;gap:.1rem;
  background:rgba(255,255,255,.94);color:var(--ink);border-radius:12px;padding:.6rem .9rem;box-shadow:var(--shadow-sm)}
.hero-naam b{font-size:.95rem;color:var(--ink)}
.hero-naam span{font-size:.78rem;color:var(--muted)}

/* formulier als kaart over de foto */
.hero-form--kaart{background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow);padding:24px 26px 26px;position:relative;z-index:2}
.hero-form--kaart h2{color:var(--ink)}

/* onder de hero: de vier routes op wit */
.routes-sec{background:var(--bg);padding:0 0 8px}
.routes-sec .routes{margin-top:-34px;position:relative;z-index:3}

@media(max-width:1180px){.hero-foto img{object-position:30% 18%}}
@media(max-width:980px){
  .hero-grid--adviseur{grid-template-columns:1fr;gap:26px}
  .hero--adviseur .container{padding-top:40px;padding-bottom:40px}
  /* mobiel: kop, compacte foto (max 40% scherm), knop, formulier eronder */
  .hero-foto{position:relative;inset:auto;width:100%;height:auto;border-radius:var(--radius-lg);overflow:hidden;
    max-height:40vh;aspect-ratio:16/10;margin:6px 0 22px;max-width:640px}
  .hero-foto img{object-position:50% 22%}
  .hero-foto::after{background:linear-gradient(180deg,rgba(12,21,38,0) 60%,rgba(12,21,38,.55) 100%)}
  .hero-naam{left:14px;bottom:14px;padding:.5rem .75rem}
  .hero-form--kaart{max-width:560px}
  .routes-sec .routes{margin-top:26px}
}
@media(max-width:760px){
  .hero-foto{max-height:38vh}
  .hero--adviseur .hero-cta .btn{flex:1 1 100%}
  .hero-form--kaart{padding:18px 18px 20px}
}

/* V3-correcties na check_design/check_responsive */
.hero--adviseur .lead b{color:#fff}
.hero-naam span{color:var(--slate)}
@media(max-width:980px){
  .hero-foto{max-height:30vh;aspect-ratio:16/9;margin:4px 0 18px}
  .hero--adviseur .container{padding-top:26px;padding-bottom:34px}
  .hero--adviseur .eyebrow{display:none}
  .hero--adviseur h1{font-size:clamp(1.9rem,7vw,2.4rem)}
  .hero--adviseur .lead{font-size:1.02rem;margin-bottom:.4rem}
}
/* desktop: foto iets naar links zodat Stan tussen kop en formulierkaart staat, naamkaartje hoger */
@media(min-width:981px){
  .hero-foto{inset:0 auto 0 30%;width:56%}
  .hero-foto img{object-position:50% 16%}
  .hero-foto::after{background:linear-gradient(90deg,var(--ink) 0%,rgba(12,21,38,.6) 18%,rgba(12,21,38,.22) 45%,rgba(12,21,38,.5) 78%,var(--ink) 100%),
    linear-gradient(180deg,rgba(12,21,38,0) 50%,rgba(12,21,38,.75) 100%)}
  .hero-naam{left:34%;bottom:62px}
}

/* V3b (19-09-2026): doorzichtige (glas) formulierkaart en naamkaartje op de hero */
@media(min-width:981px){
  .hero-form--kaart{background:rgba(12,21,38,.58);backdrop-filter:blur(14px) saturate(140%);-webkit-backdrop-filter:blur(14px) saturate(140%);
    border:1px solid rgba(255,255,255,.18);box-shadow:0 24px 60px -30px rgba(0,0,0,.7)}
  .hero-form--kaart h2{color:#fff}
  .hero-form--kaart .hf-sub{color:#DCE3F2}
  .hero-form--kaart .field label{color:#fff}
  .hero-form--kaart .field input{background:rgba(255,255,255,.10);border-color:rgba(255,255,255,.28);color:#fff}
  .hero-form--kaart .field input::placeholder{color:rgba(255,255,255,.55)}
  .hero-form--kaart .field input:focus{background:rgba(255,255,255,.16);border-color:var(--brand);box-shadow:0 0 0 3px rgba(30,144,255,.28)}
  .hero-form--kaart .form-note{color:#C5CCE0}
  .hero-form--kaart .form-note a{color:#fff}
  .hero-naam{left:9%;bottom:64px;background:rgba(12,21,38,.62);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
    border:1px solid rgba(255,255,255,.18);box-shadow:none;max-width:280px}
  .hero-naam b{color:#fff}
  .hero-naam span{color:#DCE3F2}
}

/* V3c (19-09-2026): naam en functie in de formulierkaart (desktop), naamkaartje op de foto alleen mobiel */
.hf-wie{display:none;align-items:center;gap:.7rem;margin-bottom:.9rem;padding-bottom:.9rem;border-bottom:1px solid rgba(255,255,255,.16)}
.hf-wie img{width:48px;height:48px;border-radius:50%;object-fit:cover;flex:0 0 auto;border:2px solid rgba(255,255,255,.35)}
.hf-wie b{display:block;color:#fff;font-size:.98rem;line-height:1.2}
.hf-wie small{display:block;color:#C5CCE0;font-size:.78rem}
@media(min-width:981px){
  .hf-wie{display:flex}
  .hero-naam{display:none}
}


/* ==========================================================================
   V4 (19-09-2026) — ronde 2: money-hero met klikvragen (blauwdruk 1d, 18b),
   logo-balk onder de hero (25b), klikbare reviews en kaarten (23b, 29b),
   foto van Stan in actie i.p.v. gebouwen (6c), portretkader 4/5 (32b).
   ========================================================================== */
/* --- money-hero: kop links, check-kaart rechts (mobiel: kop, dan kaart) --- */
.hero--money{position:relative;background:
  radial-gradient(700px 360px at 12% -10%,var(--blue-050),transparent 60%),var(--bg);
  border-bottom:1px solid var(--line)}
.hero--money .container{padding-top:56px;padding-bottom:56px}
.hero-grid--money{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(300px,400px);gap:48px;align-items:center}
.hero--money h1{max-width:18ch;margin-bottom:.45em}
.hero--money .lead{max-width:44ch}
.hero--money .hero-twijfel{color:var(--slate)}
.hero--money .tp{margin-top:.9rem}

/* --- check-kaart: 1 tot 3 klikvragen, contact als laatste stap --- */
.hero-check{background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow);padding:22px 24px 24px;position:relative;z-index:2}
.hero-check h2{color:var(--ink)}
.hero-check .hf-wie{display:flex;border-bottom-color:var(--line)}
.hero-check .hf-wie b{color:var(--ink)}
.hero-check .hf-wie small{color:var(--muted)}
.hero-check .hf-wie img{border-color:var(--blue-050)}
.hc-progress{font-size:.74rem;color:var(--muted);font-weight:700;letter-spacing:.08em;text-transform:uppercase;margin:0 0 .5rem}
.hc-vraag{font-weight:700;color:var(--ink);margin:0 0 .6rem;font-size:1rem}
.hc-chips{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0 0 .85rem}
.hc-chip{min-height:46px;padding:.6rem .8rem;border:1.5px solid var(--line);border-radius:10px;background:#fff;
  font:inherit;font-weight:600;font-size:.92rem;color:var(--ink);text-align:left;cursor:pointer;line-height:1.25}
.hc-chip small{display:block;font-weight:400;font-size:.76rem;color:var(--muted);margin-top:.1rem}
.hc-chip:hover,.hc-chip:focus-visible{border-color:var(--brand);box-shadow:0 0 0 3px rgba(30,144,255,.18);outline:none}
.hc-chip.is-actief{border-color:var(--brand);background:var(--blue-050)}
.hc-feedback{background:var(--blue-050);border-left:3px solid var(--brand);border-radius:8px;padding:.7rem .85rem;font-size:.9rem;color:var(--ink);margin:0 0 .85rem;line-height:1.45}
.hc-feedback b{color:var(--ink)}
.hc-terug{background:none;border:0;color:var(--blue);font:inherit;font-weight:700;font-size:.84rem;cursor:pointer;padding:0;margin:0 0 .7rem;text-decoration:underline}
.hc-keuze{font-size:.86rem;color:var(--slate);margin:0 0 .7rem}
.hc-keuze b{color:var(--ink)}
.hero-check .hc-contact[hidden]{display:none}

/* --- logo-balk direct onder de hero --- */
.logobalk{background:#fff;border-bottom:1px solid var(--line);padding:20px 0 60px}
.logobalk .logobalk-kop{display:block;margin:0 0 20px;text-align:center}
.klantlogos--balk{gap:16px 34px}
.klantlogos--balk img{max-height:38px;max-width:112px}
.hero--adviseur+.logobalk{border-top:0}

/* --- reviews en kaarten: het hele blok is de link (29b, 23b) --- */
a.review-card{display:flex;flex-direction:column;color:inherit;text-decoration:none;
  transition:transform .2s,box-shadow .2s,border-color .2s}
a.review-card:hover,a.review-card:focus-visible{border-color:var(--blue-300);box-shadow:var(--shadow);transform:translateY(-3px);outline:none}
a.review-card:focus-visible{box-shadow:0 0 0 3px rgba(30,144,255,.3),var(--shadow)}
a.review-card .via{color:var(--blue)}
.route:focus-visible,.card:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(30,144,255,.3)}

/* --- foto van Stan in actie naast tekst (6c) --- */
.stan-actie{display:grid;grid-template-columns:minmax(240px,400px) 1fr;gap:clamp(24px,4vw,48px);align-items:center}
.stan-actie figure{margin:0;border-radius:var(--radius-lg);overflow:hidden;aspect-ratio:4/3;background:var(--bg-2);box-shadow:var(--shadow-sm)}
.stan-actie img{width:100%;height:100%;object-fit:cover;object-position:50% 30%;display:block}
.stan-actie figcaption{font-size:.82rem;color:var(--muted);padding:.5rem 0 0}
.stan-actie .steps{margin-top:0}
.zakelijke-stappen .stan-actie .steps{margin-top:24px}
.stan-actie .steps .step{padding:18px 20px}
.stan-actie--isde .step .num{color:#1e90ff}
.home-steps-cta{margin-top:26px}
.home-steps-section{background:linear-gradient(180deg,#fff 0,var(--bg-2) 56px,var(--bg-2) calc(100% - 56px),#fff 100%)}

/* --- portretkader bij het contactblok: 4/5, hoofd nooit afgesneden (32b) --- */
.contact-split{align-items:stretch}
.contact-split-foto{padding:0;align-self:stretch;aspect-ratio:4/5;overflow:hidden;background:var(--bg-2)}
.contact-split-foto img{width:100%;height:100%;object-fit:cover;object-position:50% 20%;display:block}

/* --- regel onder een herhaalde knop met de kernbelofte (26b) --- */
.btn-note{font-size:.88rem;color:var(--slate);margin:.7rem 0 0}
.steps-band .btn-note,.cta-band .btn-note{color:#fff}

@media(max-width:980px){
  .hero-grid--money{grid-template-columns:1fr;gap:24px}
  .hero--money .container{padding-top:30px;padding-bottom:36px}
  .hero--money h1{font-size:clamp(1.9rem,7vw,2.4rem)}
  .hero-check{max-width:560px}
  .stan-actie{grid-template-columns:1fr}
  .stan-actie figure{max-width:520px}
}
@media(max-width:760px){
  .hero--money .hero-cta .btn{flex:1 1 100%}
  .hero-check{padding:18px 18px 20px}
  .contact-split-foto{max-width:300px;margin:0 auto;aspect-ratio:4/5;width:100%}
}

/* page-hero met class hero: geen dubbele padding uit .hero .container */
.page-hero.hero .container{padding-top:0;padding-bottom:0}
.page-hero.hero{padding:56px 0 52px}
@media(max-width:980px){.page-hero.hero{padding:30px 0 36px}}

/* knopregel op de merkblauwe band: inkt i.p.v. wit (contrast 4,5:1) */
.steps-band .btn-note{color:var(--ink);font-weight:600}

/* R2-fix (19-09-2026): koppen nooit afbreken met streepjes; op mobiel een kleinere H1 zodat
   lange woorden ("verduurzaming", "werkzaamheden") passen, text-wrap:balance voor de verdeling */
h1,h2,h3,h4{hyphens:manual;-webkit-hyphens:manual;overflow-wrap:normal}
@media(max-width:560px){
  h1,.hero--money h1,.hero--adviseur h1{font-size:clamp(1.6rem,8vw,2.1rem);line-height:1.12}
  h2{font-size:clamp(1.4rem,6.4vw,1.8rem)}
  .hero-tekst{min-width:0}
}
/* R2-fix: logo-balk krijgt eigen ruimte; de routekaarten schuiven er niet meer overheen */
.logobalk+.routes-sec .routes{margin-top:28px}
.logobalk{position:relative;z-index:1}
/* R2-fix: check-kaart mag de kolom niet breder duwen dan het scherm (320 px) */
.hero-check{min-width:0}
.hc-chips{grid-template-columns:repeat(2,minmax(0,1fr))}
.hc-chip{min-width:0;overflow-wrap:break-word}
@media(max-width:980px){.hero-grid--money{grid-template-columns:minmax(0,1fr)}}
@media(max-width:360px){.hero-check{padding:16px 14px 18px}.hc-chip{padding:.55rem .6rem;font-size:.88rem}}

/* ==========================================================================
   R3 (20-09-2026) — besluit Maxim, akkoord Stan: geen formulier in de hero.
   Hero = kop, belofte, één knop naar de rekentool, telefoon als regel,
   adviseur groot in beeld (blauwdruk 1a). Het formulier staat onderaan en in
   de rekentool. Bewuste afwijking van blauwdruk 1d (graad C), zie verify.json.
   ========================================================================== */
.hero--money .hero-grid--money{grid-template-columns:minmax(0,1.15fr) minmax(240px,340px);align-items:center}
.hero-persoon{margin:0;position:relative}
.hero-persoon img{width:100%;height:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 16%;
  border-radius:var(--radius-lg);box-shadow:var(--shadow);background:var(--bg-2);display:block}
.hero-persoon figcaption{position:absolute;left:14px;bottom:14px;background:rgba(255,255,255,.94);
  border-radius:10px;padding:.5rem .75rem;box-shadow:var(--shadow-sm);max-width:calc(100% - 28px)}
.hero-persoon figcaption b{display:block;font-size:.92rem;color:var(--ink);line-height:1.2}
.hero-persoon figcaption span{display:block;font-size:.76rem;color:var(--slate)}
.hero--money .hero-twijfel a{color:var(--blue)}
/* homepage: zonder formulierkaart mag de tekstkolom niet over de hele breedte lopen */
@media(min-width:981px){
  .hero-grid--adviseur{grid-template-columns:minmax(0,600px)}
  .hero--adviseur .hero-cta{margin-top:1.6rem}
}
@media(max-width:980px){
  .hero--money .hero-grid--money{grid-template-columns:1fr;gap:22px}
  /* mobiel: kop, knop, telefoon, dan de foto compact (max 40% van het scherm) */
  .hero-persoon{max-width:300px;margin:4px auto 0}
  .hero-persoon img{aspect-ratio:1/1;max-height:32vh}
}
/* mobiele onderbalk: bellen blijft bereikbaar nu de belknop uit de hero is */
@media(max-width:900px){
  .mobile-cta .btn--tel{flex:0 0 auto;width:52px;padding:0;background:#fff;color:var(--ink);border:1.5px solid var(--line)}
  .mobile-cta .btn--tel svg{width:22px;height:22px}
}
/* R3-fix: telefoonlink in de donkere hero moet licht zijn */
.hero--adviseur .hero-twijfel a,.hero--adviseur .hero-twijfel a b{color:#fff;text-decoration:underline;text-decoration-color:rgba(255,255,255,.4)}
.hero--adviseur .hero-twijfel a:hover{text-decoration-color:#fff}

/* ==========================================================================
   R4 (21-09-2026) — echte opdrachtgever-logo's van Stan (Drive). Alle bestanden
   staan op dezelfde beeldhoogte; hier alleen de weergavemaat per plek.
   ========================================================================== */
.klantlogos img{max-height:46px;max-width:150px;opacity:.7}
.klantlogos--balk img{max-height:40px;max-width:132px}
.klantlogos--alle{max-width:1040px}
@media(max-width:560px){
  .klantlogos{gap:18px 26px}
  .klantlogos--balk img{max-height:32px;max-width:104px}
}

/* ==========================================================================
   V5 (28-09-2026) — homepage volgens "Homepage verbeteringen.pdf" (22-09-2026)
   Merkblauwe hero met teamfoto die in het blauw overloopt · USP-balk over de
   onderrand van de hero · situatiekaarten met foto · rekentool-kaarten met
   icoon · specialist-blok met vinkjes in een cirkel · contactkaart met
   naamkaartje, drie pluspunten en een handgeschreven noot.
   Contrast: wit op #1E90FF haalt alleen AA voor grote tekst (3,2:1), dus de
   hero-belofte is groot en halfvet, en de kleine regels eronder staan in navy
   (#06206A, 4,56:1). Knoppen blijven oranje met donkere tekst (BRAND.md).
   ========================================================================== */
:root{--navy:#06206A;--blue-100:#E3F0FF}

/* --- hero: tekst links op merkblauw, foto rechts --- */
.hero--team{background:var(--brand);color:#fff;border-bottom:0;overflow:hidden;isolation:isolate}
.hero--team .container{position:relative;z-index:2;padding-top:76px;padding-bottom:124px}
.hero--team .hero-tekst{max-width:540px}
.hero--team h1{color:#fff;margin-bottom:.42em}
.hero--team h1 .hl{color:var(--navy)}
.hero--team .lead{color:#fff;font-weight:600;font-size:1.2rem;line-height:1.5;max-width:40ch;margin-bottom:0}
.hero--team .lead strong{color:#fff}
.hero--team .hero-cta{margin-top:1.6rem}
.hero--team .btn--primary:hover{box-shadow:0 18px 40px -20px rgba(6,32,106,.6)}
.hero--team .hero-twijfel{color:var(--navy);font-weight:600;font-size:.92rem;margin-top:1rem}
.hero--team .hero-twijfel a,.hero--team .hero-twijfel a b{color:var(--navy);text-decoration:underline;text-underline-offset:3px}
.hero--team .hero-trust{margin-top:.9rem}
.hero--team .tp{color:var(--navy);font-weight:600}
.hero--team .tp b,.hero--team .tp a{color:var(--navy)}
.hero--team .tp a{text-decoration-color:rgba(6,32,106,.4)}
.hero-team-foto{position:absolute;inset:0 0 0 auto;width:62%;margin:0;z-index:0}
.hero-team-foto img{width:100%;height:100%;object-fit:cover;object-position:62% 30%}
.hero-team-foto::after{content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,var(--brand) 0%,rgba(30,144,255,.82) 13%,rgba(30,144,255,.34) 30%,rgba(30,144,255,0) 48%)}

/* Breedbeeld: een ruimere hero dan de standaard contentkolom, met foto van rand tot rand in de herohoogte. */
@media(min-width:1500px){
  .hero--team{min-height:600px}
  .hero-team-foto{inset:0 max(24px,calc((100% - 1600px)/2 + 24px)) 0 auto;width:min(46vw,820px);height:auto;aspect-ratio:auto;transform:none}
  .hero-team-foto img{object-fit:cover;object-position:62% 30%}
  .hero-team-foto::after{background:
    linear-gradient(90deg,var(--brand) 0%,rgba(30,144,255,.82) 13%,rgba(30,144,255,.34) 30%,rgba(30,144,255,0) 48%),
    linear-gradient(270deg,var(--brand) 0%,rgba(30,144,255,.82) 12%,rgba(30,144,255,.34) 26%,rgba(30,144,255,0) 38%)}
}

/* --- USP-balk: één witte kaart, vier kolommen, valt over de hero --- */
.usp-sec{position:relative;z-index:3;margin-top:-52px}
.usp-sec .container{max-width:1300px}
.usp-balk{list-style:none;margin:0;padding:26px 6px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  background:#fff;border:1px solid var(--line-2);border-radius:18px;
  box-shadow:0 26px 54px -30px rgba(12,21,38,.38),0 2px 6px rgba(12,21,38,.04)}
.usp-balk li{display:flex;align-items:center;gap:18px;padding:4px 26px;border-left:1px solid var(--line);min-width:0}
.usp-balk li:first-child{border-left:0}
.usp-ic{flex:0 0 auto;width:62px;height:62px;border-radius:50%;background:var(--blue-100);color:var(--blue);display:grid;place-items:center}
.usp-ic svg{width:28px;height:28px}
.usp-balk b{display:block;color:var(--ink);font-size:1.04rem;letter-spacing:-.01em;margin-bottom:.15rem}
.usp-balk li span:not(.usp-ic){display:block;color:var(--slate);font-size:.9rem;line-height:1.45}

/* --- ronde pijlknop (situatiekaarten en rekentool) --- */
.pijl{flex:0 0 auto;width:40px;height:40px;border-radius:50%;background:var(--blue-100);color:var(--blue);
  display:grid;place-items:center;font-style:normal;transition:background .2s,color .2s,transform .2s}
.pijl svg{width:18px;height:18px}

/* --- situatiekaarten --- */
.situ-sec{padding-top:76px}
.situ-sec .sec-head{max-width:900px}
.situ-sec .lead{max-width:62ch;margin-left:auto;margin-right:auto}
.situ-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}
.situ-grid--three{grid-template-columns:repeat(3,minmax(0,1fr))}
.situ{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;
  color:inherit;box-shadow:var(--shadow-sm);transition:transform .2s,box-shadow .2s,border-color .2s}
.situ:hover{color:inherit;transform:translateY(-4px);box-shadow:var(--shadow);border-color:var(--blue-300)}
.situ:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(30,144,255,.35),var(--shadow)}
.situ-img{display:block;aspect-ratio:16/10;overflow:hidden;background:var(--bg-2)}
.situ-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.22,.61,.36,1)}
.situ:hover .situ-img img{transform:scale(1.04)}
.situ-body{flex:1 1 auto;display:flex;align-items:flex-end;justify-content:space-between;gap:14px;padding:20px 18px 20px 20px}
.situ-body b{display:block;color:var(--ink);font-size:1.08rem;letter-spacing:-.015em;margin-bottom:.3rem}
.situ-body small{display:block;color:var(--slate);font-size:.9rem;line-height:1.45}
.situ:hover .pijl,.sc-kies-btn:hover .pijl{background:var(--blue);color:#fff}
.situ--selected{border-color:var(--brand);box-shadow:0 0 0 2px rgba(30,144,255,.22),var(--shadow-sm)}
.wijzer-layout{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(360px,1fr);gap:28px;align-items:stretch;margin-top:34px;scroll-margin-top:104px}
.wijzer-layout[hidden]{display:none!important}
.wijzer-resultaten,.wijzer-form-wrap{min-width:0;margin:0}
.wijzer-resultaten{display:flex;flex-direction:column;padding:clamp(20px,2.5vw,30px);border:1px solid var(--line);border-radius:var(--radius-lg);background:#F4F8FD}
.wijzer-resultaten-kop{max-width:760px;margin-bottom:22px}
.wijzer-resultaten-kop h3{margin:.35rem 0 .55rem;color:var(--ink);font-size:clamp(1.35rem,2vw,1.75rem);line-height:1.18}
.wijzer-resultaten-kop p{margin:0;color:var(--slate);line-height:1.65}
.wijzer-regelingen{display:grid;grid-template-columns:1fr;gap:10px}
.wijzer-lokaal{margin-top:12px}
.wijzer-regeling{display:flex;flex-direction:column;align-items:flex-start;min-width:0;padding:15px 17px;background:#fff;border:1px solid var(--line);border-radius:12px}
.wijzer-regeling--lokaal{background:#FFF5E9;border-color:#EFD3AD;padding:13px 16px}
.wijzer-regeling-type{color:var(--brand);font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.wijzer-regeling h4{margin:5px 0 6px;color:var(--ink);font-size:1rem;line-height:1.3}
.wijzer-regeling p{margin:0;color:var(--slate);font-size:.92rem;line-height:1.55}
.wijzer-regeling-details{width:100%}
.wijzer-regeling-bron{display:inline-block;margin-top:6px;color:var(--muted);font-size:.8rem;text-decoration:underline;text-underline-offset:2px}
.wijzer-regeling-info-link{margin-top:5px;color:var(--brand);font-size:.82rem;font-weight:650;text-decoration:none}
.wijzer-regeling-info-link:hover{text-decoration:underline;text-underline-offset:2px}
.wijzer-lees-meer{margin:4px 0 6px;padding:0;border:0;background:transparent;color:var(--brand);font:inherit;font-size:.84rem;text-decoration:underline;text-underline-offset:2px;cursor:pointer}
.wijzer-lees-meer:hover{color:#1475c9}
.wijzer-lees-meer:focus-visible{outline:2px solid var(--brand);outline-offset:3px;border-radius:2px}
.wijzer-status{display:inline-flex;align-items:center;margin:6px 0 0;padding:5px 9px;border-radius:12px;background:#EAF4FF;color:#164f81;font-size:.76rem;font-weight:700;line-height:1.35}
.wijzer-status--open{background:#E5F7EC;color:#187044}
.wijzer-status--closed{background:#FDE8E7;color:#B42318}
.wijzer-status--soon{background:#FFF5D8;color:#795900}
.wijzer-status--lokaal{background:#F7E6CD;color:#77532A}
.wijzer-peildatum{margin:auto 0 0;padding-top:17px;color:var(--muted);font-size:.8rem;line-height:1.5}
.wijzer-form-wrap{display:block;padding:clamp(20px,2.5vw,30px);background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm)}
.wijzer-form-intro{margin-bottom:20px}
.wijzer-form-intro h3{margin:0 0 9px;color:var(--ink);font-size:clamp(1.25rem,1.8vw,1.6rem);line-height:1.2}
.wijzer-form-intro p{margin:0;color:var(--slate);line-height:1.6}
.wijzer-form{padding:0;border:0;border-radius:0;box-shadow:none}
.wijzer-form .field{position:relative;margin-bottom:9px}
.wijzer-form .field label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.wijzer-form .field input,.wijzer-form .field textarea{padding:.82rem .9rem}
.wijzer-form .field textarea{min-height:86px}
.wijzer-form .contactvoorkeur{min-width:0}
.wijzer-form .contactvoorkeur-titel{display:block;padding:0}
.wijzer-form [data-contact-field][hidden]{display:none!important}
.wijzer-form .form-note{margin:14px 0 0;text-align:center}
.wijzer-selected-investment{margin:0 0 14px;padding:9px 11px;border-radius:8px;background:#F4F8FD;color:var(--slate);font-size:.84rem;line-height:1.4}
.wijzer-selected-investment span{font-weight:600}
.wijzer-selected-investment strong{color:var(--ink)}
.zakelijk-keuzes .situ-img{aspect-ratio:16/8.5}
.zakelijk-keuzes .situ-body{padding-top:16px;padding-bottom:16px}
.zakelijke-regelingen-sec .sec-head{margin-bottom:28px}
.zakelijke-regelingen{max-width:1040px;margin:0 auto}
.zakelijke-regelingen-categorieen{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:0 auto 20px}
.zakelijke-regeling-categorie{display:flex;align-items:center;justify-content:center;gap:10px;min-width:0;min-height:58px;padding:10px 14px;border:1px solid var(--line);border-radius:14px;background:#fff;color:var(--ink);font:inherit;font-weight:700;text-align:left;cursor:pointer;transition:background .18s,border-color .18s,color .18s,box-shadow .18s}
.zakelijke-regeling-categorie svg{flex:0 0 21px;width:21px;height:21px;color:var(--brand)}
.zakelijke-regeling-categorie:hover{border-color:var(--brand);color:var(--brand)}
.zakelijke-regeling-categorie.is-active{border-color:var(--brand);background:#EAF4FF;color:var(--blue);box-shadow:0 3px 10px rgba(30,144,255,.1)}
.zakelijke-regeling-categorie:focus-visible{outline:3px solid rgba(30,144,255,.35);outline-offset:2px}
.zakelijke-regelingen-subtitle{margin:0 0 5px;color:var(--muted);font-size:.88rem;font-weight:650;text-align:center}
.zakelijke-regelingen-tabs{display:flex;flex-wrap:wrap;justify-content:center;gap:9px;overflow-x:visible;padding:4px 3px 12px;scrollbar-width:thin;overscroll-behavior-x:contain}
.zakelijke-regelingen-tabs[hidden],.zakelijke-regelingen-subtitle[hidden]{display:none!important}
.zakelijke-regelingen-paneel-bediening{display:flex;justify-content:flex-end;margin:-3px 0 10px}
.zakelijke-regelingen-paneel-bediening[hidden],.zakelijke-regelingen-paneel[hidden]{display:none!important}
.zakelijke-regelingen-toggle{padding:5px 0;border:0;background:transparent;color:var(--blue);font:inherit;font-size:.86rem;font-weight:650;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.zakelijke-regelingen-toggle:hover{color:var(--brand)}
.zakelijke-regelingen-toggle:focus-visible{outline:3px solid rgba(30,144,255,.35);outline-offset:3px;border-radius:3px}
.zakelijke-regelingen-sec{scroll-margin-top:88px}
.zakelijke-regeling-tab{flex:0 0 auto;min-height:44px;padding:10px 20px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--slate);font:inherit;font-weight:700;cursor:pointer;transition:background .18s,border-color .18s,color .18s,box-shadow .18s}
.zakelijke-regeling-tab:hover{border-color:var(--brand);color:var(--brand)}
.zakelijke-regeling-tab.is-active{border-color:var(--brand);background:var(--brand);color:#fff;box-shadow:0 4px 12px rgba(30,144,255,.18)}
.zakelijke-regeling-tab:focus-visible{outline:3px solid rgba(30,144,255,.35);outline-offset:2px}
.zakelijke-regelingen-paneel{padding:clamp(22px,3.2vw,38px);border:1px solid var(--line);border-radius:var(--radius-lg);background:#fff;box-shadow:var(--shadow-sm)}
.zakelijke-regeling-heading{display:flex;align-items:center;justify-content:space-between;gap:18px}
.zakelijke-regeling-heading h3{margin:0;color:var(--ink);font-size:clamp(1.35rem,2.1vw,1.8rem);line-height:1.2}
.zakelijke-regeling-type{flex:0 0 auto;padding:6px 11px;border-radius:999px;background:#EAF4FF;color:#165B96;font-size:.75rem;font-weight:700}
.zakelijke-regeling-intro{max-width:78ch;margin:12px 0 25px;color:var(--slate);line-height:1.65}
.zakelijke-regeling-source{margin:-12px 0 21px;color:var(--muted);font-size:.8rem;line-height:1.45}
.zakelijke-regeling-source a{color:var(--blue);text-decoration:underline;text-underline-offset:2px}
.zakelijke-regeling-finance{padding:20px 22px;border:1px solid var(--line);border-radius:var(--radius);background:#F7FAFE}
.zakelijke-regeling-finance h4,.zakelijke-regeling-voorwaarden h4{margin:0 0 14px;color:var(--ink);font-size:1.08rem}
.zakelijke-regeling-bedragen{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:0}
.zakelijke-regeling-bedrag{min-width:0;padding:14px 15px;border:1px solid var(--line);border-radius:12px;background:#fff}
.zakelijke-regeling-bedrag dt{color:var(--slate);font-size:.82rem;font-weight:650;line-height:1.4}
.zakelijke-regeling-bedrag dd{margin:6px 0;color:var(--brand);font-size:1.1rem;font-weight:750;line-height:1.3}
.zakelijke-regeling-bedrag p{margin:0;color:var(--muted);font-size:.83rem;line-height:1.45}
.zakelijke-regeling-voorwaarden{display:grid;grid-template-columns:minmax(220px,.78fr) minmax(0,1.22fr);gap:36px;align-items:start;padding:27px 0 24px}
.zakelijke-regeling-voorwaarden-kop h4{margin-bottom:8px}
.zakelijke-regeling-voorwaarden-kop p{margin:0;color:var(--slate);line-height:1.55}
.zakelijke-regeling-checks{display:grid;gap:11px;margin:0;padding:0;list-style:none}
.zakelijke-regeling-checks li{display:grid;grid-template-columns:18px minmax(0,1fr);gap:10px;align-items:start;color:var(--slate);font-size:.92rem;line-height:1.5}
.zakelijke-regeling-checks svg{width:18px;height:18px;margin-top:2px;color:var(--green);stroke-linecap:round;stroke-linejoin:round}
.zakelijke-regeling-contact{align-self:flex-start;margin-top:18px;min-height:46px;padding:11px 20px}
body[data-page="zakelijk"].wijzer-open .wa-float,
body[data-page="zakelijk"].wijzer-open .wa-bubble{display:none!important}
@media(max-width:980px){.wijzer-regelingen{grid-template-columns:1fr}}
.zakelijk-tool-wrap{margin-top:0}
.zakelijk-tool-velden{display:grid;grid-template-columns:1fr;gap:0;margin:0}
.zakelijk-tool-velden .field{margin-bottom:18px}
.zakelijk-tool-link,.zakelijk-tool-cta{margin:16px 0 0}
.zakelijk-tool-cta .btn{width:100%}

/* --- rekentool-sectie: zachte cirkels in de hoeken --- */
.check-sec{position:relative;overflow:hidden}
.check-sec::before,.check-sec::after{content:"";position:absolute;border-radius:50%;background:#E6F0FC;z-index:0;pointer-events:none}
.check-sec::before{width:380px;height:380px;left:-210px;top:-220px}
.check-sec::after{width:440px;height:440px;right:-250px;top:-170px}
.check-sec>.container{position:relative;z-index:1}

/* --- rekentool: keuzekaarten met icoon en pijl (ook op subsidiecheck.html) --- */
.sc-kies{padding:6px 0 0}
.sc-kies-h{font-size:1.12rem;margin-bottom:20px}
.sc-kies-grid{gap:18px}
.sc-kies-btn{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto 1fr;align-items:end;column-gap:12px;
  padding:20px 18px 20px 20px;border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow-sm)}
.sc-kies-btn:hover{border-color:var(--blue-300);box-shadow:var(--shadow)}
.sc-kies-ic{grid-column:1/-1;width:48px;height:48px;border-radius:12px;background:var(--blue-100);color:var(--blue);
  display:grid;place-items:center;margin-bottom:16px;align-self:start}
.sc-kies-ic svg{width:24px;height:24px}
.sc-kies-tekst{min-width:0}
.sc-kies-btn small{margin-bottom:0;color:var(--slate)}

/* --- projecten: kopblok met eyebrow, bedrag met vinkje --- */
.ervaring-sec .sec-head{margin-bottom:36px}
.ervaring-sec .lead{max-width:60ch;margin-left:auto;margin-right:auto}
.ervaring-sec .feiten{margin-bottom:34px}

/* --- specialist: vinkjes in een groene cirkel, titel en uitleg onder elkaar --- */
.waarom-sec h2{font-size:clamp(1.9rem,3.9vw,3.05rem);line-height:1.08;max-width:14ch}
.waarom-sec .lead{max-width:44ch}
.checks--rond{gap:28px}
.checks--rond li{gap:1.1rem}
.checks--rond li i{flex:0 0 auto;width:44px;height:44px;border-radius:50%;background:var(--green-050);display:grid;place-items:center}
.checks--rond li i svg{width:20px;height:20px;margin:0;color:var(--green)}
.checks--rond li span{font-size:.95rem;color:var(--slate);line-height:1.5}
.checks--rond li b{font-size:1.05rem;margin-bottom:.2rem}

/* --- contactkaart --- */
.contact-sec{background:#EEF5FE}
.contact-kaart{display:grid;grid-template-columns:minmax(240px,300px) minmax(0,1fr);background:#fff;border:1px solid var(--line-2);
  border-radius:22px;overflow:hidden;box-shadow:var(--shadow)}
.contact-kaart-foto{margin:0;position:relative;min-height:420px;background:var(--ink)}
.contact-kaart-foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 20%}
.contact-kaart-foto figcaption{position:absolute;left:14px;bottom:14px;background:rgba(255,255,255,.9);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:10px;padding:.55rem .85rem;line-height:1.25;box-shadow:var(--shadow-sm)}
.contact-kaart-foto figcaption b{display:block;font-size:.92rem;color:var(--ink)}
.contact-kaart-foto figcaption span{display:block;font-size:.78rem;color:var(--slate)}
.contact-kaart-body{position:relative;padding:46px 46px 42px;min-width:0}
.contact-kaart-body h2{font-size:clamp(1.45rem,2.2vw,1.9rem);max-width:38ch;margin:.4rem 0 .6rem}
.contact-kaart-body>p{max-width:68ch;color:var(--slate);font-size:1.04rem}
.contact-kaart .contact-actions{gap:14px;margin-top:1.5rem}
.contact-kaart .contact-actions .btn svg{width:20px;height:20px}
.contact-pluspunten{list-style:none;margin:32px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:16px 0}
.contact-pluspunten li{display:flex;align-items:center;gap:12px;padding:0 20px;border-left:1px solid var(--line)}
.contact-pluspunten li:first-child{padding-left:0;border-left:0}
.contact-pluspunten .usp-ic{width:42px;height:42px}
.contact-pluspunten .usp-ic svg{width:20px;height:20px}
.contact-pluspunten b{display:block;font-size:.93rem;color:var(--ink);line-height:1.3}
.contact-pluspunten li div span{display:block;font-size:.82rem;color:var(--muted)}
.contact-noot{position:absolute;top:40px;right:46px;margin:0;font-family:'Caveat','Segoe Print','Bradley Hand',cursive;font-weight:700;
  font-size:2rem;line-height:1.02;color:var(--ink);text-align:center;transform:rotate(-9deg);
  -webkit-text-stroke:.6px currentColor}  /* Caveat is ook in 700 dun; een lichte omlijning maakt de pen dikker */
.contact-noot svg{display:block;width:46px;height:56px;margin:4px 0 0 40px;color:var(--ink)}

/* --- responsive V5 --- */
@media(max-width:1180px){
  .usp-balk li{padding:4px 18px;gap:14px}
  .usp-ic{width:52px;height:52px}.usp-ic svg{width:24px;height:24px}
  .contact-noot{display:none}
  /* drie pluspunten in vaste kolommen i.p.v. een regel die afbreekt */
  .contact-pluspunten{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0}
  .contact-pluspunten li{flex-direction:column;align-items:flex-start;gap:8px;padding:0 16px}
}
@media(max-width:980px){
  .hero--team{display:flex;flex-direction:column}
  .hero--team .container{order:1;padding-top:40px;padding-bottom:28px}
  .hero-team-foto{order:2;position:relative;inset:auto;width:100%;aspect-ratio:16/10;max-height:min(46vh,440px)}
  .hero-team-foto img{object-position:60% 30%}
  .hero-team-foto::after{background:linear-gradient(180deg,var(--brand) 0%,rgba(30,144,255,0) 28%)}
  .usp-sec{margin-top:-40px}
  .usp-balk{grid-template-columns:repeat(2,minmax(0,1fr));padding:8px 0}
  .usp-balk li{padding:18px 20px;border-left:0}
  .usp-balk li:nth-child(even){border-left:1px solid var(--line)}
  .usp-balk li:nth-child(n+3){border-top:1px solid var(--line)}
  .situ-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .situ-grid--three{grid-template-columns:repeat(2,minmax(0,1fr))}
  .contact-kaart{grid-template-columns:minmax(220px,280px) minmax(0,1fr)}
  .contact-kaart-body{padding:34px 32px}
}
@media(max-width:760px){
  .wijzer-layout{grid-template-columns:1fr}
  .zakelijke-regeling-voorwaarden{grid-template-columns:1fr;gap:18px}
  .zakelijke-regeling-bedragen{grid-template-columns:1fr}
  .zakelijke-regelingen-paneel{padding:22px 18px}
  .zakelijk-tool-velden{grid-template-columns:1fr;gap:0}
  .hero--team .container{padding-top:30px}
  .hero--team .lead{font-size:1.1rem}
  .hero--team .hero-cta .btn{flex:1 1 100%}
  .usp-balk li{flex-direction:column;align-items:flex-start;gap:10px;padding:18px 16px}
  .usp-ic{width:46px;height:46px}.usp-ic svg{width:22px;height:22px}
  .usp-balk b{font-size:.97rem}
  .usp-balk li span:not(.usp-ic){font-size:.85rem}
  .situ-sec{padding-top:56px}
  .waarom-sec h2{max-width:none}
  .contact-kaart{grid-template-columns:1fr}
  .contact-kaart-foto{min-height:0;aspect-ratio:4/3}
  .contact-kaart-foto img{object-position:50% 22%}
  .contact-kaart-body{padding:26px 22px 30px}
  .contact-kaart .contact-actions .btn{flex:1 1 100%}
  .contact-pluspunten{grid-template-columns:1fr;gap:14px;margin-top:26px}
  .contact-pluspunten li{flex-direction:row;align-items:center;gap:12px;padding:0;border-left:0}
}
@media(max-width:520px){
  .zakelijke-regelingen-categorieen{grid-template-columns:1fr;gap:8px;margin-bottom:16px}
  .zakelijke-regeling-categorie{justify-content:flex-start;min-height:50px;padding:9px 13px}
  .zakelijke-regelingen-subtitle{text-align:left}
  .zakelijke-regelingen-tabs{flex-wrap:wrap;justify-content:flex-start;overflow:visible;gap:7px}
  .zakelijke-regeling-heading{align-items:flex-start;flex-direction:column;gap:10px}
  .zakelijke-regeling-tab{padding:9px 16px}
  .zakelijke-regeling-footer{align-items:flex-start;flex-direction:column}
}
@media(max-width:560px){
  .situ-grid{grid-template-columns:1fr;gap:16px}
  .situ-grid--three{grid-template-columns:1fr}
  .wijzer-regelingen{grid-template-columns:1fr}
  .situ{flex-direction:row;align-items:stretch}
  .situ-img{flex:0 0 34%;aspect-ratio:auto}
  .situ-body{padding:16px 14px 16px 16px;align-items:center;gap:10px}
  .situ-body>span{min-width:0}
  .situ-body small{font-size:.86rem;hyphens:auto;-webkit-hyphens:auto}
  .situ .pijl{width:34px;height:34px}
  .check-sec::before{width:220px;height:220px;left:-150px;top:-130px}
  .check-sec::after{width:260px;height:260px;right:-190px;top:-110px}
}
@media(max-width:380px){
  .usp-balk{grid-template-columns:1fr}
  .usp-balk li:nth-child(even){border-left:0}
  .usp-balk li:nth-child(n+2){border-top:1px solid var(--line)}
}

/* ==========================================================================
   V5b (28-09-2026) — mailronde Stan: oranje knoppen met witte tekst en een
   kleinere radius, teamfoto ook in de hero van de money pages.
   Let op: wit op #FF7800 is 2,6:1 en haalt geen WCAG AA. Bewuste keuze van
   Stan; de tekst is vet (700) om de leesbaarheid zo goed mogelijk te houden.
   ========================================================================== */
.btn{border-radius:8px}
.btn--primary,.btn--gold,
.btn--primary:hover,.btn--gold:hover,
.site-footer a.btn,.site-footer a.btn:hover{color:#fff}

/* money pages: gezamenlijke foto (liggend) i.p.v. het staande portret van Stan */
.hero--money .hero-grid--money{grid-template-columns:minmax(0,1.05fr) minmax(300px,480px)}
.hero-persoon--team img{aspect-ratio:4/3;object-position:62% 30%}
@media(max-width:980px){
  .hero--money .hero-grid--money{grid-template-columns:1fr}
  .hero-persoon--team{max-width:560px;margin:4px 0 0}
  .hero-persoon--team img{aspect-ratio:16/10;max-height:34vh}
}

/* V5c (28-09-2026): logo-balk terug direct onder de hero (usp.png van Stan). De USP-kaart valt
   daardoor niet meer over de hero maar staat als eigen blok onder de logo's. */
.hero--team .container{padding-bottom:48px}
.hero--team+.logobalk{border-top:0}
.usp-sec{margin-top:0;padding-top:44px}
@media(max-width:980px){
  .hero--team .container{padding-bottom:16px}
  .usp-sec{margin-top:0;padding-top:32px}
}

/* ==========================================================================
   V5d (28-09-2026) — WhatsApp-wolkje boven de WhatsApp-knop (desktop) of boven
   de WhatsApp-knop in de mobiele onderbalk. Verschijnt na 35% scrollen,
   eenmalig per bezoek (assets/js/main.js).
   ========================================================================== */
.wa-bubble{position:fixed;right:22px;bottom:86px;z-index:var(--z-drijvend);width:min(300px,calc(100vw - 28px));
  background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 22px 48px -20px rgba(12,21,38,.4);
  opacity:0;transform:translateY(10px) scale(.97);transform-origin:100% 100%;
  transition:opacity .25s ease,transform .3s cubic-bezier(.22,.61,.36,1)}
.wa-bubble.is-visible{opacity:1;transform:none}
.wa-bubble[hidden]{display:none}
/* staartje naar de knop */
.wa-bubble::after{content:"";position:absolute;right:34px;bottom:-7px;width:14px;height:14px;background:#fff;
  border-right:1px solid var(--line);border-bottom:1px solid var(--line);transform:rotate(45deg)}
.wa-bubble-link{display:flex;align-items:center;gap:12px;padding:14px 38px 14px 14px;color:var(--slate)}
.wa-bubble-link:hover{color:var(--slate)}
.wa-bubble-link:hover b{color:#0F7A6D}
.wa-bubble-ic{flex:0 0 auto;width:40px;height:40px;border-radius:50%;background:#0F7A6D;color:#fff;display:grid;place-items:center}
.wa-bubble-ic svg{width:21px;height:21px}
.wa-bubble-ic--foto{position:relative;background:none;overflow:visible}
.wa-bubble-ic--foto img{width:40px;height:40px;border-radius:50%;object-fit:cover;display:block}
.wa-bubble-ic--foto svg{position:absolute;right:-5px;bottom:-4px;width:12px;height:12px;background:#0F7A6D;color:#fff;border-radius:50%;padding:3px;box-sizing:content-box;border:2px solid #fff}
.wa-bubble-tekst b{display:block;color:var(--ink);font-size:.95rem;line-height:1.3;transition:color .15s}
.wa-bubble-tekst span{display:block;font-size:.84rem;line-height:1.4;margin-top:.1rem}
.wa-bubble-x{position:absolute;top:6px;right:6px;width:28px;height:28px;border:0;background:none;border-radius:8px;
  font-size:1.3rem;line-height:1;color:var(--muted);cursor:pointer}
.wa-bubble-x:hover{background:var(--bg-2);color:var(--ink)}
@media(max-width:760px){
  /* boven de onderbalk; staartje wijst naar de WhatsApp-knop rechts in die balk */
  .wa-bubble{right:14px;bottom:calc(84px + env(safe-area-inset-bottom))}
  .wa-bubble::after{right:19px}
}
@media (prefers-reduced-motion:reduce){.wa-bubble{transition:none;transform:none}}

/* ==========================================================================
   V6 (29-09-2026) — de homepage-hero op alle pagina's (.hero--team.hero--sub).
   Zelfde opbouw en kleuren; de kop is iets kleiner omdat de titels van de
   subpagina's langer zijn. Kruimelpad en eyebrow in navy (AA op merkblauw).
   ========================================================================== */
.hero--sub .container{padding-top:64px;padding-bottom:76px}
.hero--sub .hero-tekst{max-width:560px}
.hero--sub h1{font-size:clamp(2rem,4.2vw,3.25rem);line-height:1.08}
body[data-page="home"] .hero--team h1{font-size:clamp(2rem,4.2vw,3.25rem);line-height:1.08}
.hero--team .crumb{color:var(--navy);font-weight:600;margin-bottom:18px}
.hero--team .crumb a{color:var(--navy);text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(6,32,106,.4)}
.hero--team .eyebrow{color:var(--navy);margin-bottom:.8rem}
.hero--team .lead b{color:#fff}
.hero--team .hero-cta{flex-wrap:wrap;gap:.7rem}
.hero--cta-duo .container{padding-top:64px;padding-bottom:38px}
@media(min-width:1500px){.hero--cta-duo{min-height:590px}}
.hero--cta-duo .hero-cta .btn{padding-top:.78em;padding-bottom:.78em}
body[data-page="home"] .hero--cta-duo .lead,
body[data-page="vve"] .hero--cta-duo .lead,
body[data-page="verhuurders"] .hero--cta-duo .lead,
body[data-page="particulieren"] .hero--cta-duo .lead{max-width:560px}
.hero--cta-duo .hero-cta .btn--outline-light{background:#fff;border-color:#fff;color:#111}
.hero--cta-duo .hero-cta .btn--outline-light:hover{background:#eef6ff;border-color:#eef6ff;color:#111;transform:translateY(-2px)}
.hero--team .btn--ghost{border-color:#fff}
.hero--team .btn--ghost:hover{border-color:var(--navy);color:var(--navy)}
/* juridische pagina's: lange inleiding, geen knoppen */
.hero--legal .lead{max-width:48ch;font-size:1.1rem}

/* onder de hero: sprongmenu (FAQ) en bereikbaarheid + formulier (contact) */
.faq-routes-sec{padding:40px 0 0}
.faq-routes-sec .routes{margin-top:0}
.contact-kanalen h2{font-size:clamp(1.5rem,2.6vw,2rem)}
.contact-kanalen .checks{margin-top:1.2rem}

@media(max-width:980px){
  .hero--sub .container{padding-top:32px;padding-bottom:26px}
  .hero--cta-duo .container{padding-top:32px;padding-bottom:16px}
}
/* V6b: elke hero houdt zijn eigen beeld. Eigen foto's (over ons, projecten) hebben het onderwerp links in
   beeld, dus die schuiven naar links zodat het blauwe verloop geen gezicht bedekt. Pagina's die nooit een
   herobeeld hadden krijgen alleen het blauwe vlak. */
.hero-team-foto--eigen img{object-position:12% 40%}
.hero--zonder-foto .hero-tekst{max-width:640px}
@media(max-width:980px){
  .hero--zonder-foto .container{padding-bottom:40px}
  .hero-team-foto--eigen img{object-position:30% 40%}
}

/* ==========================================================================
   Rekentool: minimum-oppervlakte (29-09-2026). Elk veld toont vooraf vanaf
   hoeveel m² het meetelt; onder het minimum wordt het veld zacht blauw
   gemarkeerd met "nog X m²", en de uitkomst toont voortgangsbalken i.p.v.
   een waarschuwingstekst.
   ========================================================================== */
.sc-m2>span .sc-min{display:block;font-size:.76rem;line-height:1.3;color:var(--muted);margin-top:1px;font-weight:400}
.sc-m2.is-onder input{border-color:var(--blue-300);background:var(--blue-050)}
.sc-m2.is-onder .sc-min{color:var(--blue);font-weight:600}

.sc-bijna{background:#fff;border:1px solid var(--line);border-radius:14px;padding:20px 20px 18px}
.sc-bijna-h{display:flex;align-items:center;gap:.55rem;margin:0 0 .25rem;font-family:var(--ff-head);font-weight:800;
  font-size:1.06rem;color:var(--ink)}
.sc-bijna-h::before{content:"";flex:0 0 auto;width:26px;height:26px;border-radius:50%;
  background:var(--blue-050) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230B6FD6' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E") center/14px no-repeat}
.sc-bijna-sub{font-size:.88rem;color:var(--slate);line-height:1.5;margin:0 0 16px}
.sc-bijna ul{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.sc-bijna-rij{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-size:.92rem;font-weight:600;color:var(--ink)}
.sc-bijna-rij b{white-space:nowrap;font-variant-numeric:tabular-nums;font-weight:700;color:var(--ink)}
.sc-bijna-balk{height:7px;margin:7px 0 5px;border-radius:999px;background:var(--line-2);overflow:hidden}
.sc-bijna-balk i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--blue),var(--brand));transition:width .3s ease}
.sc-bijna li small{display:block;font-size:.8rem;color:var(--slate)}
.sc-bijna--na{margin:14px 0 0;padding:16px 18px;background:var(--bg-2);border-style:dashed}
.sc-bijna--na .sc-bijna-h{font-size:.96rem}
@media (prefers-reduced-motion:reduce){.sc-bijna-balk i{transition:none}}

/* Opdrachtgeverscarrousel, vormgeving afgestemd op de referentievideo */
.logobalk{padding:64px 0 96px;border-bottom:0}
.logobalk>.container{width:100%;max-width:var(--container);padding-inline:24px}
.logobalk .logobalk-kop{display:block;margin:0 0 34px;text-align:center;font-family:var(--ff-head);font-size:1rem;
  line-height:1.4;letter-spacing:0;font-weight:700;color:var(--ink);text-transform:none}
.klantlogos-carousel{display:flex;align-items:center;gap:12px;min-width:0}
.klantlogos--scroll{container-type:inline-size;flex:1 1 auto;min-width:0;overflow-x:auto;overflow-y:hidden;
  overscroll-behavior-x:contain;scrollbar-width:none;scroll-behavior:auto;-webkit-overflow-scrolling:touch}
.klantlogos--scroll::-webkit-scrollbar{display:none}
.klantlogos-track{display:flex;align-items:center;width:max-content}
.klantlogos-track__group{display:flex;flex:0 0 auto;align-items:center;gap:12px;padding-right:12px}
.klantlogos-track__group img{display:block;flex:0 0 calc(16.666667cqw - 10px);width:calc(16.666667cqw - 10px);height:80px;
  max-width:none;max-height:none;object-fit:contain;filter:none;opacity:1;transform:scale(.5)}
.klantlogos-prev,.klantlogos-next{display:grid;flex:0 0 22px;width:22px;height:36px;place-items:center;border:0;
  border-radius:0;background:transparent;color:#111;cursor:pointer;box-shadow:none;padding:0}
.klantlogos-prev:hover,.klantlogos-next:hover{color:var(--blue)}
.klantlogos-prev[hidden],.klantlogos-next[hidden]{display:none}
.klantlogos-prev:focus-visible,.klantlogos-next:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
.klantlogos-prev svg,.klantlogos-next svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;
  stroke-linecap:round;stroke-linejoin:round}
@media(max-width:760px){
  .logobalk{padding:42px 0 64px}
  .logobalk .logobalk-kop{font-size:.95rem;margin-bottom:24px}
  .klantlogos-carousel{gap:8px}
  .klantlogos-track__group{gap:8px;padding-right:8px}
  .klantlogos-track__group img{flex-basis:calc(16.666667cqw - 6.666667px);width:calc(16.666667cqw - 6.666667px);height:60px}
}

/* Minder tussenruimte tussen de opdrachtgevers en rekentool op de subsidiepagina's */
.logobalk--check-near{padding-bottom:32px}
.section--check-near{padding:56px 0 6px}
.aanvraagmoment-spacing{padding:5px 0 48px}
@media(max-width:760px){
  .logobalk--check-near{padding-bottom:24px}
  .section--check-near{padding:44px 0 4px}
  .aanvraagmoment-spacing{padding:5px 0 36px}
}

/* Trustpilot-score op de homepage-hero in wit */
.prose--svve-bedragen{max-width:92ch}
.prose--isde-bedragen{max-width:92ch}
.hero--team .hero-twijfel,
.hero--team .hero-twijfel a,
.hero--team .hero-twijfel a b{color:#fff}
.hero--team .hero-trust .tp,
.hero--team .hero-trust .tp b,
.hero--team .hero-trust .tp a{color:#fff}
.hero--team .hero-trust .tp a{text-decoration-color:rgba(255,255,255,.65)}

@media(min-width:901px){
  table.bedragen--svoh{table-layout:fixed}
  table.bedragen--svoh th:first-child,
  table.bedragen--svoh td:first-child{width:52%}
  table.bedragen--svoh th:nth-child(2),
  table.bedragen--svoh td:nth-child(2),
  table.bedragen--svoh th:nth-child(3),
  table.bedragen--svoh td:nth-child(3){width:24%}
  table.bedragen--svoh th:nth-child(2),
  table.bedragen--svoh th:nth-child(3){text-align:right}
  table.bedragen--svve th:nth-child(2),
  table.bedragen--svve th:nth-child(3),
  table.bedragen--isde th:nth-child(2),
  table.bedragen--isde th:nth-child(3){text-align:right}
  table.bedragen--svve td.num,
  table.bedragen--isde td.num,
  table.bedragen--svoh td.num{text-align:right}
  table.bedragen--svve .bedragen-waarde,
  table.bedragen--isde .bedragen-waarde,
  table.bedragen--svoh .bedragen-waarde{display:inline-block;width:9ch;text-align:right}
  table.bedragen--svve .bedragen-eenheid,
  table.bedragen--isde .bedragen-eenheid,
  table.bedragen--svoh .bedragen-eenheid{display:inline-block;width:5ch;text-align:right}
}
.voorwaarden-intro{margin:.9rem 0 0;padding-left:14px;border-left:3px solid var(--green);color:var(--muted);font-size:.98rem;line-height:1.6;max-width:34ch}
.vergoeding-ondertitel{white-space:nowrap}
@media(max-width:760px){.vergoeding-ondertitel{white-space:normal}}
body[data-page="over"] .logobalk{padding-bottom:32px}
body[data-page="over"] .logobalk+.section{padding-top:44px}
body[data-page="over"] .over-ons-stappen .step h3{font-size:.98rem;line-height:1.25}
@media(max-width:760px){
  body[data-page="over"] .logobalk{padding-bottom:24px}
  body[data-page="over"] .logobalk+.section{padding-top:32px}
}

/* Contactpagina: compactere hero, zonder de beeldstijl te wijzigen. */
body[data-contact-page] .hero--team{min-height:0}
body[data-contact-page] .hero--team .container{padding-top:44px;padding-bottom:36px}
body[data-contact-page] .hero-team-foto img{object-position:62% 50%}
@media(max-width:760px){
  body[data-contact-page] .hero--team .container{padding-top:26px;padding-bottom:20px}
  body[data-contact-page] .hero-team-foto{max-height:min(34vh,300px)}
}

/* Lichte, compacte logobalk onder de hero op de homepage en doelgroep-pagina's. */
.home-hero-logos,.logobalk--audience{position:relative;background:#fafbfc;padding:14px 0 16px;border-top:1px solid #f0f2f5}
.home-hero-logos{padding:8px 0 10px}
.home-hero-logos>.container,.logobalk--audience>.container{max-width:1300px;padding-left:calc(24px + clamp(0px,calc(50vw - 590px),60px));display:grid;grid-template-columns:minmax(240px,300px) minmax(0,1fr);align-items:center;gap:36px}
.home-hero-logos .logobalk-kop,.logobalk--audience .logobalk-kop{display:block;margin:0;text-align:left;color:#667085;font-size:.78rem;line-height:1.45;font-weight:500}
.home-hero-logos>.container{grid-template-columns:190px 1px minmax(0,1fr);gap:18px}
.home-trust-mark{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:1px;min-width:0;line-height:1.05}
.home-trust-mark strong{color:var(--navy);font-family:var(--ff-head);font-size:1.55rem;font-weight:800;letter-spacing:-.04em}
.home-trust-mark span{color:var(--ink);font-size:.78rem;font-weight:600;line-height:1.15}
.home-trust-mark small{color:var(--muted);font-size:.68rem;line-height:1.15}
.home-logos-divider{display:block;width:1px;height:46px;background:#d9e1ea}
.home-hero-logos .logobalk-kop.tp{display:flex;align-items:center;gap:.55rem;color:var(--slate);font-size:.92rem;font-weight:400;flex-wrap:wrap}
.home-hero-logos .logobalk-kop.tp a{color:var(--ink);font-weight:700;text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:3px}
.home-hero-logos .klantlogos-carousel,.logobalk--audience .klantlogos-carousel{max-width:none;margin:0;gap:10px}
.home-hero-logos .klantlogos-track__group,.logobalk--audience .klantlogos-track__group{gap:56px;padding-right:56px}
.home-hero-logos .klantlogos-track__group img,.logobalk--audience .klantlogos-track__group img{flex:0 0 124px;width:124px;height:42px;max-width:none;max-height:none;object-fit:contain;transform:none;filter:grayscale(1);opacity:.78;mix-blend-mode:multiply}
.home-hero-logos .klantlogos-track__group img.logo-nova-connect,.logobalk--audience .klantlogos-track__group img.logo-nova-connect{flex-basis:156px;width:156px;height:56px}
.home-hero-logos .klantlogos-track__group img.logo-derksen,.logobalk--audience .klantlogos-track__group img.logo-derksen{flex-basis:156px;width:156px;height:54px}
.home-hero-logos .klantlogos-track__group img:hover,.logobalk--audience .klantlogos-track__group img:hover{opacity:.78}
.home-hero-logos .klantlogos-track--marquee,.logobalk--audience .klantlogos-track--marquee{animation:none!important;will-change:transform}
@keyframes klantlogos-marquee{from{transform:translateX(-33.333333%)}to{transform:translateX(-66.666667%)}}
@media(max-width:980px){.home-hero-logos>.container,.logobalk--audience>.container{grid-template-columns:minmax(210px,250px) minmax(0,1fr);gap:26px}}
@media(max-width:980px){.home-hero-logos>.container{grid-template-columns:170px 1px minmax(0,1fr);gap:14px}.home-trust-mark strong{font-size:1.4rem}.home-trust-mark span{font-size:.74rem}.home-trust-mark small{font-size:.65rem}}
@media(max-width:760px){
  .home-hero-logos,.logobalk--audience{padding:12px 0 14px}
  .home-hero-logos{padding:8px 0 10px}
  .home-hero-logos>.container{grid-template-columns:1fr;gap:10px}
  .home-logos-divider{display:none}
  .home-hero-logos>.container,.logobalk--audience>.container{grid-template-columns:1fr;gap:12px}
  .home-hero-logos .logobalk-kop,.logobalk--audience .logobalk-kop{max-width:42ch}
  .home-hero-logos .klantlogos-track__group,.logobalk--audience .klantlogos-track__group{gap:28px;padding-right:28px}
  .home-hero-logos .klantlogos-track__group img,.logobalk--audience .klantlogos-track__group img{flex-basis:106px;width:106px;height:38px}
  .home-hero-logos .klantlogos-track__group img.logo-nova-connect,.logobalk--audience .klantlogos-track__group img.logo-nova-connect{flex-basis:132px;width:132px;height:48px}
  .home-hero-logos .klantlogos-track__group img.logo-derksen,.logobalk--audience .klantlogos-track__group img.logo-derksen{flex-basis:136px;width:136px;height:46px}
}

/* Algemene voorwaarden: compactere teksthero met een volledig witte titel. */
.hero--legal{min-height:0;height:auto}
.hero--legal .container{padding-top:80px;padding-bottom:80px}
.hero--legal .lead{margin-bottom:0}
.hero--legal h1,.hero--legal h1 .hl{color:#fff}
@media(max-width:980px){.hero--legal .container{padding-top:42px;padding-bottom:42px}}
@media(max-width:760px){.hero--legal .container{padding-top:30px;padding-bottom:30px}}