:root{
  --bg:#FFFFFF;
  --bg-alt:#F4F4F2;
  --panel:#EDEDEA;
  --ink:#0A0A0A;
  --ink-soft:#55554F;
  --grey:#767671;
  --line:#E2E2DD;
  --dark:#0A0A0A;
  --dark-alt:#161615;
  --accent:#2B6EF5;
  --accent-dark:#1B4FC4;
  --accent-light:#EAF1FF;
  --ease:cubic-bezier(.16,1,.3,1);
  --maxw:1180px;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;scroll-padding-top:110px;}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px;}
a,button,input[type="checkbox"]{cursor:pointer;touch-action:manipulation;}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;}
  .rv{opacity:1;transform:none;}
}
body{
  background:var(--bg);
  color:var(--ink);
  font-family:'Inter',system-ui,sans-serif;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  padding-bottom:0;
}
h1,h2,h3{font-family:'Barlow Condensed',sans-serif;font-weight:700;letter-spacing:-.005em;text-transform:none;}
img{max-width:100%;height:auto;display:block;}
/* <picture> is alleen een omhulsel voor de WebP-varianten; display:contents
   houdt de <img> de directe flex/grid-child, zodat alle bestaande regels blijven werken */
picture{display:contents;}
a{color:inherit;text-decoration:none;}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px;}
.eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--accent-dark);margin-bottom:16px;
}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:15px 28px;border-radius:10px;font-weight:700;font-size:.95rem;
  cursor:pointer;border:2px solid transparent;transition:transform .3s var(--ease),background .3s var(--ease),border-color .3s;
  min-height:44px;
}
.btn-primary{background:var(--accent);color:#fff;}
.btn-primary:hover{transform:translateY(-2px);background:var(--accent-dark);}
.btn-dark{background:var(--ink);color:#fff;}
.btn-dark:hover{transform:translateY(-2px);background:#000;}
.btn-ghost{background:#fff;color:var(--ink);border-color:var(--line);}
.btn-ghost:hover{border-color:var(--ink);}
.btn-on-dark{background:transparent;color:#fff;border-color:rgba(255,255,255,.35);}
.btn-on-dark:hover{border-color:#fff;}
section{padding:96px 0;}
@media(max-width:760px){section{padding:60px 0;}}

/* ---------- Topbar ---------- */
.topbar{background:var(--dark);color:#cfcfcb;font-size:.82rem;}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;height:40px;gap:20px;}
.topbar a{color:#cfcfcb;}
.topbar a:hover{color:#fff;}
.topbar-left,.topbar-right{display:flex;align-items:center;gap:18px;}
@media(max-width:700px){.topbar-left span:nth-child(2){display:none;}}
@media(max-width:520px){.topbar-left{display:none;}.topbar-right a:first-child{display:none;}}

/* ---------- Header ---------- */
header{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:1000;}
.nav-inner{
  max-width:var(--maxw);margin:0 auto;padding:14px 24px;
  display:flex;align-items:center;justify-content:space-between;gap:20px;
}
.brand{display:flex;align-items:center;gap:10px;font-weight:700;font-size:1.2rem;font-family:'Barlow Condensed',sans-serif;text-transform:uppercase;letter-spacing:.02em;}
.brand img{height:22px;width:auto;object-fit:contain;}
.brand-name{font-size:1.05rem;}
@media(max-width:420px){.brand img{height:18px;}.brand-name{font-size:.9rem;}}
nav > ul{display:flex;gap:30px;list-style:none;}
nav ul a{font-size:.92rem;font-weight:600;color:var(--ink-soft);transition:color .25s;padding:10px 0;display:inline-block;position:relative;}
nav ul a:hover,nav ul a.active{color:var(--ink);}

/* Dropdown */
.has-dropdown{position:relative;}
.has-dropdown>a{display:flex;align-items:center;gap:5px;}
.has-dropdown .chev{width:10px;height:10px;transition:transform .25s var(--ease);}
.has-dropdown:hover .chev,.has-dropdown.open .chev{transform:rotate(180deg);}
.dropdown{
  position:absolute;top:100%;left:-16px;margin-top:10px;width:300px;
  background:#fff;border:1px solid var(--line);border-radius:14px;
  box-shadow:0 20px 40px rgba(10,10,10,.1);padding:10px;
  opacity:0;visibility:hidden;transform:translateY(6px);
  transition:opacity .2s var(--ease),transform .2s var(--ease),visibility .2s;
  list-style:none;z-index:1100;
}
.has-dropdown:hover .dropdown,.has-dropdown.open .dropdown{opacity:1;visibility:visible;transform:translateY(0);}
.dropdown li a{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:9px;font-size:.88rem;font-weight:600;color:var(--ink);}
.dropdown li a:hover{background:var(--bg-alt);}
.dropdown li a::after{display:none;}
.dropdown li a .di{width:32px;height:32px;border-radius:50%;background:var(--accent-light);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.dropdown li a .di svg{width:15px;height:15px;color:var(--accent-dark);}
.dropdown .dropdown-all{border-top:1px solid var(--line);margin-top:6px;padding-top:12px;}
.dropdown .dropdown-all a{color:var(--accent-dark);}
.nav-cta{display:flex;align-items:center;gap:12px;}
.icon-btn{width:44px;height:44px;border-radius:50%;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.icon-btn:hover{border-color:var(--ink);}
.icon-btn svg{width:18px;height:18px;}
.burger{display:none;width:44px;height:44px;position:relative;cursor:pointer;background:none;border:none;flex-shrink:0;}
.burger span{position:absolute;left:9px;right:9px;height:2px;background:var(--ink);transition:.3s var(--ease);}
.burger span:nth-child(1){top:15px;}
.burger span:nth-child(2){top:22px;}
.burger span:nth-child(3){top:29px;}
.burger.open span:nth-child(1){top:22px;transform:rotate(45deg);}
.burger.open span:nth-child(2){opacity:0;}
.burger.open span:nth-child(3){top:22px;transform:rotate(-45deg);}
/* ---------- Mobiel menu ---------- */
#mobMenu{
  position:fixed;inset:0;z-index:2100;background:#fff;
  display:flex;flex-direction:column;
  transform:translateX(100%);visibility:hidden;
  transition:transform .4s var(--ease),visibility .4s;
  overscroll-behavior:contain;
}
#mobMenu.open{transform:translateX(0);visibility:visible;}

.mob-head{
  flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:12px 18px;padding-top:calc(env(safe-area-inset-top) + 12px);
  border-bottom:1px solid var(--line);
}
.mob-close{
  width:40px;height:40px;flex-shrink:0;border:1px solid var(--line);border-radius:50%;
  background:#fff;display:flex;align-items:center;justify-content:center;color:var(--ink);
  transition:border-color .2s,background .2s;
}
.mob-close:hover,.mob-close:active{border-color:var(--ink);background:var(--bg-alt);}
.mob-close svg{width:17px;height:17px;}

.mob-nav{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:4px 18px 18px;}
.mob-nav > a,.mob-toggle{
  width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:13px 2px;min-height:48px;
  background:none;border:none;border-bottom:1px solid var(--line);
  font-family:'Barlow Condensed',sans-serif;font-size:1.1rem;font-weight:700;
  color:var(--ink);text-align:left;
}
.mob-nav > a.active{color:var(--accent-dark);}
.mob-toggle svg{width:16px;height:16px;flex-shrink:0;color:var(--grey);transition:transform .3s var(--ease);}
.mob-toggle.open svg{transform:rotate(180deg);color:var(--accent);}

.mob-sub{
  overflow:hidden;max-height:0;
  transition:max-height .4s var(--ease);
}
.mob-sub.open{max-height:640px;}
.mob-sub a{
  display:flex;align-items:center;gap:11px;
  padding:9px 12px;margin:6px 0;min-height:44px;
  border-radius:10px;background:var(--bg-alt);
  font-family:'Inter',sans-serif;font-size:.88rem;font-weight:600;color:var(--ink);
}
.mob-sub a:first-child{margin-top:10px;}
.mob-sub a.active{background:var(--accent-light);color:var(--accent-dark);}
.mob-sub a .mi{
  width:28px;height:28px;flex-shrink:0;border-radius:50%;background:#fff;
  display:flex;align-items:center;justify-content:center;
}
.mob-sub a .mi svg{width:14px;height:14px;color:var(--accent-dark);}
.mob-sub .mob-sub-all{
  background:none;color:var(--accent-dark);font-weight:700;font-size:.86rem;
  padding-left:2px;margin-bottom:2px;min-height:38px;
}

.mob-foot{
  flex-shrink:0;border-top:1px solid var(--line);background:var(--bg-alt);
  padding:14px 18px;padding-bottom:calc(env(safe-area-inset-bottom) + 14px);
}
.mob-foot .btn{width:100%;padding:12px 20px;font-size:.9rem;min-height:46px;}
.mob-contact{display:flex;flex-direction:row;flex-wrap:wrap;gap:8px 18px;margin-top:12px;}
.mob-contact a{
  display:flex;align-items:center;gap:8px;padding:4px 0;min-height:36px;
  font-family:'Inter',sans-serif;font-size:.84rem;font-weight:600;color:var(--ink);
}
.mob-contact .mi{
  width:26px;height:26px;flex-shrink:0;border-radius:50%;background:var(--accent-light);
  display:flex;align-items:center;justify-content:center;
}
.mob-contact .mi svg{width:13px;height:13px;color:var(--accent-dark);}
.mob-note{margin-top:8px;font-size:.75rem;color:var(--grey);}

body.menu-open{overflow:hidden;}
body.menu-open .mobile-cta-bar{display:none;}

@media(max-width:920px){
  nav ul{display:none;}
  .nav-cta .icon-btn,.nav-cta .btn{display:none;}
  .burger{display:block;}
}

/* ---------- Sticky mobile CTA bar ---------- */
.mobile-cta-bar{display:none;}
@media(max-width:760px){
  .mobile-cta-bar{
    display:flex;position:fixed;left:0;right:0;bottom:0;z-index:900;
    background:#fff;border-top:1px solid var(--line);
    padding:10px 14px calc(env(safe-area-inset-bottom) + 10px);gap:10px;
    box-shadow:0 -8px 24px rgba(10,10,10,.08);
  }
  .mobile-cta-bar a{flex:1;}
  .mobile-cta-bar .btn{padding:13px 10px;font-size:.9rem;}
  /* alleen ruimte reserveren op paginas die de balk daadwerkelijk tonen */
  body:has(.mobile-cta-bar){padding-bottom:78px;}
}

/* ---------- USP strip ---------- */
.usp-strip{background:var(--bg-alt);border-bottom:1px solid var(--line);}
.usp-strip .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:14px 30px;padding-top:16px;padding-bottom:16px;}
.usp-item{display:flex;align-items:center;gap:9px;font-size:.86rem;font-weight:600;color:var(--ink-soft);}
.usp-item svg{width:17px;height:17px;color:var(--accent);flex-shrink:0;}

/* ---------- Hero (photo) ---------- */
.hero{position:relative;color:#fff;overflow:hidden;}
.hero-media{position:absolute;inset:0;}
.hero-media img{width:100%;height:100%;object-fit:cover;}
.hero-media::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(6,8,14,.92) 0%,rgba(6,8,14,.78) 42%,rgba(6,8,14,.42) 100%);}
.hero-inner{position:relative;z-index:2;padding:120px 24px 90px;}
.hero.page-hero .hero-inner{padding:76px 24px 68px;}
.hero h1{font-size:clamp(2.1rem,4.6vw,3.4rem);font-weight:700;line-height:1.1;max-width:760px;margin-bottom:20px;}
.hero p.lead{font-size:1.08rem;color:#DADAD6;max-width:560px;margin-bottom:28px;}
.hero-checklist{list-style:none;display:flex;flex-direction:column;gap:10px;margin-bottom:34px;}
.hero-checklist li{display:flex;align-items:center;gap:10px;font-size:.96rem;font-weight:500;}
.hero-checklist svg{width:18px;height:18px;color:var(--accent);flex-shrink:0;}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;}

/* ---------- Section head ---------- */
.section-head{max-width:640px;}
.section-head.center{max-width:680px;margin:0 auto;text-align:center;}
.section-head h2{font-size:clamp(1.7rem,3.4vw,2.4rem);font-weight:700;line-height:1.15;}
.section-head p{color:var(--ink-soft);margin-top:14px;font-size:1.02rem;}

/* ---------- Diensten grid ---------- */
.diensten-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px;margin-top:50px;}
.dienst-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:30px 26px;transition:box-shadow .3s,border-color .3s,transform .3s;}
.dienst-card:hover{border-color:var(--accent);box-shadow:0 16px 34px rgba(10,10,10,.07);transform:translateY(-3px);}
.dienst-icon{width:50px;height:50px;border-radius:50%;background:var(--accent-light);display:flex;align-items:center;justify-content:center;margin-bottom:18px;position:relative;}
.dienst-icon::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:1.5px dashed rgba(43,110,245,.3);}
.dienst-icon svg{width:23px;height:23px;color:var(--accent-dark);stroke-width:1.75;}
.dienst-card h3{font-size:1.08rem;margin-bottom:8px;}
.dienst-card p{font-size:.92rem;color:var(--ink-soft);}
.dienst-card a.more{display:inline-block;margin-top:14px;font-size:.85rem;font-weight:700;color:var(--accent-dark);}

/* ---------- Werkzaamheden overview (editorial lijst i.p.v. kaartgrid) ---------- */
.category-block{margin-top:64px;}
.category-block:first-child{margin-top:0;}
.category-title{display:flex;align-items:baseline;gap:12px;margin-bottom:4px;}
.category-title h2{font-size:clamp(1.5rem,3vw,2rem);}
.category-title .cat-note{font-size:.85rem;color:var(--grey);font-weight:600;}
.service-row{display:grid;grid-template-columns:56px 1fr auto;align-items:center;gap:22px;padding:26px 0;border-top:1px solid var(--line);transition:background .2s;}
.service-row:last-child{border-bottom:1px solid var(--line);}
.service-row:hover{background:var(--bg-alt);}
.service-row .sr-num{font-family:'Barlow Condensed';font-size:2.1rem;font-weight:700;color:var(--line);transition:color .2s;}
.service-row:hover .sr-num{color:var(--accent);}
.service-row h3{font-size:1.15rem;margin-bottom:4px;font-weight:700;}
.service-row p{color:var(--ink-soft);font-size:.9rem;max-width:520px;}
.service-row .sr-arrow{width:38px;height:38px;border-radius:50%;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .2s,border-color .2s;}
.service-row:hover .sr-arrow{background:var(--ink);border-color:var(--ink);}
.service-row .sr-arrow svg{width:15px;height:15px;transition:transform .2s;}
.service-row:hover .sr-arrow svg{transform:translateX(2px);color:#fff;}
@media(max-width:640px){
  .service-row{grid-template-columns:40px 1fr;row-gap:8px;}
  .service-row .sr-arrow{display:none;}
  .service-row .sr-num{font-size:1.6rem;}
}

/* ---------- Service page layout (sidebar CTA) ---------- */
.service-layout{display:grid;grid-template-columns:1fr 320px;gap:56px;align-items:start;}
/* de sticky header is 87px hoog; top:90px liet maar 3px lucht over bij het scrollen */
.service-sidebar{position:sticky;top:118px;display:flex;flex-direction:column;gap:18px;}
.cta-card{background:var(--bg-alt);border:1px solid var(--line);border-radius:18px;padding:26px;}
.cta-card h3{font-size:1.2rem;margin-bottom:8px;}
.cta-card p{color:var(--ink-soft);font-size:.88rem;margin-bottom:16px;}
.cta-card .btn{width:100%;margin-bottom:10px;}
.related-card{border:1px solid var(--line);border-radius:18px;padding:10px;}
.related-card h4{font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;color:var(--grey);padding:12px 14px 6px;}
.related-card a{display:block;padding:11px 14px;border-radius:9px;font-size:.88rem;font-weight:600;color:var(--ink-soft);}
.related-card a:hover,.related-card a.active{background:var(--bg-alt);color:var(--ink);}
@media(max-width:900px){.service-layout{grid-template-columns:1fr;}.service-sidebar{position:static;flex-direction:row;flex-wrap:wrap;}.service-sidebar .cta-card,.service-sidebar .related-card{flex:1;min-width:260px;}}

/* ---------- Trust row (bij formulier) ---------- */
.trust-row{display:flex;gap:18px;flex-wrap:wrap;margin-top:18px;padding-top:18px;border-top:1px solid var(--line);}
.trust-row .t-item{display:flex;align-items:center;gap:7px;font-size:.82rem;color:var(--ink-soft);font-weight:600;}
.trust-row svg{width:15px;height:15px;color:var(--accent);flex-shrink:0;}

/* ---------- Storingen band ---------- */
.storingen-band{background:var(--dark);color:#fff;position:relative;overflow:hidden;}
.storingen-band .wrap{position:relative;z-index:2;display:grid;grid-template-columns:1.1fr .9fr;gap:60px;align-items:center;}
.storingen-band h2{color:#fff;}
.storingen-band p{color:#C7C7C2;}
.storingen-list{list-style:none;display:flex;flex-direction:column;gap:14px;margin-top:26px;}
.storingen-list li{display:flex;gap:12px;font-size:.95rem;}
.storingen-list svg{width:18px;height:18px;color:var(--accent-light);flex-shrink:0;margin-top:2px;}
.storingen-media{border-radius:18px;overflow:hidden;aspect-ratio:4/5;border:1px solid rgba(255,255,255,.12);}
.storingen-media img{width:100%;height:100%;object-fit:cover;}
@media(max-width:860px){.storingen-band .wrap{grid-template-columns:1fr;gap:34px;}}

/* ---------- Timeline ---------- */
.timeline{margin-top:50px;display:flex;flex-direction:column;}
.tl-item{display:flex;gap:24px;padding:24px 0;border-top:1px solid var(--line);}
.tl-item:last-child{border-bottom:1px solid var(--line);}
.tl-num{font-family:'Barlow Condensed';font-size:1.3rem;font-weight:700;color:var(--line);width:48px;flex-shrink:0;}
.tl-body h3{font-size:1.05rem;margin-bottom:6px;}
.tl-body p{color:var(--ink-soft);font-size:.93rem;max-width:520px;}

/* ---------- About ---------- */
.about{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center;}
.about-media{aspect-ratio:4/5;border-radius:18px;overflow:hidden;border:1px solid var(--line);background:var(--bg-alt);}
.about-media img{width:100%;height:100%;object-fit:cover;}
.quote{font-family:'Barlow Condensed';font-size:1.25rem;line-height:1.4;margin:22px 0;color:var(--ink);}
.about-points{list-style:none;display:flex;flex-direction:column;gap:11px;margin:22px 0 0;}
.about-points li{display:flex;align-items:flex-start;gap:10px;font-size:.94rem;font-weight:600;color:var(--ink);}
.about-points svg{width:17px;height:17px;color:var(--accent);flex-shrink:0;margin-top:3px;}
.about-sign{margin-top:22px;padding-top:18px;border-top:1px solid var(--line);font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:1rem;color:var(--ink);}
@media(max-width:860px){.about{grid-template-columns:1fr;gap:32px;}}

/* ---------- Reviews ---------- */
.reviews-wrap{margin-top:50px;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);}
.marquee{display:flex;gap:18px;width:max-content;animation:scroll 42s linear infinite;}
.marquee:hover{animation-play-state:paused;}
@keyframes scroll{from{transform:translateX(0);}to{transform:translateX(-50%);}}
.review-card{width:300px;flex-shrink:0;background:#fff;border:1px solid var(--line);border-radius:14px;padding:24px;}
.stars{color:var(--accent);font-size:.9rem;margin-bottom:12px;letter-spacing:2px;}
.review-card p{font-size:.9rem;color:var(--ink-soft);margin-bottom:14px;}
.review-name{font-size:.83rem;color:var(--grey);font-weight:700;}
@media(prefers-reduced-motion:reduce){.marquee{animation:none;}}

/* ---------- FAQ ---------- */
.faq-item{border-top:1px solid var(--line);}
.faq-item:last-child{border-bottom:1px solid var(--line);}
.faq-q{width:100%;text-align:left;background:none;border:none;color:var(--ink);padding:22px 0;min-height:44px;display:flex;justify-content:space-between;align-items:center;font-family:'Barlow Condensed';font-size:1rem;font-weight:700;gap:20px;}
.faq-q .plus{flex-shrink:0;width:22px;height:22px;position:relative;}
.faq-q .plus::before,.faq-q .plus::after{content:"";position:absolute;background:var(--accent);top:50%;left:50%;transform:translate(-50%,-50%);}
.faq-q .plus::before{width:14px;height:2px;}
.faq-q .plus::after{width:2px;height:14px;transition:transform .3s var(--ease);}
.faq-item.open .plus::after{transform:translate(-50%,-50%) rotate(90deg) scale(0);}
.faq-a{max-height:0;overflow:hidden;transition:max-height .35s var(--ease);}
.faq-item.open .faq-a{max-height:600px;}
.faq-a p{padding-bottom:22px;color:var(--ink-soft);font-size:.93rem;max-width:600px;}

/* ---------- CTA band ---------- */
.cta-band{background:var(--accent);color:#fff;position:relative;overflow:hidden;}
.cta-band::before,.cta-band::after{
  content:"";position:absolute;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20100%20130.45'%3E%3Cpath%20d='M98.87%200.00%20L99.72%201.42%20L98.30%203.40%20L60.20%2050.99%20L90.65%2051.42%20L91.36%2052.83%20L52.55%2086.97%20L0.85%20130.31%20L0.14%20130.03%20L0.42%20128.75%20L42.35%2069.83%20L17.00%2069.12%20L16.57%2067.71%20L72.95%200.00%20Z'%20fill='%23ffffff'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:center;background-size:contain;
}
.cta-band::before{top:-60px;right:2%;width:190px;height:248px;opacity:.11;transform:rotate(10deg);}
.cta-band::after{bottom:-70px;left:-30px;width:150px;height:196px;opacity:.08;transform:rotate(-14deg);}
@media(max-width:900px){
  .cta-band::before{width:130px;height:170px;top:-40px;right:-20px;}
  .cta-band::after{display:none;}
}
.cta-band .wrap{position:relative;z-index:2;}
.cta-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center;}
.cta-band .eyebrow{color:#DCE8FF;}
.cta-band h2{color:#fff;font-size:clamp(1.6rem,3.2vw,2.2rem);line-height:1.15;}
.cta-band p{color:rgba(255,255,255,.92);margin:14px 0 0;max-width:520px;}
.cta-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:28px;}
.cta-band .btn-dark{background:#fff;color:var(--ink);}
.cta-band .btn-dark:hover{background:var(--ink);color:#fff;}
.btn-on-accent{background:transparent;color:#fff;border-color:rgba(255,255,255,.45);}
.btn-on-accent:hover{border-color:#fff;background:rgba(255,255,255,.1);}
.cta-note{display:flex;align-items:center;gap:9px;font-size:.86rem;color:rgba(255,255,255,.85);margin-top:20px;}
.cta-note svg{width:16px;height:16px;flex-shrink:0;}

.cta-steps{
  list-style:none;margin:0;padding:28px;
  background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.24);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  border-radius:18px;display:flex;flex-direction:column;gap:6px;
}
.cta-steps > li{display:flex;gap:16px;padding:14px 0;align-items:flex-start;}
.cta-steps > li + li{border-top:1px solid rgba(255,255,255,.18);}
.cta-step-num{
  flex-shrink:0;width:34px;height:34px;border-radius:50%;
  background:#fff;color:var(--accent-dark);
  font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:1.1rem;
  display:flex;align-items:center;justify-content:center;
}
.cta-steps strong{display:block;font-size:.98rem;font-weight:700;margin-bottom:3px;}
.cta-steps span.cta-step-txt{display:block;font-size:.88rem;color:rgba(255,255,255,.82);line-height:1.5;}
@media(max-width:900px){
  .cta-grid{grid-template-columns:1fr;gap:36px;}
  .cta-band p{max-width:none;}
}

/* ---------- Uitgebreide tekst op dienstenpagina's ---------- */
/* ---------- Juridische pagina's ---------- */
.legal-hero{background:var(--bg-alt);border-bottom:1px solid var(--line);padding:56px 0 44px;}
.legal-hero h1{font-size:clamp(1.9rem,4vw,2.6rem);line-height:1.1;margin-bottom:14px;}
.legal-hero .lead{color:var(--ink-soft);font-size:1.02rem;max-width:620px;}
.legal-hero .breadcrumb{margin-top:20px;}
.legal{max-width:760px;padding-top:56px;}
.legal h2{font-size:1.25rem;font-weight:700;margin:36px 0 12px;padding-top:28px;border-top:1px solid var(--line);}
.legal h2:first-of-type{margin-top:0;}
.legal p{color:var(--ink-soft);font-size:.97rem;line-height:1.75;margin-bottom:14px;}
.legal a{color:var(--accent-dark);font-weight:600;}
.legal a:hover{text-decoration:underline;}
.legal ul{list-style:none;display:flex;flex-direction:column;gap:9px;margin:6px 0 18px;}
.legal ul li{display:flex;align-items:flex-start;gap:10px;font-size:.95rem;color:var(--ink-soft);line-height:1.65;}
.legal ul li::before{content:"";flex-shrink:0;width:6px;height:6px;margin-top:9px;border-radius:50%;background:var(--accent);}
.legal-updated{font-size:.83rem;color:var(--grey);margin-bottom:22px;}
.legal-card{background:var(--bg-alt);border:1px solid var(--line);border-radius:14px;padding:20px 22px;margin-bottom:10px;}
.legal-card p{color:var(--ink);margin:0;font-size:.93rem;line-height:1.8;}
.legal-note{margin-top:40px;background:var(--accent-light);border-radius:14px;padding:20px 22px;}
.legal-note p{margin:0;color:var(--ink);font-size:.93rem;}

.service-intro{font-size:1.08rem;color:var(--ink);line-height:1.65;margin-bottom:20px;}
.service-lead{color:var(--ink-soft);font-size:.98rem;line-height:1.7;margin-bottom:16px;}
.service-figure{margin:40px 0 0;}
.service-figure img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:16px;border:1px solid var(--line);}
.service-figure figcaption{margin-top:12px;font-size:.85rem;color:var(--grey);}

.service-copy{margin-top:40px;max-width:none;}
.service-copy h2{font-size:1.35rem;font-weight:700;margin-bottom:12px;line-height:1.2;}
.service-copy h2 + p{margin-top:0;}
.service-copy p{color:var(--ink-soft);font-size:.98rem;line-height:1.7;margin-bottom:14px;}
.service-copy > * + h2{margin-top:34px;padding-top:30px;border-top:1px solid var(--line);}
.service-copy ul{list-style:none;display:flex;flex-direction:column;gap:10px;margin:6px 0 18px;}
.service-copy ul li{display:flex;align-items:flex-start;gap:10px;font-size:.95rem;color:var(--ink);}
.service-copy ul li::before{
  content:"";flex-shrink:0;width:7px;height:7px;margin-top:8px;border-radius:50%;
  background:var(--accent);
}

/* ---------- Dienstenkaarten (homepage) ---------- */
.diensten-kaarten{
  display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:44px;
}
.dienst-kaart{
  position:relative;display:flex;flex-direction:column;
  background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;
  transition:transform .35s var(--ease),border-color .3s,box-shadow .35s var(--ease);
}
.dienst-kaart:hover{
  transform:translateY(-5px);border-color:var(--ink);
  box-shadow:0 18px 38px rgba(10,10,10,.1);
}
.dk-media{display:block;aspect-ratio:16/10;overflow:hidden;background:var(--bg-alt);}
.dk-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s var(--ease);}
.dienst-kaart:hover .dk-media img{transform:scale(1.06);}
.dk-num{
  position:absolute;top:0;left:0;margin:14px;
  background:var(--ink);color:#fff;
  font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:.9rem;
  letter-spacing:.06em;padding:5px 11px;border-radius:999px;
  transition:background .3s;
}
.dienst-kaart:hover .dk-num{background:var(--accent);}
.dk-body{display:flex;flex-direction:column;flex:1;padding:20px 20px 22px;}
.dk-body h3{font-size:1.1rem;font-weight:700;margin-bottom:8px;line-height:1.2;}
.dk-body p{font-size:.88rem;color:var(--ink-soft);line-height:1.55;}
.dk-link{
  display:inline-flex;align-items:center;gap:8px;margin-top:auto;padding-top:16px;
  font-size:.84rem;font-weight:700;color:var(--accent-dark);
}
.dk-link svg{width:15px;height:15px;transition:transform .25s var(--ease);}
.dienst-kaart:hover .dk-link svg{transform:translateX(4px);}
@media(max-width:1080px){.diensten-kaarten{grid-template-columns:repeat(3,1fr);}}
@media(max-width:860px){.diensten-kaarten{grid-template-columns:repeat(2,1fr);gap:18px;}}
@media(max-width:560px){.diensten-kaarten{grid-template-columns:1fr;}}

/* ---------- Contact ---------- */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;margin-top:44px;}
.info-list{display:flex;flex-direction:column;gap:20px;margin-top:30px;}
.info-row{display:flex;gap:14px;align-items:flex-start;}
.info-row .ico{width:42px;height:42px;border-radius:50%;background:var(--accent-light);display:flex;align-items:center;justify-content:center;flex-shrink:0;position:relative;}
.info-row .ico::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:1.5px dashed rgba(43,110,245,.3);}
.info-row svg{width:18px;height:18px;color:var(--accent-dark);}
.info-row strong{display:block;font-size:.95rem;}
.info-row strong a:hover{color:var(--accent-dark);}
.footer-col p a:hover{color:#fff;}
.info-row span{color:var(--ink-soft);font-size:.88rem;}
.werkgebied{margin-top:34px;padding-top:30px;border-top:1px solid var(--line);}
.werkgebied h2{font-size:1.2rem;font-weight:700;margin-bottom:10px;}
.werkgebied > p{color:var(--ink-soft);font-size:.93rem;line-height:1.65;}
.plaatsen{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin-top:18px;}
.plaatsen li{
  background:var(--bg-alt);border:1px solid var(--line);border-radius:999px;
  padding:7px 14px;font-size:.85rem;font-weight:600;color:var(--ink);
}
.werkgebied-note{
  display:flex;gap:12px;align-items:flex-start;margin-top:24px;
  background:var(--accent-light);border-radius:14px;padding:16px 18px;
}
.werkgebied-note svg{width:19px;height:19px;color:var(--accent-dark);flex-shrink:0;margin-top:1px;}
.werkgebied-note span{font-size:.89rem;color:var(--ink);line-height:1.6;}
.map-embed{margin-top:30px;border-radius:16px;overflow:hidden;border:1px solid var(--line);aspect-ratio:16/9;background:var(--bg-alt);display:flex;align-items:center;justify-content:center;color:var(--grey);font-size:.85rem;}
form{background:var(--bg-alt);border:1px solid var(--line);border-radius:18px;padding:32px;}
.f-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.field{margin-bottom:16px;}
.field label{display:block;font-size:.82rem;font-weight:600;color:var(--ink-soft);margin-bottom:7px;}
.field input,.field textarea,.field select{
  width:100%;background:#fff;border:1px solid var(--line);border-radius:10px;
  padding:13px 14px;min-height:44px;color:var(--ink);font-family:inherit;font-size:1rem;
}
.field input:focus-visible,.field textarea:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-color:var(--accent);}
.field textarea{resize:vertical;min-height:100px;}
.captcha-row{display:flex;align-items:center;gap:10px;margin-bottom:18px;font-size:.85rem;color:var(--ink-soft);}
.captcha-row input{width:20px;height:20px;flex-shrink:0;}
.website-field{position:absolute;left:-9999px;opacity:0;}
.form-msg{font-size:.88rem;margin-top:10px;}
@media(max-width:860px){.contact-grid{grid-template-columns:1fr;gap:30px;}.f-row{grid-template-columns:1fr;}}

/* ---------- Page banner (non-home hero variant) ---------- */
.page-banner{background:var(--dark);color:#fff;padding:56px 0 46px;}
.page-banner .eyebrow{color:var(--accent-light);}
.page-banner h1{color:#fff;font-size:clamp(2rem,4vw,2.8rem);}
.breadcrumb{font-size:.82rem;color:#9c9c98;margin-top:10px;}
.breadcrumb a{color:#cfcfcb;}
.breadcrumb a:hover{color:#fff;}

/* ---------- Footer ---------- */
footer{background:var(--dark);color:#cfcfcb;padding:56px 0 26px;}
.footer-top{display:flex;justify-content:space-between;flex-wrap:wrap;gap:40px;padding-bottom:40px;border-bottom:1px solid rgba(255,255,255,.1);}
.footer-logo{display:inline-flex;align-items:center;gap:10px;font-weight:700;font-family:'Barlow Condensed';font-size:1.05rem;color:#fff;transition:opacity .25s;}
.footer-logo:hover{opacity:.75;}
.footer-logo img{height:14px;width:auto;filter:invert(1) brightness(2);}
.footer-desc{color:#9c9c98;font-size:.88rem;max-width:280px;margin-top:14px;}
.footer-cols{display:flex;gap:56px;flex-wrap:wrap;}
.footer-col h4{font-size:.78rem;text-transform:uppercase;letter-spacing:.1em;color:#8b8b87;margin-bottom:16px;}
.footer-col a,.footer-col p{display:block;font-size:.89rem;color:#cfcfcb;margin-bottom:10px;}
.footer-col a:hover{color:#fff;}
.footer-bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px 26px;padding-top:24px;font-size:.78rem;color:#8b8b87;}
.footer-credit a{color:#cfcfcb;font-weight:600;border-bottom:1px solid rgba(255,255,255,.25);}
.footer-credit a:hover{color:#fff;border-bottom-color:#fff;}

/* ---------- Reveal ---------- */
.rv{opacity:0;transform:translateY(26px);transition:opacity .8s var(--ease),transform .8s var(--ease);}
.rv.in{opacity:1;transform:none;}
/* zonder JS (of als het script faalt) mag content nooit onzichtbaar blijven */
@media(scripting:none){.rv{opacity:1;transform:none;}}

/* ---------- Cookie banner (slanke balk onderaan, dekt geen content af) ---------- */
#cookieBanner{
  position:fixed;left:0;right:0;bottom:0;z-index:9999;
  background:#fff;border-top:1px solid var(--line);
  box-shadow:0 -4px 24px rgba(0,0,0,.08);
  padding:13px max(16px, calc((100vw - 1180px) / 2));
  display:none;opacity:0;transform:translateY(100%);
  transition:opacity .3s ease,transform .35s var(--ease);
}
#cookieBanner.show{display:flex;flex-wrap:wrap;align-items:center;gap:6px 20px;}
#cookieBanner.in{opacity:1;transform:translateY(0);}
#cookieBanner .ck-titel{font-size:.86rem;font-weight:700;color:var(--ink);margin:0;flex:0 0 auto;}
#cookieBanner .ck-txt{font-size:.82rem;color:var(--ink-soft);margin:0;line-height:1.5;flex:1 1 220px;}
#cookieBanner .ck-txt a{color:var(--accent);text-decoration:underline;}
#cookieBanner .ck-btns{display:flex;gap:8px;flex:0 0 auto;}
#cookieBanner .ck-btns .btn{text-align:center;padding:8px 16px;font-size:.8rem;min-height:auto;white-space:nowrap;}
#cookieBanner .ck-settings-link{
  background:none;border:none;cursor:pointer;padding:4px 2px;flex:0 0 auto;
  font-size:.78rem;color:var(--grey);text-decoration:underline;transition:color .2s;
}
#cookieBanner .ck-settings-link:hover{color:var(--accent);}
.xvs-cookie-panel{display:none;flex:1 1 100%;margin-top:12px;padding-top:12px;border-top:1px solid var(--line);max-width:560px;}
.xvs-cookie-panel.open{display:block;}
@media(max-width:600px){
  #cookieBanner.show{gap:8px 14px;}
  #cookieBanner .ck-titel{flex-basis:100%;}
  #cookieBanner .ck-txt{flex-basis:100%;}
  #cookieBanner .ck-btns{flex:1 1 100%;order:3;}
  #cookieBanner .ck-btns .btn{flex:1;}
  #cookieBanner .ck-settings-link{order:2;}
}
/* op mobiel boven de vaste bel/offerte-balk, niet eroverheen */
@media(max-width:760px){
  body:has(.mobile-cta-bar) #cookieBanner{bottom:calc(62px + env(safe-area-inset-bottom));}
}
.xvs-cookie-cat{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 0;border-bottom:1px solid var(--line);}
.xvs-cookie-cat:last-of-type{border-bottom:none;}
.xvs-cookie-cat h4{font-size:12px;font-weight:600;color:var(--ink);margin:0 0 1px;}
.xvs-cookie-cat p{font-size:11px;color:var(--grey);margin:0;}
.xvs-toggle{position:relative;width:34px;height:19px;flex-shrink:0;}
.xvs-toggle input{opacity:0;width:0;height:0;position:absolute;}
.xvs-toggle-track{position:absolute;inset:0;background:var(--line);border-radius:19px;cursor:pointer;transition:background .2s;}
.xvs-toggle-track::before{content:'';position:absolute;width:13px;height:13px;left:3px;top:3px;background:#fff;border-radius:50%;transition:transform .2s;box-shadow:0 1px 3px rgba(0,0,0,.2);}
.xvs-toggle input:checked+.xvs-toggle-track{background:var(--accent);}
.xvs-toggle input:checked+.xvs-toggle-track::before{transform:translateX(15px);}
.xvs-toggle input:disabled+.xvs-toggle-track{opacity:.4;cursor:not-allowed;}
.xvs-cookie-save{display:block;width:100%;margin-top:12px;background:var(--accent);color:#fff;border:none;cursor:pointer;padding:9px;border-radius:7px;font-size:12px;font-weight:600;transition:opacity .15s;}
.xvs-cookie-save:hover{opacity:.85;}

/* CTA-hiërarchie: één dominante actie, de rest als tekstlink eronder */
.hero-actions-note{margin-top:14px;font-size:.92rem;color:#DADAD6;}
.hero-actions-note a{color:#fff;text-decoration:underline;font-weight:600;}
.service-copy .hero-actions-note,.service-layout .hero-actions-note{color:var(--ink-soft);}
.service-copy .hero-actions-note a,.service-layout .hero-actions-note a{color:var(--accent-dark);}

/* ---------- Google Maps band ---------- */
.map-band{line-height:0;border-top:1px solid var(--line);}
.map-band iframe{width:100%;height:380px;border:0;display:block;}
@media(max-width:760px){.map-band iframe{height:280px;}}

/* ---------- Hero met ingebouwd offerteformulier ---------- */
.hero-grid{position:relative;z-index:2;display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center;padding:64px 24px 70px;}
@media(max-width:980px){.hero-grid{grid-template-columns:1fr;gap:40px;padding:48px 24px 56px;}}

.gbadge{
  display:inline-flex;align-items:center;gap:10px;
  background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.22);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  border-radius:999px;padding:9px 18px;margin-bottom:22px;
  color:#fff;font-weight:600;font-size:.88rem;
}
.gbadge b{font-weight:800;}
.gstars{display:inline-flex;gap:2px;align-items:center;color:#FFC53D;}
.gstars svg{display:block;width:14px;height:14px;}

.form-card{
  scroll-margin-top:100px;
  /* de hero zet color:#fff; zonder reset werd de kop van het formulier wit op wit */
  color:var(--ink);
  background:#fff;border-radius:18px;
  box-shadow:0 30px 70px rgba(0,0,0,.35);
  padding:30px 28px;width:100%;
}
.form-card h2{font-size:1.4rem;margin-bottom:4px;}
.form-card .form-sub{font-size:.9rem;color:var(--ink-soft);margin-bottom:20px;}
.form-card .field{margin-bottom:13px;}
.form-card .field-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.form-card .field label{display:block;font-weight:700;font-size:.83rem;color:var(--ink);margin-bottom:5px;}
.form-card .field>label::after{content:" *";color:#C0392B;}
.form-card .field input[type="text"],.form-card .field input[type="tel"],.form-card .field input[type="email"]{
  width:100%;padding:12px 13px;border:1.5px solid var(--line);border-radius:9px;
  font:inherit;font-size:1rem;color:var(--ink);background:#fff;
  transition:border-color .2s;min-height:46px;
}
.form-card .field textarea{
  width:100%;padding:12px 13px;border:1.5px solid var(--line);border-radius:9px;
  font:inherit;font-size:1rem;color:var(--ink);background:#fff;resize:vertical;min-height:90px;
  transition:border-color .2s;
}
.form-card .field input[type="text"]:focus,.form-card .field input[type="tel"]:focus,.form-card .field input[type="email"]:focus,.form-card .field textarea:focus{outline:none;border-color:var(--accent);}
.form-card.standalone{max-width:560px;}
.form-card .field input.invalid{border-color:#C0392B;}
.form-card .ferr{display:none;color:#8C2F28;font-size:.8rem;font-weight:600;margin-top:5px;}
.form-card .field.show-err .ferr,.form-card .consent-wrap.show-err .ferr{display:block;}
.form-card .pills{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.form-card .pills label{
  position:relative;display:flex;align-items:center;justify-content:center;text-align:center;
  padding:10px 6px;border:1.5px solid var(--line);border-radius:9px;
  font-weight:600;font-size:.84rem;color:var(--ink-soft);cursor:pointer;
  transition:border-color .2s,background .2s,color .2s;user-select:none;min-height:44px;
}
.form-card .pills input{position:absolute;opacity:0;pointer-events:none;}
.form-card .pills label:hover{border-color:var(--accent);}
.form-card .pills label:has(input:checked){background:var(--accent);border-color:var(--accent);color:#fff;font-weight:700;}
@media(max-width:380px){.form-card .field-row{grid-template-columns:1fr;}}
.form-card .consent{display:flex;gap:10px;align-items:flex-start;font-size:.82rem;color:var(--ink-soft);margin:14px 0;cursor:pointer;}
.form-card .consent input{width:18px;height:18px;margin-top:2px;accent-color:var(--accent);flex-shrink:0;}
.form-card .website-field{position:absolute;left:-9999px;opacity:0;}
.form-card .btn{width:100%;}
.form-card .cf-turnstile{margin:6px 0 14px;min-height:65px;}
.form-card .micro{font-size:.8rem;color:var(--grey);margin-top:12px;text-align:center;}
.form-card .form-msg{display:none;margin-top:14px;padding:12px 14px;border-radius:9px;font-size:.9rem;font-weight:600;}
.form-card .form-msg.err{display:block;background:#FDF0EF;color:#8C2F28;}
.form-card .form-success{display:none;text-align:center;padding:30px 4px;}
.form-card .form-success svg{margin:0 auto 14px;color:var(--accent);}
.form-card .form-success h3{font-size:1.25rem;margin-bottom:8px;}
.form-card .form-success p{color:var(--ink-soft);font-size:.92rem;}
.form-card.done form,.form-card.done .form-sub,.form-card.done h2{display:none;}
.form-card.done .form-success{display:block;}
@media(max-width:760px){
  .form-card{padding:24px 20px;border-radius:14px;}
  .form-card h2{font-size:1.22rem;}
}

/* ---------- Trust strip (onder hero) ---------- */
.trust-strip{background:var(--bg-alt);border-bottom:1px solid var(--line);}
.trust-strip .wrap{display:flex;flex-wrap:wrap;gap:18px 40px;justify-content:space-between;padding:20px 24px;}
.trust-strip .t-item{display:flex;align-items:center;gap:11px;font-weight:700;font-size:.92rem;color:var(--ink);}
.trust-strip .t-item .ico{width:36px;height:36px;border-radius:50%;background:var(--accent-light);display:flex;align-items:center;justify-content:center;flex-shrink:0;position:relative;}
.trust-strip .t-item .ico::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:1.5px dashed rgba(43,110,245,.3);}
.trust-strip .t-item svg{width:17px;height:17px;color:var(--accent-dark);}
@media(max-width:760px){.trust-strip .wrap{flex-direction:column;gap:14px;}}

/* ---------- Icoon-chip (nieuwe stijl, ronde duotone chip i.p.v. vierkant) ---------- */
.icon-chip{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;position:relative;}
.icon-chip::after{content:"";position:absolute;inset:0;border-radius:50%;border:1.5px dashed rgba(43,110,245,.35);}
.icon-chip svg{width:22px;height:22px;color:var(--accent-dark);}
.icon-chip.on-dark{background:rgba(255,255,255,.1);}
.icon-chip.on-dark::after{border-color:rgba(255,255,255,.25);}
.icon-chip.on-dark svg{color:#fff;}

/* ---------- Page banner met foto (i.p.v. kale donkere balk) ---------- */
.page-banner{position:relative;color:#fff;overflow:hidden;padding:0;}
.page-banner-media{position:absolute;inset:0;}
.page-banner-media img{width:100%;height:100%;object-fit:cover;}
.page-banner-media::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(6,8,14,.90) 0%,rgba(6,8,14,.76) 45%,rgba(6,8,14,.48) 100%);}
.page-banner-inner{position:relative;z-index:2;padding:68px 24px 54px;}
.page-banner .eyebrow{color:#9DBBFF;}
.page-banner h1{color:#fff;font-size:clamp(2rem,4vw,2.8rem);margin-bottom:10px;}
.page-banner p.lead{color:#DADAD6;max-width:560px;font-size:1rem;margin-top:6px;}
@media(max-width:760px){.page-banner-inner{padding:52px 24px 40px;}}

/* ---------- Reviewkaart met avatar (Google-stijl) ---------- */
.review-card{position:relative;}
.review-head{display:flex;align-items:center;gap:11px;margin-bottom:12px;}
.review-avatar{width:38px;height:38px;border-radius:50%;color:#fff;font-weight:700;font-size:.95rem;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.review-name-wrap{line-height:1.25;}
.review-name{font-size:.87rem;color:var(--ink);font-weight:700;}
.review-time{font-size:.78rem;color:var(--grey);}
.review-head .glogo{margin-left:auto;flex-shrink:0;}

/* ---------- Mobiele afwerking ---------- */
@media(max-width:560px){
  /* knoppen naast elkaar worden op smalle schermen onrustig: volle breedte leest rustiger */
  .cta-actions{flex-direction:column;align-items:stretch;}
  .cta-actions .btn{width:100%;}
  .hero-actions{flex-direction:column;align-items:stretch;}
  .hero-actions .btn{width:100%;}
  .cta-steps{padding:20px;}
  .cta-steps > li{gap:13px;}
  /* de scoreplaceholder was op mobiel onevenredig groot */
  .xvs-gscore,.reviews .gscore{gap:14px;}
  .xvs-gscore-num{font-size:2.1rem;}
  #reviews .wrap span[style*="3rem"]{font-size:2.1rem !important;}
}
@media(max-width:480px){
  /* telefoon en e-mail naast elkaar werden te smal om in te typen */
  .form-card .field-row{grid-template-columns:1fr;gap:0;}
  .form-card{padding:24px 20px;}
  .form-card h2{font-size:1.25rem;}
  .gbadge,.xvs-gbadge{font-size:.8rem;padding:8px 14px;gap:8px;}
}
@media(max-width:760px){
  /* footerkolommen stonden met 56px tussenruimte ver uit elkaar op mobiel */
  .footer-cols{gap:30px;}
  .footer-top{gap:28px;padding-bottom:30px;}
  .footer-desc{max-width:none;}
  .footer-bottom{gap:6px 20px;}
  .service-figure{margin-top:30px;}
  .service-copy{margin-top:30px;}
  .service-copy > * + h2{margin-top:26px;padding-top:24px;}
  .legal{padding-top:36px;}
  .legal h2{margin:28px 0 10px;padding-top:22px;}
}

/* ---------- Vergelijkingstabellen ---------- */
/* grid-items krijgen standaard min-width:auto en groeien mee met een brede tabel;
   min-width:0 laat de tabel binnen zijn eigen scrollgebied blijven */
.service-layout > *{min-width:0;}
.service-copy{min-width:0;}
.vgl-tabel{margin:22px 0 6px;overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%;}
.vgl-tabel table{width:100%;border-collapse:collapse;font-size:.92rem;min-width:460px;}
.vgl-tabel caption{
  text-align:left;font-size:.83rem;color:var(--grey);
  padding-bottom:10px;
}
.vgl-tabel th,.vgl-tabel td{
  text-align:left;padding:12px 14px;border-bottom:1px solid var(--line);vertical-align:top;
}
.vgl-tabel thead th{
  font-family:'Barlow Condensed',sans-serif;font-size:1rem;font-weight:700;
  color:var(--ink);border-bottom:2px solid var(--line);white-space:nowrap;
}
.vgl-tabel tbody th{font-weight:700;color:var(--ink);white-space:nowrap;}
.vgl-tabel td{color:var(--ink-soft);}
.vgl-tabel tbody tr:last-child th,.vgl-tabel tbody tr:last-child td{border-bottom:0;}
.vgl-tabel tbody tr:hover{background:var(--bg-alt);}

/* op smalle schermen niet zijwaarts scrollen, maar per rij als kaartje stapelen */
@media(max-width:560px){
  .vgl-tabel{overflow-x:visible;}
  .vgl-tabel table{min-width:0;}
  .vgl-tabel thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);}
  .vgl-tabel tbody tr{
    display:block;border:1px solid var(--line);border-radius:12px;
    padding:6px 14px;margin-bottom:12px;
  }
  .vgl-tabel tbody tr:hover{background:transparent;}
  .vgl-tabel tbody th,.vgl-tabel tbody td{
    display:block;border-bottom:0;padding:8px 0;white-space:normal;
  }
  .vgl-tabel tbody th[scope="row"]{
    font-family:'Barlow Condensed',sans-serif;font-size:1.05rem;
    padding-bottom:4px;border-bottom:1px solid var(--line);margin-bottom:4px;
  }
  .vgl-tabel tbody td[data-label]::before{
    content:attr(data-label);display:block;
    font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;
    color:var(--grey);margin-bottom:2px;
  }
}

/* ---------- Werkgebiedkaart (contactpagina) ----------
   De regio getekend als printplaat: Best is het verdeelpunt, de banen lopen
   in 45-graden hoeken naar de omliggende plaatsen, met een puls die naar
   buiten loopt. Past bij het vak en zegt in ��n oogopslag: alles is dichtbij. */
.werkkaart{
  display:block;width:100%;height:auto;
  margin:22px 0 0;
  background:#0A0E16;border-radius:18px;
  box-shadow:0 18px 40px rgba(10,10,10,.18);
}
.wk-baan{fill:none;stroke:#2B6EF5;stroke-width:2;stroke-opacity:.32;stroke-linecap:round;stroke-linejoin:round;}
.wk-puls{
  fill:none;stroke:#7FA9FF;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;
  stroke-dasharray:9 91;stroke-dashoffset:100;
  animation:wk-stroom 3.4s linear infinite;
}
@keyframes wk-stroom{to{stroke-dashoffset:0;}}

.wk-pad-buiten{fill:#0A0E16;stroke:#2B6EF5;stroke-width:2;}
.wk-pad-kern{fill:#7FA9FF;}

.wk-kern-halo{fill:#2B6EF5;opacity:.16;}
.wk-kern-ring{fill:#0A0E16;stroke:#2B6EF5;stroke-width:2;}
.wk-bliksem{fill:#2B6EF5;}

.wk-naam{
  font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:20px;
  fill:#fff;letter-spacing:.01em;
}
.wk-naam-best{font-size:26px;}
.wk-km{font-family:'Inter',sans-serif;font-size:14px;font-weight:600;fill:#7D8AA3;letter-spacing:.03em;}
.wk-km-best{fill:#7FA9FF;}

@media(prefers-reduced-motion:reduce){
  .wk-puls{animation:none;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:.5;}
}
@media(max-width:860px){
  /* op mobiel staat de kaart alleen in de kolom en mag hij groter */
  .werkkaart{max-width:none;}
}

/* de plaats waar het bedrijf zit, licht uitgelicht in de lijst */
.plaatsen li.is-basis{
  background:var(--accent-light);border-color:#C9DBFF;color:var(--accent-dark);
}
.wk-bijschrift{margin-top:14px;font-size:.83rem;color:var(--grey);line-height:1.6;}

/* ---------- Contactpagina: kolommen uitbalanceren ---------- */
/* de formulierkaart rekte mee met de hoge linkerkolom en liet wit over */
.contact-grid{align-items:start;}
/* linkerkolom en formulier starten op exact dezelfde hoogte */
.contact-grid .contact-info-col{padding-top:30px;}
.contact-grid .contact-info-col .info-list{margin-top:0;}
.contact-grid .form-card{
  box-shadow:0 1px 3px rgba(20,20,20,.05), 0 16px 40px -16px rgba(20,20,20,.22);
  border:1px solid var(--line);
}
@media(max-width:860px){.contact-grid .contact-info-col{padding-top:0;}}


/* ---------- Reviews: quotelint op een donkere band ----------
   Geen kaartjes in een carrousel meer. De quotes lopen als een lint door,
   gescheiden door de bliksem uit het logo. Twee banen die tegen elkaar in
   bewegen, zodat het rustig blijft maar wel leeft. */
.reviews-band{
  background:#0A0E16;color:#fff;overflow:hidden;
  padding-top:80px;padding-bottom:80px;
}
.reviews-band .eyebrow{color:#7FA9FF;}
.reviews-band h2{
  color:#fff;font-size:clamp(1.7rem,3.2vw,2.3rem);line-height:1.15;max-width:520px;
}
.reviews-kop{
  display:flex;align-items:flex-end;justify-content:space-between;
  gap:40px;flex-wrap:wrap;
}
.score-paneel{
  display:flex;align-items:center;gap:16px;flex-shrink:0;
  padding:16px 22px;border:1px solid rgba(255,255,255,.16);border-radius:14px;
  background:rgba(255,255,255,.04);
}
.sp-cijfer{
  font-family:'Barlow Condensed',sans-serif;font-weight:700;
  font-size:3.1rem;line-height:.9;letter-spacing:-.01em;
}
.sp-rechts{display:block;}
.sp-sterren{display:block;color:#FFC53D;font-size:1.05rem;letter-spacing:.06em;}
.sp-sub{display:flex;align-items:center;gap:5px;margin-top:5px;font-size:.83rem;color:#9AA6BC;}
.sp-sub .g-logo{width:13px;height:13px;}

.rq-wrap{
  margin-top:52px;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);
}
.rq-baan{display:flex;width:max-content;}
.rq-baan + .rq-baan{margin-top:18px;}
.rq-baan-links{animation:rq-links 78s linear infinite;}
.rq-baan-rechts{animation:rq-rechts 92s linear infinite;}
.rq-wrap:hover .rq-baan{animation-play-state:paused;}
@keyframes rq-links{from{transform:translateX(0);}to{transform:translateX(-50%);}}
@keyframes rq-rechts{from{transform:translateX(-50%);}to{transform:translateX(0);}}

.rq-lint{display:flex;align-items:center;}
.rq{
  flex-shrink:0;max-width:420px;padding:0 6px;
}
.rq p{
  font-size:.98rem;line-height:1.6;color:#E4E8F0;
}
.rq-naam{
  display:block;margin-top:8px;
  font-family:'Barlow Condensed',sans-serif;font-weight:700;
  font-size:.95rem;letter-spacing:.04em;text-transform:uppercase;color:#7FA9FF;
}
.rq-sep{
  flex-shrink:0;display:flex;align-items:center;justify-content:center;
  width:52px;
}
.rq-sep svg{width:15px;height:20px;fill:#2B6EF5;opacity:.8;}

@media(prefers-reduced-motion:reduce){
  .rq-baan{animation:none;}
  .rq-wrap{-webkit-mask-image:none;mask-image:none;overflow-x:auto;}
}
@media(max-width:760px){
  .reviews-band{padding-top:56px;padding-bottom:56px;}
  .reviews-kop{gap:26px;}
  .score-paneel{padding:14px 18px;gap:13px;}
  .sp-cijfer{font-size:2.6rem;}
  .rq{max-width:290px;}
  .rq p{font-size:.94rem;}
  .rq-sep{width:38px;}
  .rq-wrap{margin-top:38px;}
}