/* devanagari */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("/assets/fonts/poppins-300-devanagari.woff2") format('woff2');
  unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B09;
}
/* latin-ext */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("/assets/fonts/poppins-300-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("/assets/fonts/poppins-300-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* devanagari */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/poppins-400-devanagari.woff2") format('woff2');
  unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B09;
}
/* latin-ext */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/poppins-400-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/poppins-400-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* devanagari */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/assets/fonts/poppins-500-devanagari.woff2") format('woff2');
  unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B09;
}
/* latin-ext */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/assets/fonts/poppins-500-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/assets/fonts/poppins-500-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* devanagari */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/assets/fonts/poppins-600-devanagari.woff2") format('woff2');
  unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B09;
}
/* latin-ext */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/assets/fonts/poppins-600-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/assets/fonts/poppins-600-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* devanagari */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/assets/fonts/poppins-700-devanagari.woff2") format('woff2');
  unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B09;
}
/* latin-ext */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/assets/fonts/poppins-700-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/assets/fonts/poppins-700-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


:root{--groen:#4B645A;--groen-d:#4B645A;--groen-dd:#1B2530;--grijs:#5A6560;--grijs-l:#6B756F;--inkt:#1B2530;--tint:#EEF1EB;--tint2:#F5F7F2;--lijn:#E1E6DD;--zacht:#FAFBF9;--cta:#1B2530;--cta-d:#10161D;--sage:#C6F24E;--tekst:#121619;--lime:#C6F24E;--lime-d:#B6E639;}
*{margin:0;padding:0;box-sizing:border-box;}
body{font-family:'Poppins',sans-serif;color:var(--tekst);background:#fff;font-weight:400;line-height:1.6;}
h1,h2,h3,h4,h5{font-weight:600;letter-spacing:-.01em;line-height:1.18;}
a{color:inherit;}
.wrap{max-width:1180px;margin:0 auto;padding:0 40px;}
.btn{display:inline-flex;align-items:center;gap:8px;font-size:15px;font-weight:500;border-radius:999px;padding:13px 26px;text-decoration:none;cursor:pointer;border:none;transition:.2s;}
.btn-primary{background:var(--lime);color:#1B2530;font-weight:600;box-shadow:0 6px 18px rgba(198,242,78,.45);}
.btn-ghost{background:transparent;color:var(--inkt);border:1.5px solid var(--lijn);}
.btn-white{background:#fff;color:var(--groen-dd);box-shadow:0 6px 18px rgba(0,0,0,.12);}
.eyebrow{font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--groen-dd);font-weight:600;}
.photo{border-radius:18px;position:relative;overflow:hidden;border:1px solid var(--lijn);background:linear-gradient(135deg,#cfe9da 0%,#eef6f0 50%,#d6ecdf 100%);}
.photo:not(:has(img))::after{content:"";position:absolute;inset:10px;border:1.5px dashed rgba(31,90,61,.35);border-radius:12px;pointer-events:none;}
.photo::before{content:"";position:absolute;inset:0;background:radial-gradient(120px 120px at 75% 25%, rgba(255,255,255,.5), transparent 70%);}
.photo .tag{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:var(--groen-dd);font-size:13px;font-weight:500;opacity:.75;text-align:center;padding:0 14px;}
.photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;filter:saturate(.99) brightness(1.02);}
.photo::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(165deg,rgba(40,54,54,.05),rgba(40,54,54,0) 45%);}
.photo::before{z-index:2;}
.heromedia>*:not(.photo){position:relative;z-index:3;}
.topbar{background:var(--inkt);color:#cfe9da;font-size:12.5px;}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;height:38px;}
.topbar a{color:#fff;text-decoration:none;}
.topbar .r{display:flex;gap:22px;align-items:center;color:#C2CDC9;}
header{position:sticky;top:0;background:rgba(255,255,255,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--lijn);z-index:10;}
header .wrap{display:flex;align-items:center;justify-content:space-between;height:78px;}
header img.logo{height:46px;}
nav{display:flex;gap:30px;}
nav a{text-decoration:none;color:var(--grijs);font-size:15px;font-weight:400;}
nav a.active{color:var(--inkt);font-weight:600;}
.hdr-cta{display:flex;align-items:center;gap:18px;}
.hdr-phone{font-weight:600;color:var(--inkt);font-size:15px;text-decoration:none;}
.hero{background:radial-gradient(900px 480px at 90% -20%, var(--tint) 0%, rgba(238,246,240,0) 60%),radial-gradient(700px 420px at -8% 30%, rgba(198,242,78,.10), rgba(198,242,78,0) 55%),#fff;}
.crumb{font-size:13px;color:var(--grijs-l);padding-top:30px;}
.crumb a{color:var(--grijs-l);text-decoration:none;}.crumb b{color:var(--groen-d);font-weight:500;}
.hero .grid{display:grid;grid-template-columns:1.02fr .98fr;gap:54px;align-items:center;padding-top:24px;padding-bottom:78px;}
.hero h1{font-size:46px;color:var(--inkt);}
.hero p.sub{font-size:17.5px;color:var(--grijs);margin:20px 0 28px;max-width:500px;}
.hero .cta{display:flex;gap:14px;flex-wrap:wrap;}
.trust{display:flex;gap:26px;margin-top:34px;font-size:13.5px;color:var(--grijs-l);}
.trust b{color:var(--inkt);font-weight:600;display:block;font-size:20px;}
.heromedia{position:relative;}
.photo-hero{height:420px;}
.floatcard{position:absolute;left:-22px;bottom:-26px;background:#fff;border:1px solid var(--lijn);border-radius:14px;box-shadow:0 18px 44px rgba(43,54,54,.16);padding:16px 18px;width:262px;z-index:3;}
.floatcard .lab{font-size:11px;color:var(--grijs-l);text-transform:uppercase;letter-spacing:.06em;font-weight:600;margin-bottom:8px;}
.crow{display:flex;align-items:center;gap:9px;padding:5px 0;}
.crow .c{width:22px;height:22px;border-radius:6px;background:var(--groen);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.crow span{font-size:13px;color:var(--inkt);font-weight:400;}
.kpirow{display:flex;justify-content:space-between;align-items:center;padding:7px 0;border-bottom:1px solid var(--lijn);}
.kpirow:last-child{border-bottom:none;}
.kpirow .kl{font-size:12.5px;color:var(--grijs);}
.kpirow .kv{font-size:15px;font-weight:600;color:var(--inkt);}
.kpirow .kv small{color:var(--groen-d);font-size:12px;font-weight:600;margin-left:6px;}
.panel{background:#fff;border:1px solid var(--lijn);border-radius:18px;box-shadow:0 24px 60px rgba(43,54,54,.10);padding:22px 24px;}
.panel .lbl{font-size:12px;color:var(--grijs-l);letter-spacing:.04em;}
.panel .big{font-size:30px;font-weight:600;color:var(--inkt);margin-top:2px;}
.panel .big small{font-size:14px;color:var(--groen-d);font-weight:600;margin-left:8px;}
.bars{display:flex;align-items:flex-end;gap:9px;height:84px;margin-top:16px;}
.bars span{flex:1;border-radius:6px 6px 3px 3px;background:var(--tint);}
.bars span.g{background:var(--groen);}.bars span.g2{background:#86d2a6;}
section{padding:70px 0;}
.sec-head{max-width:680px;margin-bottom:38px;}
.sec-head.center{text-align:center;margin-left:auto;margin-right:auto;}
.sec-head h2{font-size:32px;color:var(--inkt);margin-top:10px;}
.sec-head p{color:var(--grijs);margin-top:12px;font-size:16px;}
.zacht{background:var(--zacht);}
.grid5{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;}
.vcard{background:#fff;border:1px solid var(--lijn);border-radius:16px;padding:26px 22px;}
.vcard .ic{width:46px;height:46px;border-radius:12px;background:var(--tint);display:flex;align-items:center;justify-content:center;color:var(--groen-d);margin-bottom:14px;}
.vcard h4{font-size:16px;color:var(--inkt);margin-bottom:6px;}.vcard p{font-size:14px;color:var(--grijs);}
.grid-d{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.dcard{border:1px solid var(--lijn);border-radius:16px;padding:28px 26px;background:#fff;transition:.2s;text-decoration:none;display:block;}
.dcard h3{font-size:18px;color:var(--inkt);margin-bottom:8px;}
.dcard p{font-size:14px;color:var(--grijs);margin-bottom:14px;}
.dcard .ln{font-size:14px;color:var(--groen-d);font-weight:600;}
.included{display:grid;grid-template-columns:1fr 1fr;gap:14px 34px;}
.inc{display:flex;gap:14px;align-items:flex-start;padding:14px 0;border-bottom:1px solid var(--lijn);}
.inc .c{width:30px;height:30px;border-radius:9px;background:var(--groen);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.inc b{font-size:15.5px;color:var(--inkt);font-weight:600;display:block;}.inc span{font-size:13.5px;color:var(--grijs);}
.voorwie .row{display:grid;grid-template-columns:.9fr 1.1fr;gap:46px;align-items:center;}
.voorwie ul{list-style:none;margin-top:6px;}
.voorwie li{position:relative;padding-left:30px;margin-bottom:12px;font-size:15.5px;color:var(--inkt);}
.voorwie li::before{content:"";position:absolute;left:0;top:8px;width:14px;height:14px;border-radius:50%;background:var(--tint);border:3px solid var(--groen);}
.photo-wie{height:300px;}
.ai{background:radial-gradient(760px 440px at 82% -10%,rgba(198,242,78,.20),rgba(198,242,78,0) 62%),radial-gradient(620px 420px at -6% 108%,rgba(75,100,90,.35),rgba(75,100,90,0) 60%),var(--inkt);color:#fff;}
.ai .grid{display:grid;grid-template-columns:1.05fr .95fr;gap:50px;align-items:center;}
.ai .eyebrow{color:#C6F24E;}
.ai h2{font-size:32px;color:#fff;margin-top:10px;}
.ai .intro{color:#b7c7c7;font-size:16px;margin:14px 0 22px;}
.ailist{list-style:none;}
.ailist li{position:relative;padding-left:38px;margin-bottom:16px;}
.ailist li .ic{position:absolute;left:0;top:0;width:26px;height:26px;border-radius:7px;background:rgba(156,167,141,.18);color:#C6F24E;display:flex;align-items:center;justify-content:center;}
.ailist li b{color:#fff;font-weight:600;font-size:15px;display:block;}
.ailist li span{color:#a9bcbc;font-size:13.5px;}
.human{margin-top:8px;background:rgba(156,167,141,.12);border:1px solid rgba(127,217,164,.3);border-radius:12px;padding:16px 18px;color:#dff3e8;font-size:14px;}
.human b{color:#fff;}
.flow{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:18px;padding:26px;}
.flow .ft{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:#C6F24E;font-weight:600;margin-bottom:18px;}
.fstep{display:flex;align-items:center;gap:14px;padding:13px 0;}
.fstep .d{width:34px;height:34px;border-radius:9px;background:rgba(156,167,141,.16);color:#C6F24E;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.fstep b{color:#fff;font-size:14px;font-weight:600;display:block;}.fstep span{color:#9fb6b6;font-size:12.5px;}
.fline{height:14px;width:1px;background:rgba(255,255,255,.15);margin-left:17px;}
.bgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;}
.ben{background:#fff;border:1px solid var(--lijn);border-radius:16px;padding:26px 22px;}
.ben .ic{width:46px;height:46px;border-radius:12px;background:var(--tint);color:var(--groen-d);display:flex;align-items:center;justify-content:center;margin-bottom:14px;}
.ben h4{font-size:16px;color:var(--inkt);margin-bottom:6px;}.ben p{font-size:13.5px;color:var(--grijs);}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;}
.step .n{width:42px;height:42px;border-radius:50%;background:var(--tint);color:var(--groen-d);display:flex;align-items:center;justify-content:center;font-weight:600;font-size:16px;margin-bottom:14px;}
.step h4{font-size:15.5px;color:var(--inkt);margin-bottom:5px;}.step p{font-size:13.5px;color:var(--grijs);}
.rev-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.rcard{background:var(--tint2);border:1px solid var(--lijn);border-radius:16px;padding:26px;}
.rcard .stars{color:var(--groen);font-size:15px;letter-spacing:2px;margin-bottom:12px;}
.rcard p{font-size:14.5px;color:var(--inkt);font-weight:400;font-style:italic;}
.rcard .who{margin-top:16px;font-size:13px;color:var(--grijs-l);}
.rcard .who b{color:var(--inkt);font-weight:600;font-style:normal;display:block;}
.qstrip{background:var(--tint);}
.qstrip .wrap{text-align:center;max-width:820px;}
.qstrip .stars{color:var(--groen);letter-spacing:3px;margin-bottom:14px;}
.qstrip p{font-size:22px;color:var(--inkt);font-weight:500;font-style:italic;line-height:1.45;}
.qstrip .who{margin-top:16px;font-size:14px;color:var(--grijs-l);}.qstrip .who b{color:var(--inkt);}
.vbpill{font-size:10px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--grijs-l);border:1px solid var(--lijn);border-radius:10px;padding:3px 9px;vertical-align:middle;}
.seoband{padding:42px 0;border-top:1px solid var(--lijn);}
.seoband p{max-width:780px;margin:0 auto;text-align:center;color:var(--grijs);font-size:15.5px;}
.rnotice{max-width:680px;margin:0 auto 26px;text-align:center;background:#FBF4F2;border:1px solid #efd5cb;border-radius:10px;padding:12px 18px;color:#9a5236;font-size:13px;}
.cmpwrap{overflow-x:auto;border:1px solid var(--lijn);border-radius:16px;}
.cmp{width:100%;border-collapse:collapse;min-width:900px;}
.cmp th,.cmp td{padding:13px 12px;text-align:center;border-bottom:1px solid var(--lijn);font-size:13px;vertical-align:middle;}
.cmp thead th{background:var(--inkt);color:#fff;font-weight:600;vertical-align:top;}
.cmp thead th .pr{display:block;color:#C6F24E;font-size:18px;font-weight:700;margin-top:6px;}
.cmp thead th .pr small{color:#C2CDC9;font-size:11px;font-weight:400;display:block;margin-top:2px;}
.cmp tbody td:first-child{text-align:left;font-weight:600;color:var(--inkt);background:var(--tint2);white-space:nowrap;}
.cmp tbody tr:last-child td{border-bottom:none;}
.cmp .yes{color:var(--groen-d);font-weight:700;font-size:15px;}
.cmp .no{color:var(--grijs-l);}
.inclbox{background:var(--tint);border-radius:16px;padding:26px 30px;margin-top:26px;}
.inclbox h4{font-size:15px;color:var(--inkt);margin-bottom:14px;}
.inclbox ul{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:9px 28px;}
.inclbox li{position:relative;padding-left:26px;font-size:14px;color:var(--inkt);}
.inclbox li::before{content:"";position:absolute;left:0;top:7px;width:13px;height:13px;border-radius:50%;background:#fff;border:3px solid var(--groen);}
.addtable{width:100%;border-collapse:collapse;border:1px solid var(--lijn);border-radius:14px;overflow:hidden;}
.addtable th{background:var(--inkt);color:#fff;text-align:left;padding:13px 16px;font-size:13px;font-weight:600;}
.addtable td{padding:13px 16px;border-bottom:1px solid var(--lijn);font-size:14px;color:var(--inkt);vertical-align:top;}
.addtable td.tar{font-weight:600;color:var(--groen-d);white-space:nowrap;}
.addtable td.toel{color:var(--grijs);font-size:13.5px;}
.addtable tr:last-child td{border-bottom:none;}
.vuist{background:var(--tint);border-left:3px solid var(--groen);border-radius:10px;padding:18px 22px;margin-top:24px;color:var(--inkt);font-size:14px;line-height:1.55;}
.vuist b{color:var(--groen-dd);}
.pkg-feat{border-color:var(--groen)!important;box-shadow:0 18px 44px rgba(156,167,141,.16);position:relative;}
.pkg-rib{position:absolute;top:-13px;left:22px;background:var(--groen);color:#fff;font-size:11px;font-weight:700;
  padding:4px 14px;border-radius:999px;letter-spacing:.04em;box-shadow:0 4px 12px rgba(156,167,141,.35);}
.grp-label{font-size:13px;font-weight:600;color:var(--grijs);letter-spacing:.04em;margin-bottom:14px;
  padding:8px 16px;background:var(--tint);border-radius:8px;display:inline-block;}
.tussencta{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;
  background:#fff;border:1px solid var(--lijn);border-radius:14px;padding:20px 26px;margin-top:26px;
  box-shadow:0 10px 26px rgba(43,54,54,.06);}
.tussencta span{font-size:16px;font-weight:600;color:var(--inkt);}


.pkggrid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.pkg{border:1px solid var(--lijn);border-radius:18px;padding:26px 24px;background:#fff;display:flex;flex-direction:column;}
.pkg .nm{font-size:19px;font-weight:600;color:var(--inkt);}
.pkg .vw{font-size:13px;color:var(--grijs-l);margin-top:3px;min-height:36px;}
.pkg .price{font-size:32px;font-weight:700;color:var(--inkt);margin-top:12px;line-height:1;}
.pkg .price small{font-size:13px;color:var(--grijs-l);font-weight:400;margin-left:4px;}
.pkg .spec{list-style:none;margin:18px 0 22px;border-top:1px solid var(--lijn);padding-top:12px;}
.pkg .spec li{display:flex;justify-content:space-between;gap:12px;padding:7px 0;font-size:13px;border-bottom:1px solid var(--lijn);}
.pkg .spec li:last-child{border-bottom:none;}
.pkg .spec li span{color:var(--grijs);}
.pkg .spec li b{color:var(--inkt);font-weight:600;text-align:right;}
.pkg .spec li b.dim{color:#c2cdc9;font-weight:400;}
.pkg .spec .ok{color:var(--groen-d);font-weight:700;}
.pkg .pbtn{margin-top:auto;}
.extrabox{background:var(--tint);border-radius:16px;padding:28px 30px;}
.extrabox h3{font-size:18px;color:var(--inkt);}
.extrabox .sub{font-size:14px;color:var(--grijs);margin-top:4px;}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px;}
.chip{background:#fff;border:1px solid var(--lijn);border-radius:999px;padding:8px 16px;font-size:13.5px;color:var(--inkt);}
.exnote{font-size:12.5px;color:var(--grijs-l);margin-top:14px;}
.extragrid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:22px;}
.xcard{border:1px solid var(--lijn);border-radius:14px;padding:22px;background:#fff;}
.xcard .xp{font-size:24px;font-weight:700;color:var(--groen-d);}
.xcard .xn{font-size:15px;font-weight:600;color:var(--inkt);margin-top:6px;}
.xcard .xd{font-size:13px;color:var(--grijs);margin-top:4px;}
@media(max-width:760px){.pkggrid{grid-template-columns:1fr;}.extragrid{grid-template-columns:1fr;}}

.faq{background:var(--zacht);}
.qa{background:#fff;border:1px solid var(--lijn);border-radius:14px;padding:22px 24px;margin-bottom:14px;}
.qa h4{font-size:16px;color:var(--inkt);display:flex;justify-content:space-between;align-items:center;}
.qa h4 .plus{color:var(--groen);font-weight:400;font-size:22px;}
.qa p{font-size:14.5px;color:var(--grijs);margin-top:8px;}
.tar .wrap{display:flex;align-items:center;justify-content:space-between;gap:30px;}
.tarteaser{background:var(--tint);}
.tarteaser h3{font-size:24px;color:var(--inkt);}
.tarteaser p{color:var(--grijs);margin-top:6px;font-size:15px;}
.tarteaser .from{font-size:14px;color:var(--grijs-l);}
.tarteaser .from b{font-size:30px;color:var(--groen-d);font-weight:600;}
.over .row{display:grid;grid-template-columns:.8fr 1.2fr;gap:48px;align-items:center;}
.foto-portret{height:360px;border-radius:20px;}
.quote{font-size:21px;color:var(--inkt);font-weight:500;line-height:1.4;margin:18px 0;}
.quote span{color:var(--groen-d);}
.pagehead{background:radial-gradient(800px 360px at 88% -30%, var(--tint), rgba(238,246,240,0) 60%),#fff;padding:48px 0 6px;}
.pagehead h1{font-size:42px;color:var(--inkt);margin-top:8px;}
.pagehead p{color:var(--grijs);font-size:17px;margin-top:12px;max-width:620px;}
.notice{background:#FBF4F2;border:1px solid #efd5cb;border-left:3px solid #D98C73;border-radius:10px;padding:14px 18px;color:#9a5236;font-size:13.5px;margin-bottom:30px;}
.cmp-wrap{overflow-x:auto;border:1px solid var(--lijn);border-radius:14px;}
table.cmp{width:100%;border-collapse:collapse;min-width:900px;}
.cmp thead th{background:var(--inkt);color:#fff;padding:16px 12px;text-align:center;vertical-align:top;font-weight:600;font-size:13px;border-left:1px solid rgba(255,255,255,.08);}
.cmp thead th:first-child{text-align:left;}
.cmp thead th .pp{display:block;color:#C6F24E;font-size:17px;font-weight:700;margin-top:6px;}
.cmp tbody th{text-align:left;font-weight:600;color:var(--inkt);background:var(--zacht);padding:12px 14px;white-space:nowrap;font-size:12.5px;}
.cmp tbody td{padding:12px 12px;text-align:center;border-bottom:1px solid var(--lijn);border-left:1px solid var(--lijn);color:var(--grijs);font-size:12.5px;}
.cmp tbody tr:nth-child(even) td{background:#FAFCFB;}
.cmp tbody tr:nth-child(even) th{background:#F1F6F3;}
.cmp .ok{color:var(--groen-d);font-weight:700;}
.cmp .no{color:#c2cdc9;}
.inclbox{background:var(--tint);border-radius:16px;padding:28px 30px;margin-top:22px;}
.inclbox h3{font-size:18px;color:var(--inkt);margin-bottom:16px;}
.inclgrid{display:grid;grid-template-columns:1fr 1fr;gap:11px 30px;}
.inclgrid div{position:relative;padding-left:28px;font-size:14px;color:var(--inkt);}
.inclgrid div::before{content:"";position:absolute;left:0;top:6px;width:14px;height:14px;border-radius:50%;background:#fff;border:3px solid var(--groen);}
table.svc{width:100%;border-collapse:collapse;font-size:14px;border:1px solid var(--lijn);border-radius:14px;overflow:hidden;}
.svc thead th{background:var(--inkt);color:#fff;text-align:left;padding:14px 16px;font-weight:600;font-size:13px;}
.svc tbody td{padding:14px 16px;border-bottom:1px solid var(--lijn);color:var(--grijs);vertical-align:top;}
.svc tbody td.naam{color:var(--inkt);font-weight:600;width:34%;}
.svc tbody td.tarief{color:var(--groen-d);font-weight:600;white-space:nowrap;width:22%;}
.svc tbody tr:nth-child(even) td{background:#FAFCFB;}
.vuist{background:var(--tint);border-left:3px solid var(--groen);border-radius:10px;padding:18px 22px;color:var(--inkt);font-size:14px;margin-top:24px;}
.vuist b{color:var(--groen-dd);}
@media(max-width:760px){.inclgrid{grid-template-columns:1fr;}.svc td.naam,.svc td.tarief{width:auto;}}

.prices{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;align-items:start;}
.pcard{border:1px solid var(--lijn);border-radius:18px;padding:30px 28px;background:#fff;}
.pcard.feat{border-color:var(--groen);box-shadow:0 18px 44px rgba(156,167,141,.14);position:relative;}
.pcard.feat .rib{position:absolute;top:-12px;left:28px;background:var(--groen);color:#fff;font-size:11px;font-weight:600;padding:4px 12px;border-radius:999px;letter-spacing:.04em;}
.pcard h3{font-size:19px;color:var(--inkt);}
.pcard .pr{font-size:34px;font-weight:600;color:var(--inkt);margin:12px 0 2px;}
.pcard .pr small{font-size:14px;color:var(--grijs-l);font-weight:400;}
.pcard .desc{font-size:13.5px;color:var(--grijs);margin-bottom:18px;}
.pcard ul{list-style:none;margin-bottom:22px;}
.pcard li{position:relative;padding-left:26px;margin-bottom:10px;font-size:14px;color:var(--inkt);}
.pcard li::before{content:"";position:absolute;left:0;top:7px;width:14px;height:14px;border-radius:50%;background:var(--tint);border:3px solid var(--groen);}
.contact .row{display:grid;grid-template-columns:1fr 1fr;gap:46px;align-items:start;}
.cinfo .item{display:flex;gap:14px;align-items:flex-start;margin-bottom:20px;}
.cinfo .ic{width:42px;height:42px;border-radius:11px;background:var(--tint);color:var(--groen-d);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.cinfo b{display:block;color:var(--inkt);font-weight:600;font-size:15px;}
.cinfo span{color:var(--grijs);font-size:14px;}
.cform{background:var(--zacht);border:1px solid var(--lijn);border-radius:18px;padding:30px;}
.cform label{display:block;font-size:13px;color:var(--inkt);font-weight:500;margin:14px 0 6px;}
.cform input,.cform textarea{width:100%;border:1px solid var(--lijn);border-radius:10px;padding:12px 14px;font-family:inherit;font-size:14px;color:var(--inkt);background:#fff;}
.cform textarea{height:120px;resize:none;}
.cform .hint{font-size:11px;color:var(--grijs-l);margin-top:18px;}
.map{height:300px;border-radius:18px;margin-top:18px;border:1px solid var(--lijn);background:linear-gradient(135deg,#e3efe8,#eef6f0);display:flex;align-items:center;justify-content:center;color:var(--groen-dd);font-size:13px;font-weight:500;opacity:.8;}
.ctaband{background:radial-gradient(700px 400px at 84% -12%,rgba(198,242,78,.22),rgba(198,242,78,0) 62%),radial-gradient(560px 380px at 2% 112%,rgba(75,100,90,.4),rgba(75,100,90,0) 58%),var(--inkt);color:#fff;}
.ctaband .wrap{text-align:center;padding:60px 40px;}
.ctaband h2{font-size:32px;}.ctaband p{color:#dff3e8;margin:12px 0 24px;font-size:16px;}
.ctaband .ph{margin-top:16px;font-size:15px;color:#eafff3;}
footer{background:radial-gradient(820px 460px at 88% -14%,rgba(198,242,78,.14),rgba(198,242,78,0) 60%),var(--inkt);color:#9fb0b0;font-size:14px;padding:54px 0 24px;}
footer .cols{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr 1fr;gap:30px;}
footer img.flogo{height:50px;margin-bottom:16px;}
footer h5{color:#fff;font-size:13px;letter-spacing:.12em;text-transform:uppercase;margin-bottom:14px;font-weight:600;}
footer a{color:#9fb0b0;text-decoration:none;display:block;margin-bottom:8px;}
footer .tagline{color:#80938f;max-width:230px;font-size:13.5px;}
footer .hours div{display:flex;justify-content:space-between;max-width:180px;margin-bottom:5px;font-size:13px;}
.footbot{border-top:1px solid #3a4646;margin-top:38px;padding-top:18px;font-size:12.5px;color:#6f8280;display:flex;justify-content:space-between;}
@media(max-width:760px){
.wrap{padding:0 20px;}
nav,.hdr-phone{display:none;}
header .wrap{height:64px;}header img.logo{height:38px;}
.topbar .wrap{font-size:11px;}.topbar span:first-child{max-width:58%;}
.hero .grid{grid-template-columns:1fr;gap:46px;padding-bottom:46px;}
.hero h1{font-size:32px;}.pagehead h1{font-size:30px;}
.floatcard{left:auto;right:0;width:230px;}
section{padding:46px 0;}
.sec-head h2{font-size:25px;}
.grid5,.grid-d,.included,.voorwie .row,.ai .grid,.bgrid,.steps,.rev-grid,.prices,.over .row,.contact .row,.tar .wrap,.inclbox ul{grid-template-columns:1fr;display:grid;}
.tar .wrap{flex-direction:column;align-items:flex-start;}
footer .cols{grid-template-columns:1fr 1fr;gap:24px;}
.qstrip p{font-size:18px;}.ctaband h2{font-size:25px;}.photo-hero{height:300px;}
}

/* ===== Motion-laag v9 (toegevoegd; huisstijl & inhoud ongewijzigd) ===== */
.rv{opacity:0;transform:translateY(26px);transition:opacity .8s cubic-bezier(.16,1,.3,1),transform .8s cubic-bezier(.16,1,.3,1) !important;transition-delay:var(--rd,0s) !important;}
.rv.on{opacity:1;transform:none;}
.page.active{animation:pageIn .5s ease both;}
@keyframes pageIn{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:none;}}
.btn{transition:transform .25s cubic-bezier(.16,1,.3,1),box-shadow .25s,background .25s,border-color .25s;}
.btn:hover{transform:translateY(-2px);}
.btn:active{transform:translateY(0) scale(.98);}
.btn-primary:hover{background:var(--lime-d);box-shadow:0 10px 26px rgba(198,242,78,.55);}
.btn-ghost:hover{border-color:var(--groen);color:var(--groen-dd);}
.dcard,.ben,.rcard,.pkg,.qa,.panel{transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s,border-color .35s;}
.dcard:hover,.ben:hover,.rcard:hover,.pkg:hover{transform:translateY(-5px);box-shadow:0 18px 40px rgba(43,54,54,.10);border-color:#cfe5d8;}
nav a{position:relative;transition:color .25s;}
nav a::after{content:"";position:absolute;left:0;bottom:-6px;width:100%;height:2px;background:var(--groen);border-radius:2px;transform:scaleX(0);transform-origin:left;transition:transform .3s cubic-bezier(.16,1,.3,1);}
nav a:hover::after,nav a.active::after{transform:scaleX(1);}
nav a:hover{color:var(--inkt);}
header{transition:box-shadow .3s;}
header.scrolled{box-shadow:0 10px 32px rgba(43,54,54,.09);}
.floatcard{animation:floaty 6s ease-in-out infinite;}
@keyframes floaty{0%,100%{transform:translateY(0);}50%{transform:translateY(-8px);}}
.qa h4{cursor:pointer;user-select:none;}
.qa .plus{transition:transform .35s cubic-bezier(.16,1,.3,1);display:inline-block;}
.qa.open .plus{transform:rotate(45deg);}
.qa p{overflow:hidden;max-height:300px;transition:max-height .5s cubic-bezier(.16,1,.3,1),opacity .4s,margin-top .4s;}
.qa.closed p{max-height:0;opacity:0;margin-top:0;}
.ic,.crow .c,.inc .c{transition:transform .3s cubic-bezier(.16,1,.3,1);}
.dcard:hover .ic,.ben:hover .ic{transform:scale(1.08) rotate(-3deg);}
@media (prefers-reduced-motion: reduce){
  .rv{opacity:1;transform:none;transition:none;}
  .page.active{animation:none;}
  .floatcard{animation:none;}
  .btn,.dcard,.ben,.rcard,.pkg,.qa,.qa p,.qa .plus,nav a::after{transition:none;animation:none;}
}

/* ===== Mobiel hamburgermenu v9.1 ===== */
.menu-btn{display:none;}
.mobilenav{display:none;}
@media(max-width:760px){
  .menu-btn{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:44px;height:44px;background:none;border:none;cursor:pointer;flex-shrink:0;}
  .menu-btn span{display:block;width:22px;height:2px;background:var(--inkt);border-radius:2px;transition:transform .3s cubic-bezier(.16,1,.3,1),opacity .25s;}
  .menu-btn.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
  .menu-btn.open span:nth-child(2){opacity:0;}
  .menu-btn.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
  .mobilenav{display:grid;position:absolute;left:0;right:0;top:100%;background:#fff;border-bottom:1px solid var(--lijn);box-shadow:0 22px 44px rgba(43,54,54,.14);padding:0 22px;max-height:0;overflow:hidden;transition:max-height .45s cubic-bezier(.16,1,.3,1),padding .3s;}
  .mobilenav.open{max-height:480px;padding:8px 22px 18px;}
  .mobilenav a{display:block;padding:14px 2px;border-bottom:1px solid var(--lijn);text-decoration:none;color:var(--inkt);font-size:16px;font-weight:400;}
  .mobilenav a:last-child{border-bottom:none;color:var(--groen-dd);font-weight:600;}
  .mobilenav a.active{color:var(--groen-dd);font-weight:600;}
}
@media (prefers-reduced-motion: reduce){
  .menu-btn span,.mobilenav{transition:none;}
}


header .logo-dark{display:none}
/* Donkere AI-sectie (antraciet) met teal accenten */
/* Foto-placeholders + slotbalk */
/* Nieuw-dienstkaart in de (groene) dienstengrids */
.dcard.nieuw{position:relative;border-color:#E1E6DD;background:linear-gradient(180deg,#EEF1EB,#fff);}
.dcard.nieuw h3{color:#1B2530;}
.dcard.nieuw .ln{color:#1B2530;}
.dcard.nieuw:hover{border-color:#1B2530!important;box-shadow:0 18px 40px rgba(27,37,48,.18)!important;}
.dcard.nieuw:hover .ic{transform:none;}
.badge-nieuw{display:inline-block;background:#1B2530;color:#fff;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;padding:3px 10px;border-radius:999px;margin-bottom:10px;}


#intro{position:fixed;inset:0;z-index:9999;display:none;align-items:center;justify-content:center;gap:24px;
  background:radial-gradient(900px 600px at 50% 38%, #FFFFFF, #F5F7F2 70%, #EEF1EB 100%);}
#intro.show{display:flex;}
#intro.hide{opacity:0;visibility:hidden;transition:opacity .65s ease, visibility 0s .65s;}
#intro .bm{width:108px;height:auto;opacity:0;transform:scale(.82) translateY(14px);
  animation:dj-bm .8s cubic-bezier(.16,1,.3,1) .05s forwards;
  filter:drop-shadow(0 14px 30px rgba(27,37,48,.16));}
#intro .wm{overflow:hidden;}
#intro .wm h1{font-family:'Poppins',sans-serif;font-weight:700;font-size:50px;line-height:1;color:#1B2530;margin:0;
  opacity:0;transform:translateX(-18px);animation:dj-wm .7s cubic-bezier(.16,1,.3,1) .5s forwards;}
#intro .wm .tag{font-family:'Poppins',sans-serif;font-weight:500;letter-spacing:.2em;color:#4B645A;font-size:15px;
  margin-top:8px;opacity:0;transform:translateY(6px);animation:dj-tag .55s cubic-bezier(.16,1,.3,1) .8s forwards;}
#intro .wm .uline{height:3px;width:0;background:#C6F24E;border-radius:3px;margin-top:12px;
  animation:dj-ul .6s cubic-bezier(.16,1,.3,1) .75s forwards;}
@keyframes dj-bm{to{opacity:1;transform:scale(1) translateY(0)}}
@keyframes dj-wm{to{opacity:1;transform:translateX(0)}}
@keyframes dj-tag{to{opacity:1;transform:translateY(0)}}
@keyframes dj-ul{to{width:100%}}
@media (max-width:560px){#intro{flex-direction:column;gap:14px}#intro .bm{width:88px}#intro .wm h1{font-size:34px}#intro .wm .tag{font-size:12px}}
@media (prefers-reduced-motion:reduce){#intro .bm,#intro .wm h1,#intro .wm .tag,#intro .wm .uline{animation:none;opacity:1;transform:none;width:auto}}

/* ===== Aanvullingen op ontwerp V2.3 (functionele onderdelen) ===== */

/* Toetsenbordfocus zichtbaar */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
.qa h4:focus-visible {
  outline: 3px solid var(--lime);
  outline-offset: 3px;
  border-radius: 6px;
}

/* Header: logo zonder vaste breedte, mobiele menuknop netjes */
header img.logo { width: auto; }
.menu-btn { background: none; border: 0; padding: 8px; cursor: pointer; }

/* Contactgegevens als link */
.cinfo b a { color: inherit; text-decoration: none; }
.cinfo b a:hover { text-decoration: underline; text-underline-offset: 3px; }

/* Formulier */
.cform .hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.cform input:invalid:not(:placeholder-shown),
.cform textarea:invalid:not(:placeholder-shown) { border-color: #C9826B; }
.cform button[disabled] { opacity: .7; cursor: wait; }
.cform .hint a { color: var(--groen-dd); }
.form-status { font-size: 14px; margin-top: 14px; min-height: 1em; }
.form-status.busy { color: var(--grijs); }
.form-status.ok { color: #2F5D47; font-weight: 500; background: #E6F2EA; border-radius: 10px; padding: 10px 14px; }
.form-status.err { color: #8A3B26; font-weight: 500; background: #F8E9E3; border-radius: 10px; padding: 10px 14px; }

/* Kaartkaart (zonder cookies van Google) */
.map.map-card {
  opacity: 1;
  position: relative;
  overflow: hidden;
  text-decoration: none;
  align-items: flex-end;
  justify-content: flex-start;
  background: #EEF1EB;
  transition: box-shadow .3s, border-color .3s;
}
.map.map-card:hover { border-color: var(--groen); box-shadow: 0 14px 34px rgba(27, 37, 48, .12); }
.map-card .map-art { position: absolute; inset: 0; width: 100%; height: 100%; }
.map-card .map-pin { position: absolute; left: 50%; top: 42%; transform: translate(-50%, -100%); color: var(--inkt); filter: drop-shadow(0 6px 10px rgba(27, 37, 48, .25)); }
.map-card .map-label {
  position: relative;
  margin: 16px;
  background: #fff;
  border-radius: 12px;
  padding: 12px 16px;
  box-shadow: 0 8px 22px rgba(27, 37, 48, .12);
  color: var(--inkt);
  font-size: 14px;
  line-height: 1.45;
}
.map-card .map-label b { display: block; font-weight: 600; }
.map-card .map-cta { display: block; margin-top: 4px; color: var(--groen-dd); font-weight: 600; }

/* Footer: social media en onderregel */
footer .socials { display: flex; gap: 10px; margin-top: 18px; }
footer .socials a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  margin: 0;
  border-radius: 10px;
  border: 1px solid #3a4646;
  color: #cfd8d6;
  transition: border-color .25s, color .25s;
}
footer .socials a:hover { border-color: var(--lime); color: var(--lime); }
footer a:hover { color: #fff; }
/* Lange woorden (zoals het e-mailadres) mogen afbreken, anders schuift de pagina op mobiel horizontaal */
footer .cols > div { min-width: 0; }
footer a { overflow-wrap: break-word; }
.footbot a { display: inline; margin: 0; color: #9fb0b0; }
.footbot a:hover { color: #fff; }

/* Tekstpagina's (privacybeleid, 404) */
.prose { max-width: 760px; color: var(--tekst); font-size: 16px; }
.prose h2 { font-size: 22px; color: var(--inkt); margin: 34px 0 10px; }
.prose h2:first-child { margin-top: 0; }
.prose p, .prose ul { margin: 0 0 14px; color: var(--grijs); }
.prose ul { padding-left: 22px; }
.prose li { margin-bottom: 6px; }
.prose a { color: var(--groen-dd); }
.prose table { width: 100%; border-collapse: collapse; margin: 8px 0 18px; font-size: 15px; }
.prose th, .prose td { text-align: left; padding: 10px 12px; border-bottom: 1px solid var(--lijn); vertical-align: top; }
.prose th { color: var(--inkt); font-weight: 600; background: var(--tint2); }
.concept-melding {
  max-width: 760px;
  background: #FFF6D6;
  border: 1px solid #E8D48A;
  color: #5B4A12;
  border-radius: 12px;
  padding: 14px 18px;
  margin-bottom: 30px;
  font-size: 14px;
}
.concept-melding ul { margin: 6px 0 0; padding-left: 20px; }
.linklijst { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 22px; }

/* Mobiele header: in het ontwerp drukte de knop tegen het logo en liep de bovenbalk over twee regels */
@media (max-width: 560px) {
  .topbar .wrap > span:first-child { display: none; }
  .topbar .wrap { justify-content: center; }
  .topbar .r { gap: 18px; white-space: nowrap; }
  header .wrap { gap: 10px; }
  header img.logo { height: 34px; }
  .hdr-cta { gap: 8px; margin-left: auto; }
  .hdr-cta .btn { padding: 9px 14px; font-size: 13px; white-space: nowrap; box-shadow: none; }
}
@media (max-width: 560px) {
  footer .cols > div:nth-child(-n+2) { grid-column: 1 / -1; }
}

/* Tablet-header (761–1080px): in het ontwerp liepen menu en telefoonnummer over meerdere regels.
   Het nummer staat ook in de bovenbalk, dus hier mag het uit de header. */
header nav a, .hdr-phone, .hdr-cta .btn { white-space: nowrap; }
@media (min-width: 761px) and (max-width: 1080px) {
  .hdr-phone { display: none; }
  header .wrap { gap: 20px; }
}
@media (min-width: 761px) and (max-width: 900px) {
  nav { gap: 20px; }
  nav a { font-size: 14.5px; }
  header img.logo { height: 40px; }
}
@media (max-width: 360px) {
  .hdr-cta .btn { display: none; }
}

@media (max-width: 760px) {
  .prose table, .prose thead, .prose tbody, .prose tr, .prose th, .prose td { display: block; }
  .prose thead { display: none; }
  .prose td { border-bottom: 0; padding: 4px 0; }
  .prose tr { border-bottom: 1px solid var(--lijn); padding: 10px 0; }
  .prose td[data-label]::before { content: attr(data-label); display: block; font-size: 12px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--groen-dd); }
  .prose td[data-label] + td[data-label] { padding-top: 8px; }
}

/* ===== Echte reviews ===== */
.rcard p + p, .qstrip p + p { margin-top: 0.7em; }
.qstrip .lang p { font-size: 18px; }
.rcard .who a, .qstrip .who a { color: inherit; text-decoration: underline; text-decoration-color: var(--lijn); text-underline-offset: 3px; }
.rcard .who a:hover, .qstrip .who a:hover { color: var(--inkt); text-decoration-color: currentColor; }
@media (max-width: 760px) { .qstrip .lang p { font-size: 16px; } }

/* ===== Reviews rouleren (zelfde curves als de motion-laag van het ontwerp) ===== */
/* Citaatbalk: hoogte groeit mee, oude review vervaagt omhoog, nieuwe komt binnen met de reveal */
.q-slides.q-anim { overflow: hidden; transition: height .5s cubic-bezier(.16,1,.3,1); }
.q-slide.q-uit { opacity: 0; transform: translateY(-12px); transition: opacity .4s ease, transform .45s cubic-bezier(.16,1,.3,1); }

/* Homepage: zonder script het raster uit het ontwerp (6 kaarten), met script een carrousel */
.rev-grid[data-roulatie]:not(.car) > :nth-child(n+7) { display: none; }
.car-view { overflow-x: hidden; overflow-x: clip; margin: 0 -12px; padding: 0 12px; }
.rev-grid.car { display: flex; gap: 22px; align-items: flex-start; }
.rev-grid.car > .rcard {
  flex: 0 0 calc((100% - 44px) / 3);
  position: relative;
  min-height: var(--rh, 0px);
  transition: transform .35s cubic-bezier(.16,1,.3,1), box-shadow .35s, border-color .35s, min-height .6s cubic-bezier(.16,1,.3,1);
}
@media (max-width: 1024px) { .rev-grid.car > .rcard { flex-basis: calc((100% - 22px) / 2); } }
@media (max-width: 760px) { .rev-grid.car > .rcard { flex-basis: 100%; } }

/* Bediening: subtiel, in de kleuren van het ontwerp */
.rev-nav { display: flex; align-items: center; justify-content: center; gap: 6px; margin-top: 28px; }
.qstrip .rev-nav { margin-top: 22px; }
.rev-nav button { font: inherit; background: none; border: 0; padding: 0; cursor: pointer; color: var(--grijs-l); }
.rev-nav .rn-pijl {
  width: 34px; height: 34px; border-radius: 50%;
  border: 1px solid rgba(75, 100, 90, .22);
  display: inline-flex; align-items: center; justify-content: center;
  transition: color .25s, border-color .25s, background .25s;
}
.rev-nav .rn-pijl:hover { color: var(--groen); border-color: var(--groen); }
.rn-dots { display: flex; margin: 0 6px; }
.rev-nav .rn-dot { width: 20px; height: 24px; display: inline-flex; align-items: center; justify-content: center; }
.rn-dot::before {
  content: ''; width: 7px; height: 7px; border-radius: 999px;
  background: rgba(75, 100, 90, .3);
  transition: width .35s cubic-bezier(.16,1,.3,1), background .35s;
}
.rn-dot:hover::before { background: rgba(75, 100, 90, .55); }
.rn-dot.on::before { width: 14px; background: var(--groen); }

@media (prefers-reduced-motion: reduce) {
  .q-slides.q-anim, .q-slide.q-uit, .rev-grid.car, .rev-grid.car > .rcard, .rn-dot::before { transition: none; }
}

/* ===== Livegang 10 oktober 2026: correcties uit de pre-livegang-check ===== */

/* Lettertype van knoppen en velden gelijk aan de rest van de site (de verstuurknop stond in Arial) */
button, input, textarea, select { font-family: inherit; }

/* Zwevende kaart in de hero. In het ontwerp werd hij door `.heromedia>*:not(.photo)` relatief i.p.v. absoluut
   gezet, en stak hij 22px links uit. Nu netjes uitgelijnd:
   - bij een foto: zwevend over de onderrand, gelijk met de linkerrand van de foto (mobiel: rechterrand);
   - op de homepage (dashboardkaart): eronder, gelijk met de linkerrand, en de dashboardkaart over de volle breedte. */
.heromedia > .photo + .floatcard { position: absolute; left: 0; right: auto; bottom: -80px; }
@media (min-width: 761px) { .heromedia:has(> .photo + .floatcard) { margin-bottom: 50px; } }
.heromedia > .panel { margin-right: 0 !important; }
.heromedia > .panel + .floatcard { left: 0; bottom: auto; margin-top: 18px; }
@media (max-width: 760px) {
  /* Mobiel: kaart onder de foto, rechts uitgelijnd en net over de onderrand, zodat hij het onderwerp van de foto niet afdekt */
  .heromedia > .photo + .floatcard { position: relative; left: auto; right: auto; bottom: auto; margin: -28px 0 0 auto; }
  .heromedia > .panel + .floatcard { width: auto; }
}

/* Dichtgeklapt mobiel menu: geen schaduwveeg onder de header en niet bereikbaar met Tab */
@media (max-width: 760px) {
  .mobilenav:not(.open) { visibility: hidden; box-shadow: none; border-bottom-color: transparent; }
  .mobilenav { transition: max-height .45s cubic-bezier(.16,1,.3,1), padding .3s, box-shadow .3s, visibility 0s linear .45s; }
  .mobilenav.open { transition-delay: 0s; }
}

/* Reviewcarrousel: zo hoog als de kaarten die in beeld staan, niet als de langste review (anders veel lege ruimte) */
.rev-grid.car { height: var(--rh, auto); transition: height .6s cubic-bezier(.16,1,.3,1); }
.car-view { overflow: hidden; overflow: clip; margin: -12px -12px -28px; padding: 12px 12px 28px; }
@media (prefers-reduced-motion: reduce) {
  .mobilenav, .rev-grid.car { transition: none; }
}

/* Tablet staand (761–960px): in het ontwerp liepen header, hero, pakketten en dienstenraster hier buiten beeld */
@media (min-width: 761px) and (max-width: 960px) {
  header .wrap { gap: 14px; }
  nav { gap: 16px; }
  nav a { font-size: 14px; }
  .hdr-cta .btn { padding: 10px 16px; font-size: 14px; }
  .hero .grid { grid-template-columns: 1fr; gap: 46px; }
  .pkggrid { grid-template-columns: 1fr; max-width: 560px; margin-left: auto; margin-right: auto; }
  .grid-d { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Footer: op tablet braken woorden midden af ("Belastingaangi-fte"); op desktop brak het e-mailadres na de @ */
@media (min-width: 761px) and (max-width: 1060px) {
  footer .cols { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  footer .cols > div:first-child { grid-column: 1 / -1; }
}
@media (min-width: 761px) and (max-width: 900px) {
  footer .cols { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1061px) {
  footer .cols { grid-template-columns: 1.3fr 1.35fr 1fr 1fr 1fr; }
}
/* Heel smalle telefoons (≤360px): footer in één kolom, lange woorden in koppen netjes afbreken */
@media (max-width: 360px) {
  footer .cols { grid-template-columns: 1fr; }
  h1, h2, h3 { hyphens: auto; overflow-wrap: break-word; }
  .hero h1, .pagehead h1 { font-size: 29px; }
}

/* Btw-vermelding (variant B, gekozen 10 oktober 2026): één duidelijk label i.p.v. "excl. btw" bij elke prijs */
.btwchip {
  display: inline-flex; align-items: center; gap: 8px; margin-top: 16px;
  background: var(--tint); color: var(--groen-dd); border: 1px solid rgba(75, 100, 90, .18);
  border-radius: 999px; padding: 7px 14px 7px 10px; font-size: 13.5px; font-weight: 600;
}
.btwchip svg { flex: none; }
.btwsub { font-size: 12.5px; color: var(--grijs-l); margin-top: 4px; }