
:root{--navy:#102636;--ink:#193348;--green:#77b63a;--muted:#61717c}
html{scroll-behavior:smooth}body{background:#fff;color:var(--ink);font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif}
.nav{background:#fff!important;box-shadow:0 2px 20px rgba(10,36,50,.04)}.brand-logo{width:248px!important;height:auto!important;max-height:80px;object-fit:contain}
.hero{background:linear-gradient(115deg,#122b3c,#1b394a)!important;color:#fff!important;padding:88px 0 80px}
.hero-simple{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(290px,.75fr);align-items:center;gap:72px}
.hero h1{font-size:clamp(38px,4.25vw,65px);line-height:1.11;letter-spacing:-.045em;color:#fff!important;margin:20px 0 22px;max-width:760px}
.hero h1 em{color:#a2d969!important;font-style:normal}.hero p{color:#d3e0e6!important;font-size:17px;line-height:1.72;max-width:600px}
.hero .eyebrow{color:#a6d87d!important;letter-spacing:.12em}.trust{display:flex;gap:13px;flex-wrap:wrap;margin-top:24px}.trust span{font-size:13px;color:#deefe3!important}
.btn{background:#87c64d!important;color:#102b22!important;border-radius:11px!important;font-weight:750!important;min-height:52px;display:inline-flex;align-items:center;justify-content:center;gap:13px;padding:13px 24px;border:0;cursor:pointer}
.btn:hover{background:#a4da69!important;transform:translateY(-1px)}.hero-side{background:#ffffff0c;border:1px solid #ffffff23;padding:35px;border-radius:18px;box-shadow:0 16px 55px #07182533}
.hero-side h2{font-size:26px;color:#fff;margin:6px 0 25px}.hero-side-kicker{font-size:11px;letter-spacing:.16em;color:#c0ddb8;font-weight:750}.hero-topic{border-top:1px solid #ffffff20;padding:17px 0;font-size:15px}.hero-topic span{font-size:12px;color:#a6d87d;margin-right:14px}.hero-side p{font-size:12px;line-height:1.5;margin:10px 0 0}
.section{padding-top:73px;padding-bottom:73px}.customer{background:#f6f9f7!important}.customer .eyebrow{color:#548b29}.customer h2{max-width:610px;font-size:clamp(27px,3vw,40px);letter-spacing:-.025em;margin:14px 0 33px}
.step-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.step-grid>div{background:#fff;border:1px solid #e2eae7;border-radius:15px;padding:24px}.step-grid strong{color:#4c8f29;font-size:13px;letter-spacing:.1em}.step-grid h3{margin:10px 0 9px;font-size:18px}.step-grid p{margin:0;font-size:14px;line-height:1.5;color:var(--muted)}
#scan{background:#fff!important;scroll-margin-top:25px}#scan .wrap{max-width:770px!important}#lead-form{width:100%!important;max-width:none!important;margin:0 auto!important;box-shadow:0 12px 60px rgba(20,43,50,.07)!important;border:1px solid #e4ebe7!important;border-radius:20px!important;padding:clamp(22px,4vw,44px)!important}
.wizard-top h2{font-size:clamp(28px,3vw,36px);letter-spacing:-.03em;margin:10px 0}.wizard-top>p,.step-intro{color:var(--muted);font-size:15px;line-height:1.5}.wizard-top .eyebrow{color:#538f33}.wizard-step h3{font-size:22px;margin:17px 0 7px}.wizard-step .contact-title{font-size:20px;margin-top:32px}
.progress-track{height:6px;border-radius:20px;background:#e7eee7;margin-top:24px;overflow:hidden}.progress-track span{display:block;height:100%;width:33.33%;background:#80bb40;transition:width .24s}.progress-label{display:flex;justify-content:space-between;font-size:12px;color:#62747c;margin:10px 0 18px}
.wizard-step[hidden]{display:none!important}label{font-size:13px!important;font-weight:650}input,select,textarea{background:#fbfcfb!important;border:1px solid #d9e4dd!important;border-radius:10px!important;min-height:48px!important;font-size:16px!important;width:100%;max-width:100%;box-sizing:border-box}
input:focus,select:focus,textarea:focus{outline:2px solid #77b63a!important;outline-offset:1px}.field-row{gap:15px!important}.wizard-controls{display:flex;align-items:center;justify-content:flex-end;gap:20px;margin-top:25px}.wizard-controls .back{background:none;border:0;color:#50687a;cursor:pointer;font-size:15px;padding:12px}.wizard-controls .btn{min-width:190px}
.optional{border:1px solid #e1e9e4;border-radius:12px;padding:15px;margin-top:22px}.optional summary{font-weight:650;cursor:pointer}.optional[open] summary{margin-bottom:20px}
.insight{border:1px solid #dce9d7;background:#f3f8f0;border-radius:12px;padding:18px!important;font-size:15px;line-height:1.6}.consent{display:flex!important;gap:12px;align-items:flex-start;margin-top:18px}.consent input{width:18px!important;min-height:18px!important;flex:0 0 18px;margin-top:4px}
.faq-simple{max-width:770px}.faq-simple h2{font-size:27px}.faq-simple details{border-bottom:1px solid #e4ebe7;padding:18px 0}.faq-simple summary{cursor:pointer;font-weight:700}.faq-simple p{color:#5d6c74}.nav nav a:not(.navcta){color:#183747!important}
@media(max-width:800px){.hero{padding:45px 0 54px}.hero-simple{grid-template-columns:1fr;gap:25px}.hero h1{font-size:clamp(36px,9vw,48px)}.hero-side{padding:21px}.hero-side h2{font-size:21px}.hero-topic{padding:13px 0}.step-grid{grid-template-columns:1fr;gap:10px}.step-grid>div{padding:20px}.section{padding:48px 0}.field-row{grid-template-columns:1fr!important;display:grid!important}.wizard-controls{flex-wrap:wrap}.wizard-controls .btn{flex:1;min-width:0}.trust{gap:10px}.trust span{font-size:12px}.nav .brand-logo{width:180px!important}.wizard-top>p{font-size:14px}}

/* V10: ruimer scanformulier voor laptop en telefoon */
@media(min-width:901px){
  #scan .scan-layout{grid-template-columns:minmax(250px,.64fr) minmax(0,1.36fr)!important;gap:clamp(28px,3vw,58px)!important;align-items:start;}
  #scan .wrap{max-width:1240px;}
  #scan .formbox{padding:clamp(34px,3.5vw,54px)!important;}
}
#scan .formbox{border-radius:20px;box-shadow:0 18px 55px rgba(13,35,49,.12);}
#scan .formbox .field-row{gap:20px!important;}
#scan .formbox label{font-size:15px!important;line-height:1.45;margin-bottom:22px!important;}
#scan .formbox input,#scan .formbox select,#scan .formbox textarea{min-height:58px!important;padding:15px 17px!important;font-size:16px!important;border-radius:11px!important;}
#scan .formbox textarea{min-height:105px!important;}
#scan .wizard-step h3{font-size:clamp(23px,2.1vw,29px);}
#scan .wizard-controls .btn{min-height:56px;padding:15px 25px;font-size:16px;min-width:215px;}
#scan .progress-track{height:10px;}
@media(max-width:900px){#scan .scan-layout{grid-template-columns:1fr!important;gap:26px!important;}#scan .formbox{padding:28px!important;}#scan .formbox input,#scan .formbox select{min-height:56px!important;}}
@media(max-width:540px){#scan .formbox{padding:20px!important;border-radius:16px;}#scan .formbox .field-row{grid-template-columns:1fr!important;gap:0!important;}#scan .wizard-controls .btn{width:100%;min-width:0;}#scan .wizard-controls{gap:8px;} }

/* V11: XL scan workspace, desktop-first with mobile safety */
#scan .wrap{max-width:1480px!important;width:min(94%,1480px)!important}
@media(min-width:1024px){
 #scan .scan-layout{grid-template-columns:minmax(230px,.48fr) minmax(0,1.52fr)!important;gap:clamp(24px,3.5vw,66px)!important}
 #scan .formbox{padding:clamp(42px,4vw,68px)!important}
}
#scan .formbox{width:100%;max-width:none;box-shadow:0 22px 70px rgba(7,25,38,.13);border:1px solid #dce8e4}
#scan .formbox .field-row{gap:clamp(18px,2.6vw,34px)!important}
#scan .formbox label{font-size:16px!important;font-weight:750!important;color:#183544!important}
#scan .formbox input,#scan .formbox select,#scan .formbox textarea{min-height:64px!important;font-size:17px!important;padding:17px 20px!important;border:1.5px solid #bfcecd!important;transition:border-color .2s,box-shadow .2s,background .2s}
#scan .formbox input:focus-visible,#scan .formbox select:focus-visible,#scan .formbox textarea:focus-visible{outline:3px solid #a5d77e;outline-offset:2px}
#scan .wizard-controls .btn{min-height:64px;font-size:17px;transition:transform .2s,box-shadow .2s}
#scan .wizard-controls .btn:hover{box-shadow:0 12px 24px rgba(51,114,37,.18)}
#scan .progress-track{height:12px;overflow:hidden;background:#e5eee9;border-radius:999px}
#scan #progress-bar{transition:width .45s cubic-bezier(.2,.8,.2,1)}
#scan .wizard-step:not([hidden]){animation:tanStepIn .34s ease-out both}
@keyframes tanStepIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
.tan-appear{opacity:0;transform:translateY(15px);transition:opacity .55s ease,transform .55s ease}
.tan-appear.is-visible{opacity:1;transform:none}
.tan-help{font-size:14px;line-height:1.6;margin:8px 0 20px;color:#425f66;background:#eff6ee;border-left:3px solid #69b540;border-radius:8px;padding:11px 15px}
.tan-save-note{font-size:13px;color:#44625d;margin-top:9px}
#scan .formbox input:invalid:not(:placeholder-shown){border-color:#af594b!important}
@media(max-width:1023px){#scan .scan-layout{grid-template-columns:1fr!important}#scan .formbox{padding:clamp(23px,5vw,45px)!important}}
@media(max-width:580px){#scan .wrap{width:min(94%,1480px)!important}#scan .formbox{padding:21px!important}#scan .formbox input,#scan .formbox select,#scan .formbox textarea{font-size:16px!important;min-height:58px!important;padding:14px!important}#scan .wizard-controls .btn{width:100%;min-width:0}#scan .formbox .field-row{grid-template-columns:1fr!important;gap:0!important}.tan-appear{transform:none;opacity:1}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}.tan-appear{opacity:1;transform:none}}
