:root{--primary:#1f6f5e;--accent:#d3363a;--ink:#0e0e0e;--bg:#f6f7f8;--radius:12px;--shadow:0 6px 20px rgba(0,0,0,.06);--w:1140px}
*{box-sizing:border-box}html,body{margin:0;background:#fff;color:var(--ink);font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}
img{max-width:100%;height:auto}a{color:var(--primary);text-decoration:none}
.container{max-width:var(--w);margin:0 auto;padding:0 16px}
header{position:sticky;top:0;background:#fff;border-bottom:3px solid var(--primary);z-index:50}
.nav{display:flex;align-items:center;justify-content:space-between;padding:12px 0;gap:12px}
.brand img{height:56px;width:auto;object-fit:contain;display:block}.menu a{padding:10px 12px;border-radius:10px;color:#0e0e0e;font-weight:600}.menu a:hover{background:#eaf6f3}
#navToggle{display:none}
#navToggle span{display:block;width:20px;height:2px;background:var(--primary);position:relative}
#navToggle span:before,#navToggle span:after{content:'';position:absolute;left:0;width:18px;height:2px;background:var(--primary)}
#navToggle span:before{top:-6px}#navToggle span:after{top:6px}
.menu{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end;align-items:center}.menu.open{}
@media(min-width:860px){#navToggle{display:none}.menu{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end;align-items:center}.menu a{padding:10px 12px;border-radius:10px;color:#0e0e0e;font-weight:600}}
.hero{background:linear-gradient(180deg,#f3fbf8 0,#eaf6f3 100%);border-bottom:4px solid var(--accent)}
.hero .wrap{display:grid;grid-template-columns:1fr;gap:18px;padding:28px 0}
.hero h1{font-size:clamp(28px,5vw,46px);margin:6px 0 8px}.hero p.lead{color:#30423d;font-size:clamp(16px,2.2vw,20px);margin:0}
.cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:12px;justify-content:center}
.btn{display:inline-block;padding:12px 18px;border-radius:var(--radius);border:2px solid var(--primary);background:var(--primary);color:#fff;font-weight:800}
.btn.outline{background:#fff;color:var(--primary)}.btn.accent{border-color:var(--accent);background:var(--accent)}
section{padding:42px 0;border-top:1px solid #eee;background:#fff}h2{font-size:clamp(22px,3vw,32px);color:var(--primary);text-align:center;margin:0 0 18px}.sub{text-align:center;color:#53656b;margin-top:-8px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px}.card{background:#fff;border:1px solid #e5e7eb;border-radius:var(--radius);padding:16px;box-shadow:var(--shadow)}
.badge{display:inline-block;padding:6px 10px;background:#f7fbfa;border:1px solid #e5e7eb;border-radius:999px;font-size:14px;color:#4b5563}.usps{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:8px}
.faq details{border:1px solid #e5e7eb;border-radius:12px;padding:12px 14px;background:#fff}.faq details+details{margin-top:10px}.faq summary{cursor:pointer;font-weight:700}
.form{max-width:900px;margin:0 auto;display:grid;gap:14px}label b{display:block;margin:0 0 6px}input,select,textarea{width:100%;padding:12px;border:1px solid #cbd5e1;border-radius:10px;font:inherit}
.hint{font-size:12px;color:#64748b}.error{color:#d3363a;font-size:13px;display:none}
.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}.gallery img{width:100%;height:200px;object-fit:cover;border-radius:12px;border:1px solid #e5e7eb}
footer{background:#0f1f1b;color:#e8eeec;border-top:4px solid var(--accent)}.footer{display:grid;grid-template-columns:1fr;gap:14px;padding:28px 0}
.footer a{color:#fff}.footer small a{opacity:.85}@media(min-width:720px){.footer{grid-template-columns:1fr auto}}
.sticky{position:fixed;left:0;right:0;bottom:0;background:#fff;border-top:2px solid var(--primary);padding:10px 16px;display:flex;gap:10px;justify-content:space-between;align-items:center;z-index:99}
.sticky .btn{padding:10px 14px}
:focus-visible{outline:3px solid var(--accent);outline-offset:2px}

@media (max-width: 640px){
  .menu a{padding:10px 8px;font-size:15px}
  .nav{align-items:flex-start}
  .brand img{height:56px;width:auto;object-fit:contain;display:block}
}

@media (max-width:640px){
  .btn{padding:14px 18px}
}

/* Sticky shadow on scroll */
body.scrolled header{box-shadow:0 6px 18px rgba(0,0,0,.06)}
/* Active link styling */
.menu a.active{position:relative}
.menu a.active::after{content:'';position:absolute;left:10px;right:10px;bottom:4px;height:3px;background:var(--accent);border-radius:2px}
/* Compact hero text on small screens */
@media (max-width:640px){
  .hero h1{font-size:26px}
  .hero p.lead{font-size:15px}
}

@media (max-width:480px){
  .brand img{height:48px}
}

@media (max-width:640px){ .menu{display:flex} }

.hero .wrap img{border-radius:12px;border:1px solid #e5e7eb}

/* Top utility bar (mobile) */
.topbar{}

@media (max-width:640px){.topbar{}}
.btn.ghost{background:#fff;border:1px solid #cbd5e1;color:#0e0e0e}
/* Reviews layout */
.reviews{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}
.review{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:12px;box-shadow:var(--shadow)}
.review .meta{color:#64748b;font-size:13px}
.badge-proof{display:inline-block;background:#e9f7ef;color:#0e7a49;border:1px solid #bfe7d1;border-radius:999px;padding:4px 8px;font-size:12px}
/* Cookie banner */
.cookie{position:fixed;z-index:9999;left:12px;right:12px;bottom:12px;background:#0f1f1b;color:#fff;border-radius:12px;padding:12px;border:1px solid #0b1613;display:none}
.cookie .actions{display:flex;gap:8px;margin-top:8px;justify-content:flex-end}
.cookie .btn{padding:10px 14px}

.icon-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin-top:10px}
.icon-item{display:flex;gap:10px;align-items:flex-start;background:#f7fbf9;border:1px solid #e5e7eb;border-radius:12px;padding:10px}
.icon-item i{display:inline-flex;width:28px;height:28px;border-radius:999px;justify-content:center;align-items:center;background:var(--primary);color:#fff;font-style:normal;font-weight:800}

/* v24: harden nav visibility */
header .menu{display:flex !important;gap:16px;flex-wrap:wrap;justify-content:flex-end;align-items:center}
.brand img{height:56px;width:auto;object-fit:contain}
@media(max-width:480px){.brand img{height:48px}}

/* v26: center main intro on detail pages */
.page-center .container, .page-center .container * {text-align:center}

/* v29: keep nav inline and enlarge logo */
header .menu{flex-wrap:nowrap !important; gap:12px}
header .menu a{white-space:nowrap}
.brand img{height:64px}
@media(max-width:480px){
  header .menu a{font-size:0.95rem}
  .brand img{height:56px}
}

.steps-nolist{list-style:none;padding-left:0}
.steps-nolist li{margin:6px 0}

/* v30: micro 'Meer' menu on very small screens */
@media(max-width:380px){
  header .menu a.hide-xs{display:none}
  .more-menu{position:relative}
  .more-menu > button{border:1px solid var(--primary);background:#fff;padding:6px 10px;border-radius:10px}
  .more-menu ul{display:none;position:absolute;right:0;top:110%;background:#fff;border:1px solid #e5e7eb;border-radius:10px;min-width:150px;box-shadow:0 8px 24px rgba(0,0,0,.08);padding:6px;margin:0;list-style:none}
  .more-menu ul li a{display:block;padding:8px 10px}
  .more-menu.open ul{display:block}
}

/* v31: nav cleanup */
header nav, header nav ul{list-style:none;margin:0;padding:0}
.more-menu{display:none} /* hidden by default */
.more-menu ul{display:none;list-style:none;margin:0;padding:0}
.more-menu ul li{list-style:none}
@media(max-width:380px){
  .more-menu{display:inline-block}
  header .menu a.hide-xs{display:none}
  .more-menu > button{border:1px solid var(--primary);background:#fff;padding:6px 10px;border-radius:10px}
  .more-menu.open ul{display:block;position:absolute;right:0;top:110%;background:#fff;border:1px solid #e5e7eb;border-radius:10px;min-width:150px;box-shadow:0 8px 24px rgba(0,0,0,.08);}
  .more-menu ul li a{display:block;padding:8px 10px}
}

/* v31: FAQ tidy */
details{background:#fff;border:1px solid #e5e7eb;border-radius:10px;padding:10px;margin:8px 0}
details[open]{background:#f8faf9}

/* v32: Header cleanup and More visibility */
header nav, header nav ul{list-style:none;margin:0;padding:0}
.more-menu{display:none;position:relative}
.more-menu ul{display:none}
@media(max-width:380px){
  .more-menu{display:inline-block}
  header .menu a.hide-xs{display:none}
  .more-menu > button{border:1px solid var(--primary);background:#fff;padding:6px 10px;border-radius:10px}
  .more-menu.open ul{display:block;position:absolute;right:0;top:110%;background:#fff;border:1px solid #e5e7eb;border-radius:10px;min-width:160px;box-shadow:0 8px 24px rgba(0,0,0,.1);padding:4px}
  .more-menu ul li a{display:block;padding:8px 10px}
}

/* v33: bigger logo, responsive downscale on very small screens */
@media(max-width:480px){ .brand img{height:64px !important} }


/* Brand titel 2-kleurig in footer */
.site-footer .brand-title{display:flex;gap:.35rem;align-items:baseline;font-weight:800;letter-spacing:.5px}
.site-footer .brand-title .brand-main{color:#ffffff;text-transform:uppercase}
.site-footer .brand-title .brand-acc{color:#1fa36b;text-transform:lowercase;font-weight:800}
@media (min-width:768px){ .site-footer .brand-title{font-size:1.25rem} }

nav[aria-label="Breadcrumb"]{display:none !important}