/* ECE Ultimate Theme — main.css v3.0 */
:root{--navy:#0D1B35;--navy2:#162040;--navy3:#1E2D55;--red:#DC2626;--reddk:#C02020;--white:#fff;--off:#F8F9FB;--off2:#EFF1F5;--text:#111827;--muted:#6B7280;--border:#E5E7EB;--gold:#F59E0B;--green:#059669;--fd:'Plus Jakarta Sans',system-ui,sans-serif;--fb:'Inter',system-ui,sans-serif}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--fb);color:var(--text);background:var(--white);line-height:1.6;font-size:16px;-webkit-font-smoothing:antialiased;overflow-x:clip}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
:focus-visible{outline:3px solid var(--red);outline-offset:3px;border-radius:3px}
[id]{scroll-margin-top:96px}
.skip-link{position:absolute;left:-9999px;top:0;z-index:999;background:var(--navy);color:#fff;font-family:var(--fd);font-weight:700;font-size:14px;padding:12px 20px;border-radius:0 0 10px 0}
.skip-link:focus{left:0}
.fc-field .fc-invalid{border-color:#dc2626;background:#FEF2F2}
.wrap{max-width:1220px;margin:0 auto;padding:0 clamp(16px,4vw,48px)}

/* URG BAR */
.urg-bar{background:var(--red);color:#fff;font-family:var(--fd);font-size:12px;font-weight:600;text-align:center;padding:7px 16px}
.urg-bar a{color:#fff;text-decoration:underline;margin-left:12px;font-weight:700}

/* TOP BAR */
.top-bar{background:var(--navy);border-bottom:1px solid rgba(255,255,255,.08);padding:6px 0;font-size:12px}
.top-bar-inner{max-width:1220px;margin:0 auto;padding:0 clamp(16px,4vw,48px);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px}
.top-left{display:flex;gap:20px;align-items:center;flex-wrap:wrap}
.top-item{color:rgba(255,255,255,.7);display:flex;align-items:center;gap:5px;transition:color .15s}
.top-item:hover{color:#fff}
.top-time{color:rgba(255,255,255,.5)}
.top-badges{display:flex;gap:8px;flex-wrap:wrap}
.top-badge{display:flex;align-items:center;gap:5px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);color:rgba(255,255,255,.7);font-size:11px;font-weight:500;padding:3px 10px;border-radius:100px}
.top-badge-green{background:rgba(5,150,105,.2);border-color:rgba(5,150,105,.4);color:#6ee7b7}

/* HEADER */
.site-header{background:#fff;border-bottom:2px solid var(--off2);position:sticky;top:0;z-index:200;box-shadow:0 2px 20px rgba(0,0,0,.06);transition:box-shadow .3s}
.site-header.scrolled{box-shadow:0 4px 24px rgba(0,0,0,.1)}
.header-inner{max-width:1220px;margin:0 auto;padding:0 clamp(16px,4vw,48px);height:72px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.site-logo{display:flex;align-items:center;gap:10px;flex-shrink:0}
.logo-shield{width:40px;height:40px;background:var(--navy);border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.logo-text{display:flex;flex-direction:column}
.logo-main{font-family:var(--fd);font-size:18px;font-weight:800;color:var(--navy);letter-spacing:-.02em;line-height:1.1}
.logo-sub{font-size:11px;color:var(--muted)}
.logo-uploaded-wrap{display:flex;align-items:center;flex-shrink:0}
.logo-uploaded-wrap .custom-logo-link{display:block}
.logo-uploaded-wrap img.custom-logo{max-height:52px;width:auto;display:block;object-fit:contain}
@media(max-width:600px){.logo-uploaded-wrap img.custom-logo{max-height:40px}}
.nav-menu{list-style:none;display:flex;align-items:center;gap:2px}
.nav-menu li a{font-size:13px;font-weight:500;color:var(--muted);padding:7px 10px;border-radius:6px;display:block;white-space:nowrap;transition:background .15s,color .15s}
.nav-menu li a:hover{background:var(--off);color:var(--text)}
.nav-menu>li{position:relative}
.nav-menu .menu-item-has-children>a::after{content:"";display:inline-block;width:6px;height:6px;margin-left:7px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-2px) rotate(45deg);opacity:.55}
.nav-menu .sub-menu{position:absolute;top:100%;left:0;min-width:230px;list-style:none;background:#fff;border:1px solid var(--border);border-radius:0 0 12px 12px;box-shadow:0 14px 34px rgba(0,0,0,.13);padding:8px;opacity:0;visibility:hidden;transform:translateY(4px);transition:opacity .18s ease,transform .18s ease,visibility .18s;z-index:300}
.nav-menu li:hover>.sub-menu,.nav-menu li:focus-within>.sub-menu{opacity:1;visibility:visible;transform:translateY(0)}
.nav-menu .sub-menu li{width:100%}
.nav-menu .sub-menu li a{padding:10px 12px;font-size:14px;color:var(--text);white-space:normal;border-radius:7px}
.nav-menu .sub-menu li a:hover{background:var(--off);color:var(--navy)}
.nav-menu .sub-menu .sub-menu{top:-8px;left:100%;margin-left:6px;border-radius:12px}
.mobile-menu .sub-menu{list-style:none;padding:2px 0 6px 16px}
.mobile-menu .sub-menu a{color:var(--muted);font-size:14px}
.header-actions{display:flex;align-items:center;gap:10px;flex-shrink:0}
.header-tel{display:flex;align-items:center;gap:7px;font-family:var(--fd);font-size:16px;font-weight:700;color:var(--navy);padding:8px 16px;border:2px solid var(--navy);border-radius:8px;transition:background .15s,color .15s;white-space:nowrap}
.header-tel:hover{background:var(--navy);color:#fff}
.header-cta{background:var(--red);color:#fff;font-family:var(--fd);font-size:14px;font-weight:700;padding:10px 20px;border-radius:8px;white-space:nowrap;transition:background .15s}
.header-cta:hover{background:var(--reddk)}
.hamburger{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:8px}
.hamburger span{display:block;width:22px;height:2px;background:var(--text);border-radius:2px;transition:.2s}
@media(max-width:1024px){.nav-menu{display:none}.header-tel{display:none}.hamburger{display:flex}}
@media(max-width:600px){.header-cta{display:none}}
/* Mobiel menu: vult het scherm onder de header */
.mobile-nav{
  position:fixed;
  top:var(--ece-hdr-h,116px);
  left:0;right:0;bottom:0;
  background:#fff;
  border-top:1px solid var(--border);
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  z-index:190;
  opacity:0;
  visibility:hidden;
  transform:translateY(-8px);
  transition:opacity .22s ease,transform .22s ease,visibility .22s;
}
.mobile-nav.is-open{opacity:1;visibility:visible;transform:none}
.mobile-nav[hidden]{display:block!important}
.mobile-nav-inner{padding:20px clamp(16px,4vw,48px) calc(32px + env(safe-area-inset-bottom,0px));min-height:100%;display:flex;flex-direction:column}
/* Menu bovenaan, knoppen onderaan het scherm */
.mobile-nav-foot{margin-top:auto;padding-top:24px}
/* Achtergrond niet meescrollen als het menu open staat */
body.menu-open{overflow:hidden}
.mobile-menu{list-style:none}
.mobile-menu li a{display:block;padding:14px 0;font-size:16px;font-weight:600;color:var(--text);border-bottom:1px solid var(--border)}
.mobile-nav-foot{display:flex;flex-direction:column;gap:10px}
.mob-tel{display:flex;align-items:center;justify-content:center;gap:8px;background:var(--navy);color:#fff;font-weight:700;font-size:18px;padding:14px;border-radius:10px}
.mob-offerte{display:block;text-align:center;background:var(--red);color:#fff;font-weight:700;font-size:16px;padding:14px;border-radius:10px;transition:background .15s}
.mob-offerte:hover{background:var(--reddk)}

/* BUTTONS */
.btn-primary{display:inline-flex;align-items:center;gap:10px;background:var(--red);color:#fff;font-family:var(--fd);font-size:16px;font-weight:700;padding:16px 32px;border-radius:10px;box-shadow:0 4px 24px rgba(220,38,38,.4);transition:background .15s,transform .1s;white-space:nowrap}
.btn-primary:hover{background:var(--reddk);transform:translateY(-2px);color:#fff}
.btn-sec{display:inline-flex;align-items:center;gap:10px;background:rgba(255,255,255,.1);color:#fff;font-family:var(--fd);font-size:16px;font-weight:600;padding:15px 28px;border-radius:10px;border:1.5px solid rgba(255,255,255,.25);transition:background .15s;white-space:nowrap}
.btn-sec:hover{background:rgba(255,255,255,.18)}
.btn-navy{display:inline-flex;align-items:center;gap:8px;background:var(--navy);color:#fff;font-family:var(--fd);font-size:14px;font-weight:700;padding:13px 24px;border-radius:8px;transition:background .15s}
.btn-navy:hover{background:var(--navy2);color:#fff}
.btn-outline{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.1);color:#fff;font-family:var(--fd);font-size:15px;font-weight:600;padding:14px 24px;border:1.5px solid rgba(255,255,255,.3);border-radius:8px;transition:background .15s;white-space:nowrap}
.btn-outline:hover{background:rgba(255,255,255,.2)}

/* HERO */
.hero{position:relative;overflow:hidden;padding:80px 0 100px}
.hero::before{content:'';position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.04) 1px,transparent 1px);background-size:28px 28px;pointer-events:none}
.hero::after{content:'';position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--red)}
/* align-items:start i.p.v. center: anders zakt de linkerkolom mee omlaag zodra
   het formulier rechts langer wordt (bijv. als de textarea wordt uitgerekt). */
.hero-inner{position:relative;z-index:1;display:grid;grid-template-columns:1fr 420px;gap:64px;align-items:start}
.hero-badge{display:inline-flex;align-items:center;gap:8px;background:rgba(220,38,38,.15);border:1px solid rgba(220,38,38,.4);color:#fca5a5;font-size:12px;font-weight:600;letter-spacing:.06em;padding:5px 14px;border-radius:100px;margin-bottom:20px;text-transform:uppercase}
.badge-dot{width:6px;height:6px;border-radius:50%;background:var(--red);animation:pulse 2s infinite;flex-shrink:0}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.4}}
.hero h1{font-family:var(--fd);font-size:clamp(38px,5.5vw,68px);font-weight:800;line-height:1.05;letter-spacing:-.03em;color:#fff;margin-bottom:20px}
/* De H1 gebruikt geen <br>: de regelval loopt via deze regel. */
.hero h1 .h-accent,.hero h1 .h-light{display:block}
.h-accent{color:var(--red)}
.h-light{color:rgba(255,255,255,.55);font-weight:400}
.hero-sub{font-size:18px;color:rgba(255,255,255,.7);line-height:1.7;margin-bottom:36px;max-width:520px}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:44px}
.hero-proof{display:flex;gap:18px;flex-wrap:nowrap;align-items:center}
.hero-proof-item{display:flex;align-items:center;gap:7px;font-size:13px;color:rgba(255,255,255,.65);white-space:nowrap;flex-shrink:0}
.hero-proof-item svg{color:var(--gold);flex-shrink:0}
.stars{color:var(--gold);font-size:13px;letter-spacing:1px}
@media(max-width:960px){.hero-inner{grid-template-columns:1fr}.hero{padding:60px 0 72px}}

/* HERO CARD */
.hero-card{background:#fff;border-radius:16px;box-shadow:0 24px 80px rgba(0,0,0,.35);overflow:hidden}
.hero-card-top{background:var(--navy2);padding:20px 28px;display:flex;align-items:center;gap:12px}
.hero-card-icon{width:40px;height:40px;background:var(--red);border-radius:8px;display:flex;align-items:center;justify-content:center;color:#fff;flex-shrink:0}
.hero-card-title{font-family:var(--fd);font-size:16px;font-weight:700;color:#fff}
.hero-card-sub{font-size:12px;color:rgba(255,255,255,.55);margin-top:2px}
.hero-card-body{padding:24px 28px 28px}

/* FORMS */
.ece-form{display:flex;flex-direction:column;gap:12px}
.fc-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:500px){.fc-row{grid-template-columns:1fr}}
.fc-field{display:flex;flex-direction:column;gap:5px}
.fc-field label{font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.fc-field abbr{text-decoration:none;color:var(--red)}
.fc-field input,.fc-field select,.fc-field textarea{width:100%;border:1.5px solid var(--border);border-radius:8px;padding:11px 13px;font-size:14px;font-family:var(--fb);color:var(--text);background:var(--off);outline:none;transition:border-color .15s,background .15s;-webkit-appearance:none}
.fc-field input:focus,.fc-field select:focus,.fc-field textarea:focus{border-color:var(--red);background:#fff}
.fc-field textarea{resize:vertical;min-height:80px;max-height:320px;max-width:100%;width:100%;box-sizing:border-box}
/* In de hero staat de foto als achtergrond op .hero zelf, met background-size:
   cover. Wordt de hero hoger, dan moet die foto meer hoogte vullen en schaalt
   hij mee: bij het uitrekken van dit veld tot het maximum werd de foto 22 tot
   24 procent groter getoond. Vandaar hier geen sleepgreep, en in plaats
   daarvan meteen een ruimer veld. Op de contactpagina, waar geen foto onder
   ligt, blijft uitrekken gewoon mogelijk. */
.hero .fc-field textarea{resize:none;min-height:110px}
.fc-anker{display:block;height:0;overflow:hidden;scroll-margin-top:100px}
.fc-gemarkeerd{box-shadow:0 0 0 3px var(--gold,#F59E0B);transition:box-shadow .3s}
.fc-hint{margin:0;font-size:12px;line-height:1.5;color:var(--muted);text-transform:none;letter-spacing:normal}
.fc-error{margin:0;font-size:12px;line-height:1.5;font-weight:600;color:var(--red)}
.fc-submit{width:100%;background:var(--red);color:#fff;border:none;font-family:var(--fd);font-size:15px;font-weight:700;padding:15px;border-radius:10px;cursor:pointer;transition:background .15s;display:flex;align-items:center;justify-content:center;gap:8px;margin-top:4px}
.fc-submit:hover{background:var(--reddk)}
.fc-privacy{font-size:11px;color:var(--muted);text-align:center;margin-top:8px}
.fc-divider{display:flex;align-items:center;gap:12px;margin:16px 0;font-size:12px;color:var(--muted)}
.fc-divider::before,.fc-divider::after{content:'';flex:1;height:1px;background:var(--border)}
.fc-tel{display:flex;align-items:center;justify-content:center;gap:8px;background:var(--off2);border-radius:10px;padding:13px;font-family:var(--fd);font-size:18px;font-weight:800;color:var(--navy);transition:background .15s}
.fc-tel:hover{background:var(--off)}
.form-notice{display:flex;align-items:center;gap:12px;font-size:14px;padding:14px 16px;border-radius:8px;margin-bottom:16px}
.form-ok{background:#ECFDF5;border:1.5px solid #059669;color:#065f46}
.form-err{background:#FEF2F2;border:1.5px solid #dc2626;color:#7f1d1d}

/* TRUST STRIP */
.trust-strip{background:#fff;border-bottom:1px solid var(--border);padding:22px 0}
.trust-strip-inner{max-width:1220px;margin:0 auto;padding:0 clamp(16px,4vw,48px);display:flex;align-items:center;justify-content:center;gap:40px;flex-wrap:wrap}
.trust-item{display:flex;align-items:center;gap:10px}
.trust-icon{width:36px;height:36px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.trust-icon.n{background:var(--navy);color:#fff}
.trust-icon.g{background:#ECFDF5;color:var(--green)}
.trust-icon.y{background:#FFFBEB;color:var(--gold)}
.trust-text strong{display:block;font-size:13px;font-weight:700;color:var(--text)}
.trust-text span{font-size:11px;color:var(--muted)}
.trust-div{width:1px;height:32px;background:var(--border)}
@media(max-width:700px){.trust-div{display:none}.trust-strip{padding:16px 0}.trust-strip-inner{flex-direction:column;align-items:flex-start;gap:13px}.trust-strip-inner>*{width:100%}}

/* SECTIONS */
.section{padding:88px 0}
.section-alt{background:var(--off)}
.sec-label{font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--red);margin-bottom:10px}
.sec-title{font-family:var(--fd);font-size:clamp(28px,4vw,44px);font-weight:800;letter-spacing:-.025em;color:var(--text);line-height:1.1}
.sec-title.white{color:#fff}
.sec-sub{font-size:17px;color:var(--muted);margin-top:12px;line-height:1.7;max-width:560px}
.sec-sub.white{color:rgba(255,255,255,.65)}
.sec-header{margin-bottom:56px}
.sec-header-split{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:56px}

/* SERVICES */
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
@media(max-width:900px){.services-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:540px){.services-grid{grid-template-columns:1fr}}
.service-card{background:#fff;border:1.5px solid var(--border);border-radius:14px;padding:28px;transition:border-color .2s,box-shadow .2s,transform .15s;display:block;color:inherit}
.service-card:hover{border-color:var(--red);box-shadow:0 8px 40px rgba(220,38,38,.1);transform:translateY(-4px)}
.service-icon{width:52px;height:52px;border-radius:12px;background:linear-gradient(135deg,var(--navy),var(--navy3));display:flex;align-items:center;justify-content:center;margin-bottom:18px;color:#fff}
.service-icon.r{background:linear-gradient(135deg,var(--red),var(--reddk))}
.service-card h3{font-family:var(--fd);font-size:18px;font-weight:700;color:var(--text);margin-bottom:8px}
.service-card p{font-size:14px;color:var(--muted);line-height:1.65;margin-bottom:18px}
.service-link{font-size:13px;font-weight:600;color:var(--navy);display:flex;align-items:center;gap:5px;transition:gap .15s,color .15s}
.service-card:hover .service-link{color:var(--red);gap:8px}

/* WHY */
.why-grid{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center}
@media(max-width:900px){.why-grid{grid-template-columns:1fr}}
.why-visual{background:linear-gradient(145deg,var(--navy),var(--navy3));border-radius:20px;padding:48px;position:relative;overflow:hidden}
.why-visual::after{content:'';position:absolute;bottom:-24px;right:-24px;width:160px;height:160px;background:rgba(220,38,38,.15);border-radius:50%;pointer-events:none}
.why-num{font-family:var(--fd);font-size:80px;font-weight:800;color:var(--red);opacity:.85;line-height:1}
.why-label{font-family:var(--fd);font-size:32px;font-weight:700;color:#fff;margin-top:8px;line-height:1.3}
.why-since{font-size:13px;color:rgba(255,255,255,.5);margin-top:6px}
.why-divider{height:1px;background:rgba(255,255,255,.1);margin:28px 0}
.why-certs{display:flex;flex-direction:column;gap:10px}
.why-cert{display:flex;align-items:center;gap:12px;background:rgba(255,255,255,.07);border-radius:10px;padding:12px 16px}
.why-cert svg{color:var(--gold);flex-shrink:0}
.why-cert span{font-size:13px;font-weight:500;color:rgba(255,255,255,.85)}
.why-list{display:flex;flex-direction:column;gap:20px;margin-top:36px}
.why-item{display:flex;gap:16px}
.why-item-num{width:36px;height:36px;border-radius:8px;background:rgba(220,38,38,.1);color:var(--red);display:flex;align-items:center;justify-content:center;font-family:var(--fd);font-size:14px;font-weight:800;flex-shrink:0}
.why-item-body h4,.why-item-body h3{font-size:15px;font-weight:700;color:var(--text);margin-bottom:4px}
.why-item-body p{font-size:13px;color:var(--muted);line-height:1.6}

/* REVIEWS */
.reviews-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
@media(max-width:768px){.reviews-grid{grid-template-columns:1fr}}
@media(min-width:540px) and (max-width:768px){.reviews-grid{grid-template-columns:1fr 1fr}}
.review-card{background:#fff;border:1.5px solid var(--border);border-radius:14px;padding:28px;display:flex;flex-direction:column}
.review-stars{color:var(--gold);font-size:14px;letter-spacing:2px;margin-bottom:14px}
.review-text{font-size:14px;color:var(--text);line-height:1.7;font-style:italic;margin-bottom:20px;flex:1}
.review-author{display:flex;align-items:center;gap:12px;padding-top:16px;border-top:1px solid var(--border)}
.review-avatar{width:38px;height:38px;border-radius:50%;background:var(--navy);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--fd);font-weight:700;font-size:14px;flex-shrink:0}
.review-name{font-size:13px;font-weight:700;color:var(--text)}
.review-detail{font-size:11px;color:var(--muted);margin-top:1px}
.review-score-bar{display:flex;align-items:center;gap:24px;margin-top:44px;background:var(--off);border-radius:14px;padding:24px 28px;flex-wrap:wrap}
.rsb-num{font-family:var(--fd);font-size:52px;font-weight:800;color:var(--text);line-height:1}
.rsb-stars{color:var(--gold);font-size:18px;letter-spacing:2px;margin-bottom:2px}
.rsb-meta strong{display:block;font-size:14px;font-weight:700}
.rsb-meta span{font-size:13px;color:var(--muted)}
.rsb-btn{margin-left:auto;background:var(--navy);color:#fff;font-family:var(--fd);font-weight:700;font-size:13px;padding:11px 22px;border-radius:8px;white-space:nowrap;transition:background .15s}
.rsb-btn:hover{background:var(--navy2);color:#fff}
@media(max-width:600px){.rsb-btn{margin-left:0;width:100%;text-align:center;display:flex;justify-content:center}}

/* PROCESS */
.process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;position:relative}
@media(max-width:768px){.process-grid{grid-template-columns:repeat(2,1fr)}}
.process-grid::before{content:'';position:absolute;top:28px;left:10%;right:10%;height:2px;background:var(--border);z-index:0}
@media(max-width:768px){.process-grid::before{display:none}}
.process-step{display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 20px;position:relative;z-index:1}
.process-num{width:56px;height:56px;border-radius:50%;background:var(--navy);color:#fff;font-family:var(--fd);font-size:18px;font-weight:800;display:flex;align-items:center;justify-content:center;margin-bottom:20px;flex-shrink:0;border:3px solid #fff;box-shadow:0 0 0 2px var(--navy)}
.process-num.active{background:var(--red);box-shadow:0 0 0 2px var(--red)}
.process-step h3{font-size:15px;font-weight:700;color:var(--text);margin-bottom:8px}
.process-step p{font-size:13px;color:var(--muted);line-height:1.6}

/* FAQ */
.faq-list{border:1.5px solid var(--border);border-radius:14px;overflow:hidden}
.faq-item{border-bottom:1px solid var(--border)}
.faq-item:last-child{border-bottom:none}
.faq-q{width:100%;text-align:left;background:none;border:none;padding:22px 24px;font-family:var(--fb);font-size:15px;font-weight:600;color:var(--text);cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;transition:background .15s}
.faq-q:hover{background:var(--off)}
.faq-icon{width:24px;height:24px;border-radius:50%;border:1.5px solid var(--border);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .2s,border-color .2s,color .2s}
.faq-item.open .faq-icon{background:var(--red);border-color:var(--red);color:#fff}
.faq-a{display:none;padding:0 24px 22px;font-size:14px;color:var(--muted);line-height:1.75}
.faq-item.open .faq-a{display:block}

/* AREAS */
.areas-inner{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:start}
@media(max-width:768px){.areas-inner{grid-template-columns:1fr;gap:40px}}
.areas-tags{display:flex;flex-wrap:wrap;gap:8px}
.area-tag{font-size:13px;font-weight:500;color:var(--muted);background:#fff;border:1.5px solid var(--border);border-radius:100px;padding:7px 16px;transition:border-color .15s,color .15s}
.area-tag:hover{border-color:var(--red);color:var(--red)}
.area-tag.primary{background:var(--navy);color:#fff;border-color:var(--navy)}

/* CTA BAND */
.cta-band{background:linear-gradient(135deg,var(--red),var(--reddk));padding:72px 0}
.cta-band-inner{display:flex;align-items:center;justify-content:space-between;gap:40px;flex-wrap:wrap}
.cta-title{font-family:var(--fd);font-size:clamp(26px,4vw,40px);font-weight:800;color:#fff;line-height:1.1;letter-spacing:-.02em}
.cta-sub{font-size:16px;color:rgba(255,255,255,.8);margin-top:10px;max-width:480px}
.cta-actions{display:flex;gap:12px;flex-wrap:wrap;flex-shrink:0}
.btn-cta-white{display:inline-flex;align-items:center;gap:8px;background:#fff;color:var(--red);font-family:var(--fd);font-size:15px;font-weight:800;padding:15px 28px;border-radius:10px;transition:background .15s;white-space:nowrap}
.btn-cta-white:hover{background:rgba(255,255,255,.9)}
.btn-cta-outline-w{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.15);color:#fff;font-family:var(--fd);font-size:15px;font-weight:600;padding:14px 24px;border:1.5px solid rgba(255,255,255,.4);border-radius:10px;transition:background .15s;white-space:nowrap}
.btn-cta-outline-w:hover{background:rgba(255,255,255,.25)}

/* FOOTER */
.site-footer{background:var(--navy);color:rgba(255,255,255,.65);padding:64px 0 32px}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:48px;margin-bottom:48px}
@media(max-width:900px){.footer-grid{grid-template-columns:1fr 1fr;gap:32px}}
@media(max-width:500px){.footer-grid{grid-template-columns:1fr}}
.footer-logo{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.footer-desc{font-size:14px;line-height:1.7;margin-bottom:20px}
.footer-contact{font-style:normal;display:flex;flex-direction:column;gap:8px;font-size:13px}
.footer-contact a{color:rgba(255,255,255,.65);display:flex;align-items:center;gap:7px;transition:color .15s}
.footer-contact a:hover{color:#fff}
.footer-social{display:flex;gap:12px;margin-top:16px}
.footer-social a{color:rgba(255,255,255,.4);transition:color .15s}
.footer-social a:hover{color:var(--gold)}
.footer-col-title{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.35);margin-bottom:16px}
.footer-nav{list-style:none;display:flex;flex-direction:column;gap:10px}
.footer-nav a{font-size:13px;color:rgba(255,255,255,.55);transition:color .15s}
.footer-nav a:hover{color:#fff}
.footer-bottom{border-top:1px solid rgba(255,255,255,.08);padding-top:24px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;font-size:12px;color:rgba(255,255,255,.35)}
.footer-legal{display:flex;gap:20px}
.footer-legal a{color:rgba(255,255,255,.35);transition:color .15s}
.footer-legal a:hover{color:rgba(255,255,255,.7)}

/* STICKY BAR */
.sticky-bar{display:none;position:fixed;bottom:0;left:0;right:0;z-index:300;background:var(--navy);border-top:2px solid rgba(255,255,255,.1);padding:12px 16px}
.sticky-bar-inner{display:flex;gap:10px}
.sticky-tel{flex:1;display:flex;align-items:center;justify-content:center;gap:7px;padding:13px;font-family:var(--fd);font-size:14px;font-weight:700;color:rgba(255,255,255,.9);border:1.5px solid rgba(255,255,255,.2);border-radius:8px}
.sticky-offerte{flex:1;display:flex;align-items:center;justify-content:center;padding:13px;background:var(--red);color:#fff;font-family:var(--fd);font-size:14px;font-weight:700;border-radius:8px;transition:background .15s}
.sticky-offerte:hover{background:var(--reddk)}
@media(max-width:768px){
  /* Balk staat klaar maar buiten beeld; JS zet .zichtbaar zodra de hero voorbij is */
  .sticky-bar{display:block;transform:translateY(110%);opacity:0;visibility:hidden;transition:transform .28s ease,opacity .28s ease,visibility .28s}
  .sticky-bar.zichtbaar{transform:none;opacity:1;visibility:visible}
  body{padding-bottom:80px}
}
@media(prefers-reduced-motion:reduce){
  .sticky-bar{transition:opacity .2s ease,visibility .2s}
}
.wa-float{position:fixed;bottom:96px;right:20px;z-index:299;width:52px;height:52px;background:#25D366;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;box-shadow:0 4px 20px rgba(37,211,102,.4);transition:transform .2s}
.wa-float:hover{transform:scale(1.08)}
@media(min-width:769px){.wa-float{bottom:24px}}

/* PAGE HERO */
.page-hero{background:linear-gradient(160deg,var(--navy),var(--navy3));padding:56px 0 64px;position:relative}
.page-hero::after{content:'';position:absolute;bottom:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(220,38,38,.4),transparent)}
.page-hero::before{content:'';position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--red)}
.breadcrumb{display:flex;gap:6px;align-items:center;font-size:12px;color:rgba(255,255,255,.4);margin-bottom:16px;flex-wrap:wrap}
.breadcrumb a{color:rgba(255,255,255,.4);transition:color .15s}
.breadcrumb a:hover{color:rgba(255,255,255,.8)}
.page-hero h1{font-family:var(--fd);font-size:clamp(28px,4vw,48px);font-weight:800;color:#fff;letter-spacing:-.025em;line-height:1.1;margin-bottom:12px}
.page-hero-sub{font-size:17px;color:rgba(255,255,255,.65);max-width:600px;line-height:1.7}
.page-hero-actions{display:flex;gap:12px;margin-top:28px;flex-wrap:wrap}

/* PAGE LAYOUT */
.page-layout{max-width:1220px;margin:0 auto;padding:60px clamp(16px,4vw,48px);display:grid;grid-template-columns:1fr 320px;gap:56px;align-items:start}
@media(max-width:900px){.page-layout{grid-template-columns:1fr}}

/* ENTRY CONTENT */
.entry-content{font-size:16px;line-height:1.8;color:var(--text)}
.entry-content h2{font-family:var(--fd);font-size:28px;font-weight:800;color:var(--navy);margin:48px 0 16px;letter-spacing:-.02em}
.entry-content h3{font-family:var(--fd);font-size:20px;font-weight:700;color:var(--navy);margin:32px 0 12px}
.entry-content p{margin-bottom:16px}
.entry-content ul,.entry-content ol{padding-left:20px;margin-bottom:16px}
.entry-content li{margin-bottom:6px}
.entry-content img{border-radius:12px;margin:24px 0}
.entry-content blockquote{border-left:3px solid var(--red);padding:12px 20px;margin:24px 0;background:var(--off);border-radius:0 8px 8px 0;font-style:italic;color:var(--navy)}

/* SIDEBAR */
.page-sidebar{display:flex;flex-direction:column;gap:20px;position:sticky;top:96px}
.sidebar-block{background:var(--off);border:1.5px solid var(--border);border-radius:14px;padding:24px}
.sidebar-block h3{font-family:var(--fd);font-size:17px;font-weight:700;color:var(--navy);margin-bottom:10px;padding-bottom:10px;border-bottom:1px solid var(--border)}
.sidebar-block p{font-size:14px;color:var(--muted);line-height:1.65;margin-bottom:14px}
.sidebar-tel{display:flex;align-items:center;gap:8px;background:var(--navy);color:#fff;font-family:var(--fd);font-size:15px;font-weight:700;padding:12px 18px;border-radius:8px;margin-bottom:10px;transition:background .15s}
.sidebar-tel:hover{background:var(--navy2);color:#fff}
.sidebar-link{display:block;text-align:center;font-size:13px;font-weight:600;color:var(--muted);border:1.5px solid var(--border);border-radius:8px;padding:10px;transition:border-color .15s,color .15s}
.sidebar-link:hover{border-color:var(--red);color:var(--red)}
.sidebar-nav{list-style:none}
.sidebar-nav li a{display:flex;justify-content:space-between;align-items:center;padding:10px 0;font-size:14px;color:var(--text);border-bottom:1px solid var(--border);transition:color .15s}
.sidebar-nav li:last-child a{border-bottom:none}
.sidebar-nav li a::after{content:'→';color:var(--red);opacity:.6;font-size:12px}
.sidebar-nav li a:hover{color:var(--red)}
.sidebar-dark{background:var(--navy);border-color:transparent}
.sidebar-dark h3{color:#fff;border-color:rgba(255,255,255,.1)}
.sidebar-dark p{color:rgba(255,255,255,.55)}
.sidebar-dark .fc-field label{color:rgba(255,255,255,.65)}
.sidebar-dark .fc-hint{color:rgba(255,255,255,.55)}
.sidebar-dark .fc-error{color:#FCA5A5}

/* BLOG */
.blog-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
@media(max-width:640px){.blog-grid{grid-template-columns:1fr}}
.blog-card{background:#fff;border:1.5px solid var(--border);border-radius:14px;overflow:hidden;display:flex;flex-direction:column;transition:box-shadow .2s,border-color .2s}
.blog-card:hover{box-shadow:0 8px 32px rgba(0,0,0,.08);border-color:var(--red)}
.blog-card-img{aspect-ratio:16/9;overflow:hidden}
.blog-card-img img{width:100%;height:100%;object-fit:cover;transition:transform .35s}
.blog-card:hover .blog-card-img img{transform:scale(1.04)}
.blog-card-body{padding:24px;flex:1;display:flex;flex-direction:column}
.blog-card-date{font-size:12px;color:var(--muted);margin-bottom:10px}
.blog-card-title{font-family:var(--fd);font-size:20px;font-weight:700;color:var(--navy);margin-bottom:10px;line-height:1.2}
.blog-card-title a{color:inherit}
.blog-card-title a:hover{color:var(--red)}
.blog-card-excerpt{font-size:14px;color:var(--muted);line-height:1.65;flex:1}
.blog-card-link{display:inline-flex;gap:6px;font-size:13px;font-weight:600;color:var(--red);margin-top:16px}

/* CONTACT PAGE */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start}
@media(max-width:768px){.contact-grid{grid-template-columns:1fr}}
.contact-info-block{background:var(--off);border:1.5px solid var(--border);border-radius:14px;padding:32px}
.contact-info-item{display:flex;gap:14px;align-items:flex-start;padding:16px 0;border-bottom:1px solid var(--border)}
.contact-info-item:last-of-type{border-bottom:none}
.ci-icon{width:36px;height:36px;background:var(--navy);border-radius:8px;display:flex;align-items:center;justify-content:center;color:var(--gold);flex-shrink:0}
.ci-label{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:3px}
.ci-value{font-size:15px;font-weight:600;color:var(--text)}
.ci-value a{color:var(--navy);transition:color .15s}
.ci-value a:hover{color:var(--red)}
.hours-block{margin-top:24px}
.hours-block h3{font-family:var(--fd);font-size:17px;font-weight:700;color:var(--navy);margin-bottom:12px}
.hours-table{width:100%;border-collapse:collapse;font-size:14px}
.hours-table tr{border-bottom:1px solid var(--border)}
.hours-table td{padding:10px 0;color:var(--muted)}
.hours-table td:last-child{text-align:right;font-weight:600;color:var(--text)}

/* POST NAV */
.post-nav{display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--border);margin-top:56px;padding-top:32px;flex-wrap:wrap}
.post-nav a{font-size:14px;font-weight:500;color:var(--muted);max-width:280px;transition:color .15s}
.post-nav a:hover{color:var(--red)}

/* PAGINATION */
.pagination{margin-top:56px}
.pagination .nav-links{display:flex;gap:8px;flex-wrap:wrap}
.pagination .page-numbers{display:flex;align-items:center;justify-content:center;min-width:40px;height:40px;padding:0 14px;border:1.5px solid var(--border);border-radius:8px;font-size:14px;color:var(--muted);transition:border-color .15s,background .15s,color .15s}
.pagination .page-numbers:hover,.pagination .page-numbers.current{border-color:var(--navy);background:var(--navy);color:#fff}

/* 404 */
.not-found{text-align:center;padding:100px 24px}
.not-found .num{font-family:var(--fd);font-size:120px;font-weight:800;color:var(--red);opacity:.15;line-height:1}
.not-found h1{font-family:var(--fd);font-size:36px;font-weight:800;color:var(--navy);margin:16px 0 12px}
.not-found p{font-size:17px;color:var(--muted);margin-bottom:32px}
.not-found-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

/* WIDGET */
.widget{margin-bottom:20px}
.widget-title{font-family:var(--fd);font-size:15px;font-weight:700;color:var(--navy);margin-bottom:12px;padding-bottom:10px;border-bottom:1px solid var(--border)}

@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important}}

/* ════════════════════════════════════════════════════════════
   v4.0 TOEVOEGINGEN — banner, popup, cookie, pulse, stats, pricing
   ════════════════════════════════════════════════════════════ */

/* SEIZOENSBANNER */
/* Attentiebalk onder de hero. Kleuren komen uit de Customizer (inline). */
.ece-banner{padding:15px 0}
.ece-banner-inner{display:flex;align-items:center;justify-content:center;gap:10px 20px;flex-wrap:wrap;text-align:center}
.ece-banner-text{font-family:var(--fd);font-weight:700;font-size:15.5px;line-height:1.45}
.ece-banner-countdown{font-variant-numeric:tabular-nums;font-weight:700;font-size:14px;opacity:.9;background:rgba(255,255,255,.14);padding:4px 12px;border-radius:100px}
.ece-banner-link{display:inline-flex;align-items:center;gap:7px;font-family:var(--fd);font-weight:700;font-size:14px;padding:9px 18px;border-radius:100px;white-space:nowrap;transition:filter .15s,transform .15s;box-shadow:0 3px 12px rgba(0,0,0,.18)}
.ece-banner-link:hover{filter:brightness(1.12);transform:translateY(-1px)}
.ece-banner-link svg{transition:transform .15s}
.ece-banner-link:hover svg{transform:translateX(3px)}

@media(max-width:600px){
  .ece-banner{padding:13px 0}
  .ece-banner-text{font-size:14.5px}
  .ece-banner-inner{gap:9px}
  .ece-banner-link{width:100%;justify-content:center;padding:11px 18px}
}

/* PULSERENDE TELEFOONKNOP */
.header-tel.pulse{position:relative}
.header-tel.pulse::after{content:'';position:absolute;inset:-3px;border:2px solid var(--red);border-radius:10px;animation:tel-pulse 1.8s infinite}
@keyframes tel-pulse{0%{opacity:.7;transform:scale(1)}100%{opacity:0;transform:scale(1.08)}}

/* CHAT FLOAT KNOP */
.chat-float{position:fixed;bottom:24px;right:84px;z-index:298;display:flex;align-items:center;gap:8px;background:var(--navy);color:#fff;font-family:var(--fd);font-size:13px;font-weight:700;padding:13px 18px;border-radius:100px;box-shadow:0 4px 20px rgba(13,27,53,.35);transition:transform .2s}
.chat-float:hover{transform:scale(1.04);color:#fff}
@media(max-width:768px){.chat-float{bottom:96px;right:16px;padding:12px;border-radius:50%}.chat-float span,.chat-float{font-size:0}.chat-float svg{margin:0}}

/* POPUP */
.ece-popup-overlay{position:fixed;inset:0;background:rgba(13,27,53,.75);z-index:500;display:flex;align-items:center;justify-content:center;padding:20px;backdrop-filter:blur(2px)}
.ece-popup-overlay[hidden]{display:none}
.ece-popup-box{background:#fff;border-radius:16px;max-width:440px;width:100%;padding:36px 32px 28px;text-align:center;position:relative;box-shadow:0 24px 80px rgba(0,0,0,.4);animation:popup-in .25s ease}
@keyframes popup-in{from{opacity:0;transform:scale(.95) translateY(10px)}to{opacity:1;transform:scale(1) translateY(0)}}
.ece-popup-close{position:absolute;top:14px;right:14px;width:32px;height:32px;border-radius:50%;background:var(--off);border:none;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--muted);transition:background .15s}
.ece-popup-close:hover{background:var(--off2)}
.ece-popup-icon{width:56px;height:56px;background:var(--red);border-radius:14px;display:flex;align-items:center;justify-content:center;margin:0 auto 18px}
.ece-popup-box h3{font-family:var(--fd);font-size:22px;font-weight:800;color:var(--navy);margin-bottom:10px;line-height:1.25}
.ece-popup-box p{font-size:14px;color:var(--muted);line-height:1.65;margin-bottom:24px}
.ece-popup-btn{display:block;width:100%;background:var(--red);color:#fff;font-family:var(--fd);font-size:15px;font-weight:700;padding:15px;border-radius:10px;margin-bottom:12px;transition:background .15s}
.ece-popup-btn:hover{background:var(--reddk);color:#fff}
.ece-popup-dismiss{background:none;border:none;font-size:13px;color:var(--muted);cursor:pointer;text-decoration:underline;padding:4px}
.ece-popup-dismiss:hover{color:var(--text)}

/* COOKIE MELDING */
.ece-cookie{position:fixed;left:0;right:0;z-index:400;background:var(--navy);color:rgba(255,255,255,.85);padding:16px 20px;box-shadow:0 -4px 20px rgba(0,0,0,.2)}
.ece-cookie[hidden]{display:none}
.ece-cookie-bottom{bottom:0}
.ece-cookie-top{top:0;box-shadow:0 4px 20px rgba(0,0,0,.2)}
.ece-cookie-inner{max-width:1220px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.ece-cookie-inner p{font-size:13px;line-height:1.5;margin:0;flex:1;min-width:200px}
.ece-cookie-inner a{color:#fff;text-decoration:underline;font-weight:600}
.ece-cookie-btn{background:var(--red);color:#fff;border:none;font-family:var(--fd);font-size:13px;font-weight:700;padding:10px 22px;border-radius:8px;cursor:pointer;white-space:nowrap;transition:background .15s}
.ece-cookie-btn:hover{background:var(--reddk)}
@media(max-width:768px){.ece-cookie{left:8px;right:8px;bottom:calc(env(safe-area-inset-bottom,0px) + 76px);border-radius:14px;padding:14px 16px;box-shadow:0 8px 30px rgba(0,0,0,.35)}.ece-cookie-top{top:8px;bottom:auto}.ece-cookie-inner{flex-direction:column;align-items:stretch;gap:12px}.ece-cookie-inner p{min-width:0}.ece-cookie-btn{width:100%;padding:12px}}

/* STATS BALK (donker, herbruikbaar) */
.section-dark-stats{background:linear-gradient(160deg,var(--navy),var(--navy3));padding:64px 0}
.stats-bar-title{font-family:var(--fd);font-size:14px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.4);text-align:center;margin-bottom:36px}
.stats-bar-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
@media(max-width:768px){.stats-bar-grid{grid-template-columns:repeat(2,1fr)}}
.stats-bar-item{text-align:center;padding:0 12px}
.stats-bar-num{font-family:var(--fd);font-size:clamp(32px,5vw,48px);font-weight:800;color:#fff;line-height:1}
.stats-bar-label{font-size:14px;font-weight:600;color:rgba(255,255,255,.85);margin-top:8px}
.stats-bar-sub{font-size:12px;color:rgba(255,255,255,.45);margin-top:3px}

/* PRIJSTABEL */
.pricing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;align-items:start}
@media(max-width:900px){.pricing-grid{grid-template-columns:1fr;max-width:420px;margin:0 auto}}
.pricing-card{background:#fff;border:1.5px solid var(--border);border-radius:16px;padding:32px 28px;position:relative;transition:transform .2s,box-shadow .2s}
.pricing-card.featured{border-color:var(--red);box-shadow:0 16px 48px rgba(220,38,38,.15);transform:scale(1.04)}
@media(max-width:900px){.pricing-card.featured{transform:none}}
.pricing-badge{position:absolute;top:-13px;left:50%;transform:translateX(-50%);background:var(--red);color:#fff;font-family:var(--fd);font-size:11px;font-weight:700;letter-spacing:.04em;padding:5px 16px;border-radius:100px;white-space:nowrap}
.pricing-name{font-family:var(--fd);font-size:20px;font-weight:800;color:var(--navy);margin-bottom:6px}
.pricing-sub{font-size:13px;color:var(--muted);margin-bottom:20px;min-height:36px}
.pricing-price{display:flex;align-items:baseline;gap:2px;margin-bottom:24px;padding-bottom:24px;border-bottom:1px solid var(--border)}
.pricing-currency{font-family:var(--fd);font-size:20px;font-weight:700;color:var(--text)}
.pricing-amount{font-family:var(--fd);font-size:40px;font-weight:800;color:var(--text);line-height:1}
.pricing-amount-text{font-size:24px}
.pricing-features{list-style:none;display:flex;flex-direction:column;gap:12px;margin-bottom:28px}
.pricing-features li{display:flex;align-items:flex-start;gap:10px;font-size:13.5px;color:var(--text);line-height:1.5}
.pricing-features li svg{color:var(--green);flex-shrink:0;margin-top:2px}
.pricing-footnote{text-align:center;font-size:12px;color:var(--muted);margin-top:32px}

/* LOGOS SECTIE */
.logos-strip{padding:48px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.logos-title{text-align:center;font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:28px}
.logos-grid{display:flex;align-items:center;justify-content:center;gap:48px;flex-wrap:wrap;opacity:.55}
.logos-grid img{max-height:32px;width:auto;filter:grayscale(1)}

/* GARANTIE BLOK */
.guarantee-block{display:flex;align-items:center;gap:20px;background:var(--off);border:1.5px dashed var(--border);border-radius:14px;padding:24px 28px;margin:32px 0}
.guarantee-icon{width:48px;height:48px;background:var(--navy);border-radius:12px;display:flex;align-items:center;justify-content:center;color:var(--gold);flex-shrink:0}
.guarantee-block h4{font-family:var(--fd);font-size:16px;font-weight:700;color:var(--navy);margin-bottom:4px}
.guarantee-block p{font-size:13px;color:var(--muted);margin:0}

/* VERGELIJKINGSTABEL */
.compare-table{width:100%;border-collapse:collapse;font-size:14px;margin:24px 0}
.compare-table th,.compare-table td{padding:14px 16px;text-align:left;border-bottom:1px solid var(--border)}
.compare-table th{font-family:var(--fd);font-weight:700;color:var(--navy);background:var(--off)}
.compare-table td:not(:first-child),.compare-table th:not(:first-child){text-align:center}
.compare-table .yes{color:var(--green)}
.compare-table .no{color:var(--muted);opacity:.4}

/* COUNTDOWN BANNER (dienst-pagina urgentie) */
.urgency-banner{background:linear-gradient(135deg,var(--red),var(--reddk));border-radius:14px;padding:24px 28px;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;margin:32px 0}
.urgency-banner-text{color:#fff;font-family:var(--fd);font-weight:700;font-size:15px}
.urgency-banner-sub{color:rgba(255,255,255,.8);font-size:13px;margin-top:2px}
.urgency-banner-btn{background:#fff;color:var(--red);font-family:var(--fd);font-weight:800;font-size:14px;padding:12px 22px;border-radius:8px;white-space:nowrap}

/* TESTIMONIAL QUOTE BLOK (los te gebruiken in entry-content) */
.quote-block{background:var(--off);border-left:4px solid var(--red);border-radius:0 12px 12px 0;padding:24px 28px;margin:28px 0}
.quote-block p{font-size:16px;font-style:italic;color:var(--navy);line-height:1.7;margin-bottom:10px}
.quote-block cite{font-size:13px;font-weight:700;color:var(--muted);font-style:normal}

/* STICKY CTA (binnen content, voor lange pagina's) */
.inline-cta{background:var(--navy);border-radius:14px;padding:32px;text-align:center;margin:40px 0}
.inline-cta h3{font-family:var(--fd);font-size:22px;font-weight:800;color:#fff;margin-bottom:10px}
.inline-cta p{font-size:14px;color:rgba(255,255,255,.65);margin-bottom:20px;max-width:480px;margin-left:auto;margin-right:auto}

/* ═══════════════════════════════════════════════
   KENNISBANK
═══════════════════════════════════════════════ */
.kb-cat-btn{padding:8px 18px;border-radius:30px;border:1.5px solid var(--border);background:#fff;font-size:13px;font-weight:700;color:var(--muted);cursor:pointer;transition:all .2s;}
.kb-cat-btn:hover,.kb-cat-btn.active{background:var(--navy);color:#fff;border-color:var(--navy);}
.kb-content h2{font-size:25px;font-weight:800;color:var(--navy);margin:36px 0 12px;line-height:1.3;}
.kb-content h3{font-size:20px;font-weight:700;color:var(--navy);margin:26px 0 8px;line-height:1.35;}
.kb-content p{font-size:16px;line-height:1.8;color:var(--muted);margin-bottom:16px;}
.kb-content ul,.kb-content ol{padding-left:20px;margin-bottom:16px;}
.kb-content li{font-size:15px;line-height:1.75;color:var(--muted);margin-bottom:6px;}
.kb-content strong{color:var(--text);}
.kb-content table{width:100%;border-collapse:collapse;margin:24px 0;font-size:14px;}
.kb-content table th{background:var(--navy);color:#fff;padding:10px 14px;text-align:left;font-weight:700;}
.kb-content table td{padding:10px 14px;border-bottom:1px solid var(--border);}
.kb-content table tr:hover td{background:var(--off);}
.kb-content blockquote{border-left:4px solid var(--navy);padding:16px 20px;background:var(--off);border-radius:0 10px 10px 0;margin:24px 0;font-size:16px;font-style:italic;color:var(--text);}

/* ═══════════════════════════════════════════════
   AREA TAGS
═══════════════════════════════════════════════ */
.area-tag{display:inline-block;padding:5px 14px;background:var(--off);border:1.5px solid var(--border);border-radius:20px;font-size:12.5px;font-weight:600;color:var(--text);transition:all .2s;}
.area-tag:hover,.area-tag.primary{background:var(--navy);color:#fff;border-color:var(--navy);}

/* ═══════════════════════════════════════════════
   COMPARE TABLE
═══════════════════════════════════════════════ */
.compare-table{width:100%;border-collapse:collapse;font-size:14px;min-width:520px;}
.compare-table thead tr{background:var(--navy);}
.compare-table th{padding:12px 16px;color:#fff;font-weight:700;text-align:left;background:var(--navy);}
.compare-table td{padding:11px 16px;border-bottom:1px solid var(--border);color:var(--muted);}
.compare-table tr:last-child td{border-bottom:none;}
.compare-table tbody tr:hover td{background:var(--off);}
.compare-table td:first-child{color:var(--text);}
@media(max-width:640px){.compare-table{display:block;width:100%;min-width:0;overflow-x:auto;-webkit-overflow-scrolling:touch}.compare-table thead,.compare-table tbody{display:table;width:100%;min-width:460px}}

/* ═══════════════════════════════════════════════
   PROCESS GRID
═══════════════════════════════════════════════ */
.process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:48px;}
.process-step{text-align:center;}
.process-num{width:48px;height:48px;border-radius:50%;background:var(--navy);color:#fff;font-family:var(--fd);font-weight:900;font-size:20px;display:flex;align-items:center;justify-content:center;margin:0 auto 14px;}
.process-num.active{background:var(--red);}
.process-step h3{font-size:15px;font-weight:700;color:var(--navy);margin-bottom:8px;}
.process-step p{font-size:13.5px;color:var(--muted);line-height:1.6;}
@media(max-width:768px){.process-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:480px){.process-grid{grid-template-columns:1fr;}}

/* ═══════════════════════════════════════════════
   REVIEW SCORE BAR
═══════════════════════════════════════════════ */
.review-score-bar{display:flex;align-items:center;gap:24px;background:var(--off);border:1.5px solid var(--border);border-radius:14px;padding:20px 24px;flex-wrap:wrap;}
.rsb-num{font-family:var(--fd);font-size:48px;font-weight:900;color:var(--navy);line-height:1;}
.rsb-meta{flex:1;min-width:140px;}
.rsb-stars{font-size:20px;color:#f59e0b;margin-bottom:4px;}
.rsb-meta strong{display:block;font-size:15px;color:var(--text);}
.rsb-meta span{font-size:13px;color:var(--muted);}
.rsb-btn{display:inline-flex;align-items:center;padding:10px 20px;background:var(--navy);color:#fff;border-radius:8px;font-size:14px;font-weight:700;text-decoration:none;white-space:nowrap;}
.rsb-btn:hover{background:var(--navy-dark,#0f2d5e);}

/* ═══════════════════════════════════════════════
   WHY GRID
═══════════════════════════════════════════════ */
.why-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start;}
.why-list{display:flex;flex-direction:column;gap:20px;}
.why-item{display:flex;gap:16px;align-items:flex-start;}
.why-item-num{width:36px;height:36px;border-radius:50%;background:var(--navy);color:#fff;font-family:var(--fd);font-weight:800;font-size:15px;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:2px;}
.why-item-body h4,.why-item-body h3{font-size:15px;font-weight:700;color:var(--navy);margin-bottom:4px;}
.why-item-body p{font-size:14px;color:var(--muted);line-height:1.65;margin:0;}
.why-visual{background:var(--navy);border-radius:20px;padding:36px;}
.why-num{font-family:var(--fd);font-size:64px;font-weight:900;color:#fff;line-height:1;}
.why-label{font-size:15px;color:rgba(255,255,255,.75);margin-top:6px;line-height:1.4;}
.why-since{font-size:12px;color:rgba(255,255,255,.45);margin-top:8px;}
.why-divider{height:1px;background:rgba(255,255,255,.12);margin:20px 0;}
.why-certs{display:flex;flex-direction:column;gap:10px;}
.why-cert{display:flex;align-items:center;gap:10px;font-size:13.5px;color:rgba(255,255,255,.85);}
.why-cert svg{color:#6ee7b7;flex-shrink:0;}
@media(max-width:768px){.why-grid{grid-template-columns:1fr;gap:32px;}}

/* ═══════════════════════════════════════════════
   SERVICE LINK
═══════════════════════════════════════════════ */
.service-link{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:700;color:var(--navy);margin-top:12px;}

/* ═══════════════════════════════════════════════
   BREADCRUMB
═══════════════════════════════════════════════ */
.breadcrumb{display:flex;align-items:center;gap:8px;font-size:13px;color:rgba(255,255,255,.6);margin-bottom:12px;}
.breadcrumb a{color:rgba(255,255,255,.7);text-decoration:none;}
.breadcrumb a:hover{color:#fff;}
.breadcrumb span:not(:first-child){color:rgba(255,255,255,.4);}

/* ═══════════════════════════════════════════════
   RESPONSIVE - TWO COLUMN GRIDS
═══════════════════════════════════════════════ */
@media(max-width:900px){
  .why-grid,[style*="grid-template-columns:1fr 1fr"]{grid-template-columns:1fr!important;}
}

/* ═══════════════════════════════════════════════
   PERFORMANCE - LAZY IMAGES
═══════════════════════════════════════════════ */
img{height:auto;max-width:100%;}
img:not([loading]){loading:lazy;}

/* ═══ KENNISBANK / HELP CENTER ═══ */
.kb-hero2{background:linear-gradient(160deg,var(--navy),#16223f);padding:56px 0 64px;text-align:center}
.kb-hero2 .breadcrumb{justify-content:center}
.kb-hero2 .breadcrumb a,.kb-hero2 .breadcrumb span{color:rgba(255,255,255,.6)}
.kb-hero2 h1{color:#fff;font-size:clamp(28px,5vw,38px);margin:10px 0 10px}
.kb-lead{color:rgba(255,255,255,.72);margin:0 auto 28px;max-width:560px;font-size:16px}
.kb-searchbar{position:relative;max-width:600px;margin:0 auto;padding:0 20px}
.kb-searchbar>svg{position:absolute;left:38px;top:50%;transform:translateY(-50%);color:#9aa4b2;pointer-events:none}
.kb-searchbar input{width:100%;padding:17px 18px 17px 52px;border:0;border-radius:14px;font-size:16px;box-shadow:0 12px 40px rgba(0,0,0,.25);outline:none;font-family:var(--fb)}
.kb-db{max-width:1080px;margin:0 auto;padding:52px 24px 72px}
.kb-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px}
.kb-card{display:block;background:#fff;border:1px solid var(--border);border-radius:var(--radius-card,16px);padding:26px;text-decoration:none;transition:transform .18s,box-shadow .18s,border-color .18s}
.kb-card:hover{transform:translateY(-4px);box-shadow:0 16px 40px rgba(10,22,40,.10);border-color:var(--navy)}
.kb-card-ic{width:52px;height:52px;border-radius:14px;display:flex;align-items:center;justify-content:center;background:var(--off);color:var(--navy);margin-bottom:16px}
.kb-card h3{font-size:18px;font-weight:800;color:var(--heading);margin:0 0 6px}
.kb-card p{font-size:14px;color:var(--muted);margin:0 0 14px;line-height:1.5}
.kb-card-meta{display:flex;align-items:center;justify-content:space-between}
.kb-card-count{font-size:13px;font-weight:700;color:var(--muted)}
.kb-card-go{color:var(--navy);display:inline-flex}
.kb-sub-h{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);margin:26px 0 4px}
.kb-item{display:flex;align-items:center;gap:12px;padding:14px 14px;border-bottom:1px solid var(--border);text-decoration:none;color:var(--text);transition:background .12s,padding-left .12s}
.kb-item:hover{background:var(--off);padding-left:20px}
.kb-item .kb-ic{color:var(--navy);flex-shrink:0}
.kb-item .kb-t{font-weight:600;font-size:15px;flex:1;line-height:1.35}
.kb-item .kb-tag{font-size:11px;font-weight:700;color:var(--muted);background:var(--off);border:1px solid var(--border);border-radius:16px;padding:2px 10px;white-space:nowrap}
.kb-item .kb-arrow{color:#c2c8d0;flex-shrink:0}
.kb-results{margin-top:8px}
.kb-empty{display:none;text-align:center;color:var(--muted);padding:48px 20px;font-size:15px}
.kb-cat-side h3{font-size:13px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:0 0 12px}
.kb-cat-side a{display:block;padding:9px 12px;border-radius:8px;text-decoration:none;color:var(--text);font-weight:600;font-size:14px}
.kb-cat-side a:hover{background:var(--off)}
.kb-cat-side a.active{background:var(--navy);color:#fff}
@media(max-width:600px){.kb-searchbar>svg{left:34px}}
/* ═══ KB artikel: inhoudsopgave, feedback ═══ */
.kb-toc{display:flex;flex-direction:column;gap:2px}
.kb-toc a{display:block;padding:6px 10px;border-left:2px solid var(--border);color:var(--muted);text-decoration:none;font-size:13.5px;line-height:1.4;transition:all .12s}
.kb-toc a:hover{color:var(--navy);border-left-color:var(--navy)}
.kb-toc a.sub{padding-left:22px;font-size:13px}
.kb-toc a.active{color:var(--navy);border-left-color:var(--navy);font-weight:600}
.kb-feedback{margin-top:48px;padding:24px;background:var(--off);border:1px solid var(--border);border-radius:14px;text-align:center}
.kb-feedback p{margin:0 0 14px;font-weight:700;color:var(--heading)}
.kb-fb-btns{display:flex;gap:10px;justify-content:center}
.kb-fb-btns button{border:1px solid var(--border);background:#fff;color:var(--text);padding:9px 22px;border-radius:30px;font-weight:600;font-size:14px;cursor:pointer;display:inline-flex;align-items:center;gap:7px;transition:all .15s;font-family:var(--fb)}
.kb-fb-btns button:hover{border-color:var(--navy);background:var(--navy);color:#fff}
.kb-print{display:inline-flex;align-items:center;gap:8px;width:100%;justify-content:center;border:1px solid var(--border);background:#fff;color:var(--text);padding:11px;border-radius:8px;font-weight:600;font-size:14px;cursor:pointer;text-decoration:none;font-family:var(--fb)}
.kb-print:hover{border-color:var(--navy);color:var(--navy)}
@media print{.site-header,.top-bar,.urg-bar,.page-sidebar,.kb-feedback,.cta-band,.site-footer,.mobile-sticky-bar,.wa-float,.chat-float{display:none!important}.page-layout{display:block}.entry-content{max-width:none}}
/* ═══ BLOG ═══ */
.blog-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:26px}
.blog-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--border);border-radius:14px;overflow:hidden;text-decoration:none;color:var(--text);transition:transform .18s,box-shadow .18s,border-color .18s}
.blog-card:hover{transform:translateY(-4px);box-shadow:0 16px 40px rgba(10,22,40,.1);border-color:var(--navy)}
.blog-card-img{aspect-ratio:16/10;overflow:hidden;background:var(--off)}
.blog-card-img img{width:100%;height:100%;object-fit:cover;display:block}
.blog-card-noimg{display:flex;align-items:center;justify-content:center;color:#c6ccd6}
.blog-card-body{padding:22px;display:flex;flex-direction:column;flex:1}
.blog-card-cat{align-self:flex-start;font-size:11px;font-weight:700;color:var(--navy);background:var(--off);border:1px solid var(--border);border-radius:20px;padding:3px 10px;margin-bottom:12px}
.blog-card-body h3{font-size:18px;font-weight:800;color:var(--heading);margin:0 0 8px;line-height:1.3}
.blog-card-body p{font-size:14px;color:var(--muted);line-height:1.55;margin:0 0 16px;flex:1}
.blog-card-meta{display:flex;align-items:center;justify-content:space-between;font-size:13px;color:var(--muted)}
.blog-pagination{display:flex;gap:8px;justify-content:center;margin-top:44px}
.blog-pagination a,.blog-pagination span{padding:8px 14px;border:1px solid var(--border);border-radius:8px;text-decoration:none;color:var(--text);font-weight:600}
.blog-pagination .current{background:var(--navy);color:#fff;border-color:var(--navy)}
/* ═══ Handleiding-download knop ═══ */
.kb-download{display:inline-flex;align-items:center;gap:10px;background:var(--navy);color:#fff;padding:13px 22px;border-radius:10px;text-decoration:none;font-weight:700;font-size:15px;transition:filter .15s}
.kb-download:hover{filter:brightness(1.12)}
.kb-download svg{flex-shrink:0}

/* Reviews klikbaar naar Google: links behouden de opmaak van hun oorspronkelijke element */
a.top-badge{text-decoration:none;transition:background .15s}
a.top-badge:hover{background:rgba(255,255,255,.16)}
a.hero-proof-item{text-decoration:none;color:rgba(255,255,255,.65);transition:color .15s}
a.hero-proof-item:hover{color:#fff}
a.trust-item{text-decoration:none}
a.trust-item:hover .trust-text strong{text-decoration:underline}
a.stats-bar-item{display:block;text-decoration:none}
a.stats-bar-item:hover .stats-bar-num{text-decoration:underline}
a.rsb-num{display:block;text-decoration:none}
a.rsb-stars{display:block;text-decoration:none;color:var(--gold)}
a.review-stars{display:block;text-decoration:none;color:var(--gold)}
a.review-stars:hover{filter:brightness(1.12)}

/* Kennisbank: inhoudsopgave bovenaan het artikel (vooral voor mobiel) */
.kb-toc-mobile{display:none;margin:0 0 28px;border:1.5px solid var(--border);border-radius:12px;background:var(--off);overflow:hidden}
.kb-toc-mobile summary{cursor:pointer;padding:14px 16px;font-weight:700;color:var(--navy);font-size:15px;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:10px}
.kb-toc-mobile summary::-webkit-details-marker{display:none}
.kb-toc-mobile summary::after{content:"";width:8px;height:8px;border-right:2px solid var(--navy);border-bottom:2px solid var(--navy);transform:rotate(45deg);transition:transform .18s;flex-shrink:0}
.kb-toc-mobile[open] summary::after{transform:rotate(-135deg)}
.kb-toc-mobile .kb-toc{padding:0 12px 12px}
@media(max-width:900px){.kb-toc-mobile{display:block}}

/* Kennisbank-artikel: iets grotere kopteksten */
.single-kennisbank .entry-content h2{font-size:31px;margin:52px 0 16px}
.single-kennisbank .entry-content h3{font-size:22px;margin:34px 0 12px}
@media(max-width:600px){.single-kennisbank .entry-content h2{font-size:26px}.single-kennisbank .entry-content h3{font-size:20px}}

/* Hero-proof: 1 regel op desktop, netjes afbreken op smalle schermen */
.hero-proof-item svg{flex-shrink:0}
@media(max-width:1100px){.hero-proof{gap:14px}.hero-proof-item{font-size:12.5px}}
@media(max-width:820px){.hero-proof{flex-wrap:wrap;gap:12px 18px}}

/* Google-reviews: echte profielfoto netjes rond tonen */
img.review-avatar{border-radius:50%;object-fit:cover;padding:0;background:none;display:block}

/* ============================================================
   RESPONSIVE HERSTEL — samenhangende mobiele regels
   Staat onderaan zodat deze de eerdere regels netjes overschrijven.
   ============================================================ */

/* Tablet en kleiner */
@media(max-width:768px){
  .hero{padding:48px 0 56px}
  .hero h1{font-size:clamp(30px,7vw,42px);line-height:1.12;margin-bottom:16px}
  .hero-sub{font-size:16px;line-height:1.6;margin-bottom:28px;max-width:none}
  .hero-badge{font-size:11px;padding:4px 12px;margin-bottom:16px}
  .hero-actions{gap:10px;margin-bottom:32px}
  .hero-actions .btn-primary,.hero-actions .btn-sec{width:100%;justify-content:center}
  .hero-proof{flex-wrap:wrap;gap:10px 16px}

  .page-hero{padding:56px 0 40px}
  .page-hero h1{font-size:clamp(26px,6.5vw,36px)}
  .page-hero-sub{font-size:15px}

  /* Topbalk: minder proppen, nette uitlijning */
  .top-bar-inner{justify-content:center;gap:6px 14px;row-gap:4px}
  .urg-bar{font-size:11px;padding:6px 14px;line-height:1.4}
  .urg-bar a{margin-left:8px}

  /* Sectiekoppen niet te groot */
  .sec-title{font-size:clamp(24px,5.5vw,32px)}
}

/* Telefoon */
@media(max-width:600px){
  .hero h1{font-size:clamp(27px,8vw,34px)}
  .hero-sub{font-size:15px}
  .wrap{padding-left:18px;padding-right:18px}

  /* Topbalk: badges verbergen, alleen kerninfo houden */
  .top-badges{display:none}
  .top-bar{padding:5px 0}
  .top-bar-inner{font-size:11px}

  /* Footer: alles onder elkaar, gecentreerd, niets tegen elkaar */
  .footer-grid{grid-template-columns:1fr;gap:28px;margin-bottom:36px}
  .footer-col ul{padding:0}

  .footer-bottom{flex-direction:column;align-items:flex-start;gap:8px;padding-top:20px}

  /* Cijferbalk leesbaar houden */
  .rsb-num{font-size:44px}
  .review-score-bar{gap:14px;padding:20px}
}

/* Heel smalle telefoons */
@media(max-width:380px){
  .hero h1{font-size:26px}
  .stats-bar-grid,.process-grid{grid-template-columns:1fr}
}

/* Mobiel menu: submenu's inklapbaar */
.mobile-menu .menu-item-has-children{position:relative}
.mobile-menu .submenu-toggle{position:absolute;top:0;right:0;width:52px;height:52px;display:flex;align-items:center;justify-content:center;background:none;border:none;color:var(--navy);cursor:pointer}
.mobile-menu .submenu-toggle svg{transition:transform .2s}
.mobile-menu li.open > .submenu-toggle svg{transform:rotate(180deg)}
.mobile-menu .menu-item-has-children > a{padding-right:52px}
.mobile-menu .sub-menu{max-height:0;overflow:hidden;padding:0 0 0 16px;transition:max-height .25s ease}
.mobile-menu li.open > .sub-menu{max-height:600px;padding:2px 0 6px 16px}
.mobile-menu .sub-menu a{border-bottom:none;padding:8px 0;font-size:14px;font-weight:500;color:var(--muted)}

/* Sticky contactbalk: compacter */
@media(max-width:600px){
  .sticky-bar{padding:8px 12px calc(8px + env(safe-area-inset-bottom,0px))}
  .sticky-bar-inner{gap:8px}
  .sticky-tel,.sticky-offerte{padding:11px 8px;font-size:13px;border-radius:9px}
}

/* Hero-knoppen op mobiel: niet manshoog */
@media(max-width:600px){
  .hero-actions .btn-primary,.hero-actions .btn-sec{padding:14px 20px;font-size:15px;border-radius:10px;width:100%}
  .hero-actions .btn-primary svg,.hero-actions .btn-sec svg{width:18px;height:18px}
}

/* ============================================================
   AUDIT SLOT — laatste responsive-correcties (hele site)
   ============================================================ */

/* Grote cijfers nooit laten overlopen */
.why-num{font-size:clamp(40px,9vw,64px)}
.not-found .num{font-size:clamp(64px,22vw,120px)}
.rsb-num{font-size:clamp(38px,10vw,52px)}

@media(max-width:768px){
  /* Alle hoofdknoppen goed aantikbaar (min 46px hoog) */
  .btn-primary,.btn-sec,.header-cta{font-size:15px;padding:13px 22px}
  .btn-primary,.btn-sec{min-height:48px}

  /* Sectie-tussenruimte compacter, tekst rustiger */
  section{padding-top:44px;padding-bottom:44px}
  .sec-sub{font-size:15px;line-height:1.6}
  .sec-label{font-size:11px}

  /* CTA-band netjes gestapeld en gecentreerd */
  .cta-band{padding:48px 0}
  .cta-band-inner{flex-direction:column;text-align:center;gap:22px}
  .cta-band-inner .btn-primary,.cta-band-inner .btn-sec{width:100%;justify-content:center}

  /* Kennisbank-kaarten: 1 kolom i.p.v. krappe minmax */
  .kb-cards{grid-template-columns:1fr}

  /* Reviewscore-balk netjes stapelen */
  .review-score-bar{flex-direction:column;align-items:flex-start;text-align:left}
}

@media(max-width:600px){
  /* Body iets kleiner zodat lange zinnen niet overlopen */
  body{font-size:15.5px}
  /* Alle losse call-to-action knoppen volle breedte op telefoon */
  .btn-primary,.btn-sec{width:100%;justify-content:center}
  /* Blog- en dienstenkaarten met wat meer lucht */
  .services-grid,.blog-grid,.reviews-grid{gap:16px}
  /* Voorkom horizontale overflow door lange woorden/links */
  a,p,h1,h2,h3,li{overflow-wrap:break-word;word-break:break-word}
}

@media(max-width:380px){
  .btn-primary,.btn-sec,.header-cta{font-size:14px;padding:12px 16px}
  .why-num{font-size:38px}
}

/* ============================================================
   ONDERKANT MOBIEL — stapeling en overflow definitief oplossen
   ============================================================ */
@media(max-width:768px){
  /* Cookiebanner: compact, binnen het scherm, boven de sticky-bar */
  .ece-cookie{
    left:8px;right:8px;
    bottom:calc(env(safe-area-inset-bottom,0px) + 8px);
    padding:12px 14px;border-radius:12px;
  }
  .sticky-bar.zichtbaar ~ .ece-cookie{bottom:calc(env(safe-area-inset-bottom,0px) + 72px)}
  .ece-cookie-inner{flex-direction:column;align-items:stretch;gap:10px}
  .ece-cookie-inner p{font-size:12.5px;min-width:0;line-height:1.45}
  .ece-cookie-btn{width:100%;padding:11px}

  /* De zwevende knoppen zakken mee zolang de sticky-balk verborgen is.
     Zodra de balk verschijnt (.zichtbaar), schuiven ze er netjes bovenuit. */
  .wa-float,.chat-float,.ece-cookie{transition:bottom .28s ease}

  /* WhatsApp: standaard boven de chatknop */
  .wa-float{bottom:calc(env(safe-area-inset-bottom,0px) + 80px);right:14px;width:48px;height:48px}
  .sticky-bar.zichtbaar ~ .wa-float{bottom:calc(env(safe-area-inset-bottom,0px) + 148px)}

  /* Geen chatknop actief? Dan neemt WhatsApp die onderste plek in. */
  .wa-float.solo{bottom:calc(env(safe-area-inset-bottom,0px) + 20px)}
  .sticky-bar.zichtbaar ~ .wa-float.solo{bottom:calc(env(safe-area-inset-bottom,0px) + 88px)}

  /* Chat-knop: rond icoon rechtsonder, NIET buiten het scherm */
  .chat-float{
    bottom:calc(env(safe-area-inset-bottom,0px) + 20px);right:14px;left:auto;
    padding:12px;border-radius:50%;gap:0;
  }
  .sticky-bar.zichtbaar ~ .chat-float{bottom:calc(env(safe-area-inset-bottom,0px) + 88px)}
  .chat-float span{display:none}
  .chat-float svg{margin:0}
}

/* Extra kleine schermen: cookiebanner niet te hoog laten worden */
@media(max-width:400px){
  .ece-cookie-inner p{font-size:12px}
}

/* Downloadknop in kennisbank-artikelen: altijd navy met witte tekst,
   ook als WordPress zijn eigen blauwe linkkleur meegeeft. */
.entry-content a.kb-download,
.kb-content a.kb-download,
a.kb-download{
  display:inline-flex;align-items:center;gap:10px;
  background:var(--navy);color:#fff;
  padding:13px 22px;border-radius:10px;
  text-decoration:none;font-weight:700;font-size:15px;
  border:none;transition:filter .15s;
}
.entry-content a.kb-download:hover,
.kb-content a.kb-download:hover,
a.kb-download:hover{filter:brightness(1.15);color:#fff;text-decoration:none}
.entry-content a.kb-download:visited,
a.kb-download:visited{color:#fff}
a.kb-download svg{flex-shrink:0;stroke:currentColor}

/* ============================================================
   VACATURES
   ============================================================ */
.vac-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px;margin-bottom:56px}
.vac-card{display:flex;flex-direction:column;gap:10px;background:#fff;border:1.5px solid var(--border);border-radius:14px;padding:26px;transition:border-color .15s,box-shadow .15s,transform .15s}
.vac-card:hover{border-color:var(--navy);box-shadow:0 8px 30px rgba(13,27,53,.09);transform:translateY(-2px)}
.vac-card-top{display:flex}
.vac-status{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:4px 10px;border-radius:100px}
.vac-status.open{background:#dcfce7;color:#166534}
.vac-status.dicht{background:#FEE2E2;color:var(--red)}
.vac-card-title{font-family:var(--fd);font-size:19px;font-weight:800;color:var(--navy);margin:0;line-height:1.3}
.vac-card-sub{font-size:14px;color:var(--muted);line-height:1.6;margin:0}
.vac-meta{list-style:none;display:flex;flex-wrap:wrap;gap:6px 16px;padding:0;margin:0}
.vac-meta li{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--muted)}
.vac-card-link{display:inline-flex;align-items:center;gap:7px;margin-top:auto;padding-top:8px;font-family:var(--fd);font-size:14px;font-weight:700;color:var(--red)}
.vac-card:hover .vac-card-link svg{transform:translateX(3px)}
.vac-card-link svg{transition:transform .15s}

.vac-hero-meta{list-style:none;display:flex;flex-wrap:wrap;gap:8px 22px;padding:0;margin:16px 0 0}
.vac-hero-meta li{display:flex;align-items:center;gap:7px;font-size:14px;color:rgba(255,255,255,.75)}

.vac-melding{display:flex;gap:12px;align-items:flex-start;background:#fef3c7;border:1.5px solid #fcd34d;color:#78350f;border-radius:12px;padding:16px 18px;margin-bottom:28px}
.vac-melding svg{flex-shrink:0;margin-top:1px}
.vac-melding strong{display:block;font-size:15px;margin-bottom:2px}
.vac-melding span{font-size:14px;line-height:1.6}

.vac-solliciteer{background:var(--off);border:1.5px solid var(--border);border-radius:14px;padding:28px;margin-top:40px}
.vac-solliciteer h2{font-family:var(--fd);font-size:22px;font-weight:800;color:var(--navy);margin:0 0 8px}
.vac-solliciteer p{font-size:15px;color:var(--muted);line-height:1.7;margin:0 0 20px;max-width:560px}
.vac-solliciteer-acties{display:flex;flex-wrap:wrap;gap:10px}
.vac-solliciteer-acties .btn-sec{background:#fff;color:var(--navy);border:1.5px solid var(--border)}

.vac-side-lijst{list-style:none;padding:0;margin:0}
.vac-side-lijst li{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid var(--border);font-size:14px}
.vac-side-lijst li:last-child{border-bottom:none}
.vac-side-lijst span{color:var(--muted)}
.vac-side-lijst strong{color:var(--text);text-align:right}

.vac-open-sol{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:24px;background:var(--navy);border-radius:16px;padding:32px}
.vac-open-sol h2{font-family:var(--fd);font-size:24px;font-weight:800;color:#fff;margin:0 0 6px}
.vac-open-sol p{font-size:15px;color:rgba(255,255,255,.7);line-height:1.65;margin:0;max-width:460px}
.vac-open-sol-acties{display:flex;flex-wrap:wrap;gap:10px}
.vac-open-sol-acties .btn-sec{color:#fff;border:1.5px solid rgba(255,255,255,.3);background:rgba(255,255,255,.08)}

@media(max-width:768px){
  .vac-grid{grid-template-columns:1fr;gap:14px}
  .vac-open-sol{flex-direction:column;align-items:flex-start;padding:26px}
  .vac-open-sol-acties{width:100%}
  .vac-open-sol-acties .btn-primary,.vac-open-sol-acties .btn-sec{width:100%;justify-content:center}
  .vac-solliciteer{padding:22px}
  .vac-solliciteer-acties .btn-primary,.vac-solliciteer-acties .btn-sec{width:100%;justify-content:center}
}



/* Vacatures: compacte voordelenrij onder de lijst */
.vac-voordelen{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px}
.vac-voordeel{display:flex;align-items:center;gap:14px;background:#fff;border:1.5px solid var(--border);border-radius:12px;padding:16px 18px}
.vac-voordeel-icoon{width:40px;height:40px;border-radius:10px;background:linear-gradient(135deg,var(--navy),var(--navy3));color:#fff;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.vac-voordeel span{font-family:var(--fd);font-size:14.5px;font-weight:700;color:var(--navy);line-height:1.35}

/* Openstaande vacature laten opvallen */
.vac-card.is-open{border-color:var(--navy);box-shadow:0 4px 20px rgba(13,27,53,.07)}
.vac-card.is-dicht{opacity:.65}
.vac-card.is-dicht:hover{border-color:var(--border);box-shadow:none;transform:none}
.vac-card.is-open .vac-card-title{color:var(--navy)}

@media(max-width:600px){
  .vac-voordelen{grid-template-columns:1fr}
  .vac-voordeel{padding:14px 16px}
}

/* ============================================================
   BLOK-EDITOR — opmaak voor blokken in de pagina-inhoud
   ============================================================ */

/* Brede en volle uitlijning binnen een gewone tekstkolom */
.entry-content > .alignwide{width:min(1120px,92vw);margin-left:50%;transform:translateX(-50%)}
.entry-content > .alignfull{width:100vw;margin-left:50%;transform:translateX(-50%);max-width:none}
.entry-content .alignleft{float:left;margin:6px 24px 16px 0}
.entry-content .alignright{float:right;margin:6px 0 16px 24px}
.entry-content .aligncenter{margin-left:auto;margin-right:auto;text-align:center}

/* Afbeeldingen */
.entry-content .wp-block-image{margin:28px 0}
.entry-content .wp-block-image img{border-radius:12px;display:block;height:auto;max-width:100%}
.entry-content .wp-block-image figcaption{font-size:13px;color:var(--muted);text-align:center;margin-top:8px}

/* Kolommen */
.entry-content .wp-block-columns{gap:28px;margin:28px 0}
@media(max-width:781px){.entry-content .wp-block-columns{gap:20px}}

/* Groep en achtergrondvlakken */
.entry-content .wp-block-group.has-background{border-radius:14px;padding:28px}
.entry-content .wp-block-group{margin:28px 0}

/* Knoppen in de huisstijl */
.entry-content .wp-block-buttons{gap:10px;margin:24px 0}
.entry-content .wp-block-button__link{
  display:inline-flex;align-items:center;justify-content:center;
  font-family:var(--fd);font-size:15px;font-weight:700;
  padding:14px 26px;border-radius:10px;
  background:var(--red);color:#fff;border:none;
  transition:filter .15s;text-decoration:none;
}
.entry-content .wp-block-button__link:hover{filter:brightness(1.1);color:#fff}
.entry-content .is-style-outline .wp-block-button__link{
  background:transparent;color:var(--navy);border:1.5px solid var(--border);
}
.entry-content .is-style-outline .wp-block-button__link:hover{background:var(--off);color:var(--navy)}

/* Citaat en scheiding */
.entry-content .wp-block-quote{border-left:3px solid var(--red);padding:12px 20px;margin:24px 0;background:var(--off);border-radius:0 8px 8px 0;font-style:italic;color:var(--navy)}
.entry-content .wp-block-separator{border:none;border-top:1px solid var(--border);margin:36px auto;max-width:100%;opacity:1}

/* Tabel */
.entry-content .wp-block-table table{width:100%;border-collapse:collapse;font-size:14.5px}
.entry-content .wp-block-table th{background:var(--navy);color:#fff;padding:11px 14px;text-align:left;font-weight:700}
.entry-content .wp-block-table td{padding:11px 14px;border-bottom:1px solid var(--border)}

/* Cover */
.entry-content .wp-block-cover{border-radius:14px;overflow:hidden;margin:28px 0}

/* Media en tekst */
.entry-content .wp-block-media-text{margin:28px 0;border-radius:14px;overflow:hidden}

/* Kleuren uit de huisstijl (editor-palet) */
.has-navy-color{color:var(--navy)!important}
.has-rood-color{color:var(--red)!important}
.has-goud-color{color:var(--gold)!important}
.has-groen-color{color:var(--green)!important}
.has-tekst-color{color:var(--text)!important}
.has-grijs-color{color:var(--muted)!important}
.has-wit-color{color:#fff!important}
.has-navy-background-color{background-color:var(--navy)!important}
.has-rood-background-color{background-color:var(--red)!important}
.has-goud-background-color{background-color:var(--gold)!important}
.has-groen-background-color{background-color:var(--green)!important}
.has-lichtgrijs-background-color{background-color:var(--off)!important}
.has-wit-background-color{background-color:#fff!important}
.has-navy-background-color,.has-navy-background-color p,.has-navy-background-color h2,.has-navy-background-color h3{color:#fff}

/* Lettergroottes uit het palet */
.has-klein-font-size{font-size:14px}
.has-normaal-font-size{font-size:16px}
.has-groot-font-size{font-size:20px}
.has-extra-groot-font-size{font-size:28px}

/* ============================================================
   AANBIEDINGSPAGINA — kop + werkbank voor blokken
   ============================================================ */
.aanb-kop-labels{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:14px}
.aanb-badge{display:inline-flex;align-items:center;background:var(--red);color:#fff;font-family:var(--fd);font-size:11px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;padding:5px 13px;border-radius:100px}
.aanb-geldig-label{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.10);border:1.5px solid rgba(255,255,255,.22);color:rgba(255,255,255,.8);font-size:12.5px;font-weight:600;padding:4px 12px;border-radius:100px}

/* Werkbank: tekstkolom gecentreerd, brede blokken mogen uitbreken */
.aanb-canvas{padding:44px 0 56px}
.aanb-canvas .aanb-tekst{max-width:760px;margin-left:auto;margin-right:auto}

@media(max-width:600px){
  .aanb-canvas{padding:32px 0 40px}
}

/* ============================================================
   Vacatures-link in het menu: rode omlijning met gloed
   Werkt automatisch op de link naar /vacatures/, geen instelling nodig.
   ============================================================ */
.nav-menu li.menu-vacature > a,
.nav-menu li a[href*="vacature"]{
  color:var(--red);
  font-weight:700;
  border:1.5px solid var(--red);
  padding:5.5px 12px;
  border-radius:100px;
  box-shadow:0 0 0 3px rgba(220,38,38,.10), 0 0 10px rgba(220,38,38,.28);
  animation:vac-gloed 2.6s ease-in-out infinite;
}
.nav-menu li.menu-vacature > a:hover,
.nav-menu li a[href*="vacature"]:hover{
  background:var(--red);
  color:#fff;
  box-shadow:0 0 0 3px rgba(220,38,38,.16), 0 0 18px rgba(220,38,38,.55);
  animation:none;
}

@keyframes vac-gloed{
  0%,100%{box-shadow:0 0 0 3px rgba(220,38,38,.08), 0 0 8px rgba(220,38,38,.22)}
  50%    {box-shadow:0 0 0 3px rgba(220,38,38,.18), 0 0 16px rgba(220,38,38,.45)}
}

/* Mobiel menu: zelfde accent, passend bij de lijstopmaak */
.mobile-menu li.menu-vacature > a,
.mobile-menu li a[href*="vacature"]{
  color:var(--red);
  font-weight:800;
}
.mobile-menu li.menu-vacature > a::before,
.mobile-menu li a[href*="vacature"]::before{
  content:"";
  display:inline-block;
  width:7px;height:7px;border-radius:50%;
  background:var(--red);
  margin-right:8px;
  vertical-align:middle;
  box-shadow:0 0 8px rgba(220,38,38,.7);
}

/* Wie liever geen bewegende elementen ziet, krijgt een vaste gloed */
@media(prefers-reduced-motion:reduce){
  .nav-menu li.menu-vacature > a,
.nav-menu li a[href*="vacature"]{animation:none}
}

/* Lokvakje voor bots: uit beeld, maar NIET display:none.
   Bots vullen het in, mensen zien en focussen het nooit. */
.fc-lok{
  position:absolute!important;
  left:-9999px!important;
  top:auto!important;
  width:1px!important;
  height:1px!important;
  overflow:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
}

/* Grid-kolommen niet laten uitzetten door brede inhoud (grid-blowout).
   Zonder min-width:0 kan een veld of lange tekst de hele kolom oprekken. */
.hero-inner > *{min-width:0}
.hero-card{min-width:0;max-width:100%}
.fc-field{min-width:0}
.page-layout > *,.vac-grid > *{min-width:0}

/* De hero-varianten (donker/licht/foto/split + kleurverlopen) worden
   bewust vanuit functions.php ingeladen, direct in de paginakop.
   Reden: dan werken ze ook als deze stylesheet gecachet blijft hangen. */
.footer-keurmerken{display:flex;justify-content:flex-end;align-items:center;gap:18px;flex-wrap:wrap;margin:0 0 22px}
.footer-keurmerken .footer-trustpilot{width:100%;max-width:380px;margin:0}
@media (max-width:640px){.footer-keurmerken{justify-content:center}}
.footer-badge{display:inline-flex;align-items:center;background:#fff;border-radius:8px;padding:8px 14px;transition:transform .15s}
.footer-badge:hover{transform:translateY(-2px)}
.footer-badge img{height:40px;width:auto;display:block}

/* ─── Referenties: fotoblok, plaatskaarten en plaatspagina ────────
   Sluit aan op het bestaande systeem: zelfde radius, rand en kleuren als
   .service-card en .review-card. Alleen de indeling is anders. */

.section--zacht{background:var(--off)}

/* Krappere sectie voor de referentieblokken. 88px boven en onder is de
   themastandaard en blijft staan voor de rest van de site; tussen twee
   secties werd dat 176px, en dat is te veel lucht rond een fotoblok.
   De sectie ervoor krimpt mee, anders halveert alleen de onderste helft. */
.section--dicht{padding-top:56px;padding-bottom:56px}
.section:has(+ .section--dicht){padding-bottom:56px}
@media(max-width:640px){.section--dicht{padding-top:44px;padding-bottom:44px}
  .section:has(+ .section--dicht){padding-bottom:44px}}

/* Galerij. De eerste foto is groot: een raster waarin alles even groot is
   stuurt het oog nergens heen. */
.ref-galerij{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:28px}
.ref-galerij>*{min-width:0}
.ref-item{margin:0;display:flex;flex-direction:column;gap:10px}
.ref-item img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;
  border-radius:12px;border:1px solid var(--border);background:var(--off2)}
.ref-item--groot{grid-column:span 2;grid-row:span 2}
.ref-item--groot img{aspect-ratio:auto;height:100%;min-height:240px}
.ref-item figcaption{font-size:13px;line-height:1.45;color:var(--muted)}
.ref-item figcaption b{color:var(--text);font-weight:700}
@media(max-width:860px){
  .ref-galerij{grid-template-columns:repeat(2,1fr)}
  .ref-item--groot{grid-column:span 2;grid-row:auto}
  .ref-item--groot img{aspect-ratio:16/9;min-height:0}
}
@media(max-width:480px){
  .ref-galerij{grid-template-columns:1fr;gap:20px}
  .ref-item--groot{grid-column:span 1}
}

/* Plaatskaarten op /referenties/ */
.plaats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:28px}
.plaats-grid>*{min-width:0}
.plaats-kaart{display:flex;flex-direction:column;background:#fff;border:1.5px solid var(--border);
  border-radius:14px;overflow:hidden;text-decoration:none;color:inherit;
  transition:border-color .2s,box-shadow .2s,transform .15s}
.plaats-kaart:hover{border-color:var(--red);box-shadow:0 8px 40px rgba(220,38,38,.1);transform:translateY(-4px)}
/* Plaats zonder eigen pagina: staat in hetzelfde raster, maar reageert niet
   op de muis. Een kaart die oplicht alsof je erop kunt klikken en dan niets
   doet, is vervelender dan een kaart die stil blijft. */
.plaats-kaart--stil:hover{border-color:var(--border);box-shadow:none;transform:none}
.plaats-kaart img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}
.plaats-kaart-tekst{padding:16px 18px 18px;display:flex;flex-direction:column;gap:3px}
.plaats-kaart-naam{font-family:var(--fd);font-size:18px;font-weight:800;color:var(--navy);letter-spacing:-.015em;line-height:1.2}
.plaats-kaart-naam .pk-voor{display:block;font-family:var(--fb);font-size:11px;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:3px}
.plaats-kaart-meta{font-size:13px;color:var(--muted);font-variant-numeric:tabular-nums}
.plaats-kaart-diensten{font-size:12.5px;color:var(--muted);margin-top:10px;
  border-top:1px solid var(--border);padding-top:10px}
@media(max-width:900px){.plaats-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:540px){.plaats-grid{grid-template-columns:1fr}}

/* Tijdens de uitrol staat er vaak maar een of twee plaatsen in. In een raster
   van drie kolommen blijft er dan tweederde leeg, en dat leest als een fout in
   plaats van als een keuze. Bij weinig kaarten krimpt het raster mee. */
.plaats-grid:has(> :only-child){grid-template-columns:minmax(0,420px)}
.plaats-grid:has(> :nth-child(2):last-child){grid-template-columns:repeat(2,minmax(0,1fr));max-width:790px}


/* Bewijsregel in de kop van een plaatspagina. Komt uit de projecten zelf. */
.plaats-bewijs{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;margin-top:18px;
  font-size:14px;font-weight:600;color:rgba(255,255,255,.9)}
.plaats-bewijs-telling{display:inline-flex;align-items:baseline;gap:6px;background:rgba(255,255,255,.11);
  border:1px solid rgba(255,255,255,.2);border-radius:999px;padding:5px 14px}
.plaats-bewijs-telling b{font-family:var(--fd);font-size:16px;font-weight:800;font-variant-numeric:tabular-nums}
.plaats-bewijs-scheid{color:rgba(255,255,255,.32)}
.plaats-bewijs-zacht{color:rgba(255,255,255,.72);font-weight:500}
.plaats-hero-knoppen{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}

/* Intro op leesbare regellengte in plaats van geperst naast een formulier */
.plaats-intro{max-width:64ch;margin-top:16px;font-size:16px;line-height:1.75;color:#374151}
.plaats-intro p+p{margin-top:15px}

/* Zoekwoordankers naar de dienstpagina's */
.plaats-diensten{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:24px;max-width:780px}
.plaats-diensten>*{min-width:0}
.plaats-diensten a{display:flex;align-items:center;justify-content:space-between;gap:14px;
  background:#fff;border:1.5px solid var(--border);border-radius:11px;padding:15px 18px;
  color:var(--text);font-weight:700;font-size:15px;text-decoration:none;
  transition:border-color .2s,box-shadow .2s}
.plaats-diensten a:hover{border-color:var(--red);box-shadow:0 6px 24px rgba(220,38,38,.08)}
.plaats-pijl{color:var(--red);font-weight:800;flex-shrink:0}
@media(max-width:640px){.plaats-diensten{grid-template-columns:1fr}}

/* Formulierband onderaan de plaatspagina */
.plaats-formband{background:var(--navy);color:#fff;padding:56px 0}
.plaats-formband-titel{font-family:var(--fd);font-size:clamp(24px,3.4vw,36px);font-weight:800;
  letter-spacing:-.025em;line-height:1.15;color:#fff;text-wrap:balance}
.plaats-formband-onder{color:rgba(255,255,255,.72);font-size:16px;margin-top:10px;max-width:54ch;line-height:1.65}
.plaats-formgrid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start;margin-top:30px}
.plaats-formgrid>*{min-width:0}
.plaats-punten{list-style:none;display:flex;flex-direction:column;gap:13px;font-size:15px}
.plaats-punten li{display:flex;gap:11px;align-items:flex-start;color:rgba(255,255,255,.9);font-weight:600}
.plaats-punten svg{color:var(--green);flex-shrink:0;margin-top:3px}
.plaats-formkaart{background:#fff;border-radius:16px;padding:22px;box-shadow:0 24px 80px rgba(0,0,0,.28)}
@media(max-width:820px){.plaats-formgrid{grid-template-columns:1fr;gap:28px}}

/* Blok "in uw plaats" onder de dienstpagina's */
.plaats-links{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.plaats-links a{display:inline-flex;align-items:center;background:#fff;border:1.5px solid var(--border);
  border-radius:999px;padding:9px 18px;font-size:14px;font-weight:700;color:var(--navy);text-decoration:none;
  transition:border-color .2s}
.plaats-links a:hover{border-color:var(--red)}

/* ─── Twee-koloms indelingen die als inline stijl in de sjablonen staan ──
   Die inline stijl wint het van elke regel hier, dus een media query kan er
   niet overheen. Op een telefoon bleef het daardoor twee kolommen: tekst op
   45% breedte naast een formulier op 45%. Onleesbaar.
   Onderstaande regels vangen dat af met !important, wat hier terecht is: het
   is de enige manier om een inline stijl te overrulen zonder elk sjabloon
   opnieuw te moeten opmaken. */
   Bewust NIET afhankelijk gemaakt van de nesting: de meeste van deze divs
   zijn een direct kind van .wrap, maar in over-ons.php zitten er twee dieper
   in een gekleurd blok. Een attribuutselector zonder padvoorwaarde pakt ze
   allemaal. */
@media(max-width:820px){
  [style*="grid-template-columns:1fr 1fr"],
  [style*="grid-template-columns: 1fr 1fr"]{
    grid-template-columns:1fr!important;
    gap:32px!important;
  }
}
}
@media(max-width:700px){}
}}
.hero-card .ece-form{gap:9px}.hero-card .hero-card-top,.hero-card-top{padding:14px 22px}.hero-card .hero-card-body,.hero-card-body{padding:16px 22px 18px}.hero-card .fc-field{gap:3px}.hero-card .fc-field label{font-size:10px;letter-spacing:.05em}.hero-card .fc-field input,.hero-card .fc-field select,.hero-card .fc-field textarea{padding:8px 11px;font-size:13.5px;border-radius:7px}.hero-card .fc-field textarea{min-height:62px}.hero-card .fc-row{gap:9px}.hero-card .fc-submit{padding:11px;font-size:14px;border-radius:9px;margin-top:2px}.hero-card .fc-hint,.hero-card .fc-error{font-size:11px;line-height:1.4}.hero-card .fc-divider{margin:10px 0;font-size:11.5px}.hero-card .fc-tel{padding:9px;font-size:16px;border-radius:9px}.hero-card .fc-privacy{font-size:10.5px;margin-top:6px}.hero-card .hero-card-title{font-size:16px}.hero-card .hero-card-sub{font-size:12.5px}@media(max-width:700px){.hero-card .hero-card-top,.hero-card-top{padding:13px 18px}.hero-card .hero-card-body,.hero-card-body{padding:14px 18px 16px}}
@media(max-width:860px){}@media(max-width:520px){}
a.termijnen-balk{display:block;text-decoration:none;background:linear-gradient(100deg,var(--red) 0%,var(--reddk) 60%,#9C1616 100%);position:relative;overflow:hidden;transition:filter .15s}a.termijnen-balk:hover{filter:brightness(1.07)}a.termijnen-balk::after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(115deg,rgba(255,255,255,.06) 0 2px,transparent 2px 10px);pointer-events:none}.termijnen-balk-inner{position:relative;z-index:1;max-width:1220px;margin:0 auto;padding:7px clamp(16px,4vw,48px);display:flex;align-items:center;justify-content:center;gap:4px 11px;flex-wrap:wrap;text-align:center}.termijnen-balk-vlag{flex-shrink:0;background:#fff;color:var(--red);font-family:var(--fd);font-weight:800;font-size:9px;letter-spacing:.09em;text-transform:uppercase;padding:2px 7px;border-radius:100px}.termijnen-balk-tekst{font-family:var(--fd);font-weight:800;font-size:13.5px;line-height:1.3;color:#fff;letter-spacing:-.01em}.termijnen-balk-link{display:inline-flex;align-items:center;gap:5px;font-family:var(--fd);font-weight:800;font-size:12px;color:#fff;border-bottom:1.5px solid rgba(255,255,255,.5);padding-bottom:1px}a.termijnen-balk:hover .termijnen-balk-link{border-bottom-color:#fff}.termijnen-balk-link svg{transition:transform .15s}a.termijnen-balk:hover .termijnen-balk-link svg{transform:translateX(3px)}@media(max-width:860px){.termijnen-balk-tekst{font-size:12.5px}.termijnen-balk-inner{padding:6px 16px;gap:3px 9px}}@media(max-width:520px){.termijnen-balk-vlag{display:none}.termijnen-balk-tekst{font-size:12px}.termijnen-balk-link{font-size:11px}}
/* Het offerteformulier in de hero op mobiel. Gemeten op 412 px: de kaart was   795 px en begon pas op y=758, dus ver onder de vouw. Dit verkleint hem   zonder velden te verbergen. De invoervelden gaan juist naar 16px: onder de   16 zoomt Safari op iOS bij het aantikken in, en dan springt de pagina. */@media(max-width:700px){.hero-card .hero-card-top,.hero-card-top{padding:10px 15px}.hero-card .hero-card-title{font-size:15px}.hero-card .hero-card-sub{font-size:11.5px}.hero-card .hero-card-body,.hero-card-body{padding:12px 15px 13px}.hero-card .ece-form{gap:7px}.hero-card .fc-row{grid-template-columns:1fr 1fr;gap:7px}.hero-card .fc-field{gap:2px}.hero-card .fc-field label{font-size:9.5px;margin-bottom:0;line-height:1.2}.hero-card .fc-field input,.hero-card .fc-field select,.hero-card .fc-field textarea{padding:7px 10px;font-size:16px;border-radius:6px}.hero-card .fc-field textarea{min-height:0;height:64px}.hero-card .fc-hint,.hero-card .fc-error{font-size:10px;line-height:1.3;margin-top:1px}.hero-card .fc-submit{padding:10px;font-size:14px;margin-top:0}.hero-card .fc-privacy{font-size:9.5px;margin-top:4px}.hero-card .fc-divider{margin:8px 0;font-size:11px}.hero-card .fc-captcha{transform:scale(.88);transform-origin:left center;margin:-4px 0}}