:root{color-scheme:dark}.provision-body{min-height:100vh;margin:0;color:#f7fbff;background:radial-gradient(circle at 75% 0,#0b3556 0,#06182f 36%,#020d1c 80%);font-family:"DM Sans",sans-serif}.provision-header{display:flex;align-items:center;justify-content:space-between;min-height:76px;padding:0 clamp(22px,5vw,76px);border-bottom:1px solid #6dbee42e}.provision-header>a{color:#9fc5dc;text-decoration:none}.provision-page{width:min(1050px,calc(100% - 36px));margin:auto;padding:65px 0 100px}.provision-page>header{max-width:800px}.provision-page>header p,.provision-step small,.provision-result>p{color:#49ddea;font-size:11px;font-weight:800;letter-spacing:.18em}.provision-page>header h1{margin:10px 0;font:700 clamp(43px,7vw,78px)/.98 "Space Grotesk"}.provision-page>header span{color:#9db2c9;font-size:18px}.provision-steps{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin:42px 0 18px;padding:0;list-style:none;counter-reset:step}.provision-steps li{padding:12px 8px;border-bottom:2px solid #294862;color:#7791a8;font-size:12px;font-weight:700;counter-increment:step}.provision-steps li:before{content:counter(step) ". ";color:#49ddea}.provision-steps li.is-active{border-color:#49ddea;color:#fff}.provision-card,.provision-result{padding:clamp(24px,5vw,48px);border:1px solid #6dbce43d;border-radius:22px;background:#061a32d9;box-shadow:0 25px 70px #0005}.provision-step{display:none}.provision-step.is-active{display:block}.provision-step h2,.provision-result h2{margin:8px 0 25px;font:700 clamp(28px,4vw,42px) "Space Grotesk"}.provision-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.provision-step label{display:grid;gap:7px;color:#dce9f5;font-size:13px;font-weight:700}.provision-step input{width:100%;box-sizing:border-box;padding:14px;border:1px solid #36546f;border-radius:10px;color:#fff;background:#031326;font:inherit;outline:none}.provision-step input:focus{border-color:#49ddea;box-shadow:0 0 0 3px #49ddea18}.slug-preview{padding:18px;border-radius:10px;color:#9cb3c9;background:#031326}.slug-preview strong{color:#71e4af}.slug-status{min-height:20px;color:#e4c36c}.slug-status.is-ok{color:#71e4af}.palette-grid,.package-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.palette-card,.package-card{position:relative;padding:16px;border:1px solid #34516d;border-radius:14px;background:#04162b;cursor:pointer}.palette-card.is-selected,.package-card.is-selected{border-color:#49ddea;box-shadow:0 0 0 2px #49ddea33}.palette-card input,.package-card input{position:absolute;opacity:0}.palette-preview{display:grid;grid-template-columns:repeat(5,1fr);height:70px;overflow:hidden;border-radius:8px}.palette-card strong,.package-card strong{display:block;margin-top:12px}.package-card ul{padding-left:18px;color:#95abc0;font-size:12px;line-height:1.6}.provision-review{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:22px}.provision-review div{padding:14px;border-radius:10px;background:#031326}.provision-review span{display:block;color:#7892aa;font-size:11px}.provision-review strong{display:block;margin-top:4px}.provision-check{grid-template-columns:20px 1fr!important;align-items:start;margin-top:13px;color:#9fb4c8!important;font-weight:500!important}.provision-check input{width:18px}.provision-honeypot{position:absolute;left:-9999px}.provision-actions{display:flex;justify-content:space-between;margin-top:30px}.provision-actions button{padding:13px 19px;border:1px solid #36546f;border-radius:999px;color:#dce9f5;background:transparent;font-weight:800;cursor:pointer}.provision-actions button:last-of-type{margin-left:auto;color:#031424;border-color:#49ddea;background:#49ddea}.provision-actions button:disabled{opacity:.35}.provision-card>p{min-height:20px;color:#ffaaa9}.provision-result{margin-top:40px;text-align:center}.provision-progress{height:8px;margin:25px 0;overflow:hidden;border-radius:8px;background:#19334b}.provision-progress i{display:block;width:8%;height:100%;background:#49ddea;transition:width .4s}.provision-result>a{display:inline-block;padding:13px 20px;border-radius:999px;color:#031424;background:#49ddea;font-weight:800;text-decoration:none}@media(max-width:760px){.provision-grid,.provision-review{grid-template-columns:1fr}.palette-grid,.package-grid{grid-template-columns:1fr 1fr}.provision-steps{grid-template-columns:repeat(5,minmax(70px,1fr));overflow:auto}.provision-steps li{font-size:0}.provision-steps li:before{font-size:12px}}@media(max-width:500px){.palette-grid,.package-grid{grid-template-columns:1fr}.provision-page{width:min(100% - 20px,1050px)}.provision-card{padding:22px 16px}}
.template-heading{margin:30px 0 12px}.template-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.template-card{position:relative;padding:16px;border:1px solid #34516d;border-radius:14px;background:#04162b;cursor:pointer}.template-card input{position:absolute;opacity:0}.template-card.is-selected{border-color:#49ddea;box-shadow:0 0 0 2px #49ddea33}.template-card strong{display:block;margin-top:12px}.template-preview{display:grid;grid-template-columns:1.3fr .7fr;grid-template-rows:35px 35px;gap:4px}.template-preview i{border-radius:5px;background:#174563}.template-preview i:first-child{grid-column:1/-1;background:linear-gradient(120deg,#0c3153,#25b8d0)}
.template-preview{position:relative;display:block;height:168px;overflow:hidden;border:1px solid #28506f;border-radius:9px;background:radial-gradient(circle at 72% 55%,#0a518355,transparent 25%),linear-gradient(118deg,#071a35 0%,#06162e 58%,#020b15 100%)}.template-preview:before{content:"DIGIFX     Aanpak   Realisaties   Prijzen";position:absolute;top:0;left:0;right:0;height:25px;padding:8px 10px;color:#eaf7ff;font:700 6px/1 system-ui;letter-spacing:.25px;border-bottom:1px solid #9fdfff22}.template-preview:after{content:"Digitale ervaringen\A die werken.";white-space:pre;position:absolute;z-index:2;left:11px;top:48px;width:48%;color:#fff;font:700 14px/.92 system-ui;letter-spacing:-.6px}.template-preview i{position:absolute;display:block;border-radius:3px}.template-preview i:first-child{z-index:3;left:11px;top:92px;width:52px;height:15px;background:#47dce9;box-shadow:none}.template-preview i:first-child:after{content:"Gratis voorstel ↗";display:block;padding:5px 5px;color:#03172d;font:700 4px/1 system-ui;white-space:nowrap}.template-preview i:nth-child(2){right:10px;top:48px;width:42%;height:69px;border:2px solid #315f82;background:linear-gradient(145deg,#0a365c,#020b14);box-shadow:0 8px 18px #0008;transform:perspective(100px) rotateY(-5deg)}.template-preview i:nth-child(2):before{content:"";position:absolute;inset:8px;background:linear-gradient(90deg,#0b3152 64%,#0c426b 64%);border:1px solid #158ac755}.template-preview i:nth-child(2):after{content:"";position:absolute;left:-5px;right:-5px;bottom:-7px;height:6px;border-radius:1px 1px 8px 8px;background:#153957}.template-preview i:nth-child(3){left:0;right:0;bottom:0;height:28px;border-radius:0;background:#f5f8fb}.template-preview i:nth-child(3):before{content:"Sterke websites, gebouwd voor resultaat";position:absolute;left:10px;top:8px;color:#06172f;font:700 6px system-ui}.template-card:not(:first-child) .template-preview:before{content:"JOUW TEMPLATE     Home   Diensten   Contact"}.template-card:not(:first-child) .template-preview:after{content:"Een realistische\A websitepreview."}
.template-open-preview{position:relative;z-index:3;width:100%;margin-top:12px;padding:9px 11px;border:1px solid #3a627f;border-radius:8px;color:#bdebf3;background:#09213b;font-size:11px;font-weight:800;cursor:pointer}.template-open-preview:hover{border-color:#49ddea;color:#fff}.template-modal[hidden]{display:none}.template-modal{position:fixed;z-index:10000;inset:0;display:grid;place-items:center;padding:24px;background:#010914e8;backdrop-filter:blur(8px)}.template-modal-dialog{width:min(1180px,100%);height:min(780px,92vh);overflow:hidden;border:1px solid #4d7897;border-radius:18px;background:#06182f;box-shadow:0 35px 100px #000}.template-modal-dialog>header{display:flex;align-items:center;justify-content:space-between;height:55px;padding:0 18px;border-bottom:1px solid #294863}.template-modal-dialog>header button{display:grid;place-items:center;width:34px;height:34px;border:1px solid #46637d;border-radius:50%;color:#fff;background:transparent;font-size:22px;cursor:pointer}.template-browser{position:relative;height:calc(100% - 55px);padding-top:31px;background:#dce4eb}.template-browser>i{position:absolute;top:12px;width:8px;height:8px;border-radius:50%;background:#ff6b68}.template-browser>i:first-child{left:15px}.template-browser>i:nth-child(2){left:29px;background:#ffc45a}.template-browser>i:nth-child(3){left:43px;background:#69d48b}.template-browser>span{position:absolute;top:8px;left:70px;right:16px;height:16px;border-radius:8px;background:#c5d0d9}.template-browser iframe{display:block;width:100%;height:100%;border:0;background:#fff}@media(max-width:700px){.template-modal{padding:8px}.template-modal-dialog{height:95vh}.template-browser{padding-top:25px}}
