/* ============================================================
   INPACT · styles.css
   Gedeeld designsysteem voor alle pagina's, in de designtaal van
   het klantverhaal Söderberg & Partners Volmacht (magazine-stijl).
   Tokens, chrome (nav/footer/modal), componenten en animaties.
   ============================================================ */

:root{
  --ink:#0B1330;
  --navy-900:#0A1230;
  --navy-800:#101B44;
  --navy-700:#19244A;
  --blue-600:#2F52E0;
  --blue-500:#4568F2;
  --blue-400:#7B93F5;
  --blue-300:#A9BAF8;
  --blue-100:#EAEFFE;
  --accent-cyaan:#61AECA;
  --paper:#FFFFFF;
  --mist:#F5F7FC;
  --slate-500:#5B6478;
  --slate-400:#828DA3;
  --line:#E4E8F4;
  --line-dark:rgba(255,255,255,.12);
  --font-display:'Poppins',ui-sans-serif,system-ui,sans-serif;
  --font-body:'Poppins',ui-sans-serif,system-ui,sans-serif;
  --ease:cubic-bezier(.22,.7,.24,1);
  --shadow-soft:0 6px 24px rgba(11,19,48,.08);
  --shadow-card:0 18px 50px rgba(11,19,48,.16);
  --radius:18px;
  --nav-h:72px;
}


/* Vangnet tegen robots: staat in elk formulier, is voor mensen onzichtbaar en voor
   schermlezers verborgen. Vult iets het toch in, dan is het geen bezoeker. Bewust geen
   display:none, want daar kijken sommige robots overheen. */
.vangnet{position:absolute!important;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden;}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{margin:0;font-family:var(--font-body);font-size:16px;line-height:1.65;color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased;}
img{max-width:100%;display:block;}
a{color:inherit;}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer;}
h1,h2,h3,h4{font-family:var(--font-display);letter-spacing:-.01em;line-height:1.18;margin:0;}
p{margin:0 0 1em;}
p:last-child{margin-bottom:0;}
ul,ol{margin:0 0 1em;padding-left:20px;}
[hidden]{display:none !important;}
::selection{background:var(--blue-300);color:var(--ink);}

.container{width:min(1160px,calc(100% - 48px));margin-inline:auto;}
@media(max-width:640px){.container{width:calc(100% - 36px);}}

.u-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}
.u-ul-effect{text-decoration:none;background-image:linear-gradient(currentColor,currentColor);background-size:0% 1px;background-position:0 100%;background-repeat:no-repeat;transition:background-size .3s var(--ease);}
.u-ul-effect:hover{background-size:100% 1px;}
.u-link-cover{text-decoration:none;color:inherit;}
.u-link-cover::after{content:"";position:absolute;inset:0;z-index:1;}

/* ---------- typografie & sectiebasis ---------- */
.h2{font-size:clamp(24px,3vw,36px);font-weight:700;}
.h3{font-size:clamp(18px,2vw,23px);font-weight:600;}
.eyebrow{font-size:12px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--blue-600);margin:0 0 14px;}
.lede{font-size:clamp(17px,1.9vw,20px);line-height:1.6;color:var(--slate-500);font-weight:500;}

.section{padding:clamp(56px,7.4vw,104px) 0;position:relative;}
.section--tight{padding:clamp(28px,3.4vw,44px) 0;}
.section--tint{background:var(--mist);}
.section--accent-tint{background:linear-gradient(180deg,#F2F5FE, #EAEFFE 90%);}
.section--flush-top{padding-top:clamp(34px,4vw,56px);}
.section--kn{padding-top:0;}
.section__head{max-width:780px;margin-bottom:clamp(30px,4vw,52px);}
.section__head--split{max-width:none;display:flex;align-items:flex-end;justify-content:space-between;gap:32px;flex-wrap:wrap;}
.section__head--split>div{max-width:680px;}
.section__head--midden{margin-inline:auto;text-align:center;}
.section__lead{font-size:clamp(15.5px,1.7vw,17.5px);color:var(--slate-500);line-height:1.7;margin:14px 0 0;}

/* thema: donkere secties */
.section[data-theme="dark"]{background:var(--navy-900);color:#fff;}
.section[data-theme="dark"]::before{content:"";position:absolute;inset:0;pointer-events:none;background:
  radial-gradient(680px 420px at 85% -10%, rgba(47,82,224,.32), transparent 65%);}
.section[data-theme="dark"] .eyebrow{color:var(--blue-300);}
.section[data-theme="dark"] .section__lead{color:#C4CCE6;}
.section[data-theme="dark"] .h2,.section[data-theme="dark"] .h3{color:#fff;}
.section[data-theme="dark"]>.container{position:relative;z-index:1;}

/* ---------- knoppen ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;font-weight:600;font-size:15px;line-height:1;padding:15px 26px;border-radius:100px;text-decoration:none;border:1.5px solid transparent;transition:transform .25s var(--ease),box-shadow .25s var(--ease),background .25s var(--ease),border-color .25s var(--ease),color .25s var(--ease);white-space:nowrap;}
.btn:hover{transform:translateY(-2px);}
.btn:active{transform:translateY(0);}
.btn--sm{padding:11px 19px;font-size:13.5px;}
.btn--primary{background:var(--blue-600);color:#fff;box-shadow:0 10px 26px rgba(47,82,224,.35);}
.btn--primary:hover{background:var(--blue-500);box-shadow:0 14px 30px rgba(47,82,224,.42);}
.btn--dark{background:var(--ink);color:#fff;}
.btn--dark:hover{background:var(--navy-800);}
.btn--ghost{border-color:rgba(255,255,255,.36);color:#fff;background:rgba(255,255,255,.04);}
.btn--ghost:hover{border-color:#fff;background:rgba(255,255,255,.1);}
[data-theme="light"] .btn--ghost,.section--tint .btn--ghost,.tabs .btn--ghost,.modal .btn--ghost,.cookie .btn--ghost,.panel-actions .btn--ghost{border-color:var(--line);color:var(--ink);background:#fff;}
[data-theme="light"] .btn--ghost:hover,.cookie .btn--ghost:hover{border-color:var(--blue-400);background:var(--blue-100);}
.btn--outline-dark{border-color:rgba(11,19,48,.45);color:var(--ink);background:transparent;}
.btn--outline-dark:hover{border-color:var(--ink);background:rgba(255,255,255,.35);}

.link-arrow{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:14.5px;color:var(--blue-600);text-decoration:none;position:relative;z-index:2;}
.link-arrow::after{content:"\2192";transition:transform .25s var(--ease);}
.link-arrow:hover::after{transform:translateX(4px);}
.section[data-theme="dark"] .link-arrow{color:var(--blue-300);}

/* ---------- kleine bouwstenen ---------- */
.tag,.tagpill{display:inline-flex;align-items:center;padding:5px 12px;border-radius:100px;font-size:11.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;background:var(--blue-100);color:var(--blue-600);}
.pill{display:inline-flex;align-items:center;gap:6px;padding:4px 11px;border-radius:100px;font-size:11.5px;font-weight:600;background:var(--mist);color:var(--slate-500);white-space:nowrap;}
.pill--klaar{background:#E3F5EC;color:#177A4C;}
.pill--bezig{background:var(--blue-100);color:var(--blue-600);}
.pill--wacht{background:#FDF1DF;color:#9A6413;}
.pill--nieuw{background:#EFE9FD;color:#6D3FD4;}
.pill--soon{background:var(--blue-100);color:var(--blue-600);}
.badges{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px;}
.badge{display:inline-flex;align-items:center;padding:9px 16px;border-radius:100px;border:1px solid var(--line);background:#fff;font-size:13px;font-weight:600;color:var(--slate-500);}
.section[data-theme="dark"] .badge{background:rgba(255,255,255,.05);border-color:var(--line-dark);color:#C4CCE6;}

.ico{display:inline-flex;width:20px;height:20px;flex:none;color:var(--blue-600);}
.ico svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;}

.ticks{list-style:none;padding:0;margin:20px 0 26px;display:grid;gap:11px;}
.ticks li{position:relative;padding-left:30px;font-size:14.5px;line-height:1.55;color:var(--slate-500);}
.ticks li::before{content:"";position:absolute;left:0;top:2px;width:19px;height:19px;border-radius:6px;background:var(--blue-100);}
.ticks li::after{content:"";position:absolute;left:5px;top:7.5px;width:9px;height:5px;border-left:2px solid var(--blue-600);border-bottom:2px solid var(--blue-600);transform:rotate(-45deg);}
.section[data-theme="dark"] .ticks li{color:#C4CCE6;}
.section[data-theme="dark"] .ticks li::before{background:rgba(255,255,255,.08);}
.section[data-theme="dark"] .ticks li::after{border-color:var(--blue-300);}

.mock-caption{font-size:12px;font-weight:600;letter-spacing:.04em;color:var(--slate-400);margin:0 0 10px;display:flex;align-items:center;gap:8px;}
.mock-caption::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--accent-cyaan);}
.section[data-theme="dark"] .mock-caption{color:#8B96BC;}

.crumbs{display:flex;align-items:center;gap:9px;font-size:13px;color:#7883A8;margin:0 0 26px;flex-wrap:wrap;}
.crumbs a{color:#C4CCE6;text-decoration:none;}
.crumbs span:last-child{color:#98A2C8;}

.team-note{display:flex;gap:14px;align-items:flex-start;max-width:760px;margin:28px 0 0;padding:20px 24px;border:1px solid var(--line);border-radius:16px;background:#fff;font-size:14px;color:var(--slate-500);line-height:1.6;}
.team-note .ico{margin-top:2px;}
.section[data-theme="dark"] .team-note{background:rgba(255,255,255,.05);border-color:var(--line-dark);color:#C4CCE6;}

/* ---------- scroll progress / to-top ---------- */
.scroll-progress{position:fixed;top:0;left:0;right:0;height:3px;z-index:120;background:transparent;}
.scroll-progress span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--blue-600),var(--blue-400));transition:width .12s linear;}
.to-top{position:fixed;right:22px;bottom:22px;z-index:90;width:46px;height:46px;border-radius:50%;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-card);opacity:0;visibility:hidden;transform:translateY(10px);transition:all .35s var(--ease);}
.to-top.is-visible{opacity:1;visibility:visible;transform:none;}
.to-top:hover{background:var(--blue-600);}
.to-top svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}

/* ---------- info-banner ---------- */
.info-banner{background:linear-gradient(90deg,var(--navy-800),#1D2E6E);color:#fff;position:relative;z-index:110;}
.info-banner__inner{width:min(1160px,calc(100% - 48px));margin-inline:auto;display:flex;align-items:center;gap:14px;padding:9px 0;font-size:13px;}
.info-banner__tag{flex:none;font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;background:rgba(255,255,255,.14);padding:4px 10px;border-radius:100px;}
.info-banner__text{margin:0;color:#D5DCF5;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.info-banner__link{flex:none;color:#fff;font-weight:600;}
.info-banner__close{flex:none;margin-left:auto;width:26px;height:26px;display:flex;align-items:center;justify-content:center;border-radius:50%;color:#B9C2E4;}
.info-banner__close:hover{background:rgba(255,255,255,.12);color:#fff;}
.info-banner__close svg{width:11px;height:11px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;}
@media(max-width:720px){.info-banner__text{white-space:normal;}.info-banner__link{display:none;}}

/* ---------- navigatie ---------- */
.nav{position:sticky;top:0;z-index:100;background:var(--navy-900);border-bottom:1px solid rgba(255,255,255,.08);transition:background .3s var(--ease),border-color .3s var(--ease);}
.nav__inner{display:flex;align-items:center;gap:28px;height:var(--nav-h);}
.nav__logo{display:inline-flex;align-items:center;flex:none;}
.nav__logo-img{height:30px;width:auto;}
.nav__logo img.nav__logo--onlight{display:none;}
.nav.is-light{background:#fff;border-bottom-color:var(--line);box-shadow:0 8px 30px rgba(11,19,48,.06);}
.nav.is-light .nav__logo img.nav__logo--ondark{display:none;}
.nav.is-light .nav__logo img.nav__logo--onlight{display:block;}
.nav__menu{flex:1;display:flex;justify-content:center;}
.nav__list{list-style:none;display:flex;align-items:center;gap:6px;margin:0;padding:0;}
.nav__item{position:static;}
.nav-link{display:inline-flex;align-items:center;gap:7px;padding:9px 14px;font-size:14.5px;font-weight:600;color:#E7EBFA;text-decoration:none;border-radius:10px;background-size:0;}
.nav-link:hover{color:#fff;}
.nav-link.is-current{color:#fff;}
.nav-link.is-current::after{content:"";position:absolute;}
.nav__item .nav-link.is-current{box-shadow:inset 0 -2px 0 var(--blue-400);border-radius:0;}
.nav.is-light .nav-link{color:#3C4358;}
.nav.is-light .nav-link:hover,.nav.is-light .nav-link.is-current{color:var(--ink);}
.nav.is-light .nav__item .nav-link.is-current{box-shadow:inset 0 -2px 0 var(--blue-600);}
.chev{width:10px;height:6px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;transition:transform .25s var(--ease);}
.nav__item.is-open .chev{transform:rotate(180deg);}
.nav__actions{display:flex;align-items:center;gap:10px;flex:none;}
.nav__cta-ghost{border-color:rgba(255,255,255,.32);}
.nav.is-light .nav__cta-ghost{border-color:var(--line);color:var(--ink);background:#fff;}
.nav__burger{display:none;width:42px;height:42px;border-radius:12px;flex-direction:column;align-items:center;justify-content:center;gap:5px;}
.nav__burger span{display:block;width:20px;height:2px;border-radius:2px;background:#fff;transition:transform .3s var(--ease),opacity .3s;}
.nav.is-light .nav__burger span{background:var(--ink);}
.nav__burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav__burger[aria-expanded="true"] span:nth-child(2){opacity:0;}
.nav__burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

/* mega-menu */
.mega{position:absolute;top:100%;left:0;right:0;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 30px 60px rgba(11,19,48,.14);opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity .3s var(--ease),transform .3s var(--ease),visibility .3s;z-index:99;}
.nav__item.is-open .mega{opacity:1;visibility:visible;transform:none;}
.mega__inner{display:grid;grid-template-columns:1.15fr 1fr 1fr;gap:34px;padding:34px 0 38px;color:var(--ink);}
.mega__inner:has(.mega__col--promo){grid-template-columns:1.15fr 1fr 1fr 1fr;}
.mega__inner:has(.mega__col--span3){grid-template-columns:1.1fr 2.4fr;}
.mega__col--intro{padding-right:26px;border-right:1px solid var(--line);}
.mega__title{font-size:20px;margin:0 0 10px;}
.mega__lead{font-size:13.5px;color:var(--slate-500);line-height:1.6;margin:0 0 18px;}
.mega__label{font-size:11px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--slate-400);margin:4px 0 14px;}
.mega__link{display:flex;gap:13px;align-items:flex-start;padding:11px 12px;margin:0 -12px;border-radius:12px;text-decoration:none;transition:background .2s var(--ease);}
.mega__link:hover{background:var(--mist);}
.mega__link .ico{margin-top:2px;width:22px;height:22px;}
.mega__link strong{display:block;font-family:var(--font-display);font-size:14.5px;font-weight:600;color:var(--ink);}
.mega__link em{display:block;font-style:normal;font-size:12.5px;color:var(--slate-400);margin-top:1px;}
.mega__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;align-content:start;}
.mega__tile{display:block;border:1px solid var(--line);border-radius:14px;padding:18px;text-decoration:none;transition:border-color .25s var(--ease),transform .25s var(--ease);}
.mega__tile:hover{border-color:var(--blue-300);transform:translateY(-2px);}
.mega__tile .ico{width:22px;height:22px;margin-bottom:10px;}
.mega__tile strong{display:block;font-family:var(--font-display);font-size:14.5px;color:var(--ink);}
.mega__tile em{display:block;font-style:normal;font-size:12.5px;color:var(--slate-400);margin-top:3px;line-height:1.5;}
.mega .btn--ghost{border-color:var(--line);color:var(--ink);background:#fff;}
.mega .btn--ghost:hover{border-color:var(--blue-400);background:var(--blue-100);}
.promo-card{border-radius:16px;overflow:hidden;border:1px solid var(--line);background:#fff;display:block;}
.promo-card__media{aspect-ratio:16/10;background:var(--navy-800);}
.promo-card__media img{width:100%;height:100%;object-fit:cover;}
.promo-card__body{padding:14px 16px 16px;}
.promo-card__body .eyebrow{margin-bottom:6px;font-size:10.5px;}
.promo-card__title{font-family:var(--font-display);font-weight:600;font-size:13.5px;line-height:1.4;margin:0;color:var(--ink);}

/* mobiel menu */
@media(max-width:1020px){
  .nav__burger{display:flex;}
  .nav__cta-ghost{display:none;}
  .nav__menu{position:fixed;inset:var(--nav-h) 0 0 0;background:#fff;padding:14px 24px 40px;overflow:auto;opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity .3s var(--ease),transform .3s var(--ease),visibility .3s;justify-content:flex-start;box-shadow:inset 0 1px 0 var(--line);/* de lijst en de knoppen stapelen, ze staan niet naast elkaar */flex-direction:column;align-items:stretch;}
  .nav__menu.is-open{opacity:1;visibility:visible;transform:none;}
  body.menu-open .nav{background:#fff;border-bottom-color:var(--line);}
  body.menu-open .nav .nav__logo img.nav__logo--ondark{display:none;}
  body.menu-open .nav .nav__logo img.nav__logo--onlight{display:block;}
  body.menu-open .nav__burger span{background:var(--ink);}
  .nav__list{flex-direction:column;align-items:stretch;gap:2px;width:100%;}
  .nav-link{width:100%;justify-content:space-between;padding:16px 4px;font-size:17px;color:var(--ink);border-bottom:1px solid var(--line);border-radius:0;}
  .nav-link:hover,.nav__item.is-open .nav-link--toggle{color:var(--blue-600);}
  .nav__item .nav-link.is-current{box-shadow:none;color:var(--blue-600);}
  .mega{position:static;background:transparent;border:0;box-shadow:none;opacity:1;visibility:visible;transform:none;display:none;}
  .nav__item.is-open .mega{display:block;}
  .mega__inner{grid-template-columns:1fr !important;gap:8px;padding:8px 0 18px;width:100%;}
  .mega__col--intro{display:none;}
  .mega__label{color:var(--slate-400);margin-top:14px;}
  .mega__link{margin:0;padding:11px 8px;}
  .mega__link:hover{background:var(--mist);}
  .mega__link strong{color:var(--ink);}
  .mega__link em{color:var(--slate-400);}
  .mega__grid{grid-template-columns:1fr;}
  .mega__tile{border-color:var(--line);}
  .mega__tile strong{color:var(--ink);}
  .mega__col--promo{display:none;}
  /* scrollvergrendeling op html: op body brak die de sticky kopbalk (zie app.js) */
  html.menu-open{overflow:hidden;}
  .nav__menu{overscroll-behavior:contain;}
}

/* ---------- home-hero ---------- */
.section--hero{background:var(--navy-900);color:#fff;padding:clamp(64px,8vw,110px) 0 clamp(70px,8vw,110px);overflow:hidden;}
.hero__bg{position:absolute;inset:0;pointer-events:none;}
.hero__motion{position:absolute;inset:-20%;background:
  radial-gradient(560px 380px at 18% 22%, rgba(69,104,242,.20), transparent 60%),
  radial-gradient(700px 460px at 86% 12%, rgba(47,82,224,.38), transparent 62%),
  radial-gradient(520px 420px at 74% 92%, rgba(97,174,202,.12), transparent 60%);
  animation:heroDrift 16s ease-in-out infinite alternate;}
@keyframes heroDrift{from{transform:translate3d(0,0,0) scale(1);}to{transform:translate3d(2%,-2%,0) scale(1.04);}}
.hero__grid{position:absolute;inset:0;background:
  linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),
  linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:56px 56px;
  -webkit-mask-image:radial-gradient(75% 65% at 50% 38%,#000 30%,transparent 100%);
  mask-image:radial-gradient(75% 65% at 50% 38%,#000 30%,transparent 100%);}
.hero__glow{position:absolute;left:50%;top:-320px;width:900px;height:640px;transform:translateX(-50%);background:radial-gradient(closest-side,rgba(69,104,242,.4),transparent);filter:blur(10px);}
.hero__inner{position:relative;z-index:1;}
.hero__inner--split{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:clamp(34px,4.6vw,64px);align-items:center;}
.hero__title,.pakkethero__title{font-size:clamp(33px,4.6vw,56px);font-weight:700;color:#fff;margin:0 0 20px;max-width:15ch;}
.hero__lead,.pakkethero__lead{font-size:clamp(16px,1.85vw,18.5px);color:#C9D3F2;line-height:1.7;max-width:560px;margin:0 0 30px;}
.hero__cta{display:flex;gap:14px;flex-wrap:wrap;}
.hero__proof{grid-column:1/-1;list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:clamp(26px,3.4vw,46px) 0 0;padding:0;}
.hero__proof a{display:block;text-decoration:none;border:1px solid rgba(255,255,255,.22);border-radius:16px;padding:18px 20px;background:rgba(10,18,48,.58);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);transition:border-color .25s var(--ease),transform .25s var(--ease),background .25s var(--ease);}
.hero__proof a:hover{border-color:var(--blue-400);transform:translateY(-3px);background:rgba(255,255,255,.07);}
.hero__proof strong{display:block;font-family:var(--font-display);font-size:16px;color:#fff;}
.hero__proof span{display:block;font-size:12.5px;color:#C4CCE6;margin-top:3px;}
.hero__scroll{position:absolute;left:50%;bottom:16px;transform:translateX(-50%);width:26px;height:42px;border:1.5px solid rgba(255,255,255,.35);border-radius:100px;display:flex;justify-content:center;padding-top:8px;}
.hero__scroll span{width:3px;height:8px;border-radius:3px;background:var(--blue-300);animation:scrollHint 1.8s var(--ease) infinite;}
@keyframes scrollHint{0%{transform:translateY(0);opacity:1;}70%{transform:translateY(12px);opacity:0;}100%{opacity:0;}}
@media(max-width:1020px){.hero__inner--split{grid-template-columns:minmax(0,1fr);}.hero__proof{grid-template-columns:1fr;}.hero__scroll{display:none;}}
/* hero met foto (sinds 9-9-2026; de collage-variant staat in docs/archief) */
.hero--photo{min-height:min(86vh,720px);display:flex;align-items:center;}
.hero__photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:0% center;transform:scale(1.13);transform-origin:left center;}
.hero__shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,18,48,.94) 0%,rgba(10,18,48,.82) 30%,rgba(10,18,48,.38) 56%,rgba(10,18,48,.05) 100%);}
.hero--photo .hero__inner{display:block;}
.hero--photo .hero__copy{max-width:600px;}
.hero--photo .hero__proof{max-width:880px;}
@media(max-width:1020px){.hero__photo{object-position:70% 30%;transform:none;}.hero__shade{background:linear-gradient(180deg,rgba(10,18,48,.86) 0%,rgba(10,18,48,.78) 60%,rgba(10,18,48,.92) 100%);}}

/* ---------- paginakop (pagehero), klantcase-signatuur ---------- */
.section--pagehero{background:var(--navy-900);color:#fff;padding:clamp(46px,5.6vw,76px) 0 clamp(50px,6vw,84px);overflow:hidden;}

/* Elke paginakop sluit onderaan af met dezelfde ronding als Over ons
   (wens Jacoline 21-9-2026, `.ov-hero` in over-ons.css is het voorbeeld).
   De koppen hebben allemaal al overflow:hidden, dus foto, gloed en tint
   lopen netjes mee met de bocht. Op de homepage staat de ronding niet onder
   de foto-kop maar onder de logobalk eronder: die twee vormen samen het
   donkere blok bovenaan de pagina, met een zichtbare naad ertussen. */
:root{--kop-radius:56px;}
.section--pagehero,
.pakkethero,
.kv .hero,
.section--kopsluiting{border-radius:0 0 var(--kop-radius) var(--kop-radius);}
.section--kopsluiting{overflow:hidden;}
@media(max-width:640px){:root{--kop-radius:36px;}}
.pagehero__bg{position:absolute;inset:0;pointer-events:none;background:
  radial-gradient(760px 480px at 84% -12%, rgba(47,82,224,.42), transparent 64%),
  radial-gradient(460px 380px at 4% 108%, rgba(97,174,202,.13), transparent 60%);}
.pagehero__bg::after{content:"";position:absolute;inset:0;background:
  linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),
  linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);
  background-size:56px 56px;
  -webkit-mask-image:radial-gradient(80% 80% at 70% 20%,#000 25%,transparent 100%);
  mask-image:radial-gradient(80% 80% at 70% 20%,#000 25%,transparent 100%);}
.pagehero__inner{position:relative;z-index:1;}
.pagehero__title{font-size:clamp(29px,4vw,46px);font-weight:700;color:#fff;margin:0 0 18px;max-width:20ch;}
.pagehero__lead{font-size:clamp(15.5px,1.8vw,18px);color:#C9D3F2;line-height:1.7;max-width:640px;margin:0;}
.pagehero__cta{display:flex;gap:14px;flex-wrap:wrap;margin-top:30px;}
.pagehero--center .pagehero__inner{text-align:center;display:flex;flex-direction:column;align-items:center;}
.pagehero--center .crumbs{justify-content:center;}
.pagehero--center .pagehero__title{max-width:24ch;}
.pagehero--center .pagehero__title em{font-style:normal;color:#8FB9FF;}
.pagehero--center .pagehero__cta{justify-content:center;}
.pagehero-split{display:grid;grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr);gap:clamp(34px,4.6vw,60px);align-items:center;}
@media(max-width:960px){.pagehero-split{grid-template-columns:minmax(0,1fr);}}
/* Kop met een schema in plaats van een lijstje: het beeld krijgt meer breedte, anders
   is de tekst in het schema niet te lezen. Alleen op breed scherm; daaronder staat de
   kop toch al onder elkaar. */
@media(min-width:961px){.pagehero-split--breedbeeld{grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);column-gap:clamp(56px,7vw,110px);}}
/* data-split woorden + accent */
[data-split] .w{display:inline-block;opacity:0;transform:translateY(.5em);transition:opacity .6s var(--ease),transform .6s var(--ease);}
[data-split].is-in .w{opacity:1;transform:none;}
[data-split] .w.accent{color:#8FB9FF;}
body.no-js [data-split] .w{opacity:1;transform:none;}

/* feitentegels in hero (over-ons), klantcase feitenkader */
.figs{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:clamp(30px,4vw,48px);width:100%;max-width:900px;}
.figs__cell{background:rgba(255,255,255,.05);border:1px solid var(--line-dark);border-radius:16px;padding:20px 22px;text-align:left;}
.figs__cell strong{display:block;font-family:var(--font-display);font-weight:700;font-size:22px;color:#fff;margin-bottom:6px;}
.figs__cell span{font-size:13px;color:#C4CCE6;line-height:1.55;display:block;}
@media(max-width:760px){.figs{grid-template-columns:1fr;}}

/* ---------- ankerbalk / filterbalk (kn-bar) ---------- */
.kn-bar{position:sticky;top:var(--nav-h);z-index:60;background:#fff;border-bottom:1px solid var(--line);}
.kn-bar__inner{display:flex;align-items:center;gap:16px;padding:13px 0;flex-wrap:wrap;}
.kn-bar__label{margin:0;font-size:11px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--slate-400);flex:none;}
.kn-bar__count{margin:0 0 0 auto;font-size:12.5px;color:var(--slate-400);flex:none;}
.kn-bar__reset{font-size:12.5px;font-weight:600;color:var(--blue-600);flex:none;}
.chips{display:flex;gap:8px;flex-wrap:wrap;}
.chip{display:inline-flex;align-items:center;gap:7px;white-space:nowrap;padding:8px 15px;border-radius:100px;border:1px solid var(--line);background:#fff;font-size:13px;font-weight:600;color:var(--slate-500);text-decoration:none;transition:border-color .2s var(--ease),color .2s var(--ease),background .2s var(--ease);}
.chip:hover{border-color:var(--blue-400);color:var(--ink);}
.chip[aria-pressed="true"],.chip.is-active{background:var(--ink);border-color:var(--ink);color:#fff;}
.chip__n{font-size:11px;font-weight:700;background:var(--mist);color:var(--slate-400);padding:1px 7px;border-radius:100px;}
.chip[aria-pressed="true"] .chip__n{background:rgba(255,255,255,.16);color:#fff;}
@media(max-width:760px){.kn-bar__inner{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;}.kn-bar__inner::-webkit-scrollbar{display:none;}.chips{flex-wrap:nowrap;}.kn-bar__count{display:none;}}

/* ---------- kennisbank ---------- */
.kn-search{position:relative;max-width:560px;margin-top:30px;}
.kn-search__ico{position:absolute;left:18px;top:50%;transform:translateY(-50%);width:18px;height:18px;fill:none;stroke:#8B96BC;stroke-width:1.8;stroke-linecap:round;}
.kn-search input{width:100%;padding:16px 52px;border-radius:100px;border:1px solid var(--line-dark);background:rgba(255,255,255,.06);color:#fff;font:inherit;font-size:15px;outline:none;transition:border-color .25s var(--ease),background .25s var(--ease);}
.kn-search input::placeholder{color:#8B96BC;}
.kn-search input:focus{border-color:var(--blue-400);background:rgba(255,255,255,.1);}
.kn-search__clear{position:absolute;right:12px;top:50%;transform:translateY(-50%);width:30px;height:30px;border-radius:50%;display:none;align-items:center;justify-content:center;color:#8B96BC;}
.kn-search__clear:hover{background:rgba(255,255,255,.12);color:#fff;}
.kn-search__clear svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;}
.kn-search.has-value .kn-search__clear{display:flex;}

.kn-lead{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);border:1px solid var(--line);border-radius:22px;overflow:hidden;background:#fff;position:relative;transition:border-color .25s var(--ease),transform .25s var(--ease),box-shadow .25s var(--ease);}
.kn-lead:hover{border-color:var(--blue-300);box-shadow:var(--shadow-soft);}
.kn-lead__media{position:relative;background:var(--navy-800);min-height:280px;}
.kn-lead__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.kn-lead__flag{position:absolute;z-index:2;top:16px;left:16px;padding:6px 13px;border-radius:100px;background:var(--ink);color:#fff;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;}
.kn-lead__body{padding:clamp(24px,3vw,40px);display:flex;flex-direction:column;align-items:flex-start;gap:12px;}
.kn-lead__body h2{font-size:clamp(20px,2.3vw,27px);line-height:1.25;}
.kn-lead__body h2 a{text-decoration:none;color:var(--ink);position:relative;}
.kn-lead__body>p{font-size:14.5px;color:var(--slate-500);line-height:1.65;margin:0;}
.kn-lead__ai{max-width:860px;margin-top:30px;}
@media(max-width:860px){.kn-lead{grid-template-columns:1fr;}.kn-lead__media{min-height:210px;}}

.kn-meta{display:flex;align-items:center;gap:9px;font-size:12.5px;color:var(--slate-400);margin:0;flex-wrap:wrap;}
.kn-meta__cat{font-weight:700;color:var(--blue-600);text-transform:uppercase;letter-spacing:.05em;font-size:11px;}
.kn-meta__dot{width:3px;height:3px;border-radius:50%;background:var(--slate-400);display:inline-block;}

.kn-body{padding-top:clamp(30px,3.6vw,48px);padding-bottom:0;}
.kn-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
@media(max-width:1020px){.kn-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:660px){.kn-grid{grid-template-columns:1fr;}}
.kn-card{position:relative;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:18px;overflow:hidden;background:#fff;transition:transform .25s var(--ease),border-color .25s var(--ease),box-shadow .25s var(--ease);}
.kn-card:hover{transform:translateY(-3px);border-color:var(--blue-300);box-shadow:var(--shadow-soft);}
.kn-card__media{aspect-ratio:16/9;background:linear-gradient(150deg,var(--navy-800),#24346E);overflow:hidden;}
.kn-card__media img{width:100%;height:100%;object-fit:cover;}
.kn-card__media img[src=""]{display:none;}
.kn-card__body{padding:20px 22px 22px;display:flex;flex-direction:column;gap:10px;flex:1;}
.kn-card__body h3{font-size:16.5px;line-height:1.35;}
.kn-card__body h3 a{text-decoration:none;color:var(--ink);}
.kn-card__body>p{font-size:13.5px;color:var(--slate-500);line-height:1.6;margin:0;}
.kn-card__foot{margin-top:auto !important;padding-top:6px;}
.kn-card .tag{align-self:flex-start;}
.kn-card__link{position:absolute;inset:0;z-index:1;}
.kn-card .link-arrow{position:relative;z-index:0;}
.kn-empty{text-align:center;padding:56px 20px;border:1.5px dashed var(--line);border-radius:20px;}
.kn-empty h3{margin-bottom:8px;}
.kn-empty p{color:var(--slate-500);font-size:14.5px;max-width:420px;margin:0 auto 20px;}
.kn-more{display:flex;justify-content:center;padding:clamp(28px,3.4vw,44px) 0 clamp(48px,6vw,84px);}
.kn-signup{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(30px,4vw,60px);align-items:center;position:relative;z-index:1;}
.kn-signup form{display:flex;gap:10px;flex-wrap:wrap;}
.kn-signup input{flex:1;min-width:220px;padding:15px 22px;border-radius:100px;border:1px solid var(--line-dark);background:rgba(255,255,255,.06);color:#fff;font:inherit;outline:none;}
.kn-signup input::placeholder{color:#8B96BC;}
.kn-signup input:focus{border-color:var(--blue-400);}
.kn-signup small{display:block;margin-top:12px;font-size:12.5px;color:#8B96BC;}
.kn-signup .form__success{color:#9FE3C0;}
@media(max-width:860px){.kn-signup{grid-template-columns:minmax(0,1fr);}}

/* ---------- AI-balk (Neem dit mee) ---------- */
.ai-bar{border:1px solid var(--line);border-radius:20px;background:#fff;padding:22px 24px;box-shadow:var(--shadow-soft);}
.ai-bar__head{display:flex;gap:14px;align-items:flex-start;margin-bottom:16px;}
.ai-bar__icon{flex:none;width:38px;height:38px;border-radius:12px;background:var(--blue-100);color:var(--blue-600);display:flex;align-items:center;justify-content:center;}
.ai-bar__icon svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;}
.ai-bar__head>span{display:block;}
.ai-bar__head strong{display:block;font-family:var(--font-display);font-size:15.5px;color:var(--ink);margin-bottom:2px;}
.ai-bar__head span span{display:block;font-size:13px;color:var(--slate-500);line-height:1.55;}
.ai-bar__actions{display:flex;gap:9px;flex-wrap:wrap;align-items:center;}
.ai-btn{display:inline-flex;align-items:center;gap:8px;padding:9px 15px;border-radius:100px;border:1px solid var(--line);background:#fff;font-size:12.5px;font-weight:600;color:var(--slate-500);transition:border-color .2s var(--ease),color .2s var(--ease),transform .2s var(--ease);}
.ai-btn:hover{border-color:var(--blue-400);color:var(--ink);transform:translateY(-1px);}
.ai-btn svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none;}
.ai-btn--primary{background:var(--ink);border-color:var(--ink);color:#fff;}
.ai-btn--primary:hover{background:var(--navy-800);color:#fff;}
.ai-bar__melding{font-size:12.5px;font-weight:600;color:#177A4C;}
.ai-bar__vragen{margin-top:16px;padding-top:16px;border-top:1px solid var(--line);display:flex;gap:8px;flex-wrap:wrap;align-items:center;}
.ai-bar__vragen p{margin:0 6px 0 0;font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--slate-400);}
.vraag-chip{display:inline-flex;align-items:center;padding:8px 14px;border-radius:100px;border:1px dashed var(--blue-300);background:var(--blue-100);font-size:12.5px;font-weight:600;color:var(--blue-600);transition:background .2s var(--ease),border-color .2s var(--ease);}
.vraag-chip:hover{background:#DDE6FD;border-style:solid;}
/* donkere context (kennis-hero) */
.section[data-theme="dark"] .ai-bar{background:rgba(255,255,255,.05);border-color:var(--line-dark);box-shadow:none;}
.section[data-theme="dark"] .ai-bar__icon{background:rgba(255,255,255,.09);color:var(--blue-300);}
.section[data-theme="dark"] .ai-bar__head strong{color:#fff;}
.section[data-theme="dark"] .ai-bar__head span span{color:#C4CCE6;}
.section[data-theme="dark"] .ai-btn{background:rgba(255,255,255,.05);border-color:var(--line-dark);color:#C4CCE6;}
.section[data-theme="dark"] .ai-btn:hover{border-color:var(--blue-400);color:#fff;}
.section[data-theme="dark"] .ai-btn--primary{background:#fff;border-color:#fff;color:var(--ink);}
.section[data-theme="dark"] .ai-btn--primary:hover{background:var(--blue-100);color:var(--ink);}
.section[data-theme="dark"] .ai-bar__melding{color:#9FE3C0;}

/* ---------- artikelpagina ---------- */
.art-head{max-width:860px;}
.art-head h1{font-size:clamp(27px,3.6vw,42px);font-weight:700;color:#fff;margin:0 0 16px;line-height:1.16;}
.art-head__dek{font-size:clamp(15.5px,1.8vw,18px);color:#C9D3F2;line-height:1.65;max-width:640px;margin:0;}
.art-head__meta{display:flex;align-items:center;gap:12px;margin-top:24px;font-size:13.5px;color:#C4CCE6;flex-wrap:wrap;}
.art-byline{display:inline-flex;align-items:center;gap:10px;}
.art-byline__avatar{width:34px;height:34px;border-radius:50%;background:linear-gradient(140deg,var(--blue-500),var(--blue-300));color:#fff;display:inline-flex;align-items:center;justify-content:center;font-family:var(--font-display);font-weight:700;font-size:12.5px;}
.art-layout{display:grid;grid-template-columns:224px minmax(0,1fr);gap:clamp(30px,4vw,64px);align-items:start;}
.art-rail{position:sticky;top:calc(var(--nav-h) + 22px);display:grid;gap:26px;}
.toc__label{font-size:11px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--slate-400);margin:0 0 12px;}
.toc ol{list-style:none;margin:0;padding:0;display:grid;gap:2px;border-left:1.5px solid var(--line);}
.toc a{display:block;padding:7px 0 7px 16px;font-size:13px;color:var(--slate-500);text-decoration:none;line-height:1.4;margin-left:-1.5px;border-left:1.5px solid transparent;transition:color .2s,border-color .2s;}
.toc a:hover{color:var(--ink);}
.toc a.is-active{color:var(--blue-600);border-left-color:var(--blue-600);font-weight:600;}
.art-share__row{display:flex;gap:8px;margin-top:10px;}
.art-share__btn{width:38px;height:38px;border-radius:12px;border:1px solid var(--line);background:#fff;display:inline-flex;align-items:center;justify-content:center;color:var(--slate-500);transition:border-color .2s,color .2s,transform .2s;}
.art-share__btn:hover{border-color:var(--blue-400);color:var(--blue-600);transform:translateY(-1px);}
.art-share__btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;}
.art-share__btn svg path[d^="M4.98"]{fill:currentColor;stroke:none;}
.art-share__done{font-size:12px;color:#177A4C;font-weight:600;margin:8px 0 0;}
@media(max-width:960px){.art-layout{grid-template-columns:minmax(0,1fr);}.art-rail{position:static;grid-template-columns:1fr;}.toc{display:none;}}

/* prose, leest als de klantcase */
.prose{max-width:760px;}
.prose>p{font-size:15.5px;color:#3C4358;line-height:1.75;margin:0 0 18px;}
.prose h2{font-size:clamp(20px,2.4vw,27px);font-weight:700;margin:44px 0 16px;display:flex;align-items:baseline;gap:14px;}
.prose h2:first-of-type{margin-top:34px;}
.prose h2 .num{font-size:13px;font-weight:700;color:var(--blue-400);letter-spacing:.06em;flex:none;}
.prose h2#bronnen{font-size:16px;margin-top:52px;padding-top:20px;border-top:1px solid var(--line);color:var(--slate-500);}
.prose h2#bronnen+ul{font-size:13px;color:var(--slate-400);display:grid;gap:5px;padding-left:18px;}
.prose a{color:var(--blue-600);text-decoration:none;background-image:linear-gradient(var(--blue-300),var(--blue-300));background-size:100% 1.5px;background-position:0 100%;background-repeat:no-repeat;transition:background-image .2s;}
.prose a:hover{background-image:linear-gradient(var(--blue-600),var(--blue-600));}
.prose ul:not(.prose-stats):not([class]){padding-left:20px;display:grid;gap:8px;font-size:15px;color:#3C4358;}
.prose .lede{margin:0 0 26px;}
.callout{border:1px solid var(--blue-300);background:var(--blue-100);border-radius:18px;padding:24px 28px;margin:0 0 10px;}
.callout__label{font-size:11px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--blue-600);margin:0 0 12px;}
.callout ul{list-style:none;margin:0;padding:0;display:grid;gap:10px;}
.callout li{position:relative;padding-left:22px;font-size:14px;line-height:1.6;color:#2A3352;}
.callout li::before{content:"";position:absolute;left:0;top:9px;width:8px;height:8px;border-radius:50%;background:var(--blue-500);}
.pullquote{border-left:3px solid var(--blue-500);padding:6px 0 6px 24px;margin:32px 0;}
.pullquote p{font-family:var(--font-display);font-size:18.5px;line-height:1.5;color:var(--ink);margin:0;font-weight:600;}
.prose-stats{list-style:none;margin:26px 0 30px;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:12px;}
.prose-stats li{background:var(--mist);border:1px solid var(--line);border-radius:16px;padding:18px 20px;}
.prose-stats strong{display:block;font-family:var(--font-display);font-weight:700;font-size:clamp(18px,2vw,23px);color:var(--blue-600);margin-bottom:5px;letter-spacing:-.01em;}
.prose-stats span{font-size:12.5px;color:var(--slate-500);line-height:1.5;display:block;}
@media(max-width:640px){.prose-stats{grid-template-columns:1fr;}}
.stat-callouts{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:26px 0 30px;}
.stat-co{background:var(--mist);border:1px solid var(--line);border-radius:16px;padding:18px 20px;}
.stat-co strong{display:block;font-family:var(--font-display);font-weight:700;font-size:clamp(18px,2vw,23px);color:var(--blue-600);margin-bottom:5px;}
.stat-co span{font-size:12.5px;color:var(--slate-500);line-height:1.5;display:block;}
@media(max-width:640px){.stat-callouts{grid-template-columns:1fr;}}
.prose .pkg-note{margin-bottom:6px;}

/* ---------- generieke kaartfamilies (klantcase-signatuur) ---------- */
.cards{display:grid;gap:16px;}
.cards--3{grid-template-columns:repeat(3,1fr);}
@media(max-width:960px){.cards--3{grid-template-columns:1fr;}}
.cards--2{grid-template-columns:repeat(2,1fr);}
@media(max-width:960px){.cards--2{grid-template-columns:1fr;}}
.card{border:1px solid var(--line);border-radius:18px;background:#fff;transition:transform .25s var(--ease),border-color .25s var(--ease);}
.card:hover{transform:translateY(-3px);border-color:var(--blue-300);}
.card__body{padding:26px;}
.card__body .tag{margin-bottom:16px;}
.card__title{font-size:17px;margin:0 0 9px;}
.card__text{font-size:13.5px;color:var(--slate-500);line-height:1.6;margin:0;}
.section[data-theme="dark"] .card{background:rgba(255,255,255,.05);border-color:var(--line-dark);}
.section[data-theme="dark"] .card:hover{border-color:var(--blue-400);}
.section[data-theme="dark"] .card__title{color:#fff;}
.section[data-theme="dark"] .card__text{color:#C4CCE6;}
.section[data-theme="dark"] .card .tag{background:rgba(169,186,248,.16);color:var(--blue-300);}

.pk-card{border:1px solid var(--line);border-radius:20px;background:#fff;overflow:hidden;transition:transform .25s var(--ease),border-color .25s var(--ease),box-shadow .25s var(--ease);}
.pk-card:hover{transform:translateY(-4px);border-color:var(--blue-300);box-shadow:var(--shadow-soft);}
.pk-card__head{padding:26px 26px 0;}
.pk-card__icon{display:inline-flex;width:44px;height:44px;border-radius:13px;background:var(--blue-100);color:var(--blue-600);align-items:center;justify-content:center;margin-bottom:16px;}
.pk-card__icon svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.pk-card__label{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--blue-400);margin:0 0 6px;}
.pk-card__title{font-size:19px;margin:0;}
.pk-card__body{padding:12px 26px 26px;}
.pk-card__body p{font-size:14px;color:var(--slate-500);line-height:1.65;margin:0;}

.feat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
@media(max-width:1020px){.feat-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:620px){.feat-grid{grid-template-columns:1fr;}}
.feat{border:1px solid var(--line);border-radius:18px;padding:24px;background:#fff;transition:transform .25s var(--ease),border-color .25s var(--ease);}
.feat:hover{transform:translateY(-3px);border-color:var(--blue-300);}
.feat__icon{display:inline-flex;width:42px;height:42px;border-radius:12px;background:var(--blue-100);color:var(--blue-600);align-items:center;justify-content:center;margin-bottom:16px;}
.feat__icon svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;}
.feat__step{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--blue-400);margin:0 0 6px;}
.feat h3{font-size:17px;margin:0 0 8px;}
.feat p{font-size:13.5px;color:var(--slate-500);line-height:1.6;margin:0;}

.mod-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
@media(max-width:960px){.mod-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:640px){.mod-grid{grid-template-columns:1fr;}}
.mod-grid--2{grid-template-columns:repeat(2,1fr);}
@media(max-width:640px){.mod-grid--2{grid-template-columns:1fr;}}
.mod{border:1px solid var(--line);border-radius:18px;padding:26px;background:#fff;transition:transform .25s var(--ease),border-color .25s var(--ease);}
.mod:hover{transform:translateY(-3px);border-color:var(--blue-300);}
.mod__name{font-family:var(--font-display);font-weight:700;font-size:17px;color:var(--ink);margin:0 0 4px;}
.mod__belofte{font-size:14px;font-weight:500;line-height:1.45;color:var(--slate-500);margin:0 0 12px;}
.mod p:last-child{font-size:13.5px;color:var(--slate-500);line-height:1.62;margin:0;}
/* Kaarten met veel inhoud: een korte lead en daaronder een opsomming, zodat de kaart te scannen is.
   Aanleiding: Rene Hoogerbrugge 25-9-2026 (meer met opsommingstekens) en Michel Teunissen 24-9-2026
   (wie scant raakt de weg kwijt). */
.mod__tekst{font-size:13.5px;color:var(--slate-500);line-height:1.62;margin:0 0 14px;}
.mod__lijst{list-style:none;margin:0;padding:0;display:grid;gap:10px;}
.mod__lijst li{position:relative;padding-left:19px;font-size:13.5px;color:var(--slate-500);line-height:1.55;}
.mod__lijst li::before{content:"";position:absolute;left:0;top:7px;width:7px;height:7px;border-radius:50%;background:var(--blue-300);}
.mod__lijst b{color:var(--ink);font-weight:600;}

.xs-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:26px;}
@media(max-width:760px){.xs-grid{grid-template-columns:1fr;}}
.xs-card{position:relative;display:grid;grid-template-columns:180px 1fr;border:1px solid var(--line);border-radius:18px;overflow:hidden;background:#fff;transition:transform .25s var(--ease),border-color .25s var(--ease);}
.xs-card:hover{transform:translateY(-3px);border-color:var(--blue-300);}
.xs-card__visual{background:var(--mist);display:flex;align-items:center;justify-content:center;padding:14px;}
.xs-card__visual img{max-height:150px;width:auto;filter:drop-shadow(0 8px 18px rgba(11,19,48,.18));}
.xs-card__body{padding:22px 24px;display:flex;flex-direction:column;gap:8px;align-items:flex-start;}
.xs-card__body strong a{font-family:var(--font-display);font-size:17px;color:var(--ink);}
.xs-card__body p{font-size:13.5px;color:var(--slate-500);line-height:1.6;margin:0;}
@media(max-width:520px){.xs-card{grid-template-columns:1fr;}.xs-card__visual{min-height:130px;}}

.route-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
@media(max-width:860px){.route-grid{grid-template-columns:1fr;}}
.route{border:1px solid var(--line-dark);border-radius:18px;padding:26px;background:rgba(255,255,255,.05);transition:transform .25s var(--ease),border-color .25s var(--ease);}
.route:hover{transform:translateY(-3px);border-color:var(--blue-400);}
.route__nr{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--blue-300);margin:0 0 10px;}
.route h3{font-size:18px;color:#fff;margin:0 0 9px;}
.route p{font-size:13.5px;color:#C4CCE6;line-height:1.62;margin:0;}

.method-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
@media(max-width:760px){.method-grid{grid-template-columns:1fr;}}
.method-card{border:1px solid var(--line);border-radius:18px;padding:26px;background:#fff;transition:transform .25s var(--ease),border-color .25s var(--ease);}
.method-card:hover{transform:translateY(-3px);border-color:var(--blue-300);}
.method-card h3{font-size:16.5px;margin:0 0 8px;}
.method-card p{font-size:13.5px;color:var(--slate-500);line-height:1.62;margin:0;}

.gain-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
@media(max-width:860px){.gain-grid{grid-template-columns:1fr;}}
.gain{border:1px solid var(--line);border-radius:20px;padding:30px 32px;background:#fff;}
.gain__tag{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--blue-600);margin:0 0 12px;}
.gain h3{font-size:19px;margin:0 0 16px;}
.gain ul{list-style:none;margin:0;padding:0;display:grid;gap:11px;}
.gain li{position:relative;padding-left:24px;font-size:14px;line-height:1.6;color:var(--slate-500);}
.gain li::before{content:"";position:absolute;left:0;top:8px;width:8px;height:8px;border-radius:50%;background:var(--blue-500);}
.gain--dark{background:linear-gradient(150deg,var(--navy-800),#1B2B63);border-color:transparent;box-shadow:var(--shadow-card);}
.gain--dark .gain__tag{color:var(--blue-300);}
.gain--dark h3{color:#fff;}
.gain--dark li{color:#C9D3F2;}
.gain--dark li::before{background:var(--blue-300);}

.over-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.over-grid--twee{grid-template-columns:repeat(2,1fr);}
@media(max-width:960px){.over-grid{grid-template-columns:1fr;}}
.over-card{border:1px solid var(--line);border-radius:18px;padding:26px;background:#fff;display:flex;flex-direction:column;gap:9px;align-items:flex-start;transition:transform .25s var(--ease),border-color .25s var(--ease);}
.over-card:hover{transform:translateY(-3px);border-color:var(--blue-300);}
.over-card__mark{font-size:11px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--blue-400);margin:0;}
.over-card h3{font-size:17.5px;}
.over-card p{font-size:13.5px;color:var(--slate-500);line-height:1.62;margin:0 0 6px;}
.over-card .link-arrow{margin-top:auto;}

/* stappen, klantcase-stapkaarten met zwevend nummer */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:14px;}
@media(max-width:1020px){.steps{grid-template-columns:1fr 1fr;}}
@media(max-width:620px){.steps{grid-template-columns:1fr;}}
.step{position:relative;background:#fff;border:1px solid var(--line);border-radius:16px;padding:26px 24px 22px;margin-top:14px;}
.step__num{position:absolute;top:-15px;left:20px;width:31px;height:31px;border-radius:50%;background:var(--blue-600);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-weight:700;font-size:13.5px;box-shadow:0 8px 18px rgba(47,82,224,.35);}
.step__line{position:absolute;top:50%;left:100%;width:20px;height:1.5px;background:var(--line);display:block;}
@media(max-width:1020px){.step__line{display:none;}}
.step h3{font-size:16px;margin:0 0 7px;}
.step p{font-size:13.5px;color:var(--slate-500);line-height:1.58;margin:0;}
.section[data-theme="dark"] .step{background:rgba(255,255,255,.05);border-color:var(--line-dark);}
.section[data-theme="dark"] .step h3{color:#fff;}
.section[data-theme="dark"] .step p{color:#C4CCE6;}
.section[data-theme="dark"] .step__line{background:var(--line-dark);}

/* statistiektegels */
.stat-band{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
@media(max-width:860px){.stat-band{grid-template-columns:1fr;}}
.stat-card{border:1px solid var(--line);border-radius:18px;padding:28px 28px 24px;background:var(--mist);}
.stat-card strong{display:block;font-family:var(--font-display);font-weight:700;font-size:clamp(26px,3vw,36px);letter-spacing:-.02em;color:var(--blue-600);margin-bottom:10px;}
.stat-card p{font-size:13.5px;color:var(--slate-500);line-height:1.6;margin:0;}

/* citaten, de klantcase-gradientkaart */
.quote-card,.case-quote{position:relative;background:linear-gradient(150deg,#2646D9,#6E86F0);border-radius:22px;padding:clamp(28px,3.4vw,40px);box-shadow:var(--shadow-card);overflow:hidden;}
.quote-card::before,.case-quote::before{content:"\201C";position:absolute;top:-30px;right:18px;font-family:var(--font-display);font-size:170px;line-height:1;color:rgba(255,255,255,.14);}
.quote-card blockquote,.case-quote blockquote{margin:0 0 18px;font-family:var(--font-display);font-weight:600;font-size:clamp(17px,2vw,22px);line-height:1.5;color:#fff;position:relative;}
.quote-card cite,.case-quote cite{font-style:normal;font-size:13.5px;color:#fff;font-weight:600;}
.quote-card cite span,.case-quote cite span{display:block;font-weight:400;color:#D8E0F8;font-size:12px;margin-top:2px;}
.quote-card{max-width:860px;margin-inline:auto;}

/* klantverhalen-overzicht */
.case-lead{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:22px;align-items:stretch;}
@media(max-width:860px){.case-lead{grid-template-columns:minmax(0,1fr);}}
.case-quote{display:flex;flex-direction:column;gap:16px;justify-content:center;}
.case-quote .tag{background:rgba(255,255,255,.16) !important;color:#fff !important;}
.case-side{border:1px solid var(--line);border-radius:22px;padding:clamp(26px,3vw,36px);background:#fff;display:flex;flex-direction:column;align-items:flex-start;gap:12px;}
.case-side h3{font-size:19px;}
.case-side p{font-size:14px;color:var(--slate-500);line-height:1.65;margin:0 0 8px;}
.section--tint .case-side{background:#fff;}
.case-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
@media(max-width:760px){.case-grid{grid-template-columns:1fr;}}
.case-card{border:1px solid var(--line);border-radius:18px;padding:26px;background:#fff;display:flex;flex-direction:column;gap:10px;align-items:flex-start;transition:transform .25s var(--ease),border-color .25s var(--ease);}
.case-card:hover{transform:translateY(-3px);border-color:var(--blue-300);}
.case-card h3{font-size:17px;}
.case-card p{font-size:13.5px;color:var(--slate-500);line-height:1.6;margin:0;}
.case-card__voet{display:flex;align-items:center;gap:12px;margin-top:6px !important;font-size:12px;color:var(--slate-400);flex-wrap:wrap;}

/* ---------- split (tekst + beeld) ---------- */
.split{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(30px,4.4vw,64px);align-items:center;}
@media(max-width:900px){.split{grid-template-columns:minmax(0,1fr);}}
.split__body>div p{font-size:15px;color:#3C4358;line-height:1.7;}
.split__media{margin:0;border-radius:20px;overflow:hidden;box-shadow:var(--shadow-card);}
.split__media img{width:100%;height:100%;object-fit:cover;}

.module-head{display:grid;grid-template-columns:1fr 1.2fr;gap:clamp(24px,3.5vw,56px);align-items:end;margin-bottom:clamp(26px,3.4vw,42px);}
@media(max-width:860px){.module-head{grid-template-columns:1fr;}}
.module-tagline{font-size:11px;font-weight:700;letter-spacing:.11em;text-transform:uppercase;color:var(--blue-400);margin:0 0 8px;}
.module-head p{font-size:15px;color:var(--slate-500);line-height:1.7;margin:0;}
.module-head .btn{margin-top:18px;}

/* ---------- tabs ---------- */
.tabs{margin-top:6px;}
.tabs__menu{position:relative;display:inline-flex;gap:4px;padding:5px;border-radius:100px;background:var(--mist);border:1px solid var(--line);margin-bottom:clamp(24px,3vw,38px);max-width:100%;overflow-x:auto;scrollbar-width:none;}
.tabs__menu::-webkit-scrollbar{display:none;}
.tabs__link{position:relative;z-index:1;display:inline-flex;align-items:center;gap:9px;padding:11px 20px;border-radius:100px;font-size:14px;font-weight:600;color:var(--slate-500);white-space:nowrap;transition:color .25s var(--ease);}
.tabs__link .ico{width:17px;height:17px;color:currentColor;}
.tabs__link.is-current{color:#fff;}
.tabs__indicator{position:absolute;top:5px;bottom:5px;left:0;width:0;border-radius:100px;background:var(--ink);transition:transform .35s var(--ease),width .35s var(--ease);z-index:0;}
.tabs__pane{display:none;}
.tabs__pane.is-current{display:block;animation:paneIn .45s var(--ease);}
@keyframes paneIn{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:none;}}
.tabs__pane-grid{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:clamp(28px,4vw,58px);align-items:center;}
.tabs__pane-grid--enkel{grid-template-columns:minmax(0,820px);}
.pagehero__beeld,.module__beeld{display:block;width:100%;height:auto;}
.module__beeld{max-width:920px;margin-inline:auto;}
@media(max-width:900px){.tabs__pane-grid{grid-template-columns:minmax(0,1fr);}}
.tabs__pane-grid>div>p{font-size:15px;color:var(--slate-500);line-height:1.7;}
.tabs__visual{border-radius:20px;overflow:hidden;box-shadow:var(--shadow-card);}
.tabs__visual--mock{border:1px solid var(--line);background:var(--mist);padding:clamp(14px,1.8vw,22px);box-shadow:var(--shadow-soft);}
.tabs__visual--mock img{border-radius:12px;box-shadow:var(--shadow-card);}
.tabs__visual img{width:100%;height:100%;object-fit:cover;}

/* ---------- accordeon ---------- */
.acc-layout{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(30px,4.4vw,64px);align-items:start;}
@media(max-width:900px){.acc-layout{grid-template-columns:minmax(0,1fr);}}
.accordion{display:grid;gap:12px;}
.acc__item{border:1px solid var(--line);border-radius:16px;background:#fff;overflow:hidden;transition:border-color .25s var(--ease);}
.acc__item.is-open{border-color:var(--blue-300);}
.acc__head{width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:19px 22px;text-align:left;font-family:var(--font-display);font-weight:600;font-size:15.5px;color:var(--ink);}
.acc__icon{flex:none;position:relative;width:26px;height:26px;border-radius:50%;background:var(--blue-100);}
.acc__icon::before,.acc__icon::after{content:"";position:absolute;left:50%;top:50%;background:var(--blue-600);transition:transform .3s var(--ease);}
.acc__icon::before{width:11px;height:1.8px;transform:translate(-50%,-50%);}
.acc__icon::after{width:1.8px;height:11px;transform:translate(-50%,-50%);}
.acc__item.is-open .acc__icon::after{transform:translate(-50%,-50%) rotate(90deg);}
.acc__panel{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s var(--ease);}
.acc__item.is-open .acc__panel{grid-template-rows:1fr;}
.acc__inner{overflow:hidden;}
.acc__inner p{padding:0 22px 20px;font-size:14px;color:var(--slate-500);line-height:1.68;margin:0;}
body.no-js .acc__panel{grid-template-rows:1fr;}

/* ---------- slider (klantstemmen) ---------- */
.slider{overflow:hidden;padding:6px 0 0;}
.slider__track{display:flex;gap:16px;padding:0 max(24px,calc((100vw - 1160px)/2)) 8px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;}
.slider__track::-webkit-scrollbar{display:none;}
.slide{flex:0 0 min(480px,85vw);scroll-snap-align:start;border-radius:22px;padding:30px 32px;display:flex;flex-direction:column;gap:14px;}
.slide--quote{background:linear-gradient(150deg,#2646D9,#6E86F0);box-shadow:var(--shadow-card);}
.slide__label{align-self:flex-start;padding:5px 12px;border-radius:100px;background:rgba(255,255,255,.16);color:#fff;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;}
.slide--quote blockquote{margin:0;font-family:var(--font-display);font-weight:600;font-size:17.5px;line-height:1.5;color:#fff;flex:1;}
.slide--quote cite{font-style:normal;font-size:13px;color:#fff;font-weight:600;}
.slide--quote cite span{display:block;font-weight:400;color:#D8E0F8;font-size:11.5px;margin-top:2px;}
.slide--open{background:rgba(255,255,255,.04);border:1px solid var(--line-dark);box-shadow:none;}
.slide--open blockquote{color:#C9D3F2;font-weight:500;font-size:15.5px;}
.slide--open cite{color:#fff;}
.slide--open cite span{color:#8B96BC;}
.slide--open .slide__label{background:rgba(169,186,248,.15);color:var(--blue-300);}
.slider__nav{display:flex;gap:8px;}
.slider__btn{width:44px;height:44px;border-radius:50%;border:1px solid var(--line-dark);color:#fff;display:inline-flex;align-items:center;justify-content:center;transition:border-color .2s,background .2s;}
.slider__btn:hover{border-color:var(--blue-400);background:rgba(255,255,255,.07);}
.slider__btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.slider__dots{display:flex;gap:7px;justify-content:center;margin-top:20px;}
.slider__dots button{width:7px;height:7px;border-radius:100px;background:rgba(255,255,255,.25);transition:width .3s var(--ease),background .3s;}
.slider__dots button.is-active{width:22px;background:var(--blue-300);}

/* ---------- klantmap: echte schermen in een slider (30-9-2026) ----------
   Zeven schermen van de Klantmap in de huisstijl van het fictieve kantoor Helder, een per keer
   op volle breedte. Hergebruikt de slider hierboven (pages.js, data-slider) en het groot bekijken
   uit app.js (data-zoom). Staat op een donkere sectie. */
.km-slider__kop{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:16px;}
.km-slider__kop .mock-caption{margin:0;}
.km-slider .slider__track{padding:0 0 8px;gap:16px;transition:opacity .28s ease;}
.km-slider .slider__track.is-wissel{opacity:0;}
.km-slide{flex:0 0 100%;min-width:0;scroll-snap-align:start;margin:0;cursor:zoom-in;}
/* Het hele scherm moet in beeld passen, ook op een laptop: de breedte volgt de vensterhoogte
   (16:9), zodat hoogte en breedte altijd samen kloppen, ook voordat een beeld geladen is. */
.km-slide a{display:block;width:100%;max-width:min(100%,calc((100vh - 250px) * 16 / 9));margin:0 auto;}
.km-slide img{display:block;width:100%;height:auto;aspect-ratio:16/9;border-radius:16px;box-shadow:0 30px 70px -34px rgba(0,0,0,.6);}
.km-slide figcaption{margin:16px auto 0;font-size:14.5px;line-height:1.6;color:#C9D3F2;max-width:760px;text-align:center;}
.km-slide figcaption b{color:#fff;font-weight:600;margin-right:6px;}
/* Klantmap, versie Q4 2026: licht grijsblauw vlak (#E4E8F4, merkboek) binnen het donkere beeldblok, met donkere
   tekst. Stond los op navy, en de lopende tekst (#3C4358) was daar onleesbaar (Jacoline 30-9). */
.km-concept{margin-top:clamp(40px,5vw,70px);background:#E4E8F4;border-radius:24px;padding:clamp(24px,4vw,56px);color:var(--ink);}
.section[data-theme="dark"] .km-concept .eyebrow{color:var(--blue-600);}
.section[data-theme="dark"] .km-concept .h3{color:var(--ink);}
.section[data-theme="dark"] .km-concept .mock-caption{color:var(--slate-500);}
.km-concept .split__body>div p{color:#3C4358;}
.km-concept .pg-shot{border-color:#D7DEF0;}

/* ---------- klantcitaten: een citaat tegelijk, namen altijd in beeld ----------
   Een blok, een merkblauw moment (de actieve knop). De citaten staan alle vier in de HTML,
   over elkaar heen in dezelfde rastercel, zodat de hoogte niet verspringt bij het wisselen.
   Zonder JavaScript vervalt het stapelen en staan ze gewoon onder elkaar. */
.quotes{position:relative;max-width:900px;margin-inline:auto;text-align:center;}
.quotes__mark{display:block;font-family:var(--font-display);font-size:66px;line-height:1;color:rgba(110,134,240,.45);margin-bottom:-4px;}
/* Minder lucht tussen de kop en het citaat (Danny 29-9): het citaat staat bovenaan, de kop dichterbij. */
#cases .section__head{margin-bottom:clamp(8px,1.4vw,18px);}
#cases .quotes__mark{margin-bottom:-14px;}
.quotes__podium{display:grid;}
.quotes__item{grid-area:1 / 1;align-self:start;opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity .5s var(--ease),transform .5s var(--ease);}
.quotes__item.is-actief{opacity:1;visibility:visible;transform:none;}
.quotes__label{display:inline-block;padding:5px 12px;border-radius:100px;background:rgba(169,186,248,.15);color:var(--blue-300);font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;margin-bottom:20px;}
.quotes__item blockquote{margin:0 0 24px;font-family:var(--font-display);font-weight:600;font-size:clamp(20px,2.4vw,29px);line-height:1.4;color:#fff;}
.quotes__naam{font-style:normal;display:block;font-size:13px;font-weight:600;color:#fff;}
.quotes__naam span{display:block;font-weight:400;color:#8B96BC;font-size:11.5px;margin-top:3px;}
.quotes__balk{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:42px;}
.quotes__knop{position:relative;overflow:hidden;padding:13px 22px;border-radius:12px;border:1px solid var(--line-dark);background:rgba(255,255,255,.04);color:#C4CCE6;font-size:13.5px;font-weight:600;transition:color .3s,border-color .3s;}
.quotes__knop:hover{color:#fff;border-color:var(--blue-400);}
.quotes__knop.is-actief{color:#fff;border-color:transparent;}
.quotes__bedrijf{position:relative;}
/* de voortgangsvulling loopt in de tijd die bij dit citaat hoort; JavaScript zet de duur */
.quotes__voortgang{position:absolute;inset:0;background:linear-gradient(150deg,#2646D9,#6E86F0);transform:scaleX(0);transform-origin:left center;}
.quotes__knop.is-actief .quotes__voortgang{transform:scaleX(1);}
@media(max-width:760px){
  .quotes__balk{gap:8px;}
  .quotes__knop{padding:11px 16px;font-size:12.5px;}
}
/* zonder JavaScript, en bij voorkeur voor minder beweging, geen gestapelde onzichtbare citaten */
.no-js .quotes__podium{display:block;}
.no-js .quotes__item{opacity:1;visibility:visible;transform:none;margin-bottom:38px;}
.no-js .quotes__balk{display:none;}
@media(prefers-reduced-motion:reduce){
  .quotes__item{transition:none;}
  .quotes__voortgang{display:none;}
}


/* ---------- orbit / engine ---------- */
.orbit{position:relative;max-width:860px;margin:0 auto;}
.orbit__svg{width:100%;height:auto;display:block;}
.orbit__ring{fill:none;stroke:var(--line);stroke-dasharray:3 9;stroke-width:1.2;}
.orbit__dot{fill:var(--blue-500);}
.orbit__core{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:clamp(120px,17vw,170px);aspect-ratio:1;border-radius:50%;background:linear-gradient(150deg,var(--navy-800),#2646D9);color:#fff;display:flex;align-items:center;justify-content:center;text-align:center;font-family:var(--font-display);font-weight:600;font-size:clamp(13px,1.5vw,15.5px);box-shadow:var(--shadow-card);padding:14px;}
.orbit__sat{position:absolute;padding:9px 16px;border-radius:100px;background:#fff;border:1px solid var(--line);font-size:13px;font-weight:600;color:var(--ink);box-shadow:var(--shadow-soft);}
.engine{width:100%;height:auto;}
.engine__ring{transform-origin:220px 188px;animation:engineSpin 40s linear infinite;}
@keyframes engineSpin{to{transform:rotate(360deg);}}

/* ---------- logomarquee ---------- */
.marquee{overflow:hidden;padding:10px 0;position:relative;-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);}
.marquee__caption{font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#8B96BC;margin:0 0 14px;}
.marquee__track{display:flex;gap:14px;width:max-content;animation:marqueeMove var(--marquee-dur,40s) linear infinite;}
.marquee[data-reverse] .marquee__track{animation-direction:reverse;}
.marquee:hover .marquee__track{animation-play-state:paused;}
@keyframes marqueeMove{to{transform:translateX(-50%);}}
.marquee-chip{flex:none;display:inline-flex;align-items:center;gap:10px;padding:13px 22px;border-radius:100px;border:1px solid var(--line-dark);background:rgba(255,255,255,.04);color:#98A2C8;font-family:var(--font-display);font-weight:600;font-size:14px;white-space:nowrap;}
.marquee-chip img{height:20px;width:auto;opacity:.92;}
.marquee-chip--logo{background:#fff;border-color:#fff;padding:11px 22px;}
.marquee-chip--logo img{height:26px;max-width:150px;width:auto;object-fit:contain;opacity:1;}
/* Gestapeld logo (beeldmerk boven de naam): hoger beeld, minder binnenruimte, zelfde chiphoogte. */
.marquee-chip--hoog{padding-top:5px;padding-bottom:5px;}
.marquee-chip--hoog img{height:38px;max-width:none;}

/* ---------- productmocks: adres / regels / services / flow ---------- */
.address-mock{border-radius:18px;overflow:hidden;border:1px solid var(--line-dark);background:var(--navy-800);box-shadow:var(--shadow-card);}
[data-theme="light"] .address-mock{border-color:var(--line);background:#fff;box-shadow:var(--shadow-soft);}
.address-bar{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 18px;border-bottom:1px solid var(--line-dark);color:#fff;font-weight:600;font-size:14.5px;}
[data-theme="light"] .address-bar{border-color:var(--line);color:var(--ink);background:var(--mist);}
.address-body{display:grid;grid-template-columns:1.15fr .85fr;}
@media(max-width:560px){.address-body{grid-template-columns:1fr;}}
.address-result{padding:18px 20px;display:grid;gap:4px;align-content:start;}
.rule-lbl{font-size:10.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--blue-300);margin:0 0 8px;}
[data-theme="light"] .rule-lbl{color:var(--blue-600);}
.scorecard-row{display:flex;justify-content:space-between;gap:14px;margin:0;padding:7px 0;border-bottom:1px dashed var(--line-dark);font-size:13px;color:#C4CCE6;}
.scorecard-row span:last-child{color:#fff;font-weight:600;}
[data-theme="light"] .scorecard-row{border-color:var(--line);color:var(--slate-500);}
[data-theme="light"] .scorecard-row span:last-child{color:var(--ink);}
.scorecard-row:last-child{border-bottom:0;}
.map-mock{position:relative;min-height:170px;background:
  radial-gradient(140px 90px at 65% 40%, rgba(69,104,242,.35), transparent 70%),
  linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),
  linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px);
  background-size:auto,26px 26px,26px 26px;border-left:1px solid var(--line-dark);}
[data-theme="light"] .map-mock{border-color:var(--line);background:
  radial-gradient(140px 90px at 65% 40%, rgba(69,104,242,.16), transparent 70%),
  linear-gradient(rgba(11,19,48,.05) 1px,transparent 1px),
  linear-gradient(90deg,rgba(11,19,48,.05) 1px,transparent 1px);
  background-size:auto,26px 26px,26px 26px;}
.map-mock__pin{position:absolute;left:65%;top:40%;width:14px;height:14px;border-radius:50% 50% 50% 0;transform:translate(-50%,-100%) rotate(-45deg);background:var(--blue-500);box-shadow:0 6px 14px rgba(69,104,242,.5);}
.map-mock__pin::after{content:"";position:absolute;inset:4px;border-radius:50%;background:#fff;}
.map-mock__note{position:absolute;right:10px;bottom:8px;font-size:10.5px;color:#8B96BC;}
[data-theme="light"] .map-mock__note{color:var(--slate-400);}

.rule-editor{display:grid;grid-template-columns:.75fr 1.25fr .8fr;border:1px solid var(--line);border-radius:18px;overflow:hidden;background:#fff;box-shadow:var(--shadow-soft);}
@media(max-width:900px){.rule-editor{grid-template-columns:1fr;}}
.rule-editor__col{padding:20px 22px;border-left:1px solid var(--line);}
.rule-editor__col:first-child{border-left:0;}
@media(max-width:900px){.rule-editor__col{border-left:0;border-top:1px solid var(--line);}.rule-editor__col:first-child{border-top:0;}}
.rule-editor__col--tree{background:var(--mist);}
.tree-item{margin:0;padding:9px 12px;border-radius:9px;font-size:13.5px;color:var(--slate-500);cursor:default;}
.tree-item.is-active{background:#fff;border:1px solid var(--line);color:var(--ink);font-weight:600;box-shadow:var(--shadow-soft);}
.rule-row{margin:0 0 8px;padding:11px 14px;border:1px solid var(--line);border-radius:10px;font-size:12.5px;line-height:1.55;color:var(--slate-500);background:#fff;}
.rule-row b{color:var(--blue-600);font-weight:700;font-size:11px;letter-spacing:.04em;}
.version-item{display:flex;flex-direction:column;gap:1px;margin:0 0 12px;font-size:13px;}
.version-item strong{display:flex;align-items:center;gap:8px;font-weight:600;color:var(--ink);font-family:var(--font-body);}
.version-item span{color:var(--slate-400);font-size:12px;padding-left:16px;}
.vdot{width:8px;height:8px;border-radius:50%;background:#2BB673;display:inline-block;}
.vdot--concept{background:var(--slate-400);}

.service-list{display:grid;gap:10px;}
.service-row{display:grid;grid-template-columns:190px 1fr auto;align-items:center;gap:16px;padding:15px 20px;border:1px solid var(--line);border-radius:14px;background:#fff;font-size:13.5px;transition:border-color .25s var(--ease),transform .25s var(--ease);}
.service-row:hover{border-color:var(--blue-300);transform:translateX(3px);}
.service-row strong{font-family:var(--font-display);font-size:14.5px;color:var(--ink);}
.service-row>span:not(.pill){color:var(--slate-500);}
[data-theme="dark"] .service-row{background:rgba(255,255,255,.05);border-color:var(--line-dark);}
[data-theme="dark"] .service-row strong{color:#fff;}
[data-theme="dark"] .service-row>span:not(.pill){color:#C4CCE6;}
@media(max-width:640px){.service-row{grid-template-columns:1fr auto;}.service-row>span:not(.pill){display:none;}}

.flow{display:flex;align-items:center;gap:14px;flex-wrap:wrap;justify-content:center;}
.flow__node{border:1px solid var(--line-dark);border-radius:16px;background:rgba(255,255,255,.05);padding:18px 22px;font-family:var(--font-display);font-weight:600;font-size:15px;color:#fff;text-align:center;min-width:180px;}
.flow__node small{display:block;font-family:var(--font-body);font-weight:400;font-size:12px;color:#98A2C8;margin-top:4px;}
.flow__node--bron{background:linear-gradient(150deg,#2646D9,#6E86F0);border-color:transparent;box-shadow:var(--shadow-card);}
.flow__node--service{border-color:var(--blue-400);}
.flow__arrow{width:34px;height:2px;background:var(--blue-400);position:relative;flex:none;}
.flow__arrow::after{content:"";position:absolute;right:-1px;top:50%;width:8px;height:8px;border-top:2px solid var(--blue-400);border-right:2px solid var(--blue-400);transform:translateY(-50%) rotate(45deg);}
.flow__fan{display:grid;gap:10px;}
.flow__fan .flow__node{min-width:220px;padding:14px 20px;font-size:14px;}
@media(max-width:860px){.flow{flex-direction:column;}.flow__arrow{width:2px;height:30px;}.flow__arrow::after{right:auto;left:50%;top:auto;bottom:-1px;transform:translateX(-50%) rotate(135deg);}}

/* ---------- appshell (productscherm) ---------- */
.collage{position:relative;}
.float-pill{position:absolute;z-index:3;top:-14px;right:6%;display:inline-flex;align-items:center;gap:9px;padding:10px 16px;border-radius:100px;background:#fff;color:var(--ink);font-size:12.5px;font-weight:600;box-shadow:var(--shadow-card);animation:floatY 5s ease-in-out infinite;}
.float-pill .dot{width:8px;height:8px;border-radius:50%;background:#2BB673;box-shadow:0 0 0 4px rgba(43,182,115,.18);}
.float-card{position:absolute;z-index:2;border-radius:16px;background:#fff;box-shadow:var(--shadow-card);padding:16px 18px;animation:floatY 6s ease-in-out infinite 1.2s;}
.float-card--score{right:-14px;bottom:-34px;width:min(250px,72%);}
.float-card__label{font-size:10.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--slate-400);margin:0 0 8px;}
.float-card__row{display:flex;justify-content:space-between;gap:12px;margin:0;padding:6px 0;border-bottom:1px dashed var(--line);font-size:12.5px;color:var(--slate-500);}
.float-card__row:last-child{border-bottom:0;}
.float-card__row b{color:var(--ink);font-weight:600;display:inline-flex;align-items:center;gap:6px;}
@keyframes floatY{0%,100%{transform:translateY(0);}50%{transform:translateY(-8px);}}
.collage .appshell{margin-bottom:34px;}
.mock-caption--hero{margin:14px 0 0;color:#8B96BC;}

.appshell{display:grid;grid-template-columns:60px minmax(0,1fr);border-radius:18px;overflow:hidden;border:1px solid var(--line-dark);background:#0D1638;box-shadow:var(--shadow-card);}
.appshell__side{display:flex;flex-direction:column;align-items:center;gap:16px;padding:16px 0;background:rgba(255,255,255,.03);border-right:1px solid var(--line-dark);}
.appshell__logo{width:26px;height:auto;margin-bottom:6px;}
.appshell__ico{width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;color:#8B96BC;}
.appshell__ico svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;}
.appshell__ico.is-active{background:var(--blue-600);color:#fff;box-shadow:0 8px 18px rgba(47,82,224,.4);}
.appshell__main{padding:16px 18px 18px;}
.appshell__bar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:14px;}
.appshell__search{flex:1;display:flex;align-items:center;gap:9px;margin:0;padding:9px 14px;border-radius:10px;border:1px solid var(--line-dark);background:rgba(255,255,255,.04);color:#8B96BC;font-size:12.5px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
.appshell__search svg{width:14px;height:14px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;}
.appshell__me{width:30px;height:30px;border-radius:50%;background:linear-gradient(140deg,var(--blue-400),var(--accent-cyaan));flex:none;}
.kpi-row{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:14px;}
.kpi{border:1px solid var(--line-dark);border-radius:12px;padding:11px 13px 9px;background:rgba(255,255,255,.03);}
.kpi span{display:block;font-size:10.5px;color:#8B96BC;margin-bottom:2px;}
.kpi strong{display:block;font-family:var(--font-display);font-size:19px;color:#fff;margin-bottom:5px;}
.kpi svg{width:100%;height:16px;opacity:.85;}
.dtable{border:1px solid var(--line-dark);border-radius:12px;overflow:hidden;font-size:12.5px;}
.dtable__head,.dtable__row{display:grid;grid-template-columns:1.3fr .8fr 1fr .6fr;gap:10px;align-items:center;padding:10px 14px;}
.dtable__head{background:rgba(255,255,255,.04);color:#8B96BC;font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;}
.dtable__row{border-top:1px solid var(--line-dark);color:#C4CCE6;}
.dtable__who{display:flex;align-items:center;gap:9px;color:#fff;font-weight:600;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
.dtable__who i{flex:none;width:22px;height:22px;border-radius:50%;background:linear-gradient(140deg,var(--blue-500),var(--blue-300));}
.dtable__bedrag{text-align:right;font-weight:600;color:#fff;}
.dtable .pill{font-size:10.5px;padding:3px 9px;}
.dtable .pill--bezig,.appshell .pill--bezig{background:rgba(69,104,242,.2);color:var(--blue-300);}
.dtable .pill--klaar,.appshell .pill--klaar{background:rgba(43,182,115,.16);color:#7FE0B2;}
.dtable .pill--wacht,.appshell .pill--wacht{background:rgba(240,173,78,.14);color:#F5C77E;}
.dtable .pill--nieuw{background:rgba(147,113,240,.18);color:#C4AEF8;}
.panel-grid{display:grid;grid-template-columns:1fr 1fr auto;gap:12px;align-items:start;}
@media(max-width:760px){.panel-grid{grid-template-columns:1fr;}}
.panel{border:1px solid var(--line-dark);border-radius:12px;padding:13px 15px;background:rgba(255,255,255,.03);}
.panel__label{font-size:10.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:#8B96BC;margin:0 0 8px;}
.panel__row{display:flex;justify-content:space-between;gap:12px;margin:0;padding:5.5px 0;border-bottom:1px dashed var(--line-dark);font-size:12px;color:#C4CCE6;}
.panel__row:last-child{border-bottom:0;}
.panel__row span:last-child{color:#fff;font-weight:600;}
.panel__row span:first-child{display:inline-flex;align-items:center;gap:7px;}
.panel-actions{display:flex;flex-direction:column;gap:8px;justify-content:center;}
.panel-actions .btn{cursor:default;}
.panel-actions .btn--ghost{border-color:var(--line-dark);color:#C4CCE6;background:rgba(255,255,255,.04);}
.sig{width:8px;height:8px;border-radius:50%;display:inline-block;flex:none;}
.sig--ok{background:#2BB673;}
.sig--let{background:#F0AD4E;}

/* ---------- pakketkaarten & schermplaten ---------- */
.pkg-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
@media(max-width:960px){.pkg-grid{grid-template-columns:1fr;}}
.pkg{border:1px solid var(--line);border-radius:20px;overflow:hidden;background:#fff;transition:transform .25s var(--ease),border-color .25s var(--ease),box-shadow .25s var(--ease);}
.pkg:hover{transform:translateY(-4px);border-color:var(--blue-300);box-shadow:var(--shadow-soft);}
.pkg__visual{background:var(--mist);display:block;padding:0;}
.pkg__visual img{width:100%;height:auto;display:block;transition:transform .35s var(--ease);}
.pkg:hover .pkg__visual img{transform:scale(1.015);}
.pkg__text{padding:20px 24px 22px;display:flex;flex-direction:column;gap:8px;align-items:flex-start;}
.pkg__text strong{font-family:var(--font-display);font-size:17px;color:var(--ink);}
.pkg__text p{font-size:14px;color:var(--slate-500);margin:0;line-height:1.6;flex:1;}
.pkg-note{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;margin-top:26px;padding:18px 24px;border:1px solid var(--line);border-radius:16px;background:var(--mist);}
.pkg-note__label{display:flex;align-items:center;gap:11px;font-size:13.5px;font-weight:600;color:var(--slate-500);}
.pkg-note__label svg{width:19px;height:19px;flex:none;fill:none;stroke:var(--blue-600);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;}
.pkg-shot{margin:0;display:flex;align-items:center;justify-content:center;background:none;padding:0;}
.pkg-shot img{width:min(100%,400px);height:auto;border-radius:22px;filter:drop-shadow(0 26px 50px rgba(2,6,20,.55));}
.shot-plate{margin:0;max-width:100%;border:0;background:none;padding:0;box-shadow:none;}
.shot-plate--smal{max-width:880px;}
.shot-plate img{display:block;width:100%;height:auto;border-radius:16px;box-shadow:0 30px 70px -34px rgba(10,18,48,.45);}
.shot-stack{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));padding-bottom:13%;}.shot-stack>.shot-plate{grid-row:1;}.shot-stack>.shot-plate:first-child{grid-column:1/11;}.shot-stack__voor{grid-column:6/13;align-self:end;margin-bottom:-13%;position:relative;z-index:1;}.shot-stack__voor img{box-shadow:none;border-radius:0;filter:drop-shadow(0 30px 48px rgba(4,8,24,.55));}@media (max-width:760px){.shot-stack{display:block;padding-bottom:0;}.shot-stack__voor{margin:20px 0 0 8%;}}
.pg-shot{margin:0;border-radius:20px;border:1px solid var(--line);overflow:hidden;box-shadow:var(--shadow-soft);}
.pg-shot img{width:100%;height:auto;}
.pg-shot--zoom{max-height:520px;}
.pg-shot--zoom img{object-fit:cover;object-position:top;height:100%;}

/* ---------- pd-split (productdata/data op home) ---------- */
.pd-split{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(30px,4.4vw,64px);align-items:center;}
@media(max-width:900px){.pd-split{grid-template-columns:minmax(0,1fr);}}
.pd-list{display:grid;gap:14px;margin-top:26px;}
.pd-item{display:flex;gap:16px;align-items:flex-start;border:1px solid var(--line-dark);border-radius:18px;padding:22px 24px;background:rgba(255,255,255,.05);transition:border-color .25s var(--ease),transform .25s var(--ease);}
.pd-item:hover{border-color:var(--blue-400);transform:translateY(-2px);}
.pd-item__icon{flex:none;width:44px;height:44px;border-radius:13px;background:rgba(255,255,255,.08);color:var(--blue-300);display:flex;align-items:center;justify-content:center;}
.pd-item__icon svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;}
.pd-item strong{display:block;font-family:var(--font-display);font-size:16.5px;color:#fff;margin-bottom:5px;}
.pd-item p{font-size:13.5px;color:#C4CCE6;line-height:1.6;margin:0 0 8px;}

/* ---------- manifest / dict / vtl / team / blog (over ons) ---------- */
.manifest{display:grid;gap:14px;max-width:880px;}
.manifest__item{display:grid;grid-template-columns:64px 1fr;gap:20px;align-items:start;border:1px solid var(--line);border-radius:18px;padding:26px 28px;background:#fff;transition:transform .25s var(--ease),border-color .25s var(--ease);}
.manifest__item:hover{transform:translateY(-2px);border-color:var(--blue-300);}
.manifest__num{font-family:var(--font-display);font-weight:700;font-size:15px;color:var(--blue-400);padding-top:4px;}
.manifest__item h3{font-size:18px;margin:0 0 8px;}
.manifest__item p{font-size:14px;color:var(--slate-500);line-height:1.65;margin:0;}
@media(max-width:560px){.manifest__item{grid-template-columns:1fr;gap:8px;}}

.dict-wrap{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:clamp(30px,4.4vw,64px);align-items:center;}
@media(max-width:900px){.dict-wrap{grid-template-columns:minmax(0,1fr);}}
.dict{border:1px solid var(--line);border-radius:22px;background:#fff;padding:clamp(28px,3.4vw,42px);box-shadow:var(--shadow-card);}
.dict__word{font-family:var(--font-display);font-weight:700;font-size:clamp(30px,3.6vw,44px);margin:0;letter-spacing:-.01em;}
.dict__word i{font-style:normal;color:var(--blue-400);}
.dict__phon{font-size:13px;color:var(--slate-400);font-style:italic;margin:4px 0 20px;}
.dict__def{list-style:none;margin:0;padding:0;display:grid;gap:14px;}
.dict__def li{display:grid;grid-template-columns:26px 1fr;gap:10px;font-size:14px;color:var(--slate-500);line-height:1.6;}
.dict__def b{font-family:var(--font-display);color:var(--blue-600);}
.dict__def strong{color:var(--ink);}
.dict__note{margin-top:22px;padding:16px 20px;border-left:3px solid var(--blue-500);background:var(--blue-100);border-radius:0 12px 12px 0;}
.dict__note p{font-size:13.5px;color:#2A3352;font-style:italic;margin:0;line-height:1.6;}
.name-copy p{font-size:15px;color:#3C4358;line-height:1.7;}

.vtl{position:relative;display:grid;gap:0;max-width:820px;padding-left:26px;border-left:2px solid var(--line);}
.vtl__item{position:relative;padding:0 0 34px 24px;}
.vtl__item:last-child{padding-bottom:0;}
.vtl__item::before{content:"";position:absolute;left:-7px;top:6px;width:12px;height:12px;border-radius:50%;background:#fff;border:3px solid var(--blue-600);margin-left:-26px;transform:translateX(26px);}
.vtl__year{font-size:11px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--blue-600);margin:0 0 6px;}
.vtl__item h3{font-size:18px;margin:0 0 8px;}
.vtl__item p{font-size:14px;color:var(--slate-500);line-height:1.65;margin:0;max-width:640px;}

.team-row{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
@media(max-width:960px){.team-row{grid-template-columns:1fr 1fr;}}
@media(max-width:560px){.team-row{grid-template-columns:1fr;}}
.member{display:flex;align-items:center;gap:14px;border:1px solid var(--line);border-radius:16px;padding:18px 20px;background:#fff;transition:transform .25s var(--ease),border-color .25s var(--ease);}
.member:hover{transform:translateY(-2px);border-color:var(--blue-300);}
/* Ronde portretfoto. De achtergrondkleur is de vulling zolang het beeld laadt. */
.member__avatar{flex:none;width:56px;height:56px;border-radius:50%;object-fit:cover;background:var(--blue-100);display:block;}
.member strong{display:block;font-family:var(--font-display);font-size:15px;color:var(--ink);}
.member span span{display:block;font-size:12.5px;color:var(--slate-400);margin-top:1px;}

.blog-split{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:18px;align-items:stretch;}
@media(max-width:860px){.blog-split{grid-template-columns:minmax(0,1fr);}}
.blog-hero{border:1px solid var(--line);border-radius:20px;padding:clamp(26px,3vw,38px);background:linear-gradient(160deg,var(--mist),#fff 60%);display:flex;flex-direction:column;gap:12px;align-items:flex-start;transition:transform .25s var(--ease),border-color .25s var(--ease);}
.blog-hero:hover{transform:translateY(-3px);border-color:var(--blue-300);}
.blog-hero h3{font-size:clamp(19px,2.2vw,24px);line-height:1.3;}
.blog-hero h3 a{text-decoration:none;color:var(--ink);}
.blog-hero p{font-size:14px;color:var(--slate-500);line-height:1.6;margin:0;}
.blog-list{display:grid;gap:12px;}
.blog-item{border:1px solid var(--line);border-radius:16px;padding:20px 24px;background:#fff;display:flex;flex-direction:column;gap:8px;align-items:flex-start;transition:transform .25s var(--ease),border-color .25s var(--ease);}
.blog-item:hover{transform:translateY(-2px);border-color:var(--blue-300);}
.blog-item h4{font-size:15.5px;line-height:1.4;}
.blog-item h4 a{text-decoration:none;color:var(--ink);}

/* ---------- contact & formulieren ---------- */
.form-layout{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:clamp(30px,4.4vw,70px);align-items:start;}
@media(max-width:900px){.form-layout{grid-template-columns:minmax(0,1fr);}}
.contact-list{list-style:none;margin:26px 0 0;padding:0;display:grid;gap:14px;}
.contact-list li{display:flex;align-items:flex-start;gap:12px;font-size:14px;color:var(--slate-500);}
.contact-list .ico{margin-top:1px;}
.contact-list a{color:var(--ink);font-weight:600;}
.form{display:grid;gap:16px;}
.form-layout .form{border:1px solid var(--line);border-radius:22px;padding:clamp(24px,3vw,36px);background:#fff;box-shadow:var(--shadow-soft);}
.form__row{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
@media(max-width:620px){.form__row{grid-template-columns:1fr;}}
.field{display:grid;gap:7px;}
.field label{font-size:13px;font-weight:600;color:var(--ink);}
.field input,.field textarea,.select select{width:100%;padding:13px 16px;border-radius:12px;border:1px solid var(--line);background:#fff;font:inherit;font-size:14.5px;color:var(--ink);outline:none;transition:border-color .2s var(--ease),box-shadow .2s var(--ease);}
.field input::placeholder,.field textarea::placeholder{color:#A6AFC6;}
.field input:focus,.field textarea:focus,.select select:focus{border-color:var(--blue-400);box-shadow:0 0 0 4px rgba(69,104,242,.12);}
.field textarea{resize:vertical;min-height:96px;}
.select{position:relative;}
.select::after{content:"";position:absolute;right:16px;top:50%;width:8px;height:8px;border-right:1.7px solid var(--slate-400);border-bottom:1.7px solid var(--slate-400);transform:translateY(-70%) rotate(45deg);pointer-events:none;}
.select select{appearance:none;-webkit-appearance:none;cursor:pointer;}
.field__err{font-size:12px;color:#C4372F;min-height:0;}
.field.is-invalid input{border-color:#DB6B64;}
.field--check{gap:4px;}
.check{display:flex;gap:11px;align-items:flex-start;font-size:13.5px;color:var(--slate-500);cursor:pointer;line-height:1.5;}
.check input{position:absolute;opacity:0;width:1px;height:1px;}
.check__box{flex:none;width:20px;height:20px;border-radius:6px;border:1.5px solid var(--line);background:#fff;position:relative;top:1px;transition:background .2s,border-color .2s;}
.check input:checked+.check__box{background:var(--blue-600);border-color:var(--blue-600);}
.check input:checked+.check__box::after{content:"";position:absolute;left:5px;top:4px;width:8px;height:4.5px;border-left:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(-45deg);}
.check input:focus-visible+.check__box{box-shadow:0 0 0 4px rgba(69,104,242,.18);}
.form__success{font-size:13.5px;font-weight:600;color:#177A4C;background:#E3F5EC;border-radius:12px;padding:12px 16px;margin:0;}

/* ---------- modal ---------- */
.modal{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;padding:22px;}
.modal__backdrop{position:absolute;inset:0;background:rgba(8,13,34,.62);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);animation:fadeIn .3s var(--ease);}
.modal__dialog{position:relative;z-index:1;width:min(480px,100%);background:#fff;border-radius:22px;padding:clamp(26px,4vw,36px);box-shadow:var(--shadow-card);animation:modalIn .4s var(--ease);max-height:calc(100vh - 44px);overflow:auto;}
@keyframes fadeIn{from{opacity:0;}}
@keyframes modalIn{from{opacity:0;transform:translateY(16px) scale(.98);}to{opacity:1;transform:none;}}
.modal__close{position:absolute;top:16px;right:16px;width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--slate-400);}
.modal__close:hover{background:var(--mist);color:var(--ink);}
.modal__close svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;}
.modal__dialog h3{padding-right:36px;}
.modal__lead{font-size:14px;color:var(--slate-500);line-height:1.65;margin:10px 0 22px;}
html.modal-open{overflow:hidden;}

/* ---------- cookiebar ---------- */
.cookie{position:fixed;left:50%;bottom:20px;transform:translateX(-50%);z-index:150;width:min(680px,calc(100% - 32px));background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow-card);animation:modalIn .5s var(--ease);}
.cookie__inner{padding:20px 22px;display:grid;gap:14px;}
.cookie__title{font-family:var(--font-display);font-weight:700;font-size:15px;margin:0 0 4px;}
.cookie__text{font-size:13px;color:var(--slate-500);line-height:1.6;margin:0;}
.cookie__actions{display:flex;gap:9px;flex-wrap:wrap;}
.cookie__settings{display:grid;gap:12px;padding-top:6px;border-top:1px solid var(--line);}
.switch{display:flex;align-items:center;gap:12px;font-size:13.5px;color:var(--slate-500);cursor:pointer;}
.switch input{position:absolute;opacity:0;width:1px;height:1px;}
.switch__ui{flex:none;width:40px;height:23px;border-radius:100px;background:var(--line);position:relative;transition:background .25s var(--ease);}
.switch__ui::after{content:"";position:absolute;left:3px;top:3px;width:17px;height:17px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(11,19,48,.24);transition:transform .25s var(--ease);}
.switch input:checked+.switch__ui{background:var(--blue-600);}
.switch input:checked+.switch__ui::after{transform:translateX(17px);}
.switch input:disabled+.switch__ui{opacity:.55;}
.cookie__settings .btn{justify-self:start;}

/* ---------- CTA-band, klantcase-gradient met scrollanimatie ---------- */
.section--cta{background:linear-gradient(120deg,var(--navy-800),#2646D9 58%,#6E86F0);color:#fff;overflow:hidden;}
.section--cta::before{content:"";position:absolute;inset:0;background:
  radial-gradient(500px 320px at 12% 120%, rgba(97,174,202,.25), transparent 60%),
  linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),
  linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:auto,56px 56px,56px 56px;
  -webkit-mask-image:radial-gradient(90% 100% at 50% 0%,#000 40%,transparent 100%);
  mask-image:radial-gradient(90% 100% at 50% 0%,#000 40%,transparent 100%);pointer-events:none;}
.cta{position:relative;z-index:1;text-align:center;display:flex;flex-direction:column;align-items:center;}
.cta__title{color:#fff;max-width:22ch;}
.cta__lead{font-size:clamp(15px,1.7vw,17px);color:#DCE3FA;line-height:1.7;max-width:600px;margin:16px 0 0;}
.cta__actions{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;margin-top:30px;}
.section--cta .btn--dark{background:var(--ink);box-shadow:0 14px 30px rgba(8,13,34,.35);}
.section--cta .btn--dark:hover{background:#000;}
.section--cta .btn--outline-dark{border-color:rgba(255,255,255,.55);color:#fff;}
.section--cta .btn--outline-dark:hover{border-color:#fff;background:rgba(255,255,255,.1);}
@supports (animation-timeline: view()){
  @media (prefers-reduced-motion: no-preference){
    .section--cta .cta{animation:ctaSlide both;animation-timeline:view();animation-range:entry 0% entry 70%;}
    @keyframes ctaSlide{from{opacity:.25;transform:translateY(46px) scale(.985);}to{opacity:1;transform:none;}}
  }
}

/* ---------- footer ---------- */
.footer{background:var(--navy-900);color:#C4CCE6;padding:clamp(48px,6vw,76px) 0 30px;position:relative;overflow:hidden;}
.footer::before{content:"";position:absolute;inset:0;background:radial-gradient(620px 380px at 90% 0%, rgba(47,82,224,.22), transparent 65%);pointer-events:none;}
.footer .container{position:relative;z-index:1;}
.footer__top{display:grid;grid-template-columns:1.1fr 2fr;gap:clamp(30px,4.6vw,70px);padding-bottom:38px;border-bottom:1px solid var(--line-dark);}
@media(max-width:900px){.footer__top{grid-template-columns:1fr;}}
.footer__brand .nav__logo-img{height:30px;}
.footer__tagline{font-size:13.5px;color:#98A2C8;line-height:1.65;margin:18px 0 20px;max-width:300px;}
/* Centraal servicenummer voor alle labels (Bianca, 1-10-2026). Op de telefoon direct te bellen. */
.footer__tel{display:inline-flex;align-items:center;gap:10px;min-height:44px;margin:-6px 0 14px;font-size:15px;font-weight:600;color:#fff;text-decoration:none;white-space:nowrap;}
.footer__tel svg{width:17px;height:17px;fill:none;stroke:var(--blue-300);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.footer__tel:hover{color:var(--blue-300);}
.support__tel{color:var(--ink);font-weight:600;white-space:nowrap;}
.footer__social{display:flex;gap:9px;}
.footer-social_link{width:38px;height:38px;border-radius:12px;border:1px solid var(--line-dark);display:inline-flex;align-items:center;justify-content:center;color:#C4CCE6;transition:border-color .2s,color .2s,transform .2s;}
.footer-social_link:hover{border-color:var(--blue-400);color:#fff;transform:translateY(-2px);}
.footer-social_link svg{width:16px;height:16px;fill:currentColor;}
.footer__cols{display:grid;grid-template-columns:1.35fr .85fr 1.15fr .8fr;gap:24px;}
@media(min-width:1200px){.footer__cols{grid-template-columns:1.2fr .68fr 1.42fr .7fr;}}
@media(max-width:760px){.footer__cols{grid-template-columns:1fr 1fr;}}
.footer__label{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#8B96BC;margin:0 0 16px;}
.footer-link_link{display:block;font-size:13.5px;color:#C4CCE6;text-decoration:none;padding:5px 0;text-align:left;}
.footer-link_link:hover{color:#fff;}
.footer__bottom{display:flex;align-items:center;justify-content:space-between;gap:18px;padding-top:24px;font-size:12.5px;color:#8B96BC;flex-wrap:wrap;}
.footer__bottom p{margin:0;}
.footer__legal{display:flex;gap:18px;align-items:center;}
.footer__legal .footer-link_link{font-size:12.5px;padding:0;display:inline;}

/* ---------- reveal-animaties ---------- */
.reveal{opacity:0;transform:translateY(20px);transition:opacity .7s var(--ease),transform .7s var(--ease);transition-delay:var(--rd,0ms);will-change:opacity,transform;}
.reveal.is-in{opacity:1;transform:none;}
body.no-js .reveal{opacity:1;transform:none;}
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;}
  html{scroll-behavior:auto;}
  .reveal,[data-split] .w{opacity:1;transform:none;}
}

/* ---------- print ---------- */
@media print{
  .nav,.footer,.to-top,.cookie,.modal,.scroll-progress,.info-banner,.kn-bar,.ai-bar,.section--cta{display:none !important;}
  .section{padding:20px 0;}
  body{color:#000;}
}


/* ---------- mobiele verfijning ---------- */
.appshell__main{min-width:0;}
@media(max-width:640px){
  .eyebrow{letter-spacing:.09em;font-size:11px;}
  .kpi-row{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;}
  .kpi strong{font-size:15.5px;}
  .kpi span{font-size:9.5px;}
  .dtable{font-size:11.5px;}
  .dtable__head,.dtable__row{grid-template-columns:1.35fr .85fr 1fr;gap:8px;padding:9px 10px;}
  .dtable__bedrag{display:none;}
  .dtable .pill{font-size:9.5px;padding:3px 7px;}
  .appshell__search{font-size:11px;}
  .panel-grid{grid-template-columns:minmax(0,1fr);}
  .float-card--score{right:6px;bottom:-26px;}
  .service-row{padding:13px 14px;}
  .btn{padding:14px 21px;font-size:14px;}
  .prose h2{gap:10px;}
}
html,body{overflow-x:clip;}


/* ---------- verfijning na review ---------- */
section[id],h2[id]{scroll-margin-top:calc(var(--nav-h) + 74px);}
.tabs__anker{display:block;height:0;scroll-margin-top:calc(var(--nav-h) + 74px);}
.orbit__ring{stroke:#D7DEF0;}
.btn:focus-visible,.chip:focus-visible,.ai-btn:focus-visible,.vraag-chip:focus-visible,.acc__head:focus-visible,.tabs__link:focus-visible,.nav-link:focus-visible{outline:3px solid rgba(69,104,242,.4);outline-offset:2px;border-radius:100px;}
.acc__head:focus-visible{border-radius:16px;}
.pkg:focus-visible{outline:3px solid rgba(69,104,242,.4);outline-offset:2px;}

body.menu-open .nav{z-index:130;}
body.menu-open .cookie{display:none;}

/* =========================================================
   Bronnenlijst en auteursblok onder een artikel.
   Overgenomen uit de vorige build voor het artikel
   'Vier partijen, een keten' en vertaald naar de tokens
   van dit systeem.
   ========================================================= */
.art-sources{
  margin-top:clamp(44px,5vw,72px);
  padding-top:clamp(28px,3vw,40px);
  border-top:1px solid var(--line);
  max-width:var(--measure,66ch);
}
.art-sources h2{font-size:1.16rem;font-weight:600;letter-spacing:-.02em;margin-bottom:16px}
.art-sources ol{display:flex;flex-direction:column;gap:10px;counter-reset:src;
  list-style:none;padding:0;margin:0}
.art-sources li{position:relative;padding-left:30px;font-size:.9rem;line-height:1.55;
  color:var(--slate-500);counter-increment:src;margin:0}
.art-sources li::before{
  content:counter(src);position:absolute;left:0;top:.02em;
  width:21px;height:21px;border-radius:50%;
  background:var(--mist);border:1px solid var(--line);
  display:grid;place-items:center;
  font-size:.7rem;font-weight:700;color:var(--blue-600);
}
.art-author{
  margin-top:clamp(36px,4vw,56px);
  display:flex;gap:20px;align-items:flex-start;
  max-width:var(--measure,66ch);
  background:var(--mist);border:1px solid var(--line);
  border-radius:var(--radius);padding:clamp(22px,2.4vw,30px);
}
.art-author__avatar{
  width:56px;height:56px;border-radius:50%;
  background:linear-gradient(150deg,var(--blue-600),var(--navy-800));
  display:grid;place-items:center;color:#fff;font-weight:700;font-size:.95rem;flex:0 0 auto;
}
.art-author strong{display:block;font-size:1rem;font-weight:600;margin-bottom:6px}
.art-author p{font-size:.92rem;color:var(--slate-500);line-height:1.6;margin-bottom:10px}
@media (max-width:560px){
  .art-author{flex-direction:column;gap:14px}
}

/* Het citaatblok in dit systeem verwacht een <p>. Het overgezette artikel
   gebruikt <blockquote> met een <cite>, dus die vorm krijgt hier dezelfde
   opmaak. Zonder deze regels lopen naam en functie aan elkaar vast. */
.pullquote blockquote{
  font-family:var(--font-display);font-size:18.5px;line-height:1.5;
  color:var(--ink);margin:0 0 12px;font-weight:600;
}
.pullquote cite{
  font-style:normal;display:block;
  font-size:.9rem;font-weight:600;color:var(--ink);
}
.pullquote cite span{
  display:block;margin-top:3px;
  font-weight:400;font-size:.85rem;color:var(--slate-500);
}


/* =========================================================
   Smalle schermen: de knop 'Plan een gesprek' paste niet naast
   de hamburger, waardoor die 4 px over de rechterrand viel. De
   knop verhuist daarom naar het opengeklapte menu.
   ========================================================= */
.nav__menu-cta{display:none}
@media(max-width:560px){
  .nav__actions .btn--primary{display:none}
  /* Zonder de knop ernaast zou de hamburger tegen het logo aan schuiven,
     dus duwt hij zichzelf naar de rechterkant. */
  .nav__actions{margin-left:auto}
  .nav__inner{gap:14px}
  .nav__menu-cta{
    display:grid;gap:10px;
    margin-top:22px;padding-top:22px;
    border-top:1px solid var(--line);
  }
  .nav__menu-cta .btn{width:100%;justify-content:center}
}

/* ---------- Voor wie (home): ketenbeeld als achtergrond, tekst links op het lichte deel (14-9-2026) ---------- */
.section.branches--foto[data-theme="light"]{position:relative;background:#F5F7FC url(img/keten-adviseur-binnendienst-klant.webp) right center/cover no-repeat;}
.section.branches--foto[data-theme="light"]::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(245,247,252,.94) 0%,rgba(245,247,252,.88) 34%,rgba(245,247,252,.45) 50%,rgba(245,247,252,0) 62%);}
.branches--foto>.container{position:relative;z-index:1;}
.branches--foto .section__head--split{flex-direction:column;align-items:flex-start;gap:0;max-width:600px;}
.branches--foto .tabs__pane-grid{grid-template-columns:minmax(0,600px);}
@media(max-width:1020px){
  .section.branches--foto[data-theme="light"]{background-position:72% center;}
  .section.branches--foto[data-theme="light"]::before{background:linear-gradient(180deg,rgba(245,247,252,.95),rgba(245,247,252,.86));}
}

/* ---------- Voor wie (home): handgeschreven "Klik hier" met gebogen pijl naar de keuzeknoppen (15-9-2026) ---------- */
.tabs__menu-row{display:flex;align-items:flex-start;gap:6px 10px;flex-wrap:wrap;margin-bottom:clamp(24px,3vw,38px);}
.tabs__menu-row .tabs__menu{margin-bottom:0;}
.tabs__hint{position:relative;display:flex;align-items:flex-end;gap:0;color:var(--blue-600);margin-top:-38px;animation:hintBob 3.2s ease-in-out infinite;}
.tabs__hint-arrow{width:118px;height:66px;flex:none;}
.tabs__hint-text{font-family:'Caveat',cursive;font-style:italic;font-weight:600;font-size:27px;line-height:1;white-space:nowrap;transform:rotate(-8deg) translate(4px,-46px);}
@keyframes hintBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
@media(max-width:700px){
  .tabs__menu-row{flex-direction:column;gap:0;}
  .tabs__hint{margin:-4px 0 0 10px;align-items:flex-start;}
  .tabs__hint-arrow{transform:scaleY(-1);}
  .tabs__hint-text{transform:rotate(-8deg) translate(-6px,30px);}
}
@media(prefers-reduced-motion:reduce){.tabs__hint{animation:none;}}

/* ---------- Voorkant en verkoopkanaal (home): tekst links, koppelingenbeeld rechts (15-9-2026, beeld Jacoline) ---------- */
.ecosystem__grid{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:center;}
@media(min-width:960px){.ecosystem__grid{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);}}
/* Zonder beeld loopt de sectie over een kolom. Het beeld met de logo's van ANVA, Novulo en CCS
   is er op 28-9-2026 uit gehaald; zie docs/claims/claim-controle-voor-livegang.md. */
.ecosystem__grid--enkel{grid-template-columns:minmax(0,1fr)!important;}
.ecosystem__grid--enkel .ecosystem__head{max-width:74ch;}
.ecosystem__head{margin-bottom:0;max-width:none;}
.ecosystem__visual{margin:0;min-width:0;}
.ecosystem__visual img{width:100%;height:auto;display:block;}
/* vier lagen naast het platformbeeld (29-9-2026): toelichting als echte tekst, niet in het beeld */
.lagen{list-style:none;margin:26px 0 0;padding:0 0 0 18px;border-left:2px solid var(--line);display:grid;gap:14px;}
.lagen li{font-size:15px;line-height:1.6;color:var(--slate-500);}
.lagen b{display:block;font-family:var(--font-display);font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--blue-600);margin-bottom:2px;}
.lagen strong{color:var(--ink);font-weight:600;}
@media(max-width:959px){.ecosystem__visual{max-width:640px;margin:0 auto;}}

/* ============================================================
   PAKKET-PAGINAKOP (volle breedte)
   De kop van de drie pakketpagina's. Loopt van schermrand tot
   schermrand; de inhoud erbinnen staat op dezelfde as van 1160
   als nav, secties en footer. Het beeldmerk staat linksboven,
   het nagebouwde Inpact-scherm rechts.
   Alles staat hier, niet in de pagina zelf, zodat een latere
   huisstijlwijziging in een keer doorwerkt.
   ============================================================ */
.pakkethero{position:relative;overflow:hidden;background:var(--navy-900);color:#fff;}
.pakkethero__art{position:absolute;inset:0;background:url(img/pakketten/berglandschap.svg) center/cover no-repeat;}
.pakkethero__tint{position:absolute;inset:0;background:linear-gradient(100deg,rgba(10,18,48,.97) 0%,rgba(13,22,56,.9) 40%,rgba(13,22,56,.42) 66%,rgba(10,18,48,.2) 84%,rgba(10,18,48,.34) 100%);}
.pakkethero__inner{position:relative;z-index:2;padding-block:clamp(30px,4vw,54px) clamp(56px,6vw,96px);}
.pakkethero__grid{display:grid;gap:clamp(28px,3.4vw,46px);align-items:center;}
.pakkethero__grid>*{min-width:0;}
@media(min-width:1000px){.pakkethero__grid{grid-template-columns:1.02fr .98fr;}}
/* variant met een echte schermafbeelding: beeld krijgt meer breedte zodat de tekst erin leesbaar blijft */
@media(min-width:1000px){.pakkethero__grid--breedbeeld{grid-template-columns:.86fr 1.14fr;}}

/* het beeldmerk uit het logo, op de plek van het oude gekleurde vierkantje */
/* Het beeldmerk staat ruim in zijn eigen vierkant (240x240), dus het moet
   groter staan dan je zou denken om even zwaar te wegen als de kop. */
.pakkethero__merk{display:block;width:auto;height:76px;margin:-6px 0 14px -6px;}

.pakkethero .crumbs{position:relative;z-index:2;color:#8C99C4;}
.pakkethero .crumbs a{color:#B6C1E4;}
.pakkethero .eyebrow{color:rgba(255,255,255,.85);}
.pakkethero__cta{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-bottom:26px;}
.pakkethero__checks{display:flex;flex-wrap:wrap;gap:12px 22px;font-size:14px;font-weight:500;}
.pakkethero__checks div{display:flex;align-items:center;gap:8px;}
.pakkethero__checks i{width:20px;height:20px;border-radius:50%;background:rgba(255,255,255,.18);border:1.5px solid rgba(255,255,255,.5);display:grid;place-items:center;flex:none;}
.pakkethero__checks i svg{width:10px;height:10px;stroke:#fff;stroke-width:3;fill:none;stroke-linecap:round;stroke-linejoin:round;}

/* handgeschreven notitie en citaat: sfeer, dus weg zodra de ruimte krap wordt */



/* ---------- nagebouwd Inpact-scherm in de paginakop ----------
   Overgenomen uit het kaartontwerp; de vier eigen variabelen zijn
   vervangen door hun waarde, zodat alles op de sitetokens draait. */
.pk-scherm{position:relative;z-index:2;background:#fff;border-radius:20px;box-shadow:0 46px 100px -42px rgba(10,18,48,.6),0 8px 24px -12px rgba(10,18,48,.25);color:var(--ink);font-size:.68rem;overflow:hidden;max-width:560px}
.pk-scherm__bar{display:flex;align-items:center;gap:.8rem;padding:.6rem .95rem;border-bottom:1px solid var(--line)}
.pk-scherm__bar .pk-logo{font-size:.85rem}.pk-scherm__bar .pk-logo svg{width:18px;height:18px}
.pk-scherm__zoek{flex:1;max-width:220px;background:var(--mist);border:1px solid var(--line);border-radius:999px;padding:.3rem .8rem;color:#9AA3BC;font-size:.62rem}
.pk-scherm__usr{margin-left:auto;display:flex;align-items:center;gap:.5rem}
.pk-scherm__bel{position:relative;width:16px;height:16px;stroke:var(--slate-500);stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}
.pk-scherm__dot{position:absolute;top:-2px;right:-3px;width:7px;height:7px;border-radius:50%;background:#E23D3D;border:1.5px solid #fff}
.pk-scherm__av{width:24px;height:24px;border-radius:50%;background:var(--blue-100);color:var(--blue-600);font-weight:700;font-size:.58rem;display:grid;place-items:center}
.pk-scherm__body{display:grid;grid-template-columns:138px 1fr;min-height:300px}
.pk-scherm__nav{padding:.7rem .5rem;display:flex;flex-direction:column;gap:.12rem;border-right:1px solid var(--line);background:#FBFCFE}
.pk-scherm__nav a{display:flex;align-items:center;gap:.5rem;padding:.4rem .6rem;border-radius:9px;font-size:.62rem;color:var(--slate-500);white-space:nowrap}
.pk-scherm__nav a i{width:13px;height:13px;border-radius:4px;background:currentColor;opacity:.28;flex:none}
.pk-scherm__nav a.pk-on{background:var(--blue-100);color:var(--blue-600);font-weight:600}
.pk-scherm--donkernav .pk-scherm__nav{background:var(--navy-700);border-right:0}
.pk-scherm--donkernav .pk-scherm__nav a{color:rgba(255,255,255,.68)}
.pk-scherm--donkernav .pk-scherm__nav a.pk-on{background:rgba(255,255,255,.14);color:#fff}
.pk-scherm__main{padding:.9rem 1rem}
.pk-skop{font-weight:700;font-size:.9rem}
.pk-ssub{color:var(--slate-500);font-size:.62rem;margin-bottom:.7rem}
.pk-statjes{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;margin-bottom:.7rem}
.pk-statje{border:1px solid var(--line);border-radius:10px;padding:.5rem .65rem}
.pk-statje span{display:block;color:var(--slate-500);font-size:.56rem}
.pk-statje b{font-size:.82rem}
.pk-blokje{border:1px solid var(--line);border-radius:14px;padding:.6rem .7rem;margin-bottom:.55rem}
.pk-blokje__kop{display:flex;align-items:center;justify-content:space-between;font-weight:600;font-size:.68rem;margin-bottom:.45rem}
.pk-telpil{background:var(--blue-100);color:var(--blue-600);font-weight:700;font-size:.56rem;border-radius:999px;padding:.08rem .5rem}
.pk-srow{display:flex;gap:.55rem;align-items:center;padding:.42rem 0;border-top:1px solid var(--line)}
.pk-srow:first-of-type{border-top:0}
.pk-srow i{width:24px;height:24px;border-radius:8px;background:var(--blue-100);display:grid;place-items:center;flex:none}
.pk-srow i svg{width:12px;height:12px;stroke:var(--blue-600);stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}
.pk-srow div{flex:1;min-width:0}
.pk-srow b{display:block;font-size:.64rem}
.pk-srow span{color:var(--slate-500);font-size:.56rem}
.pk-srow .pk-geld{font-weight:600;font-size:.62rem;text-align:right;color:var(--ink)}
.pk-srow .pk-geld span{display:block;font-weight:400}
.pk-status{flex:none;font-size:.52rem;font-weight:700;border-radius:999px;padding:.14rem .55rem}
.pk-status--ok{background:#E7F6EF;color:#1E9E6A}
.pk-status--beh{background:var(--blue-100);color:var(--blue-600)}
.pk-status--geel{background:#FDF3DC;color:#A87A18}
.pk-slink{display:flex;align-items:center;gap:.35rem;color:var(--blue-600);font-weight:600;font-size:.62rem;margin-top:.2rem}
.pk-slink svg{width:11px;height:11px;stroke:currentColor;stroke-width:2.4;fill:none;stroke-linecap:round;stroke-linejoin:round}
.pk-hulp{display:flex;align-items:center;gap:.5rem;background:var(--blue-100);border-radius:10px;padding:.5rem .7rem;color:var(--blue-600);font-weight:600;font-size:.62rem;justify-content:space-between}
.pk-prog{display:flex;align-items:center;gap:.4rem;margin:.5rem 0 .9rem}
.pk-prog i{width:20px;height:20px;border-radius:50%;display:grid;place-items:center;font-size:.56rem;font-weight:700;flex:none}
.pk-prog i.pk-aan{background:var(--blue-600);color:#fff}
.pk-prog i.pk-uit{background:var(--blue-100);color:var(--blue-600)}
.pk-prog .pk-lijn{flex:1;height:2px;background:var(--blue-100);border-radius:2px}
.pk-prog .pk-lijn.pk-aan{background:var(--blue-600)}
.pk-prog span{font-size:.56rem;color:var(--slate-500)}
.pk-balk{height:8px;border-radius:4px;background:var(--blue-100);margin:.3rem 0 .55rem}
.pk-balk i{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,var(--blue-600),var(--blue-400))}
.pk-veldlbl{display:flex;justify-content:space-between;font-size:.6rem;color:var(--slate-500)}
.pk-veldlbl b{color:var(--ink);font-weight:600}
.pk-minipil{border:1px solid var(--line);border-radius:999px;padding:.24rem .7rem;font-size:.58rem;color:var(--slate-500);display:inline-flex;gap:.3rem;margin-right:.4rem}
.pk-tabs{display:flex;gap:.9rem;border-bottom:1px solid var(--line);margin-bottom:.6rem;font-size:.62rem;color:var(--slate-500)}
.pk-tabs b{color:var(--blue-600);border-bottom:2px solid var(--blue-600);padding-bottom:.35rem;font-weight:600;display:inline-flex;gap:.3rem;align-items:center}
.pk-tabs .pk-telpil{font-size:.5rem}


/* Het scherm is een voorbeeldweergave; dat staat er ook onder. */
.pk-scherm{max-width:560px;}
.pk-scherm__bijschrift{position:relative;z-index:2;margin:14px 0 0;font-size:12px;color:rgba(255,255,255,.62);display:flex;align-items:center;gap:7px;}
.pk-scherm__bijschrift::before{content:"";width:5px;height:5px;border-radius:50%;background:rgba(255,255,255,.45);flex:none;}
@media(max-width:1000px){.pk-scherm{max-width:100%;}}
@media(max-width:640px){
  .pk-scherm__body{grid-template-columns:minmax(0,1fr);min-height:0;}
  .pk-scherm__nav{display:none;}
  .pk-statjes{grid-template-columns:1fr 1fr;}
  .pakkethero__merk{height:38px;}
}

/* ---------- 404: paginakop met achtergrondfoto (verplaatst uit 404.html, 15-9-2026) ---------- */
/* 404: foto uit de beeldbank (Veenendaal nr. 78: collega van achteren aan twee schermen) als achtergrond met donkerblauwe waas (15-9-2026).
   Tekst links over het donkere deel, de schermen rechts. */
.section.pagehero--foto[data-theme="dark"]{background:#0B142E url(img/404-achtergrond.webp) 50% 45%/cover no-repeat;min-height:540px;display:flex;flex-direction:column;justify-content:center;}
.pagehero--foto .pagehero__bg{background:linear-gradient(90deg,rgba(10,18,48,.9) 0%,rgba(10,18,48,.8) 40%,rgba(10,18,48,.5) 65%,rgba(10,18,48,.6) 100%);}
.pagehero--foto .pagehero__bg::after{opacity:.3;}
.pagehero--foto .pagehero__title,.pagehero--foto .pagehero__lead{max-width:560px;}
@media(max-width:800px){
  .section.pagehero--foto[data-theme="dark"]{background-image:url(img/404-achtergrond-1200.webp);background-position:60% 45%;min-height:0;}
  .pagehero--foto .pagehero__bg{background:linear-gradient(180deg,rgba(10,18,48,.8),rgba(10,18,48,.86));}
}

/* ---------- support: ticketsystemen bij contact (15-9-2026) ---------- */
.support{margin-top:clamp(26px,3vw,38px);padding:clamp(20px,2.4vw,26px);background:var(--mist);
  border:1px solid var(--line);border-radius:var(--radius);}
.support__head{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin:0 0 4px;}
.support__title{font-family:var(--font-display);font-size:16px;font-weight:600;color:var(--ink);margin:0;}
.support__lead{font-size:14.5px;color:var(--slate-500);margin:0 0 16px;line-height:1.6;}
.support__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
@media(max-width:560px){.support__grid{grid-template-columns:minmax(0,1fr);}}
.support__card{position:relative;display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--line);
  border-radius:12px;padding:16px 18px;transition:border-color .25s var(--ease),transform .25s var(--ease),box-shadow .25s var(--ease);}
.support__card:hover{border-color:var(--blue-300);transform:translateY(-2px);box-shadow:var(--shadow-soft);}
.support__naam{display:block;font-family:var(--font-display);font-size:14.5px;font-weight:600;
  color:var(--ink);margin:0 0 2px;}
.support__wat{display:block;font-size:13.5px;color:var(--slate-500);margin:0 0 12px;line-height:1.5;}
.support__link{display:inline-flex;align-items:center;gap:7px;font-size:13.5px;font-weight:600;
  color:var(--blue-600);text-decoration:none;
  margin-top:auto;align-self:flex-start;} /* ticketlink in beide kaarten op dezelfde hoogte */
.support__link::after{content:"";width:14px;height:14px;flex:none;
  background:currentColor;-webkit-mask:var(--pijl) center/contain no-repeat;mask:var(--pijl) center/contain no-repeat;
  transition:transform .25s var(--ease);}
.support__card:hover .support__link::after{transform:translateX(3px);}
:root{--pijl:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h13M12 5l7 7-7 7'/%3E%3C/svg%3E");}
.support__card::after{content:"";position:absolute;inset:0;border-radius:12px;}
.support__card a::before{content:"";position:absolute;inset:0;z-index:1;border-radius:12px;}
.kantoren{display:block;font-style:normal;margin-top:18px;font-size:14.5px;line-height:1.9;color:var(--slate-500);}
.kantoren__plaats{display:inline-block;min-width:96px;font-weight:600;color:var(--ink);}

/* ---------- Productdata: opmaak modules Product Engines en Product Services (29-9-2026) ----------
   Alleen gebruikt op productdata.html. Alle klassen beginnen met .pdm__ zodat niets anders verschuift.
   Variabelen: controleer of ze in :root bestaan; zo niet, vervang door de dichtstbijzijnde bestaande. */

.pdm__head{max-width:760px;}
.pdm__kern{font-family:var(--font-display);font-weight:500;font-size:clamp(20px,2.1vw,24px);line-height:1.35;margin-top:14px;max-width:32ch;}

.pdm__points{display:grid;gap:34px 56px;margin-top:48px;}
@media(min-width:760px){.pdm__points{grid-template-columns:repeat(2,minmax(0,1fr));}}
.pdm__points--stack{margin-top:0;gap:30px;}
@media(min-width:760px){.pdm__points--stack{grid-template-columns:minmax(0,1fr);}}

.pdm__point{position:relative;border-top:2px solid var(--line);padding-top:18px;}
.pdm__point::before{content:"";position:absolute;top:-2px;left:0;width:44px;height:2px;background:var(--blue-600);}
.pdm__point h3{font-family:var(--font-display);font-weight:600;font-size:19px;line-height:1.3;margin:0 0 8px;}
.pdm__point p{font-size:17px;line-height:1.6;max-width:48ch;margin:0;}

.pdm__schema{max-width:1000px;margin:56px auto 0;}
.pdm__schema--side{max-width:none;margin:0;}
.pdm__schema a{display:block;cursor:zoom-in;}.lightbox{position:fixed;inset:0;z-index:1200;display:flex;align-items:center;justify-content:center;padding:clamp(16px,4vw,56px);background:rgba(6,10,28,.9);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);opacity:0;transition:opacity .26s var(--ease);cursor:zoom-out;}.lightbox[hidden]{display:none;}.lightbox.is-open{opacity:1;}.lightbox__beeld{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;transform:scale(.96);transition:transform .32s var(--ease);cursor:default;}.lightbox.is-open .lightbox__beeld{transform:none;}.lightbox__sluit{position:absolute;top:16px;right:16px;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.08);color:#fff;display:grid;place-items:center;cursor:pointer;transition:background .2s;}.lightbox__sluit:hover,.lightbox__sluit:focus-visible{background:rgba(255,255,255,.2);}.lightbox__sluit svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;}html.lightbox-open{overflow:hidden;}[data-zoom]{cursor:zoom-in;}[data-zoom] img{transition:transform .35s var(--ease),filter .35s var(--ease);}@media (hover:hover){[data-zoom]:hover img{transform:translateY(-4px);}}[data-zoom]:focus-visible{outline:2px solid var(--blue-500);outline-offset:6px;border-radius:16px;}
.pdm__cap{font-size:13px;color:var(--slate-500);margin-top:10px;text-align:right;}

.pdm__norm{margin-top:48px;display:grid;gap:22px 48px;align-items:center;padding:26px 30px;border-radius:20px;background:#fff;border:1px solid var(--line);}
@media(min-width:900px){.pdm__norm{grid-template-columns:auto minmax(0,1fr);}}
.pdm__norm-label{font-size:13.5px;font-weight:600;color:var(--slate-500);margin:0 0 10px;}
.pdm__norm-label--kop{font-family:var(--font-display);font-size:17px;color:var(--ink);margin-bottom:12px;}
.pdm__chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px;}
.pdm__chips li{font-size:14px;font-weight:600;padding:8px 14px;border-radius:999px;background:rgba(38,70,217,.08);color:var(--blue-600);white-space:nowrap;}
.pdm__usp{font-family:var(--font-display);font-weight:500;font-size:18px;line-height:1.45;border-left:3px solid var(--blue-600);padding-left:20px;margin:0;}

.pdm__split{display:grid;gap:40px 64px;align-items:center;margin-top:48px;}
@media(min-width:960px){.pdm__split{grid-template-columns:minmax(0,1fr) minmax(0,1fr);}}
.pdm__intro{font-size:17px;line-height:1.6;max-width:52ch;margin:0 0 34px;}

/* === NIEUWE INDELING (start) · niet handmatig bewerken, bron: nieuwe-indeling.css === */
/* Inpact · nieuwe indeling (twee gebieden, modulepagina's) · 29-9-2026
   Wordt door integreer.py tussen markeringen achter assets/styles.css gezet.
   Gebruikt alleen bestaande variabelen: --blue-600 --font-display --ink --line --slate-400 --slate-500 */
.mod-groep{margin:clamp(30px,3.6vw,46px) 0 6px;font-size:12px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--slate-400)}
.mod-groep--eerste{margin-top:0}
.mod-groep__lead{margin:0 0 16px;max-width:760px;color:var(--slate-500);font-size:15px;line-height:1.65}
.mod{scroll-margin-top:150px;display:flex;flex-direction:column}
.mod__voor{font-size:13px;color:var(--slate-500);margin:12px 0 16px;line-height:1.55}
.mod__voor b{color:var(--ink);font-weight:600}
.mod .link-arrow{margin-top:auto;align-self:flex-start;padding-top:14px}
.mod-grid--1{grid-template-columns:1fr !important;max-width:860px}
.step__mod{display:block;margin:12px 0 0;font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--blue-600)}
.po-noot{border:1.5px dashed var(--slate-400);border-radius:18px;padding:22px 24px;max-width:860px;color:var(--slate-500);font-size:14.5px;line-height:1.6;background:transparent}
.po-noot b{color:var(--ink)}
.po-noot ul{margin:10px 0 0;padding-left:18px}
.oplos-kop{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;margin-bottom:clamp(24px,3.2vw,40px)}
.oplos-switch{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(20px,3vw,44px);align-items:stretch}
.oplos-lijst{display:flex;flex-direction:column;gap:6px}
.oplos-item{position:relative;border-radius:18px;padding:18px 22px;transition:background .3s cubic-bezier(.2,.7,.2,1),box-shadow .3s}
.oplos-item.is-actief{background:#fff;box-shadow:0 18px 40px -26px rgba(10,18,48,.45)}
.oplos-knop{all:unset;display:block;width:100%;cursor:pointer}
.oplos-knop:focus-visible{outline:2px solid var(--blue-600);outline-offset:6px;border-radius:8px}
.oplos-knop strong{display:flex;align-items:center;gap:10px;font-family:var(--font-display);font-size:clamp(19px,1.7vw,23px);font-weight:700;color:var(--slate-400);transition:color .3s}
.oplos-knop strong i{font-style:normal;font-size:12px;font-weight:700;letter-spacing:.08em;color:var(--slate-400)}
.oplos-item.is-actief .oplos-knop strong{color:var(--ink)}
.oplos-item.is-actief .oplos-knop strong i{color:var(--blue-600)}
.oplos-knop span{display:block;margin-top:6px;font-size:14.5px;line-height:1.6;color:var(--slate-500);max-height:0;opacity:0;overflow:hidden;transition:max-height .45s cubic-bezier(.2,.7,.2,1),opacity .3s}
.oplos-item.is-actief .oplos-knop span{max-height:140px;opacity:1}
.oplos-item .link-arrow{display:inline-flex;margin-top:12px;max-height:0;opacity:0;overflow:hidden;transition:max-height .45s,opacity .3s}
.oplos-item.is-actief .link-arrow{max-height:40px;opacity:1}
.oplos-voortgang{position:absolute;left:22px;right:22px;bottom:10px;height:2px;border-radius:2px;background:var(--line);overflow:hidden;opacity:0}
.oplos-item.is-actief .oplos-voortgang{opacity:1}
.oplos-voortgang b{display:block;height:100%;width:0;background:var(--blue-600)}
.oplos-item.is-actief.loopt .oplos-voortgang b{animation:oplosVol 7s linear forwards}
.oplos-switch:hover .oplos-voortgang b,.oplos-switch:focus-within .oplos-voortgang b{animation-play-state:paused}
@keyframes oplosVol{to{width:100%}}
.oplos-podium{position:relative;border-radius:22px;overflow:hidden;background:#0A1230;aspect-ratio:4/3;align-self:center;box-shadow:0 30px 60px -34px rgba(10,18,48,.6)}
.oplos-beeld{position:absolute;inset:0;display:block;opacity:0;transform:scale(1.035);transition:opacity .5s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1);pointer-events:none}
.oplos-beeld.is-actief{opacity:1;transform:none;pointer-events:auto}
.oplos-beeld img{width:100%;height:100%;object-fit:cover;display:block}
.oplos-beeld--scherm{padding:clamp(18px,2.6vw,34px)}
.oplos-beeld--scherm img{object-fit:contain;filter:drop-shadow(0 24px 40px rgba(10,18,48,.28))}
.oplos-label{display:none;position:absolute;left:18px;bottom:18px;z-index:2;background:rgba(10,18,48,.72);color:#fff;font-size:13px;font-weight:600;padding:8px 12px;border-radius:999px;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
@media (max-width:900px){.oplos-switch{grid-template-columns:1fr}.oplos-podium{order:-1}}
@media (prefers-reduced-motion:reduce){.oplos-beeld,.oplos-knop span,.oplos-item .link-arrow{transition:none}.oplos-item.is-actief.loopt .oplos-voortgang b{animation:none;width:100%}}
.pakkethero__grid--solo{grid-template-columns:minmax(0,1fr) !important;max-width:860px}
/* Homepage: blok met de twee gebieden (index.html, #platform) */
.pkg-grid--2{grid-template-columns:repeat(2,minmax(0,1fr));max-width:880px}
/* Knoppen onderaan de kaart op gelijke hoogte, ook als de ene tekst langer is (Danny 29-9). */
.pkg{display:flex;flex-direction:column;}
.pkg__text{flex:1;}
@media (max-width:760px){.pkg-grid--2{grid-template-columns:1fr}}
/* === NIEUWE INDELING (eind) === */

/* ============ verwerkerspagina (verwerkers en subverwerkers) ============ */
.vo-meta{display:flex;flex-wrap:wrap;gap:10px 26px;margin:0 0 clamp(28px,3.4vw,40px);font-size:13.5px;color:var(--slate-500);}
.vo-meta>span{display:inline-flex;align-items:center;gap:9px;}
.vo-meta>span::before{content:"";flex:none;width:7px;height:7px;border-radius:50%;background:var(--blue-500);}
.vo-meta>span+span::before{background:var(--accent-cyaan);}
.vo-h2{margin:0 0 18px;}
.vo-tablewrap{border:1px solid var(--line);border-radius:18px;overflow:hidden;background:#fff;margin:0 0 clamp(44px,5vw,64px);}
.vo-tablewrap:last-child{margin-bottom:0;}
.vo-table{width:100%;border-collapse:collapse;font-size:14px;line-height:1.55;color:#3C4358;}
.vo-table thead th{background:var(--mist);color:var(--slate-500);font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;text-align:left;padding:14px 20px;}
.vo-table td,.vo-table tbody th{padding:14px 20px;border-top:1px solid var(--line);text-align:left;vertical-align:top;}
.vo-table tbody th[scope="row"]{font-weight:600;color:var(--ink);}
.vo-table .vo-group th{color:var(--blue-600);font-size:12px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;padding:24px 20px 10px;}
.vo-table--producten th[scope="row"]{width:15%;}
.vo-table--producten td:nth-of-type(1){width:35%;}
.vo-table--producten td:nth-of-type(2){width:12%;white-space:nowrap;}
.vo-variants{list-style:none;margin:0;padding:0;display:grid;gap:7px;}
.vo-variants li{display:flex;align-items:baseline;gap:10px;margin:0;}
.vo-chip{flex:none;display:inline-flex;justify-content:center;width:148px;box-sizing:border-box;padding:2px 6px;border-radius:100px;border:1px solid var(--line);background:var(--mist);color:var(--slate-500);font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;line-height:1.7;white-space:nowrap;}
.vo-chip--iip{border-color:var(--blue-300);background:var(--blue-100);color:var(--blue-600);}
.vo-todo{display:inline-flex;align-items:center;padding:2px 10px;border-radius:100px;font-size:11.5px;font-weight:600;line-height:1.6;background:#FDF1DF;color:#9A6413;white-space:nowrap;vertical-align:baseline;}
@media(max-width:760px){
  .vo-table thead{display:none;}
  .vo-table,.vo-table tbody,.vo-table tr,.vo-table td,.vo-table tbody th{display:block;width:auto !important;}
  .vo-table tbody tr{border-top:1px solid var(--line);padding:14px 18px;}
  .vo-table td,.vo-table tbody th{border:0;padding:3px 0;white-space:normal !important;}
  .vo-table td::before{content:attr(data-label);display:block;font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--slate-400);margin:8px 0 1px;}
  .vo-table tbody th[scope="row"]{font-size:15px;}
  .vo-table tbody tr.vo-group{padding:22px 18px 6px;}
  .vo-table .vo-group th{padding:0;}
}
@media print{
  .vo-tablewrap{border-radius:0;overflow:visible;}
  .vo-table tr{break-inside:avoid;}
}

/* =========================================================
   Scherper beeld op de homepage (6-10-2026)
   De hero en het ketenbeeld zijn composities van 1672 px breed (ChatGPT-export; groter bestaat
   niet). Op de telefoon stond de hero als achtergrond van 390 x 916 px, dus ruim vier keer
   opgerekt, met het gezicht wazig achter de tekst. Nu: op de telefoon een eigen uitsnede als
   beeldstrook boven de tekst; op brede en retina-schermen een 2400-versie vanuit het PNG-origineel.
   ========================================================= */
@media(max-width:760px){
  .section--hero.hero--photo{padding-top:0;min-height:0;flex-direction:column;align-items:stretch;}
  .hero--photo .hero__bg{position:relative;inset:auto;width:100%;aspect-ratio:3/2;flex:none;}
  .hero--photo .hero__photo{object-position:center 30%;transform:none;}
  .hero--photo .hero__shade{background:linear-gradient(180deg,rgba(10,18,48,0) 42%,rgba(10,18,48,.6) 76%,var(--navy-900) 100%);}
  .hero--photo .hero__inner{margin-top:-30px;}
  /* Voor wie: het ketenbeeld viel op de telefoon weg onder een witte waas. Nu als beeld onder de kop. */
  .section.branches--foto[data-theme="light"]{background-image:none;}
  .section.branches--foto[data-theme="light"]::before{display:none;}
  .branches--foto .section__head::after{content:"";display:block;width:100%;aspect-ratio:3/2;margin-top:24px;border-radius:16px;background:#E4E8F4 url(img/keten-mobiel-1080.webp) center/cover no-repeat;}
}
@media(min-width:761px){
  .section.branches--foto[data-theme="light"]{background-image:image-set(url(img/keten-adviseur-binnendienst-klant.webp) 1x,url(img/keten-adviseur-binnendienst-klant-2400.webp) 2x);}
}

/* =========================================================
   Mobiele verfijning (6-10-2026)
   Uit de mobiele doorloop van 16 pagina's op 360, 390 en 768 px. Gemeten, niet geschat:
   tekst onder 12 px (eyebrows, footerkoppen, labels), tikvlakken onder 44 px (footerlinks
   21-32 px, pijllinks 24-38 px, chips 39 px, sliderbolletjes 7 px), afgesneden keuzeknoppen,
   een cookiebalk die een derde van het eerste scherm bedekte, en een blok dat elke 7 seconden
   van inhoud wisselde terwijl je las.
   ========================================================= */

/* menu: telefoonnummer, geen dubbele lijn, geen hover-onderstreping die op touch blijft hangen */
.nav__menu-tel{display:none;}
@media(max-width:1020px){
  .nav__menu .u-ul-effect{background-image:none;}
  /* de desktopstreep onder het actieve menu-item (.nav.is-light) won het van de mobiele regel */
  .nav .nav__menu .nav__item .nav-link.is-current{box-shadow:none;color:var(--blue-600);}
  .nav__menu-tel{display:flex;align-items:center;justify-content:center;gap:10px;min-height:48px;margin-top:14px;font-size:15px;font-weight:600;color:var(--ink);text-decoration:none;}
  .nav__menu-tel svg{width:18px;height:18px;fill:none;stroke:var(--blue-600);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
}
@media(max-width:560px){
  .nav__menu-cta{border-top:0;padding-top:0;}
}

/* leesbaarheid: niets onder 12 px op de telefoon */
@media(max-width:760px){
  .eyebrow,.footer__label,.callout__label,.kn-bar__label,.gain__tag,.module-tagline,.quotes__label,.pk-card__label{font-size:12px;}
  .pill,.tag{font-size:12px;}
}

/* tikvlakken: minimaal 44 px hoog op touchschermen */
@media(max-width:1020px){
  .link-arrow,.support__link{min-height:44px;}
  .chip{min-height:44px;}
  .nav__logo{min-height:44px;}
  .crumbs{margin-left:-6px;gap:0 3px;}
  .crumbs a{display:inline-flex;align-items:center;min-height:44px;padding:0 6px;}
  .footer-link_link{padding:11px 0;}
  .footer__legal{flex-wrap:wrap;gap:0 20px;}
  .footer__legal .footer-link_link{display:inline-block;padding:12px 0;}
  .footer-social_link{width:44px;height:44px;}
  .footer__label{margin-bottom:6px;}
  /* sliderbolletjes: zelfde beeld, groter tikvlak */
  .slider__dots{gap:0;}
  .slider__dots button{width:19px;height:35px;padding:14px 6px;background-clip:content-box;}
  .slider__dots button.is-active{width:34px;}
}

/* 'Op deze pagina' en 'De vijf modules': laat zien dat er meer is, in plaats van woorden half af te snijden */
@media(max-width:560px){
  .kn-bar__label{display:none;}
  .kn-bar__inner{gap:10px;padding:8px 0;scroll-snap-type:x proximity;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 44px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 44px),transparent);}
  .kn-bar__inner .chip{scroll-snap-align:start;}
  .kn-bar__inner .chips{padding-right:36px;}
}

/* Voor wie (home): twee keuzeknoppen naast elkaar die passen, in plaats van een tweede die buiten beeld valt */
@media(max-width:560px){
  .tabs__menu{display:grid;grid-template-columns:1fr 1fr;width:100%;border-radius:20px;overflow:visible;}
  .tabs__link{white-space:normal;justify-content:center;text-align:center;line-height:1.3;padding:11px 10px;border-radius:16px;min-height:52px;}
  .tabs__link .ico{display:none;}
  .tabs__indicator{border-radius:16px;}
}

/* cookiebalk: compact, drie knoppen op een rij, bedekt de knoppen van de hero niet meer */
@media(max-width:560px){
  .cookie{bottom:10px;width:calc(100% - 20px);border-radius:16px;}
  .cookie__inner{padding:14px 16px 16px;gap:10px;}
  .cookie__title{font-size:14px;margin-bottom:2px;}
  .cookie__text{font-size:12.5px;line-height:1.5;}
  .cookie__actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;}
  .cookie__actions .btn{justify-content:center;padding:10px 6px;font-size:13px;min-height:44px;}
}

/* 'Andere oplossing nodig?': op smalle schermen alles open, geen automatische wissel (oplossingen.js) */
@media(max-width:900px){
  .oplos-lijst{gap:10px;}
  .oplos-item{background:#fff;border:1px solid var(--line);padding:16px 18px 18px;}
  .oplos-item.is-actief{border-color:var(--blue-300);}
  .oplos-knop strong{color:var(--ink);font-size:19px;}
  .oplos-knop strong i{color:var(--blue-600);}
  .oplos-knop span,.oplos-item .link-arrow{max-height:none;opacity:1;}
  .oplos-voortgang{display:none;}
}

/* 'Wat het oplevert'-kaarten: icoon naast de titel in plaats van erboven */
@media(max-width:620px){
  .pk-card__head{display:flex;align-items:center;gap:14px;padding:20px 20px 0;}
  .pk-card__icon{margin-bottom:0;flex:none;}
  .pk-card__body{padding:10px 20px 22px;}
}

/* ---------- lopende tekst: tussenkopjes en tabellen (privacyverklaring, 6-10-2026) ---------- */
.prose h3{font-size:clamp(17px,1.8vw,19px);font-weight:700;margin:30px 0 10px;}
.prose-tabel{margin:6px 0 26px;overflow-x:auto;border:1px solid var(--line);border-radius:14px;}
.prose-tabel table{width:100%;border-collapse:collapse;font-size:14px;line-height:1.55;color:#3C4358;}
.prose-tabel th{text-align:left;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--slate-500);background:var(--mist);padding:11px 14px;border-bottom:1px solid var(--line);}
.prose-tabel td{padding:12px 14px;border-top:1px solid var(--line);vertical-align:top;}
.prose-tabel tr:first-child td{border-top:0;}
.prose-tabel td:first-child{font-weight:600;color:var(--ink);}
.prose-gegevens{border-collapse:collapse;font-size:14.5px;line-height:1.55;margin:0 0 30px;color:#3C4358;}
.prose-gegevens th{text-align:left;font-weight:600;color:var(--ink);padding:4px 24px 4px 0;vertical-align:top;white-space:nowrap;}
.prose-gegevens td{padding:4px 0;vertical-align:top;}
@media(max-width:560px){
  .prose-tabel table{font-size:13.5px;}
  .prose-tabel th,.prose-tabel td{padding:10px 11px;}
  .prose-gegevens th{padding-right:14px;}
}
