@import url('https://fonts.googleapis.com/css2?family=Comfortaa:wght@300;400;500;600;700&display=swap');
:root{--dark:#182d27;--green:#c9ec83;--bg:#f8f9f5;--muted:#6d7971;--line:#e4e8df;--paper:#fff;--serif:'Comfortaa',sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:'Comfortaa',sans-serif;margin:0;background:var(--bg);color:var(--dark);-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}button{cursor:pointer}button:disabled{opacity:.5;cursor:not-allowed}h1,h2,h3,p{margin-top:0}h1,h2{letter-spacing:-.055em}h1 em,h2 em,blockquote em{font-family:var(--serif);font-weight:400;letter-spacing:-.055em}h2{font-size:clamp(37px,4.2vw,64px);line-height:1.12}.section-kicker{font-size:11px;letter-spacing:.17em;font-weight:800;color:#69815d;margin-bottom:22px}.topbar{height:88px;display:flex;align-items:center;justify-content:space-between;max-width:1380px;padding:0 54px;margin:auto}.brand{display:flex;gap:10px;align-items:center;font-weight:800;letter-spacing:-.055em;font-size:20px}.brand-light{font-weight:500}.brand small{font-size:13px;letter-spacing:-.02em;font-weight:500;color:#74827b}.brandmark{width:36px;height:36px;display:grid;place-items:center;background:var(--dark);color:white;border-radius:11px;font-weight:800;font-size:26px;letter-spacing:-.2em;padding-right:6px}.brandmark span{color:var(--green);font-size:18px}.topbar nav{display:flex;align-items:center;gap:34px;font-size:13px;font-weight:700}.topbar nav>a:not(.nav-cta){color:#526158}.nav-cta{background:var(--dark);color:white;border-radius:8px;padding:13px 18px}.nav-cta span{margin-left:16px;color:var(--green)}.button{display:inline-flex;justify-content:center;align-items:center;gap:12px;border-radius:9px;min-height:52px;padding:15px 23px;font-weight:800;font-size:13px;text-align:center;border:1px solid transparent;transition:transform .2s,background .2s}.button:hover{transform:translateY(-2px)}.button.primary{background:var(--dark);color:white}.button.primary:hover{background:#305341}.button.outline{border-color:#cbd4cb;background:white;color:var(--dark)}.button.wide{width:100%}.hero{max-width:1380px;margin:0 auto;min-height:660px;display:grid;grid-template-columns:52% 48%;align-items:center;padding:40px 54px 95px;overflow:hidden}.eyebrow{font-size:10px;letter-spacing:.14em;font-weight:800;display:flex;gap:9px;align-items:center;margin-bottom:27px}.green-dot,.dot-live{display:inline-block;width:8px;height:8px;background:#91c54c;border-radius:50%}.hero h1{font-size:clamp(58px,5.7vw,89px);line-height:1.025;max-width:690px;margin-bottom:27px;font-weight:800}.hero h1 em{display:block;color:#77975e}.hero-intro{max-width:510px;font-size:16px;line-height:1.88;color:#64726a}.hero-intro strong{color:#2d4437}.hero-btn{margin-top:17px}.hero-under{font-size:11px;color:#89958c;margin:15px 0}.hero-art{position:relative;height:520px}.hero-orbit{position:absolute;right:20px;top:4px;font-size:10px;letter-spacing:2px;color:#839285;transform:rotate(7deg)}.hero-orbit span{font-size:22px;color:#8cad65}.stack-card{position:absolute;background:#fefefe;border-radius:11px;box-shadow:0 24px 70px #29402a20;overflow:hidden;border:1px solid #dbe2d6}.back-card{width:61%;height:345px;top:78px;left:3%;transform:rotate(-11deg)}.front-card{width:69%;height:401px;top:76px;left:28%;transform:rotate(5deg)}.tiny-browser{height:30px;border-bottom:1px solid #e7e8e5;padding:12px;display:flex;gap:5px;align-items:center}.tiny-browser i{width:6px;height:6px;border-radius:100%;background:#d7dcd5}.tiny-browser span{margin-left:auto;font-size:9px;color:#587046;font-weight:bold}.old-demo{padding:28px;background:#e8e9e3;height:100%;color:#778177}.old-demo span{font-size:14px}.old-demo h3{font-size:23px;font-weight:500;margin-top:30px}.old-demo p{font-size:11px}.old-demo>div{height:50px;background:#d7dbd2;margin-top:17px}.new-demo{height:calc(100% - 30px);background:linear-gradient(80deg,#203b30b5,#203b3070),url('https://images.unsplash.com/photo-1600607687920-4e2a09cf159d?w=850&q=80') center/cover;color:white;padding:19px 30px}.new-demo-head{font-weight:900;font-size:11px;display:flex;justify-content:space-between;letter-spacing:.1em}.new-demo-head span{font-size:8px}.new-demo-label{font-size:8px;letter-spacing:.23em;margin-top:70px;color:#ddf0c8}.new-demo h3{font-family:var(--serif);font-size:38px;line-height:1.04;font-weight:400;letter-spacing:-.06em;margin:17px 0}.new-demo h3 i{color:#d3ebae}.new-demo p{font-size:9px;line-height:1.6}.fake-button{display:inline-block;padding:9px 13px;background:#d0e99b;color:#20362a;font-size:8px;font-weight:900}.floating-note{position:absolute;bottom:0;left:12%;background:#e0edc4;transform:rotate(-5deg);padding:17px 22px;font-size:13px;line-height:1.6;border-radius:5px;box-shadow:0 12px 25px #1c371b1c}.section-wrap{max-width:1240px;margin:auto;padding:105px 24px}.steps{border-top:1px solid var(--line)}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:40px}.section-heading h2{max-width:790px}.section-heading h2 em{color:#73915b}.section-heading>p{font-size:14px;color:var(--muted);line-height:1.8;max-width:310px}.step-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:47px}.step-grid article{background:#fff;border:1px solid #ebeee7;border-radius:13px;padding:30px;min-height:250px}.step-number{font-size:11px;font-weight:900;color:#89a079}.step-icon{font-size:38px;margin:23px 0 17px}.step-grid h3{font-size:18px;letter-spacing:-.04em}.step-grid p{font-size:13px;color:#718077;line-height:1.8}.statement{background:#203d31;color:white;text-align:center;padding:97px 25px}.asterisk{display:block;color:#c5e49e;font-size:36px;margin-bottom:12px}.statement blockquote{font-size:clamp(29px,3.9vw,57px);font-weight:700;letter-spacing:-.06em;max-width:910px;line-height:1.23;margin:auto}.statement em{color:#c9e89f}.pricing{display:grid;grid-template-columns:1fr 1fr;gap:100px;align-items:center}.pricing h2 em{color:#73915b}.pricing>div:first-child>p{font-size:15px;line-height:1.8;max-width:420px;color:var(--muted)}.price-card{padding:35px;background:white;border:1px solid #e4e9df;border-radius:15px;box-shadow:0 15px 50px #22422e0c}.price-tag{font-size:10px;letter-spacing:.13em;font-weight:900;color:#678459}.price-major{font-size:51px;letter-spacing:-.08em;font-weight:800;margin-top:30px}.price-major span{font-size:12px;letter-spacing:0;color:#859187;font-weight:400}.price-line{font-size:23px;font-weight:800;margin:10px 0 25px}.price-line span{font-weight:400;font-size:12px;color:#77877a}.price-card hr{border:0;border-top:1px solid #e7eae4}.price-card ul{list-style:none;padding:3px 0;line-height:2.6;font-size:13px}.price-card li{color:#3b5243}.price-card>.button{width:100%;margin:14px 0}.price-card small{display:block;color:#87928a;font-size:10px;line-height:1.5}.lead-section{background:#ecf0e7;padding:105px max(5%,calc((100% - 1192px)/2));display:grid;grid-template-columns:1fr 1fr;gap:90px}.lead-content h2{max-width:540px}.lead-content h2 em{color:#799660}.lead-content>p{color:#68796d;font-size:15px;line-height:1.8}.lead-perks{display:flex;flex-direction:column;gap:16px;font-size:12px;font-weight:700;margin-top:35px}.lead-form{background:white;padding:35px;border-radius:15px;box-shadow:0 20px 60px #293a2510;display:flex;flex-direction:column;gap:17px}.lead-form>label,.inline-form>label,.admin-login label{display:flex;flex-direction:column;gap:9px;font-size:12px;font-weight:800}.lead-form label>span:not(.optional){color:#7da269}.optional{font-weight:400;color:#919b95}.lead-form input:not([type=checkbox]),.inline-form input,.inline-form textarea,.lead-form textarea,.admin-login input,.admin-page input,.admin-page select{width:100%;min-height:48px;border:1px solid #dce4db;background:#fff;border-radius:7px;padding:12px 14px;color:#1a3424;outline-color:#8ea86c}.lead-form .consent{display:flex;flex-direction:row;align-items:start;gap:10px;line-height:1.55;font-size:11px;font-weight:400;color:#69796f}.consent input{margin-top:3px}.consent span{color:#68766d!important}.consent a{text-decoration:underline}.lead-form small{color:#839187;text-align:center;font-size:10px}.form-message{font-size:12px;margin:0;line-height:1.5}.form-message.error{color:#bd3838}.form-message.success{color:#347844}footer{max-width:1240px;margin:auto;padding:55px 24px 30px;display:grid;grid-template-columns:1fr 1fr;gap:8px;color:#78867b;font-size:12px}footer .footer-brand{font-weight:900;color:var(--dark);font-size:18px;letter-spacing:-.04em}footer .footer-brand span{font-weight:400}footer p{grid-column:1;line-height:1.7}.footer-links{display:flex;justify-content:end;gap:22px;grid-column:2;grid-row:1}.footer-copy{grid-column:1/-1;border-top:1px solid var(--line);margin-top:30px;padding-top:25px}.preview-main{max-width:1130px;margin:auto;padding:60px 25px 110px}.preview-intro{text-align:center;max-width:810px;margin:10px auto 55px}.preview-intro h1{font-size:clamp(41px,5.5vw,74px);line-height:1.08;margin-bottom:20px}.preview-intro h1 em{color:#7a985f}.preview-intro>p{line-height:1.8;color:#6f7b71;max-width:670px;margin:0 auto 20px}.preview-pill{display:inline-block;padding:10px 14px;border-radius:30px;background:#ecf1e4;color:#628258;font-weight:800;font-size:11px}.preview-stage{background:#fff;border:1px solid #e0e6dc;border-radius:16px;padding:21px;box-shadow:0 24px 70px #233d2b0d}.device-switch,.frame-footer{display:flex;justify-content:space-between;align-items:center;gap:10px}.device-switch{padding:0 3px 16px;font-size:11px;letter-spacing:.06em;font-weight:900}.dot-live{margin-right:7px}.switch-buttons{display:flex;gap:5px;border-radius:8px;background:#f2f4ef;padding:4px}.switch-buttons button{border:0;padding:9px 13px;background:transparent;color:#728073;border-radius:6px;font-size:12px;font-weight:700}.switch-buttons button.selected{background:white;color:#243e2d;box-shadow:0 2px 7px #193b2010}.preview-frame-wrap{background:#e6eae5;border:1px solid #dfe7dc;border-radius:9px;overflow:hidden;transition:width .35s;margin:auto;width:100%}.preview-frame-wrap.mobile{width:min(390px,100%)}.browserbar{height:35px;background:#f7f8f6;border-bottom:1px solid #e2e7e1;display:flex;align-items:center;gap:12px;padding:0 14px;font-size:10px;color:#718177}.traffic{display:flex;gap:5px}.traffic i{width:7px;height:7px;background:#d5dcd3;border-radius:50%}.browser-url{margin:auto;background:#eef1ec;border-radius:4px;padding:5px 20px;max-width:75%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.preview-frame-wrap iframe{display:block;width:100%;height:610px;border:0;background:white}.preview-frame-wrap.mobile iframe{height:660px}.frame-footer{padding:15px 5px 0;font-size:11px;color:#829083}.frame-footer a{color:#45673f;font-weight:800}.questions{max-width:720px;margin:110px auto 0}.questions h2 em,.offer-section h2 em{color:#7b985e}.questions>p,.offer-section>p{line-height:1.8;color:#687a6c;font-size:14px;margin-bottom:32px}.q-card{padding:29px;background:white;border-radius:12px;border:1px solid #e1e7de;margin-bottom:15px}.q-num{font-size:10px;letter-spacing:.12em;font-weight:900;color:#8aa27c;margin-bottom:12px}.q-card h3{font-size:19px;letter-spacing:-.04em}.choice{display:flex;gap:12px;align-items:center;cursor:pointer;border:1px solid #e4e9df;border-radius:8px;padding:15px;margin:9px 0;font-size:13px}.choice:has(input:checked){background:#f3f8e9;border-color:#9dbb75}.choice input{accent-color:#406837}.q-card textarea{min-height:94px;border:1px solid #dce4db;border-radius:7px;padding:14px;width:100%;resize:vertical}.offer-section{max-width:720px;margin:90px auto 0;padding-top:40px;border-top:1px solid #dce3d8}.offer-card{border:1px solid #dfe6da;background:#fff;padding:29px;border-radius:12px}.offer-price{font-size:39px;letter-spacing:-.07em;font-weight:900}.offer-price span{font-weight:400;letter-spacing:0;color:#7d8b7e;font-size:14px}.offer-card>p{font-size:12px;line-height:1.8;color:#708273}.offer-actions{display:flex;gap:10px;flex-wrap:wrap}.inline-form{border-top:1px solid #e5e9e3;margin-top:25px;padding-top:22px;display:grid;gap:14px}.inline-form textarea{min-height:85px}.inline-form .button{justify-self:start}.inline-form h3{margin:0}.legal{max-width:850px;padding:90px 25px;margin:auto;min-height:65vh}.legal h1{font-size:52px}.legal p{line-height:1.8;color:#67766c}.admin-login{max-width:440px;margin:120px auto;padding:35px;background:white;border:1px solid var(--line);border-radius:13px}.admin-login form{display:grid;gap:18px}.admin-page{max-width:1200px;padding:50px 25px;margin:auto}.admin-top{display:flex;align-items:center;justify-content:space-between}.admin-panel{margin:24px 0;background:white;border:1px solid #e4e9e1;border-radius:12px;padding:25px;overflow-x:auto}.admin-panel h2{font-size:23px;letter-spacing:-.04em}.admin-panel table{width:100%;border-collapse:collapse;text-align:left;min-width:640px;font-size:12px}.admin-panel td,.admin-panel th{padding:12px 8px;border-bottom:1px solid #edf0eb;vertical-align:top}.admin-panel th{color:#718174}.admin-panel a{text-decoration:underline}.admin-create{display:flex;align-items:end;gap:10px;flex-wrap:wrap}.admin-create input,.admin-create select{max-width:220px}.admin-create .button{min-height:48px}.admin-counts{display:flex;gap:12px;flex-wrap:wrap}.admin-counts span{background:#eaf1e2;padding:10px 15px;border-radius:7px;font-size:12px;font-weight:800}@media(max-width:950px){.hero{grid-template-columns:1fr;gap:35px;padding-top:45px}.hero-art{max-width:690px;width:100%;margin:auto}.lead-section,.pricing{grid-template-columns:1fr;gap:35px}.section-heading{display:block}.step-grid{gap:12px}}@media(max-width:650px){.topbar{height:72px;padding:0 20px}.topbar nav>a:not(.nav-cta){display:none}.topbar nav{gap:0}.topbar .nav-cta{font-size:11px;padding:11px}.brand{font-size:16px}.brandmark{width:30px;height:30px;font-size:20px}.brand small{font-size:10px}.hero{padding:35px 22px 50px;min-height:auto}.hero h1{font-size:clamp(54px,13vw,76px)}.hero-art{height:330px}.back-card{height:230px;top:34px}.front-card{height:270px;top:35px}.new-demo{padding:13px}.new-demo-label{margin-top:35px;font-size:6px}.new-demo h3{font-size:25px}.floating-note{font-size:10px;bottom:5px}.hero-orbit{display:none}.section-wrap{padding:65px 22px}.step-grid{grid-template-columns:1fr}.step-grid article{min-height:190px}.statement{padding:65px 22px}.lead-section{padding:65px 20px}.lead-form{padding:25px}.preview-main{padding:35px 12px 80px}.preview-intro{margin-bottom:30px}.preview-stage{padding:10px}.device-switch{flex-wrap:wrap}.browser-url{max-width:60%}.preview-frame-wrap iframe{height:520px}.frame-footer{align-items:start;line-height:1.6}.questions{margin-top:65px}.q-card{padding:19px}.offer-actions .button{width:100%}footer{padding:40px 20px 25px}.admin-top{align-items:start;gap:12px;flex-direction:column}}
/* mooierzo.nl — editorial website showcase */
:root{--dark:#171a20;--green:#cfff87;--bg:#f5f3ed;--muted:#666b72;--line:#e7e4db}
body{background:var(--bg);color:#202329}
.topbar{max-width:1600px;height:88px;padding-inline:clamp(20px,4vw,72px)}.brandmark{border-radius:50%;background:#1e2229}.nav-cta{background:#202329;border-radius:100px;padding:14px 20px}.button{border-radius:100px}
.showcase-hero{background:#1b1f26;color:#f6f4ed;margin:0 clamp(12px,2.2vw,35px) 0;border-radius:15px;overflow:hidden;padding:0 clamp(24px,4vw,65px) 24px}.showcase-top{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #ffffff29;height:68px}.showcase-edition{font-size:12px;color:#b6b9b7}.showcase-title{display:flex;justify-content:space-between;align-items:end;padding:70px 0 55px;gap:20px}.showcase-title h1{font-size:clamp(70px,8.7vw,160px);line-height:.87;letter-spacing:-.09em;font-weight:700;margin:0 0 30px}.showcase-title h1 em{font-family:'Comfortaa',sans-serif;font-weight:400;letter-spacing:-.085em}.showcase-title h1 em span{color:var(--green)}.showcase-title p{font-size:16px;line-height:1.75;color:#bdc1c1;max-width:610px}.showcase-title p strong{color:#fff}.showcase-actions{display:flex;gap:22px;align-items:center;margin-top:27px}.showcase-actions>span{font-size:11px;color:#abb1ad}.showroom-btn,.button.showroom-btn{background:var(--green);color:#171a20;padding:19px 27px;font-size:13px}.showroom-btn:hover{background:#e2ffb7}.showcase-stage{background:#f6f4ed;border-radius:9px;box-shadow:0 35px 75px #0004;overflow:hidden}.showcase-stage-head{height:39px;display:flex;align-items:center;justify-content:space-between;padding:0 18px;color:#656b68;font-size:10px;letter-spacing:.1em}.showcase-stage-head>span:first-child{display:flex;gap:5px}.showcase-stage-head i{width:7px;height:7px;display:block;background:#bdc4bf;border-radius:50%}.showcase-canvas{height:580px;display:grid;grid-template-columns:23% 77%;overflow:hidden}.showcase-side{position:relative;background:#e4e4db;display:flex;align-items:center;justify-content:center;overflow:hidden}.showcase-vertical{position:absolute;left:16px;top:24px;writing-mode:vertical-rl;font-size:10px;letter-spacing:.15em;color:#7a807e;font-weight:800}.showcase-before{width:80%;height:72%;background:#fff;border:1px solid #cdcec7;box-shadow:0 10px 40px #2222;transform:rotate(-4deg);overflow:hidden}.showcase-before>span{display:block;font-size:10px;letter-spacing:.14em;color:#929b93;padding:12px 14px;background:#f7f7f3}.oldnav{background:#dddcd3;padding:16px;font-size:16px;font-weight:700;color:#5e615b}.oldhero{background:linear-gradient(#7778,#7778),url('https://images.unsplash.com/photo-1600607687920-4e2a09cf159d?w=500&q=70') center/cover;height:190px;color:white;padding:20px 14px;display:flex;flex-direction:column;gap:14px}.oldhero b{font-family:'Comfortaa',sans-serif;font-size:23px}.oldhero small{font-size:10px;line-height:1.5}.oldhero span{font-size:10px;text-decoration:underline}.oldlines{padding:20px 13px}.oldlines i{display:block;height:10px;background:#e5e6e3;margin:10px 0}.oldlines i:last-child{width:65%}.showcase-after{position:relative;background:#323d30}.showcase-site{height:100%;position:relative;background:linear-gradient(90deg,rgba(17,31,22,.93),rgba(20,37,26,.64) 52%,rgba(14,31,22,.02)),url('https://images.unsplash.com/photo-1600607687920-4e2a09cf159d?w=1500&q=90') center/cover;color:#fff}.showcase-site-nav{display:flex;align-items:start;justify-content:space-between;padding:37px 5%;font-size:9px;letter-spacing:.12em}.showcase-site-nav b{font-size:16px;line-height:.95;letter-spacing:-.06em}.showcase-site-nav b span{color:#d3efb1;padding-left:8px}.showcase-site-nav mark{padding:12px;background:#e0f2bd;color:#2b3026}.showcase-site-copy{padding:45px 6%;max-width:700px}.showcase-site-copy>span:first-child{font-size:10px;letter-spacing:.2em;color:#e4f0c5}.showcase-site-copy h2{font-size:clamp(60px,6.4vw,110px);line-height:.94;margin:24px 0;font-family:'Comfortaa',sans-serif;font-weight:400;letter-spacing:-.07em}.showcase-site-copy h2 em{color:#d7ecb4;font-weight:400}.showcase-site-copy p{font-size:14px;max-width:340px;line-height:1.65;color:#e7e8df}.site-mock-cta{display:inline-block;background:#ddf3b2;color:#1a2d1e;border-radius:100px;padding:15px 20px;margin-top:16px;font-size:11px;font-weight:900}.showcase-site-footer{position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:space-around;background:#e3edca;color:#253426;padding:19px;font-size:10px;letter-spacing:.1em;font-weight:800}.showcase-bottom{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:25px 4px 0;font-size:12px;color:#adb2ad}.showcase-bottom b{color:white}.showcase-bottom a{color:var(--green)}
.statement{background:#1b1f26}.statement em{color:#cfff87}.section-kicker{color:#7c8277}.step-grid article{border-radius:16px}.step-number{color:#879c78}.price-card{border-radius:19px}.lead-section{background:#e9eae0}.lead-form{border-radius:20px}.button.primary{background:#1d2422}.button.primary:hover{background:#3e4c43}.pricing h2 em,.section-heading h2 em,.lead-content h2 em{color:#879b73}
@media(max-width:950px){.showcase-title{padding:60px 0 35px}.showcase-canvas{height:460px}.showcase-site-nav>span{display:none}.showcase-site-copy{padding-top:60px}.showcase-site-copy h2{font-size:70px}}
@media(max-width:650px){.showcase-hero{margin:0 9px;border-radius:10px;padding:0 15px 19px}.showcase-top{height:56px}.showcase-edition{display:none}.showcase-title{padding:47px 2px 34px}.showcase-title h1{font-size:clamp(57px,12vw,90px);letter-spacing:-.085em}.showcase-title p{font-size:14px}.showcase-actions{align-items:start;flex-direction:column;gap:12px}.showcase-canvas{height:415px;grid-template-columns:15% 85%}.showcase-before{width:240px;position:absolute;right:-30px;height:270px;opacity:.45}.showcase-vertical{display:none}.showcase-site-nav{padding:22px 15px}.showcase-site-nav b{font-size:13px}.showcase-site-copy{padding:80px 15px 0}.showcase-site-copy h2{font-size:53px}.showcase-site-copy p{font-size:11px}.showcase-site-footer{font-size:7px;padding:12px 5px}.showcase-bottom{font-size:10px;line-height:1.6}.showcase-bottom a{text-align:right}}
.admin-help{max-width:720px;color:#656c6d;line-height:1.75;font-size:13px}.admin-upload{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:17px;max-width:890px}.admin-upload>label{font-size:12px;font-weight:800;display:grid;gap:8px}.admin-upload input,.admin-upload select{max-width:none!important}.admin-upload-file{grid-column:1/-1}.admin-upload-file input{padding:13px;border:1px dashed #c7d0c4!important;border-radius:8px}.admin-upload .form-message{align-self:center}.admin-action{border:1px solid #cdd5c9;border-radius:7px;background:#f4f6f0;padding:8px 10px;font-size:11px}.admin-action.danger{color:#a33131;border-color:#eed1d1}@media(max-width:650px){.admin-upload{grid-template-columns:1fr}.admin-upload-file{grid-column:auto}}

/* Screenshot-first previews: images stay inside realistic, scrollable device windows. */
.preview-frame-wrap .shot-scroll{height:620px;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;background:#fff;scrollbar-width:thin}
.preview-frame-wrap .shot-scroll img{display:block;width:100%;height:auto;user-select:none;-webkit-user-drag:none}
.preview-frame-wrap .mobile-shot{display:none}
.preview-frame-wrap.mobile .desktop-shot{display:none}
.preview-frame-wrap.mobile .mobile-shot{display:block;height:640px}
.preview-frame-wrap .shot-pending{min-height:440px;display:grid;align-content:center;justify-items:center;text-align:center;padding:3rem;background:#f4f6f1}
.preview-frame-wrap .shot-pending strong{font-size:1.5rem}
.preview-frame-wrap .shot-pending p{max-width:26rem;color:#617066}
.shot-loading{display:flex;flex-direction:column;align-items:center;gap:22px}
.shot-loading-logo{display:block;width:min(210px,58vw);height:auto;animation:logo-arrive .8s cubic-bezier(.2,.8,.2,1) both}
.shot-loading-track{display:block;width:94px;height:2px;border-radius:2px;background:#d9e5ef;overflow:hidden}
.shot-loading-track:after{content:"";display:block;width:36%;height:100%;border-radius:2px;background:linear-gradient(90deg,#153d69,#16a5d2);animation:loading-sweep 1.2s ease-in-out infinite}
.shot-loading strong{font-size:12px!important;font-weight:500;color:#617066}
@keyframes logo-arrive{from{opacity:0;transform:translateY(7px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes loading-sweep{from{transform:translateX(-110%)}to{transform:translateX(290%)}}
.admin-action[href]{display:inline-block;text-decoration:none;margin:3px}
@media(max-width:650px){.preview-frame-wrap .shot-scroll{height:460px}.preview-frame-wrap.mobile .mobile-shot{height:580px}}

/* Editorial homepage system, matched to the showcase */
.steps.section-wrap,.pricing.section-wrap{max-width:1320px;padding-top:clamp(76px,10vw,142px);padding-bottom:clamp(76px,10vw,142px)}
.section-kicker{font-size:10px;letter-spacing:.19em;font-weight:800;color:#819078}
.section-heading{margin-top:25px;align-items:end}
.section-heading h2,.pricing h2,.lead-content h2{font-size:clamp(42px,5.4vw,76px);line-height:1.02;letter-spacing:-.075em;font-weight:700}
.section-heading h2 em,.pricing h2 em,.lead-content h2 em{font-family:'Comfortaa',sans-serif;font-weight:400;letter-spacing:-.065em}
.section-heading>p,.pricing>div:first-child>p,.lead-content>p{font-size:15px;line-height:1.8;color:#727a75}
.step-grid{gap:0;margin-top:58px;border-top:1px solid #dfe3db;border-bottom:1px solid #dfe3db}
.step-grid article{background:transparent;border:0;border-radius:0;padding:29px 32px 31px 0;min-height:220px;position:relative;transition:transform .25s ease,color .25s ease}
.step-grid article+article{border-left:1px solid #dfe3db;padding-left:32px}
.step-grid article:hover{transform:translateY(-4px)}
.step-number{font-size:10px;letter-spacing:.12em;color:#8ca17b}
.step-icon{font-size:27px;margin:34px 0 20px;color:#718d58}
.step-grid h3{font-size:20px;letter-spacing:-.045em;margin:0 0 11px}
.step-grid p{font-size:13px;line-height:1.8;color:#778079;max-width:310px}
.statement{background:#1b1f26;padding:clamp(82px,11vw,150px) 24px}
.asterisk{font-size:24px;color:#cfff87;margin-bottom:25px}
.statement blockquote{font-size:clamp(34px,5vw,72px);letter-spacing:-.075em;line-height:1.08}
.statement em{font-family:'Comfortaa',sans-serif;font-weight:400;color:#d2edac}
.pricing{gap:clamp(50px,10vw,150px)}
.price-card{border:1px solid #dfe3dc;border-radius:4px;box-shadow:none;padding:clamp(27px,4vw,48px);transition:transform .25s ease,border-color .25s ease}
.price-card:hover{transform:translateY(-4px);border-color:#a9b99a}
.price-major{font-size:clamp(53px,6vw,78px);letter-spacing:-.09em}
.price-card ul{line-height:2.8}
.price-card li{font-size:13px}
.button{transition:transform .2s ease,background-color .2s ease,box-shadow .2s ease}
.button:hover{transform:translateY(-2px)}
.lead-section{background:#1b1f26;color:#f6f4ed;padding-top:clamp(75px,10vw,135px);padding-bottom:clamp(75px,10vw,135px);gap:clamp(45px,9vw,130px)}
.lead-section .section-kicker{color:#cfff87}
.lead-content h2 em{color:#cfff87}
.lead-content>p,.lead-perks{color:#b9c0bb}
.lead-perks{gap:18px}
.lead-form{border-radius:4px;box-shadow:none;padding:clamp(24px,4vw,42px)}
footer{max-width:1320px;padding-top:45px}
@media(max-width:650px){.section-heading h2,.pricing h2,.lead-content h2{font-size:clamp(39px,10vw,56px)}.step-grid{border-bottom:0;margin-top:35px}.step-grid article,.step-grid article+article{min-height:0;border:0;border-top:1px solid #dfe3db;padding:22px 0}.step-icon{margin:19px 0 12px}.step-grid p{margin-bottom:2px}.pricing{gap:28px}.statement blockquote{font-size:clamp(34px,9vw,48px)}}
.preview-edit{display:grid;gap:7px;min-width:190px}
.preview-edit input{width:100%;min-height:38px;border:1px solid #dce4db;background:#fff;border-radius:6px;padding:8px 10px;color:#1a3424;font-size:12px}
.preview-edit button{justify-self:start}
@media(max-width:650px){.admin-panel{padding:18px}.preview-edit{min-width:160px}}

/* Brighter gradient accents and motion for the homepage */
body:has(.showcase-hero){background:linear-gradient(180deg,#f5f3ed 0%,#f7f7f1 34%,#f1f4eb 66%,#f5f3ed 100%)}
.showcase-hero{position:relative;isolation:isolate}
.showcase-hero:before{content:"";position:absolute;z-index:-1;width:58vw;height:58vw;max-width:850px;max-height:850px;right:-19%;top:-34%;border-radius:50%;background:radial-gradient(circle,rgba(207,255,135,.16) 0%,rgba(129,155,101,.08) 34%,transparent 70%);filter:blur(7px);pointer-events:none;animation:hero-glow 12s ease-in-out infinite alternate}
.showcase-stage{animation:stage-arrive .9s cubic-bezier(.2,.75,.25,1) both;transform-origin:55% 70%}
.showcase-before{animation:before-drift 7s ease-in-out infinite}

.showcase-site{background-size:cover,cover;animation:site-kenburns 24s ease-in-out infinite alternate}
.showcase-title h1 em span{background:linear-gradient(100deg,#d5f79e 5%,#a9da83 42%,#e4f7c5 72%,#cfff87);background-size:220% auto;background-clip:text;-webkit-background-clip:text;color:transparent;animation:accent-sweep 8s ease-in-out infinite}
.steps.section-wrap{position:relative}
.step-icon{transition:transform .35s cubic-bezier(.2,.8,.2,1),color .35s}
.step-grid article:hover .step-icon{transform:translateY(-5px) rotate(-9deg) scale(1.12);color:#91b66d}
.statement{position:relative;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 12% 110%,#42573a 0%,transparent 47%),radial-gradient(ellipse at 92% -20%,#35483c 0%,transparent 46%),#1b1f26}
.statement:before{content:"";position:absolute;z-index:-1;inset:-50%;background:conic-gradient(from 180deg at 50% 50%,transparent 0 28%,#cfff8710 38%,transparent 49% 78%,#b7df9b0a 88%,transparent);animation:statement-orbit 22s linear infinite}
.statement blockquote{position:relative}
.asterisk{animation:asterisk-turn 16s linear infinite}
.pricing.section-wrap{position:relative}
.price-card{position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(145deg,#fff 4%,#fbfcf7 57%,#eef4e6 100%);box-shadow:0 25px 70px #293b2410}
.price-card:before{content:"";position:absolute;z-index:-1;inset:-1px;background:radial-gradient(ellipse at 100% 0%,#cfff8750,transparent 55%);opacity:.8;transition:opacity .35s}
.price-card:hover:before{opacity:1}
.price-card:hover{transform:translateY(-7px);box-shadow:0 32px 75px #293b2419}
.price-card>.button{box-shadow:0 9px 25px #19251b20}
.lead-section{position:relative;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 4% 100%,#3c5037 0%,transparent 43%),linear-gradient(118deg,#1b1f26 14%,#222b26 58%,#26352b 100%)}
.lead-section:after{content:"";position:absolute;z-index:-1;width:430px;height:430px;right:-170px;top:-180px;border-radius:50%;border:1px solid #d7f2b218;box-shadow:0 0 0 35px #d7f2b20a,0 0 0 75px #d7f2b207;animation:ring-breathe 7s ease-in-out infinite}
.lead-form{background:linear-gradient(150deg,#fff 0%,#fff 72%,#f2f7eb 100%);box-shadow:0 28px 80px #0003}
.lead-form input:focus,.lead-form textarea:focus{border-color:#94b879!important;box-shadow:0 0 0 4px #a9d88730;transition:box-shadow .2s,border-color .2s}
.showroom-btn{box-shadow:0 8px 30px #cfff8730}
.showroom-btn:hover{box-shadow:0 12px 38px #cfff8750}
@keyframes hero-glow{from{transform:translate3d(-2%,0,0) scale(.92)}to{transform:translate3d(5%,4%,0) scale(1.08)}}
@keyframes stage-arrive{from{opacity:0;transform:translateY(28px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes before-drift{0%,100%{transform:rotate(-4deg) translateY(0)}50%{transform:rotate(-3deg) translateY(-6px)}}
@keyframes stamp-arrive{from{opacity:0;transform:translateY(12px) scale(.86)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes stamp-shine{0%,75%,100%{filter:brightness(1)}84%{filter:brightness(1.22)}}
@keyframes site-kenburns{from{background-position:center,50% 48%}to{background-position:center,54% 52%}}
@keyframes accent-sweep{0%,100%{background-position:0% center}50%{background-position:100% center}}
@keyframes statement-orbit{to{transform:rotate(360deg)}}
@keyframes asterisk-turn{to{transform:rotate(360deg)}}
@keyframes ring-breathe{0%,100%{transform:scale(.96);opacity:.55}50%{transform:scale(1.06);opacity:1}}
.motion-ready .reveal-on-scroll{opacity:0;transform:translateY(24px);transition:opacity .75s ease,transform .75s cubic-bezier(.2,.7,.25,1)}
.motion-ready .reveal-on-scroll.is-visible{opacity:1;transform:translateY(0)}
.motion-ready .reveal-on-scroll .step-grid article{transition-delay:var(--reveal-delay,0ms)}
@media(max-width:650px){.showcase-hero:before{width:110vw;height:110vw;right:-53%;top:-14%}.showcase-stage{animation-duration:.7s}.showcase-before{animation-duration:9s}.lead-section:after{right:-260px}.statement:before{inset:-15% -80%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}.motion-ready .reveal-on-scroll{opacity:1;transform:none}}
.motion-ready .steps.reveal-on-scroll .step-grid article{opacity:0;transform:translateY(16px)}
.motion-ready .steps.reveal-on-scroll.is-visible .step-grid article{opacity:1;transform:translateY(0);transition:opacity .65s ease var(--reveal-delay,0ms),transform .65s cubic-bezier(.2,.7,.25,1) var(--reveal-delay,0ms)}

/* Homepage accent update: cobalt blue replaces the sage emphasis */
:root{--focus:#687cff;--focus-light:#aeb9ff;--focus-wash:#eef0ff}
.section-kicker{color:#737fe0}
.section-heading h2 em,.pricing h2 em{color:var(--focus)}
.lead-content h2 em{color:#aeb9ff}
.step-number,.step-icon{color:#7885ec}
.step-grid article:hover .step-icon{color:#596eff}
.price-tag{color:#6979e8}
.price-card{background:linear-gradient(145deg,#fff 5%,#fbfbff 55%,#edf0ff 100%)}
.price-card:before{background:radial-gradient(ellipse at 100% 0%,#8294ff45,transparent 58%)}
.price-card:hover{border-color:#a9b3ff}
.price-card>.button{box-shadow:0 9px 25px #26368820}
.lead-section{background:radial-gradient(ellipse at 4% 100%,#3e477b 0%,transparent 45%),linear-gradient(118deg,#1b1f26 14%,#222735 58%,#292e45 100%)}
.lead-section:after{border-color:#aeb9ff22;box-shadow:0 0 0 35px #aeb9ff0c,0 0 0 75px #aeb9ff08}
.lead-form{background:linear-gradient(150deg,#fff 0%,#fff 72%,#f1f2ff 100%)}
.lead-form input:focus,.lead-form textarea:focus{border-color:#8290ff!important;box-shadow:0 0 0 4px #8290ff30}
@media(prefers-reduced-motion:reduce){.step-grid article:hover .step-icon{transform:none}}

/* Abstract, softly blurred color forms replace homepage gradients */
body:has(.showcase-hero){background:#f5f3ed}
.showcase-hero:before{background:#cfff8720;filter:blur(28px);border-radius:43% 57% 61% 39% / 52% 42% 58% 48%}
.showcase-hero:after{content:"";position:absolute;z-index:-1;width:36vw;height:31vw;max-width:560px;max-height:450px;left:33%;top:13%;border-radius:58% 42% 37% 63% / 44% 56% 44% 56%;background:#8195ff12;filter:blur(35px);pointer-events:none}
.statement{background:#1b1f26}
.statement:before{inset:auto auto -60% -8%;width:70%;height:120%;border-radius:57% 43% 62% 38% / 45% 58% 42% 55%;background:#8195ff18;filter:blur(50px);animation:blob-drift 18s ease-in-out infinite alternate}
.statement:after{content:"";position:absolute;z-index:-1;right:-10%;top:-75%;width:50%;height:130%;border-radius:44% 56% 39% 61% / 54% 42% 58% 46%;background:#cfff8710;filter:blur(55px);animation:blob-drift 22s ease-in-out infinite alternate-reverse}
.statement blockquote,.asterisk{z-index:1}
.pricing.section-wrap{isolation:isolate}
.pricing.section-wrap:before{content:"";position:absolute;z-index:-1;right:-6%;top:16%;width:36%;height:70%;border-radius:62% 38% 43% 57% / 49% 57% 43% 51%;background:#8294ff14;filter:blur(38px);pointer-events:none;animation:blob-drift 16s ease-in-out infinite alternate}
.price-card{background:#fff}
.price-card:before{z-index:0;inset:auto -9% -32% auto;width:65%;height:68%;border-radius:42% 58% 61% 39% / 53% 42% 58% 47%;background:#8294ff12;filter:blur(22px);opacity:.9}
.price-card>*{position:relative;z-index:1}
.lead-section{background:#20232c}
.lead-section:after{width:390px;height:340px;right:-130px;top:-135px;border:0;border-radius:43% 57% 62% 38% / 52% 40% 60% 48%;background:#8195ff1b;box-shadow:none;filter:blur(27px);animation:blob-drift 13s ease-in-out infinite alternate}
.lead-form{background:#fff}
@keyframes blob-drift{from{transform:translate3d(-2%,0,0) rotate(-5deg) scale(.96)}to{transform:translate3d(4%,3%,0) rotate(7deg) scale(1.05)}}
@media(max-width:650px){.showcase-hero:after{width:78vw;height:72vw;left:14%;top:25%}.pricing.section-wrap:before{width:65%;height:48%;right:-14%;top:42%}.lead-section:after{right:-230px;top:-110px}.statement:before{width:110%;height:90%;left:-15%;bottom:-48%}.statement:after{width:75%;height:85%;right:-22%;top:-42%}}
@media(prefers-reduced-motion:reduce){.statement:before,.statement:after,.pricing.section-wrap:before,.lead-section:after{animation:none}}

/* Color accents: varied across the page, with the first hero blob removed */
.showcase-hero:before{display:none}
.showcase-hero:after{background:#8195ff15}
#werkwijze .section-kicker{color:#ff8300}
#prijzen .section-kicker{color:#687cff}
#aanvragen .section-kicker{color:#b5df68}
.step-number{color:#ff8300}
.step-grid article:nth-child(1) .step-icon{color:#687cff}
.step-grid article:nth-child(2) .step-icon{color:#82a94d}
.step-grid article:nth-child(3) .step-icon{color:#ff8300}
.step-grid article:nth-child(1):hover .step-icon{color:#4e63ec}
.step-grid article:nth-child(2):hover .step-icon{color:#6f963c}
.step-grid article:nth-child(3):hover .step-icon{color:#e87400}
.asterisk{color:#ff963d}
.statement em{color:#cfff87}
.price-card{isolation:isolate}
.price-card:after{content:"";position:absolute;z-index:0;right:-11%;top:-24%;width:45%;height:48%;border-radius:46% 54% 58% 42% / 48% 42% 58% 52%;background:#ff830012;filter:blur(24px);pointer-events:none}
.price-card>*{z-index:1}
.price-tag{color:#687cff}
.lead-perks span:nth-child(1){color:#cfff87}
.lead-perks span:nth-child(2){color:#b9c5ff}
.lead-perks span:nth-child(3){color:#ffc078}
@media(max-width:650px){.showcase-hero:after{width:78vw;height:72vw;left:14%;top:25%}}

/* A distinct accent palette for each homepage section */
#werkwijze .section-heading h2 em{color:#ff8300}
#werkwijze .step-number{color:#ff8300}
#werkwijze .step-grid article .step-icon{color:#ff9c42}
#werkwijze .step-grid article:hover .step-icon{color:#e87500}
.statement .asterisk{color:#cfff87}
.statement blockquote em{color:#b8e47b}
#prijzen .pricing h2 em{color:#687cff}
#prijzen .price-tag{color:#687cff}
#prijzen .price-card:before{background:#687cff16}
#prijzen .price-card:after{background:#ff830010}
#aanvragen .lead-content h2 em{color:#ffad68}
#aanvragen .section-kicker{color:#ffad68}
#aanvragen .lead-perks span:nth-child(1){color:#cfff87}
#aanvragen .lead-perks span:nth-child(2){color:#b9c5ff}
#aanvragen .lead-perks span:nth-child(3){color:#ffbd83}

/* Keep the page inside the viewport; decorative blobs may extend but never scroll */
html,body{max-width:100%;overflow-x:clip}
@supports not (overflow:clip){html,body{overflow-x:hidden}}

/* Center the process steps; keep their numbers as small corner labels */
.step-grid article,.step-grid article+article{position:relative;text-align:center;padding:42px 28px 30px}
.step-number{position:absolute;top:17px;left:18px;font-size:10px;line-height:1;letter-spacing:.08em}
.step-icon{font-size:48px;margin:17px auto 23px;line-height:1;display:block}
.step-grid h3,.step-grid p{margin-left:auto;margin-right:auto}
.step-grid p{max-width:300px}
@media(max-width:650px){.step-grid article,.step-grid article+article{padding:38px 18px 24px}.step-number{top:15px;left:16px}.step-icon{font-size:44px;margin:13px auto 18px}}
.lead-form{background:#efefef}
.lead-form>label{color:#000;display:block;}
.lead-form .consent span{color:#000!important}
.lead-perks span,.lead-perks span:nth-child(n){color:#e1e5df}
#aanvragen .lead-perks span:nth-child(n){color:#ff8300}

#aanvragen .lead-perks span:nth-child(n){color:#fff}

/* Three editorial showcase slider variants */
.showcase-top{gap:18px}
.showcase-slider{display:flex;align-items:center;gap:5px}
.slider-arrow,.slider-choice{display:flex;align-items:center;justify-content:center;border:1px solid #ffffff24;background:#ffffff08;color:#f6f4ed;min-height:33px;border-radius:100px;transition:background .2s,color .2s,border-color .2s,transform .2s}
.slider-arrow{width:33px;font-size:15px}
.slider-choice{gap:7px;padding:0 11px;font-size:10px;cursor:pointer}
.slider-choice span:first-child{color:#9ca09e;font-size:9px}
.slider-choice.active{background:#f6f4ed;color:#1b1f26;border-color:#f6f4ed}
.slider-choice.active span:first-child{color:#6a716b}
.slider-choice:hover,.slider-arrow:hover{border-color:#cfff87;background:#cfff87;color:#171a20;transform:translateY(-1px)}
.showcase-examples[data-active-sector="build"]{--green:#ff963d}
.showcase-examples[data-active-sector="interior"]{--green:#aeb9ff}
.showcase-site[data-sector="garden"]{background-image:linear-gradient(90deg,rgba(17,31,22,.9),rgba(20,37,26,.58) 52%,rgba(14,31,22,.02)),url('https://images.unsplash.com/photo-1416879595882-3373a0480b5b?w=1500&q=90')}
.showcase-site[data-sector="build"]{background-image:linear-gradient(90deg,rgba(22,27,30,.94),rgba(31,38,38,.62) 52%,rgba(10,20,21,.08)),url('https://images.unsplash.com/photo-1600585154340-be6161a56a0c?w=1500&q=90')}
.showcase-site[data-sector="interior"]{background-image:linear-gradient(90deg,rgba(28,27,30,.91),rgba(38,36,39,.57) 52%,rgba(20,18,21,.08)),url('https://images.unsplash.com/photo-1600607687920-4e2a09cf159d?w=1500&q=90')}
.oldhero:has([data-old-title]){background-image:linear-gradient(#5558,#5558),url('https://images.unsplash.com/photo-1416879595882-3373a0480b5b?w=500&q=70')}
.showcase-examples[data-active-sector="build"] .oldhero{background-image:linear-gradient(#5558,#5558),url('https://images.unsplash.com/photo-1600585154340-be6161a56a0c?w=500&q=70')}
.showcase-examples[data-active-sector="interior"] .oldhero{background-image:linear-gradient(#5558,#5558),url('https://images.unsplash.com/photo-1600607687920-4e2a09cf159d?w=500&q=70')}

.showcase-stage.is-changing .showcase-site-copy{animation:copy-swap .48s cubic-bezier(.2,.75,.25,1)}
@keyframes copy-swap{from{opacity:.25;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}
.site-preloader{font-family:'Comfortaa',sans-serif}
.preloader-name{letter-spacing:-.04em;font-size:16px}
.preloader-name span{margin-left:3px;color:#777f78}
.preloader-orbit{width:24px;height:24px;border:2px solid #e0e2dc;border-top-color:#687cff;border-right-color:#ff8300;border-radius:50%;animation:preloader-spin .68s linear infinite}
@keyframes preloader-spin{to{transform:rotate(360deg)}}
@media(max-width:650px){.showcase-top{height:58px;gap:8px}.showcase-slider{gap:4px}.slider-choice{min-height:30px;padding:0 8px;gap:0}.slider-choice span:last-child{display:none}.slider-choice span:first-child{font-size:9px}.slider-arrow{width:30px;min-height:30px}.showcase-edition{display:none}}
@media(prefers-reduced-motion:reduce){.showcase-stage.is-changing .showcase-site-copy{animation:none}.slider-choice,.slider-arrow{transition:none}}

/* Split the hero intro from the branch example slider */
.showcase-hero{padding-bottom:clamp(48px,6vw,82px)}
.showcase-examples{position:relative;isolation:isolate;color:#202329}








.showcase-examples .showcase-stage{box-shadow:0 22px 65px #2222}
.showcase-examples .showcase-before .oldhero{background-image:linear-gradient(#5558,#5558),url('https://images.unsplash.com/photo-1416879595882-3373a0480b5b?w=500&q=70')}
.showcase-examples[data-active-sector="build"] .showcase-before .oldhero{background-image:linear-gradient(#5558,#5558),url('https://images.unsplash.com/photo-1600585154340-be6161a56a0c?w=500&q=70')}
.showcase-examples[data-active-sector="interior"] .showcase-before .oldhero{background-image:linear-gradient(#5558,#5558),url('https://images.unsplash.com/photo-1600607687920-4e2a09cf159d?w=500&q=70')}

@media(max-width:650px){.showcase-hero{padding-bottom:48px}}

.showcase-examples{background:none;margin:40px 20px;padding:0;border-radius:0;overflow:visible}
.showcase-example-footer{height:auto;min-height:68px;display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:5px;padding:15px;border-top:1px solid #20232924;border-bottom:1px solid #20232924;background:black;}
.showcase-example-footer .showcase-edition{color:#737773}
@media(max-width:650px){.showcase-examples{margin:28px 9px}.showcase-example-footer{min-height:58px;gap:8px;margin-top:12px;padding:12px 0}}

/* Distinct palette for each branch showcase */
.showcase-examples[data-active-sector="garden"]{--green:#cfff87;--sector-accent:#cfff87;--sector-soft:#e3edca;--sector-ink:#253426;--sector-surface:#e4e7dd;--sector-after:#323d30}
.showcase-examples[data-active-sector="build"]{--green:#ff963d;--sector-accent:#ff963d;--sector-soft:#f2dfca;--sector-ink:#39291e;--sector-surface:#e8e0d7;--sector-after:#493629}
.showcase-examples[data-active-sector="interior"]{--green:#aeb9ff;--sector-accent:#aeb9ff;--sector-soft:#e0e4ff;--sector-ink:#292c43;--sector-surface:#e4e4ec;--sector-after:#343449}
.showcase-examples .slider-choice.active{background:var(--sector-accent);border-color:var(--sector-accent);color:var(--sector-ink)}
.showcase-examples .slider-choice.active span:first-child{color:var(--sector-ink)}
.showcase-examples .showcase-side{background:var(--sector-surface)}
.showcase-examples .showcase-after{background:var(--sector-after)}
.showcase-examples .showcase-site-nav b span,.showcase-examples .showcase-site-copy>span:first-child{color:var(--sector-accent)}
.showcase-examples .showcase-site-copy h2 em{color:var(--sector-accent)}
.showcase-examples .site-mock-cta{background:var(--sector-accent);color:var(--sector-ink)}
.showcase-examples .showcase-site-footer{background:var(--sector-soft);color:var(--sector-ink)}
.showcase-examples .showcase-bottom a{color:var(--sector-accent)}
.showcase-examples .slider-choice:hover,.showcase-examples .slider-arrow:hover{background:var(--sector-accent);border-color:var(--sector-accent);color:var(--sector-ink)}
.showcase-examples .showcase-site-nav mark{background:var(--sector-accent);color:var(--sector-ink)}

/* A live mobile companion to the selected desktop design */
.showcase-hero[data-active-sector="build"]{--green:#ff963d}
.showcase-hero[data-active-sector="interior"]{--green:#aeb9ff}
.showcase-hero .showcase-title{align-items:center;gap:clamp(28px,5vw,80px)}
.showcase-hero .showcase-title>div:first-child{flex:1;min-width:0}
.hero-phone-wrap{width:clamp(230px,27vw,340px);display:flex;justify-content:center;align-self:stretch;align-items:center;perspective:1000px;flex:none}
.hero-phone{position:relative;width:min(100%,275px);height:clamp(410px,39vw,510px);padding:8px;border:2px solid #7b7d80;border-radius:43px;background:#090a0c;box-shadow:0 32px 70px #0008,0 0 0 1px #ffffff2b inset;transform:rotateY(-10deg) rotateZ(2deg);animation:phone-float 6s ease-in-out infinite}
.phone-screen{position:relative;width:100%;height:100%;overflow:hidden;border-radius:34px;background:#f5f3ed;color:#202329;--green:#cfff87}
.showcase-hero[data-active-sector="build"] .phone-screen{--green:#ff963d}
.showcase-hero[data-active-sector="interior"] .phone-screen{--green:#aeb9ff}
.phone-status{position:relative;z-index:3;height:32px;display:flex;align-items:center;justify-content:space-between;padding:0 14px;color:#fff;font:700 8px Arial,sans-serif;background:#22282b}
.phone-status>span:last-child{font-size:7px;letter-spacing:.04em}
.phone-island{position:absolute;left:50%;top:6px;transform:translateX(-50%);width:74px;height:19px;background:#050607;border-radius:14px}
.phone-site-nav{height:39px;padding:0 13px;display:flex;align-items:center;justify-content:space-between;background:#22282b;color:white}
.phone-site-nav b{font-size:9px;letter-spacing:.08em}
.phone-site-nav>span{font-size:16px;line-height:1}
.phone-visual{height:59%;position:relative;display:flex;align-items:end;background-position:center;background-size:cover;background-color:#283a2f}
.phone-visual:before{content:"";position:absolute;inset:0;background:rgba(12,20,16,.43)}
.phone-screen[data-sector="garden"] .phone-visual{background-image:url('https://images.unsplash.com/photo-1416879595882-3373a0480b5b?w=700&q=85')}
.phone-screen[data-sector="build"] .phone-visual{background-image:url('https://images.unsplash.com/photo-1600585154340-be6161a56a0c?w=700&q=85')}
.phone-screen[data-sector="interior"] .phone-visual{background-image:url('https://images.unsplash.com/photo-1600607687920-4e2a09cf159d?w=700&q=85')}
.phone-visual-copy{position:relative;z-index:1;padding:0 17px 18px;color:#fff}
.phone-visual-copy>span{font-size:6px;font-weight:800;letter-spacing:.14em;color:black;}
.phone-visual-copy h2{font:400 26px/.98 Georgia,serif;letter-spacing:-.055em;margin:10px 0 8px}
.phone-visual-copy h2 em{color:var(--green)}
.phone-visual-copy p{font-size:8px;line-height:1.55;color:#f0f0eb;margin:0 0 11px;max-width:210px}
.phone-cta{display:inline-block;background:var(--green);color:#1b1f26;padding:7px 10px;border-radius:30px;font-size:7px;font-weight:900}
.phone-work{padding:12px 14px;background:#f8f7f2}
.phone-work>span{display:block;font-size:6px;letter-spacing:.12em;font-weight:900;color:#7a8078}
.phone-work>b{display:block;margin-top:5px;font:400 13px/1.1 Georgia,serif;color:#252a28}
.phone-work-image{height:47px;margin-top:9px;border-radius:4px;background-image:url('https://images.unsplash.com/photo-1600607687920-4e2a09cf159d?w=600&q=75');background-position:center 55%;background-size:cover}
@keyframes phone-float{0%,100%{transform:rotateY(-10deg) rotateZ(2deg) translateY(0)}50%{transform:rotateY(-7deg) rotateZ(1deg) translateY(-8px)}}
@media(max-width:950px){.hero-phone-wrap{width:clamp(205px,30vw,275px)}.hero-phone{height:440px}.showcase-hero .showcase-title{gap:20px}}
@media(max-width:650px){.showcase-hero .showcase-title{display:grid;grid-template-columns:1fr;gap:18px}.hero-phone-wrap{width:100%;height:306px;overflow:visible;align-self:center}.hero-phone{width:222px;height:424px;transform:scale(.72) rotateZ(2deg);transform-origin:top center}.phone-work-image{height:38px}}
@media(prefers-reduced-motion:reduce){.hero-phone{animation:none;transform:none}}
.showcase-hero .showcase-title h1 em span{color:#cfff87;transition:color .45s ease}
.showcase-hero[data-active-sector="build"] .showcase-title h1 em span{color:#ff963d}
.showcase-hero[data-active-sector="interior"] .showcase-title h1 em span{color:#aeb9ff}
@media(prefers-reduced-motion:reduce){.showcase-hero .showcase-title h1 em span{transition:none}}

/* mooierzo.nl brand accents */
:root{--dark:#12365b;--green:#b7e8f5;--bg:#f5f8fb;--muted:#65788b;--line:#e0e8ef}
.section-kicker,.price-tag{color:#168eb8}.hero h1 em,.section-heading h2 em,.pricing h2 em,.lead-content h2 em{color:#168eb8}.green-dot,.dot-live{background:#19a7d2}.button.primary,.nav-cta{background:#12365b}.button.primary:hover{background:#174a78}.nav-cta span{color:#70d6ee}.statement{background:#12365b}.statement em{color:#9fe7f6}.asterisk{color:#9fe7f6}.step-number,.lead-form label>span:not(.optional){color:#138eb8}.showcase-edition{color:#537187}.brand-logo,.footer-logo{object-fit:contain}

/* Brighter, more playful section styling below the showcase */
#werkwijze.steps.section-wrap{max-width:1320px;padding-top:clamp(82px,10vw,138px);padding-bottom:clamp(82px,10vw,138px)}
#werkwijze .section-kicker{color:#168eb8}
#werkwijze .section-heading h2 em{color:#1687ff}
#werkwijze .step-grid{gap:16px;margin-top:48px;border:0}
#werkwijze .step-grid article,#werkwijze .step-grid article+article{min-height:265px;padding:27px 27px 29px;border:1px solid #dceaf4;border-radius:20px;background:linear-gradient(145deg,#fff 8%,#f4fbff 100%);box-shadow:0 12px 36px #12365b0b;transition:transform .28s cubic-bezier(.2,.8,.2,1),box-shadow .28s,border-color .28s}
#werkwijze .step-grid article:hover{transform:translateY(-8px) rotate(-.6deg);border-color:#9bdff0;box-shadow:0 22px 50px #1687ff18}
#werkwijze .step-grid article:nth-child(2):hover{transform:translateY(-8px) rotate(.6deg)}
#werkwijze .step-number{display:inline-flex;align-items:center;justify-content:center;width:38px;height:28px;border-radius:20px;background:#e5f8fd;color:#087eaa;font-size:10px}
#werkwijze .step-icon{display:grid;place-items:center;width:54px;height:54px;margin:25px 0 20px;border-radius:17px;background:#eaf5ff;color:#1478f4!important;font-size:29px;transition:transform .28s}
#werkwijze .step-grid article:nth-child(2) .step-icon{background:#e3fbfa;color:#079da9!important}
#werkwijze .step-grid article:nth-child(3) .step-icon{background:#eaf0ff;color:#315fe9!important}
#werkwijze .step-grid article:hover .step-icon{transform:rotate(-9deg) scale(1.08)}
#werkwijze .step-grid h3{font-size:21px}
#werkwijze .step-grid p{color:#66798d;font-size:13px}
.statement{isolation:isolate;overflow:hidden;max-width:1320px;margin:10px auto 22px;padding:clamp(92px,11vw,150px) 28px;border-radius:30px;background:linear-gradient(115deg,#092957 4%,#105cb6 57%,#08a9ce 100%);box-shadow:0 24px 70px #12365b24}
.statement:before{inset:auto auto -53% -8%;width:60%;height:110%;border-radius:50%;background:#16d5ed2b;filter:blur(42px);animation:blob-drift 18s ease-in-out infinite alternate}
.statement:after{content:"";position:absolute;z-index:-1;right:-4%;top:-42%;width:min(46vw,520px);aspect-ratio:1;border:1px solid #ffffff38;border-radius:50%;box-shadow:0 0 0 28px #ffffff0c,0 0 0 60px #ffffff08;pointer-events:none}
.statement .asterisk{color:#8cf1f1;font-size:28px;animation:asterisk-turn 24s linear infinite}
.statement blockquote{max-width:980px;font-size:clamp(37px,5.6vw,78px);line-height:1.04}
.statement blockquote em{color:#a7f5f5}
#prijzen.pricing.section-wrap{max-width:1320px;gap:clamp(50px,8vw,120px);padding-top:clamp(95px,11vw,145px);padding-bottom:clamp(95px,11vw,145px)}
#prijzen .section-kicker,.price-tag{color:#1687c8}
#prijzen h2 em{color:#1687ff}
#prijzen .price-card{position:relative;overflow:hidden;padding:clamp(30px,4.3vw,52px);border:1px solid #dceaf4;border-radius:24px;background:linear-gradient(145deg,#fff 0%,#f2f9ff 100%);box-shadow:0 24px 68px #12365b13}
#prijzen .price-card:before{content:"";position:absolute;z-index:0;inset:-110px -80px auto auto;width:250px;height:250px;border-radius:50%;background:#b9f3f5;filter:blur(2px);opacity:.55}
#prijzen .price-card:after{display:none}
#prijzen .price-card>*{position:relative;z-index:1}
#prijzen .price-tag{display:inline-block;padding:9px 12px;border-radius:20px;background:#e5f8fd;letter-spacing:.12em}
#prijzen .price-major{margin-top:24px;color:#092957;font-size:clamp(58px,6vw,80px)}
#prijzen .price-line{color:#12365b}
#prijzen .price-card ul{border-top:1px solid #dceaf4;padding-top:14px}
#prijzen .price-card li{color:#35516d}
#prijzen .price-card li::first-letter{color:#078fb5}
#prijzen .price-card>.button{border-radius:12px;box-shadow:0 12px 26px #1478f42b}
#aanvragen.lead-section{isolation:isolate;overflow:hidden;background:linear-gradient(118deg,#092957 0%,#104f9b 56%,#087ca8 100%);color:#fff;padding-top:clamp(82px,10vw,135px);padding-bottom:clamp(82px,10vw,135px);gap:clamp(45px,8vw,110px)}
#aanvragen.lead-section:after{width:520px;height:520px;right:-190px;top:-230px;border:1px solid #b4f6ff55;border-radius:50%;background:transparent;box-shadow:0 0 0 35px #b4f6ff12,0 0 0 78px #b4f6ff0a;filter:none;animation:ring-breathe 8s ease-in-out infinite}
#aanvragen .section-kicker{color:#8df0f1}
#aanvragen .lead-content h2 em{color:#8df0f1}
#aanvragen .lead-content>p,#aanvragen .lead-perks{color:#d4e9f7}
#aanvragen .lead-perks span{color:#d4e9f7!important}
#aanvragen .lead-perks span::first-letter{color:#8df0f1}
#aanvragen .lead-form{position:relative;border:1px solid #ffffffa8;border-radius:22px;background:#fff;box-shadow:0 28px 80px #041b3d40;padding:clamp(25px,4vw,42px)}
#aanvragen .lead-form input:not([type=checkbox]),#aanvragen .lead-form textarea{border-color:#d8e5ef;border-radius:10px;color:#12365b;outline-color:#1687ff}
#aanvragen .lead-form input:focus,#aanvragen .lead-form textarea:focus{border-color:#1687ff!important;box-shadow:0 0 0 4px #1687ff20}
#aanvragen .lead-form .button{border-radius:11px;background:linear-gradient(100deg,#1264d8,#089ec2);box-shadow:0 11px 26px #1264d82e}
#aanvragen .lead-form small{color:#73879b}
footer{max-width:1320px;padding-top:54px;color:#62788d}
footer .footer-copy{border-color:#dce8f1}
footer .footer-links a:hover{color:#087eaa}
@media(max-width:760px){#werkwijze .step-grid{grid-template-columns:1fr;gap:12px}#werkwijze .step-grid article,#werkwijze .step-grid article+article{min-height:0;padding:22px;border:1px solid #dceaf4;border-radius:17px}#werkwijze .step-icon{margin:18px 0 15px}.statement{margin:0 12px 10px;border-radius:23px;padding:82px 22px}.statement:after{width:75vw;right:-25%;top:-30%}#prijzen .price-card{border-radius:20px}#aanvragen.lead-section{gap:34px}}
@media(prefers-reduced-motion:reduce){#werkwijze .step-grid article:hover,#werkwijze .step-grid article:nth-child(2):hover{transform:none}#werkwijze .step-grid article:hover .step-icon{transform:none}}

/* Bold brand direction: richer contrast, electric blue and a more editorial rhythm */
:root{--ink:#071b35;--blue:#1677f8;--cyan:#16c7d7;--ice:#eaf7fc;--paper:#f5f9fc}
body:has(.showcase-hero){background-color:var(--paper);background-image:radial-gradient(ellipse at 85% 20%,#d8f5fc7a,transparent 30%),linear-gradient(90deg,#0b3c6808 1px,transparent 1px),linear-gradient(#0b3c6808 1px,transparent 1px);background-size:auto,44px 44px,44px 44px}
.topbar{height:94px}
.topbar nav{gap:clamp(20px,3vw,42px)}
.topbar nav>a:not(.nav-cta){font-weight:700;color:#38516c;transition:color .2s}
.topbar nav>a:not(.nav-cta):hover{color:var(--blue)}
.nav-cta{background:var(--ink);box-shadow:0 8px 22px #071b3529;transition:transform .2s,box-shadow .2s,background .2s}
.nav-cta:hover{transform:translateY(-2px);background:#0c3971;box-shadow:0 12px 28px #071b3540}
.showcase-hero{position:relative;isolation:isolate;margin:0 clamp(12px,2vw,30px);border:1px solid #ffffff18;border-radius:26px;background:radial-gradient(ellipse at 88% 10%,#0c9dc83b 0%,transparent 30%),radial-gradient(ellipse at 60% 100%,#1264c42b 0%,transparent 42%),linear-gradient(127deg,#06172f 0%,#0a2344 54%,#07182d 100%);box-shadow:0 30px 90px #092e5b24}
.showcase-hero:after{z-index:-1;left:auto;right:4%;top:12%;width:34vw;height:34vw;max-width:560px;max-height:560px;border:1px solid #29d3e82b;background:radial-gradient(circle at 40% 40%,#16c7d719,transparent 65%);box-shadow:0 0 0 24px #16c7d70a,0 0 90px #1677f81a;filter:none;animation:hero-glow 12s ease-in-out infinite alternate}
.showcase-top{border-color:#d9f5ff22}
.showcase-edition{color:#91aecb}
.showcase-title{padding-top:clamp(65px,7.2vw,112px);padding-bottom:clamp(42px,5vw,75px)}
.showcase-title h1{font-size:clamp(74px,9.4vw,174px);line-height:.82;letter-spacing:-.105em;max-width:900px}
.showcase-title h1 em{font-style:normal;font-family:'Comfortaa',sans-serif;font-weight:500;letter-spacing:-.105em}
.showcase-title h1 em span{color:#31d8e6;text-shadow:0 0 38px #1bcce544}
.showcase-title p{max-width:580px;color:#a8bed3;font-size:clamp(15px,1.2vw,18px);line-height:1.75}
.showcase-title p strong{color:white}
.showcase-actions{gap:18px}
.showroom-btn,.button.showroom-btn{position:relative;overflow:hidden;border:1px solid #74f3f054;border-radius:12px;background:linear-gradient(105deg,#16c7d7,#147af5);color:#041b35;padding:19px 25px;box-shadow:0 12px 36px #08a5d544;font-weight:900;transition:transform .25s,box-shadow .25s,filter .25s}
.showroom-btn:hover{transform:translateY(-3px);filter:saturate(1.12);box-shadow:0 18px 45px #08a5d566}
.showroom-btn span{font-size:17px}
.showcase-actions>span{color:#90aac3}
.hero-phone{border-color:#7aa0c5;background:#041326;box-shadow:0 35px 85px #0009,0 0 0 1px #dffaff24 inset}
.showcase-stage{border:1px solid #fff;box-shadow:0 35px 90px #071b3533,0 4px 18px #071b3518}
.showcase-examples{max-width:1540px;margin:clamp(34px,5vw,70px) auto 0;padding:0 clamp(16px,3vw,44px)}
.showcase-examples .showcase-stage{border-radius:16px}
.showcase-example-footer{background:transparent;border-top:0;border-bottom:1px solid #0b3c681c;padding:17px 4px}
.showcase-example-footer .showcase-edition{color:#66819a}
.showcase-examples .slider-arrow,.showcase-examples .slider-choice{border-color:#cddce8;background:#fff;color:#29445e;min-height:38px}
.showcase-examples .slider-choice.active{background:#e9f8fc;border-color:#a7e8f0;color:#07567a}
.showcase-examples .slider-choice.active span:first-child{color:#1687be}
.showcase-examples .slider-choice:hover,.showcase-examples .slider-arrow:hover{background:#e9f8fc;border-color:#65d3e2;color:#07567a}
.showcase-examples .slider-arrow{width:38px}
.showcase-examples .showcase-stage-head{background:#fbfdff}
.showcase-examples .showcase-before{border-radius:5px;box-shadow:0 18px 50px #061b3530}
.showcase-examples .showcase-site{background-position:center}
.showcase-bottom{color:#59728a}
.showcase-bottom b{color:#153b61}
.showcase-bottom a{font-weight:800}
.button.primary{background:linear-gradient(105deg,#1264d8,#078eae);box-shadow:0 10px 26px #1264d82b}
.button.primary:hover{background:linear-gradient(105deg,#0b55c3,#047c9b);box-shadow:0 14px 30px #1264d840}
.button.outline{border-color:#c9dce8;color:#12365b}
.brand-logo{width:clamp(160px,19vw,235px)}
footer .footer-logo{display:block;width:clamp(160px,19vw,235px);max-width:100%;height:auto}
@keyframes hero-glow{from{transform:translateY(-2%) scale(.94);opacity:.65}to{transform:translateY(3%) scale(1.06);opacity:1}}
@media(max-width:950px){.showcase-title h1{font-size:clamp(66px,10vw,120px)}.showcase-hero:after{width:50vw;height:50vw;right:0;top:24%}}
@media(max-width:650px){.topbar{height:74px}.showcase-hero{margin:0 9px;border-radius:19px}.showcase-title{padding-top:45px}.showcase-title h1{font-size:clamp(58px,13.2vw,88px);line-height:.88}.showcase-title p{font-size:14px}.showcase-actions{align-items:flex-start}.showroom-btn,.button.showroom-btn{padding:16px 20px}.showcase-examples{margin:26px auto 0;padding:0 10px}.showcase-example-footer{background:transparent}.showcase-examples .slider-arrow{width:30px;min-height:30px}.showcase-examples .slider-choice{min-height:30px}.hero-phone{box-shadow:0 24px 55px #0009,0 0 0 1px #dffaff24 inset}}
@media(prefers-reduced-motion:reduce){.showcase-hero:after{animation:none}}

/* Make the process section a confident, full-width brand moment */
#werkwijze.steps.section-wrap{position:relative;isolation:isolate;overflow:hidden;width:100%;max-width:none;margin:clamp(76px,9vw,126px) 0 38px;padding:clamp(72px,8vw,112px) max(24px,calc((100vw - 1320px)/2)) clamp(78px,9vw,124px);background:radial-gradient(ellipse at 85% 4%,#1176a82b,transparent 34%),linear-gradient(124deg,#06172f 0%,#092346 62%,#071b35 100%);color:#fff}
#werkwijze.steps.section-wrap:before{content:"";position:absolute;z-index:-1;right:-10%;bottom:-74%;width:min(62vw,850px);aspect-ratio:1;border:1px solid #38d6e52c;border-radius:50%;box-shadow:0 0 0 32px #38d6e50a,0 0 0 76px #38d6e507,0 0 100px #1687ff1c;pointer-events:none}
#werkwijze .section-kicker{display:inline-flex;align-items:center;gap:10px;margin:0 0 22px;padding:9px 13px;border:1px solid #52d9e339;border-radius:30px;background:#16c7d712;color:#8cebf1;font-size:10px;letter-spacing:.16em}
#werkwijze .section-kicker:before{content:"";width:7px;height:7px;border-radius:50%;background:#35deeb;box-shadow:0 0 13px #35deeb}
#werkwijze .section-heading{display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,330px);align-items:end;gap:40px;margin-top:8px}
#werkwijze .section-heading h2{max-width:850px;margin:0;color:#fff;font-size:clamp(52px,7.2vw,100px);line-height:.91;letter-spacing:-.09em}
#werkwijze .section-heading h2 em{color:#43dce9;font-family:'Comfortaa',sans-serif;font-style:normal;font-weight:500;letter-spacing:-.09em}
#werkwijze .section-heading>p{max-width:310px;margin:0 0 5px;color:#abc1d8;font-size:14px;line-height:1.8}
#werkwijze .step-grid{position:relative;gap:14px;margin-top:clamp(42px,5vw,68px);border:0}
#werkwijze .step-grid article,#werkwijze .step-grid article+article{min-height:286px;padding:27px 27px 30px;border:1px solid #b7ddf226;border-radius:20px;background:linear-gradient(145deg,#ffffff12,#ffffff06);box-shadow:0 16px 46px #00000014;backdrop-filter:blur(12px);text-align:left}
#werkwijze .step-grid article:after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(135deg,#1bc9dd12,transparent 48%);opacity:0;transition:opacity .3s;pointer-events:none}
#werkwijze .step-grid article:hover,#werkwijze .step-grid article:nth-child(2):hover{transform:translateY(-9px);border-color:#45d9e870;background:linear-gradient(145deg,#113d63,#0a2a4d);box-shadow:0 24px 55px #0005}
#werkwijze .step-grid article:hover:after{opacity:1}
#werkwijze .step-number{position:absolute;z-index:0;top:10px;right:18px;left:auto;width:auto;height:auto;padding:0;background:transparent;color:#d2efff12;font-size:clamp(78px,9vw,124px);font-weight:800;letter-spacing:-.11em;line-height:1}
#werkwijze .step-icon{position:relative;z-index:1;display:grid;place-items:center;width:58px;height:58px;margin:17px 0 28px;border:1px solid #42d9e646;border-radius:18px;background:linear-gradient(145deg,#28d0df2a,#1677f82a);color:#70e5ee!important;font-size:30px;box-shadow:0 10px 28px #16c7d71a;transition:transform .3s,box-shadow .3s}
#werkwijze .step-grid article:nth-child(2) .step-icon,#werkwijze .step-grid article:nth-child(3) .step-icon{background:linear-gradient(145deg,#28d0df2a,#1677f82a);color:#70e5ee!important}
#werkwijze .step-grid article:hover .step-icon{transform:translateY(-3px) rotate(-7deg);box-shadow:0 12px 32px #16c7d738}
#werkwijze .step-grid h3{position:relative;z-index:1;margin-bottom:12px;color:#fff;font-size:22px;letter-spacing:-.055em}
#werkwijze .step-grid p{position:relative;z-index:1;max-width:300px;margin-bottom:0;color:#a9bfd5;font-size:13px;line-height:1.8}
@media(max-width:760px){#werkwijze.steps.section-wrap{margin:64px 0 28px;padding:70px 22px 76px}#werkwijze .section-heading{grid-template-columns:1fr;gap:20px}#werkwijze .section-heading h2{font-size:clamp(48px,11vw,72px)}#werkwijze .section-heading>p{max-width:480px}#werkwijze .step-grid{grid-template-columns:1fr;gap:12px;margin-top:34px}#werkwijze .step-grid article,#werkwijze .step-grid article+article{min-height:0;padding:22px;border-radius:17px}#werkwijze .step-icon{width:50px;height:50px;margin:10px 0 20px}#werkwijze .step-number{top:4px;right:18px;font-size:88px}}
@media(prefers-reduced-motion:reduce){#werkwijze .step-grid article:after{transition:none}}

/* Comfortaa typography across mooierzo.nl and its preview/admin interface */
body{font-family:'Comfortaa',sans-serif}
button,input,textarea,select{font-family:inherit}
h1,h2,h3,h4,blockquote,.showcase-title h1,.showcase-site-copy h2{font-family:'Comfortaa',sans-serif}

/* Give the process section its own bright, graphic visual language */
#werkwijze.steps.section-wrap{background:radial-gradient(ellipse at 92% 4%,#c8f3fa 0%,transparent 29%),linear-gradient(135deg,#eef8fc 0%,#e6f3fb 52%,#f6fbfe 100%);color:#071b35}
#werkwijze.steps.section-wrap:before{right:-8%;bottom:-64%;border-color:#1477f81c;box-shadow:0 0 0 30px #1477f808,0 0 0 72px #1477f805,0 0 100px #16c7d71c}
#werkwijze .section-kicker{border-color:#1687f830;background:#fff;color:#1167c7;box-shadow:0 6px 18px #0a397610}
#werkwijze .section-kicker:before{background:#1687f8;box-shadow:0 0 12px #1687f866}
#werkwijze .section-heading h2{color:#081f3a}
#werkwijze .section-heading h2 em{color:#087fea}
#werkwijze .section-heading>p{color:#526c85}
#werkwijze .step-grid article,#werkwijze .step-grid article+article{border-color:#d5e7f2;background:#fff;box-shadow:0 16px 45px #0b3d6810;backdrop-filter:none}
#werkwijze .step-grid article:after{background:linear-gradient(135deg,#e4f9fc 0%,transparent 60%)}
#werkwijze .step-grid article:hover,#werkwijze .step-grid article:nth-child(2):hover{border-color:#70d5e5;background:#fff;box-shadow:0 24px 54px #1677f822}
#werkwijze .step-number{color:#1477f817}
#werkwijze .step-icon{border-color:#bdebf1;background:linear-gradient(145deg,#e2fbfc,#e7f0ff);color:#087fea!important;box-shadow:none}
#werkwijze .step-grid article:nth-child(2) .step-icon,#werkwijze .step-grid article:nth-child(3) .step-icon{background:linear-gradient(145deg,#e2fbfc,#e7f0ff);color:#087fea!important}
#werkwijze .step-grid h3{color:#0a2543}
#werkwijze .step-grid p{color:#61788e}
#werkwijze .step-grid article:hover .step-icon{box-shadow:0 12px 30px #16c7d72a}
#werkwijze .step-grid{isolation:isolate}
#werkwijze .step-grid:before{content:"";position:absolute;z-index:-1;left:9%;right:9%;top:55px;height:1px;background:linear-gradient(90deg,#1687f829,#13afc54d,#1687f829)}
@media(max-width:760px){#werkwijze .step-grid:before{display:none}#werkwijze.steps.section-wrap{background:radial-gradient(ellipse at 100% 0%,#c8f3fa 0%,transparent 34%),linear-gradient(150deg,#eef8fc,#f6fbfe)}}

/* Comfortaa also covers the interface mockup typography */
.phone-visual-copy h2{font:800 26px/.98 'Comfortaa',sans-serif;letter-spacing:-.06em}
.phone-work>b{font:700 13px/1.1 'Comfortaa',sans-serif}
.new-demo h3,.oldhero b{font-family:'Comfortaa',sans-serif}
#werkwijze .step-grid:before{top:73px}
#werkwijze .step-number{color:#1477f82b}

/* Preview templates keep their page markup in views/preview.html */
.preview-live,.preview-upload{display:none}
.preview-frame-wrap[data-preview-kind="upload"] [data-capture-view]{display:none}
.preview-frame-wrap[data-preview-kind="demo"] .preview-live{display:block}
.preview-frame-wrap[data-preview-kind="upload"] .preview-upload{display:block}
.preview-frame-wrap[data-preview-kind="upload"][data-capture-view="pending"] [data-capture-view="pending"],
.preview-frame-wrap[data-preview-kind="upload"][data-capture-view="error"] [data-capture-view="error"]{display:grid}
.preview-frame-wrap[data-preview-kind="upload"][data-capture-view="ready"] [data-capture-view="ready"]{display:block}
.preview-frame-wrap[data-preview-kind="upload"][data-capture-view="ready"]:not(.mobile) .desktop-shot{display:block}
.preview-frame-wrap[data-preview-kind="upload"][data-capture-view="ready"]:not(.mobile) .mobile-shot{display:none}
.preview-frame-wrap[data-preview-kind="upload"][data-capture-view="ready"].mobile .desktop-shot{display:none}
.preview-frame-wrap[data-preview-kind="upload"][data-capture-view="ready"].mobile .mobile-shot{display:block}


/* Clear weight contrast: light reading text, bold display and action text */
body{font-weight:400}
p,li,small,footer,.showcase-title p,.showcase-bottom,.section-heading>p,.pricing>div:first-child>p,.lead-content>p,.step-grid p,.frame-footer,.preview-intro>p{font-weight:400}
h1,h2,h3,h4,.price-major,.offer-price{font-weight:700}
h1 em,h2 em,blockquote em,.showcase-title h1 em,.showcase-site-copy h2 em{font-weight:500}
.section-kicker,.price-tag,.step-number,.topbar nav,.nav-cta,.button,.lead-form>label,.inline-form>label,.admin-login label{font-weight:700}
.optional,.lead-form .consent,.lead-form small{font-weight:400}

/* Hold the preview only after it reaches the top area, then ease it to center. */
.preview-stage.is-scroll-locked{position:fixed;z-index:100;top:var(--preview-stage-top);left:var(--preview-stage-left);width:var(--preview-stage-width);max-height:calc(100vh - 24px);overflow:hidden;margin:0;transform:none;transition:top .32s cubic-bezier(.2,.8,.2,1),left .32s cubic-bezier(.2,.8,.2,1)}
.preview-stage.is-scroll-locked.is-scroll-centered{top:var(--preview-stage-centered-top);left:var(--preview-stage-centered-left)}

.ai-redesign-panel{border-color:#b9d9e7;box-shadow:0 14px 44px #0a416b0b}
.admin-upload textarea,.ai-regenerate-form textarea{width:100%;min-height:100px;resize:vertical;border:1px solid #dce4db;background:#fff;border-radius:8px;padding:13px;color:#1a3424;outline-color:#1687be}
.ai-redesign-panel #ai-redesign-jobs{display:grid;gap:18px;margin-top:28px}
.ai-job{padding:21px;border:1px solid #e0e8e7;border-radius:12px;background:#fbfcfa}
.ai-job-heading{display:flex;align-items:start;justify-content:space-between;gap:20px}
.ai-job-heading h3{margin:0 0 8px;font-size:20px}
.ai-job-heading p{font-size:12px;color:#718177;overflow-wrap:anywhere}
.ai-job-heading p a{text-decoration:underline}
.ai-job-actions{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:8px;flex:none}
.ai-edit-form{display:block;margin:18px 0;padding:18px;border:1px solid #dce8ee;border-radius:10px;background:#f6fbfd}
.ai-edit-form[hidden]{display:none!important}
.ai-edit-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px;margin-bottom:15px}
.ai-edit-fields>label{display:grid;align-content:start;gap:7px;min-width:0;font-size:12px;font-weight:700}
.ai-edit-fields>label>input,.ai-edit-fields textarea{width:100%;min-height:43px;padding:10px 12px;border:1px solid #dce4db;border-radius:8px;background:#fff;color:#263b4a;font:inherit}
.ai-edit-fields textarea{min-height:92px;resize:vertical}
.ai-edit-instructions{grid-column:1/-1}
.ai-edit-form>.form-message{margin-top:10px}
.ai-job-delete{min-height:36px;padding:9px 13px;border-color:#efcfcc;color:#a64438;background:#fff;font-size:11px}
.ai-job-delete:not(:disabled):hover{background:#fff1ef}
.ai-status{display:inline-flex;flex:none;padding:8px 11px;border:1px solid #cfe0e6;border-radius:99px;background:#edf7fa;color:#315c6d;font-size:11px}
.ai-status-review{background:#f0f5e9;border-color:#d7e5c5;color:#49633c}
.ai-status-approved{background:#e9f6ef;border-color:#cae6d6;color:#34714c}
.ai-status-error{background:#fff0ee;border-color:#f0cfca;color:#a64438}
.ai-error{padding:13px 15px;border-radius:8px;background:#fff1ef;color:#9a382e;font-size:13px;line-height:1.6}
.ai-artifact-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;margin:18px 0}
.ai-artifact{min-width:0;padding:12px;border:1px solid #e4e9e4;border-radius:9px;background:#fff}
.ai-artifact h4{margin:0 0 10px;font-size:12px}
.ai-artifact-image{height:370px;overflow:auto;border:1px solid #edf0ed;border-radius:5px;background:#edf0ed;scrollbar-width:thin}
.ai-artifact-image img{display:block;width:100%;height:auto}
.ai-artifact>.admin-action{display:inline-block;margin-top:10px;text-decoration:none}
.ai-generate-form{margin:18px 0;padding:18px;border:1px solid #dce8ee;border-radius:10px;background:#f6fbfd}
.ai-generate-form h4{margin:0 0 6px}
.ai-template-field{display:grid;gap:7px;font-size:12px;font-weight:700}
.ai-template-field select{width:100%;min-height:43px;padding:9px 12px;border:1px solid #dce4db;border-radius:8px;background:#fff;color:#263b4a;font:inherit}
.ai-generate-form>label:not(.ai-crawl-page){display:grid;gap:8px;margin:14px 0;font-size:12px;font-weight:700}
.ai-generate-form textarea{width:100%;min-height:90px;resize:vertical;border:1px solid #dce4db;background:#fff;border-radius:8px;padding:13px;color:#1a3424;outline-color:#1687be;font:inherit}
.ai-crawl-pages{display:grid;gap:7px;margin:14px 0 18px}
.ai-crawl-page{display:grid;grid-template-columns:20px minmax(0,1fr);align-items:start;gap:10px;width:100%;padding:12px;border:1px solid #e4ecef;border-radius:8px;background:#fff;cursor:pointer}
.ai-crawl-page>input[type="checkbox"]{display:block;flex:none;width:18px!important;min-width:18px;max-width:18px!important;height:18px;min-height:18px!important;margin:2px 0 0;padding:0!important;border:0;accent-color:#1389bd}
.ai-crawl-page>span{display:block;width:100%;min-width:0;overflow:hidden}
.ai-crawl-page strong,.ai-crawl-page small{display:block}
.ai-crawl-page strong{font-size:13px;line-height:1.45;overflow-wrap:anywhere}
.ai-crawl-page small{margin-top:4px;color:#718177;font-size:11px;line-height:1.55;overflow-wrap:anywhere;word-break:break-word}
.ai-profile{max-height:360px;overflow:auto;padding:12px;border-radius:7px;background:#f4f7f8;white-space:pre-wrap;overflow-wrap:anywhere;font-size:11px}
.ai-source-details{margin:15px 0;color:#58706c;font-size:12px}
.ai-source-grid{margin-top:8px}
.ai-regenerate-form{display:flex;align-items:end;flex-wrap:wrap;gap:12px;padding-top:15px;border-top:1px solid #e6ebe6}
.ai-regenerate-form label{display:grid;flex:1 1 100%;gap:8px;font-size:12px;font-weight:700}
.ai-regenerate-form textarea{min-height:72px}
.ai-regenerate-form .form-message{flex-basis:100%}
.ai-published{font-size:13px;color:#3c6a4e}
.ai-published a{text-decoration:underline;font-weight:700}
@media(max-width:800px){.ai-artifact-grid{grid-template-columns:1fr}.ai-artifact-image{height:420px}}
@media(max-width:650px){.ai-job-heading{flex-direction:column}.ai-job-actions{justify-content:flex-start}.ai-generate-form{padding:14px}.ai-edit-fields{grid-template-columns:1fr}.ai-edit-instructions{grid-column:auto}}
/* Sector-specific design references in admin */
.ai-template-field .ai-style-example{display:block;width:100%;max-width:380px;max-height:270px;object-fit:cover;object-position:top;border-radius:12px;margin:10px 0 0;border:1px solid rgba(50,60,65,.13)}
.ai-template-field .ai-style-example[hidden]{display:none}