/* Versie C: de kleur en voorbeelden van B, met de rust en verhoudingen van A. */
:root { --lijn: rgba(54, 51, 46, .2); --lijn-dk: rgba(245, 234, 221, .23); }
.wrap { max-width: 1240px; }
.wrap--narrow { max-width: 920px; }
.wrap--prose { max-width: 800px; }
.wrap--report { max-width: 940px; }
.concept-strip { padding: 5px 16px; font-size: 12px; }
.site-header { border-bottom: 1px solid var(--lijn); }
.site-header__bar { padding-top: 16px; padding-bottom: 16px; }
.brand__name, .site-footer__logo { letter-spacing: .01em; border-left-width: 4px; padding-left: 12px; }
.h1 { font-size: clamp(40px, 5.6vw, 76px); line-height: 1.03; }
.h1--page { font-size: clamp(34px, 4.5vw, 60px); line-height: 1.07; max-width: 22ch; }
.h1--article { font-size: clamp(32px, 4vw, 52px); }
.h2 { font-size: clamp(29px, 3.2vw, 43px); line-height: 1.13; max-width: 27ch; }
.eyebrow { font-size: 12px; letter-spacing: .1em; margin-bottom: 16px; }
.eyebrow::after { display: none; }
.lead { font-size: 19px; margin-top: 18px; line-height: 1.6; }
.section { padding: clamp(44px, 5.4vw, 76px) 0; }
.section--tight { padding: 40px 0; }
.section-head { margin-bottom: 32px; }
.more-link { margin-top: 24px; }
.btn { border-width: 1px; font-size: 16px; padding: 0 22px; }
.btn--lg { min-height: 52px; font-size: 16px; padding: 0 24px; }
.btn--sm { font-size: 14px; }
.btn--primary:hover { border-color: var(--steen); }
.link-arrow { font-size: 16px; text-decoration-thickness: 2px; }
.menu-btn, .mobile-menu { border-width: 1px; }
.hero-b::before { display: none; }
.hero-b__grid { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 56px; padding-top: 48px; padding-bottom: 48px; align-items: center; }
.hero-b__lead { font-size: 19px; line-height: 1.65; margin-top: 24px; }
.hero-b__actions { margin-top: 26px; gap: 12px; }
.hero-b__panel { background: var(--terra); padding: 26px 28px; }
.route__label { font-size: 11px; margin-bottom: 16px; letter-spacing: .12em; }
.route__tabs { flex-direction: row; border-top: 0; gap: 4px; }
.route__tab { display: flex; align-items: center; justify-content: center; flex: 1; min-height: 44px; padding: 8px 10px; font-size: 14px; border: 1px solid rgba(54,51,46,.4); }
.route__tab[aria-selected="true"] { padding-left: 10px; }
.route__nr { display: none; }
.route__panel { margin-top: 20px; }
.route__title { display: block; font-size: 24px; line-height: 1.2; letter-spacing: -.025em; margin: 0 0 16px; }
.regel { border-top: 1px solid var(--lijn); }
.regel li { grid-template-columns: 24px minmax(0,1fr); gap: 14px; padding: 13px 0; border-color: var(--lijn); align-items: start; }
.regel__vink { border: 0; width: auto; height: auto; justify-content: start; background: transparent; color: var(--steen); font-size: 12px; font-weight: 600; padding-top: 3px; animation: none !important; }
.regel__t { font-size: 16px; line-height: 1.35; }
.regel__t small { font-size: 14px; line-height: 1.5; margin-top: 3px; }
.regel__dienst { display: inline-flex; align-items: center; min-height: 28px; margin-top: 4px; font-size: 13px; white-space: normal; text-underline-offset: 3px; }
.route__foot { font-size: 12px; line-height: 1.6; margin-top: 16px; }
.tagline { padding: 20px 0; }
.tagline__big { font-family: var(--font); text-transform: none; font-size: 17px; letter-spacing: -.01em; line-height: 1.4; }
.tagline__small { font-size: 13px; max-width: none; }
.section-heading-row { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 28px; }
.section-heading-row .section-head { margin: 0; max-width: 740px; }
.section-heading-row > .link-arrow { flex: none; }
.home-services { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 32px; }
.home-services__group { font-size: 15px; margin: 0 0 14px; letter-spacing: -.01em; }
.home-services__rows { border-top: 3px solid var(--terra); }
.home-service { display: grid; grid-template-columns: 1fr 16px; gap: 8px 12px; padding: 22px 0; border-bottom: 1px solid var(--lijn); text-decoration: none; }
.home-service h4 { font-size: 21px; line-height: 1.25; }
.home-service p { grid-row: 2; font-size: 14px; line-height: 1.65; color: var(--muted); margin: 0; }
.home-service > span { grid-column: 2; grid-row: 1; }
.home-service:hover h4 { text-decoration: underline; text-decoration-color: var(--terra-d); text-underline-offset: 5px; }
.pick__list { border-top: 1px solid var(--lijn-dk); }
.pick__btn { min-height: 45px; font-size: 16px; }
.pick__btn svg { flex: none; }
.pick__panel, .pick__empty { border: 1px solid var(--lijn-dk); padding: 28px; }
.pick__naam { font-size: 12px; line-height: 1.5; letter-spacing: .09em; }
.pick__quote { font-size: 26px; line-height: 1.2; margin-bottom: 20px; }
.pick__h { font-size: 11px; margin-top: 18px; }
.pick__apps li { font-size: 15px; line-height: 1.65; }
.pick__chips a { font-size: 13px; border-width: 1px; padding: 0 10px; }
.pick__empty h3 { font-size: clamp(29px,3vw,40px); line-height: 1.15; margin: 20px 0; max-width: 20ch; }
.pick__empty > p:not(.pick__naam) { color: var(--muted-dk); font-size: 17px; max-width: 31em; }
.pick__empty > .link-arrow { margin-top: 12px; }
.pick__mobile { display: none; }
html:not(.js) .pick__empty { display: none; }
.paths { gap: 0; }
.path { padding: 32px; gap: 0; }
.path__kick { font-family: var(--font); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; margin-bottom: 16px; }
.path h2, .path h3 { font-size: 30px; line-height: 1.15; max-width: 22ch; }
.path > p:not(.path__kick) { font-size: 17px; line-height: 1.65; margin: 18px 0 24px; }
.path__actions { margin-top: auto; padding-top: 0; }
.calc__in, .calc__out { border-width: 1px; padding: 28px; }
.calc__v { font-size: clamp(32px,3vw,44px); }
.calc__out { border-left: 0; }
.klist { border-top-width: 1px; }
.klist__row { grid-template-columns: minmax(0,1.1fr) minmax(0,1fr) auto; padding: 18px 0; gap: 28px; }
.klist__n { display: none; }
.klist__t { font-size: 21px; line-height: 1.25; }
.klist__m { font-size: 11px; }
.statement { padding: 64px 0; }
.statement__big { font-size: clamp(32px,4vw,54px); line-height: 1.1; max-width: 19ch; }
.statement__grid { grid-template-columns: 1fr 1fr; align-items: center; }
.statement__txt p { font-size: 17px; }
.cta-band { padding: 56px 0; border-top: 0; }
.cta-band .h2 { font-size: clamp(32px,3.5vw,48px); line-height: 1.1; max-width: 26ch; }
.cta-band p { font-size: 17px; }
.site-footer { padding-top: 48px; font-size: 14px; border-top-width: 4px; }
.site-footer__logo { font-size: 28px; }
.site-footer__bottom { font-size: 12px; }
.page-head, .dhero, .phero { padding: 24px 0 56px; border-bottom: 4px solid var(--terra); }
.page-head__lead { font-size: 18px; line-height: 1.65; margin-top: 24px; }
.page-head__actions { margin-top: 26px; }
.dhero__grid, .phero__grid { gap: 64px; }
.dsub { border-bottom-color: var(--lijn); }
.dsub a { font-size: 14px; }
.dintro p { font-size: 18px; }
.dcap { border-top-width: 1px; }
.dcap li { grid-template-columns: 36px minmax(0,1fr) minmax(0,1.2fr); padding: 20px 0; border-bottom-color: var(--lijn); }
.dcap__n { font-size: 18px; padding-top: 2px; }
.dcap h3 { font-size: 23px; line-height: 1.25; }
.dpraktijk { padding: 60px 0; border: 0; }
.dpraktijk .h2 { max-width: 22ch; }
.dpraktijk p { font-size: 17px; }
.dstappen { margin-top: 28px; border-top-width: 1px; }
.dstappen span { font-size: 24px; margin-bottom: 6px; }
.delivery { border-top-width: 1px; }
.delivery li { grid-template-columns: 24px 1fr; }
.delivery li::before { font-size: 19px; }
.mk, .doc { box-shadow: 8px 8px 0 var(--terra); }
.idx { border-top-width: 1px; }
.idx__row { grid-template-columns: 28px 1fr auto; padding: 17px 0; gap: 14px; }
.idx__n { font-size: 18px; }
.idx__t { font-size: 24px; }
.idx__pijl { width: 32px; height: 32px; border: 0; }
.index-wrap__lead { position: static; }
.faq { border-top-width: 1px; }
.faq__item { border-bottom-color: var(--lijn); }
.faq__item summary { font-size: 19px; line-height: 1.35; }
.faq__plus { border-width: 1px; width: 30px; height: 30px; }
.about-hero { padding: 24px 0 56px; }
.about-hero__intro { font-size: 18px; line-height: 1.7; }
.about-hero .breadcrumb a, .about-hero .breadcrumb ol, .about-hero .breadcrumb [aria-current] { font-size: 14px; }
.about-hero :focus-visible { outline-color: var(--creme); box-shadow: 0 0 0 6px var(--steen); }
.about-hero .btn--primary { border-color: var(--terra); }
.about-hero .btn--primary:hover { background: var(--creme); color: var(--steen); border-color: var(--creme); }
.about-poster :focus-visible { outline-color: var(--steen); }
.about-poster__top { font-size: 12px; }
.about-poster__foot { font-size: 14px; }
.about-principles li { padding: 24px 0; }
.about-principles h3 { font-size: 23px; }
.about-principles p { font-size: 16px; line-height: 1.7; }
.beginnen { border-top-width: 1px; }
.beginnen span { font-size: 24px; }
.beginnen h3 { font-size: 22px; line-height: 1.25; }
.scan-process { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(0,.8fr); gap: 48px; align-items: start; }
.scan-process .steps { display: grid; grid-template-columns: 1fr; gap: 0; }
.scan-process .step { padding: 20px 0; border-left: 0; border-bottom: 1px solid var(--lijn); }
.scan-process .step__n { font-size: 24px; }
.scan-prepare { background: var(--creme); padding: 28px; }
.scan-prepare h3 { font-size: 23px; line-height: 1.25; margin-bottom: 18px; }
.scan-prepare .checklist { max-width: none; }
.scan-prepare .checklist li { font-size: 15px; }
.scan-fit { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; }
.scan-fit > div { padding-top: 20px; border-top: 2px solid var(--lijn); }
.scan-fit > .scan-fit__yes { border-top-color: var(--terra-d); }
.scan-fit h3 { font-size: 23px; line-height: 1.25; margin-bottom: 18px; }
.scan-fit ul { padding-left: 20px; font-size: 17px; }
.scan-fit li { margin-bottom: 10px; }
.phero__direct { margin-top: 22px; padding-top: 16px; border-color: var(--lijn-dk); }
.phero__direct p { font-size: 15px; }
.phero__direct .link-arrow { font-size: 15px; }
.phero .link-arrow:hover { color: var(--steen); }
@media(max-width:960px) {
 .hero-b__grid { grid-template-columns: 1fr; gap: 32px; padding: 36px 32px; }
 .hero-b__text { padding: 0; max-width: 680px; }
 .hero-b__panel { padding: 28px; }
 .hero-b .h1 { font-size: clamp(42px,7vw,64px); }
 .home-services { gap: 24px; }
 .home-service h4 { font-size: 19px; }
 .home-service p { font-size: 14px; }
 .section-heading-row { display: block; }
 .section-heading-row > .link-arrow { margin-top: 16px; }
}
@media(max-width:900px) {
 .dhero__grid, .phero__grid, .statement__grid, .scan-process { grid-template-columns: 1fr; gap: 32px; }
 .klist__row { grid-template-columns: 1fr auto; gap: 8px 16px; }
 .klist__l { grid-column: 1 / -1; grid-row: 2; }
 .klist__m { grid-column: 2; grid-row: 1; }
 .calc__out { border: 1px solid var(--steen); border-top: 0; }
 .pick { grid-template-columns: 1fr; gap: 20px; }
 .js .pick__list { display: none; }
 .js .pick__mobile { display: block; }
 .pick__mobile label { display: block; font-size: 14px; margin-bottom: 8px; }
 .pick__mobile select { width: 100%; min-height: 52px; padding: 12px; background: var(--creme); color: var(--steen); border: 1px solid var(--creme); border-radius: 0; font: inherit; font-size: 16px; }
 .beginnen { grid-template-columns: 1fr; }
 .doc { max-width: 100%; }
}
@media(max-width:800px) {
 .dcap li { grid-template-columns: 28px minmax(0,1fr); gap: 8px 16px; }
 .dcap li p { grid-column: 2; }
}
@media(max-width:640px) {
 .home-services, .scan-fit { grid-template-columns: 1fr; gap: 28px; }
 .home-service { padding: 18px 0; }
 .home-service h4 { font-size: 21px; }
 .home-service p { font-size: 15px; }
 .paths { grid-template-columns: 1fr; }
 .path { padding: 28px; }
 .about-hero__intro { font-size: 17px; }
 .about-principles p { font-size: 16px; }
 .klist__t { font-size: 19px; }
 .klist__m { grid-column: 1; grid-row: 3; }
 .klist__row { grid-template-columns: 1fr; gap: 12px; }
 .site-footer ul { grid-template-columns: 1fr 1fr; gap: 6px 18px; }
 .site-footer__top { gap: 28px; }
 .site-footer__h { margin-bottom: 6px; }
 .site-footer__top > div { border-bottom: 1px solid var(--lijn-dk); padding-bottom: 20px; }
}
@media(max-width:520px) {
 .wrap { padding-left: 20px; padding-right: 20px; }
 .hero-b__grid { padding: 32px 20px; }
 .hero-b .h1 { font-size: clamp(35px,10.8vw,48px); }
 .hero-b__lead { font-size: 17px; line-height: 1.65; }
 .hero-b__panel { padding: 24px 20px; }
 .route__tab { padding: 8px 6px; font-size: 13px; }
 .route__title { font-size: 22px; }
 .hero-b__actions { gap: 10px; }
 .hero-b__actions .btn { width: 100%; justify-content: space-between; }
 .pick__panel, .pick__empty { padding: 24px 20px; }
 .pick__quote { font-size: 23px; }
 .path { padding: 26px 22px; }
 .path h3, .path h2 { font-size: 28px; }
 .calc__in, .calc__out { padding: 22px; }
 .dhero__mock { padding-right: 8px; }
 .doc { margin-right: 8px; padding: 22px 20px; }
 .about-poster__top { font-size: 11px; }
 .about-poster__foot { font-size: 14px; }
 .about-poster__statement { font-size: clamp(43px,12vw,58px); }
 .idx__row { grid-template-columns: 22px minmax(0,1fr); }
 .idx__t { font-size: 22px; }
}
@media(prefers-reduced-motion:reduce) {
 *,*::before,*::after { scroll-behavior:auto!important; transition:none!important; }
 html:not([data-explicit-motion="aan"]) *:not([data-ambient-motion][data-user-motion="true"], [data-ambient-motion][data-user-motion="true"] *),
 html:not([data-explicit-motion="aan"]) *:not([data-ambient-motion][data-user-motion="true"], [data-ambient-motion][data-user-motion="true"] *)::before,
 html:not([data-explicit-motion="aan"]) *:not([data-ambient-motion][data-user-motion="true"], [data-ambient-motion][data-user-motion="true"] *)::after{ animation:none!important; }
}