*{box-sizing:border-box}body{margin:0}.site-shell-header{position:relative;inset:auto;z-index:20;background:#071f29;color:#fff;display:flex;align-items:center;justify-content:space-between;gap:32px;height:86px;width:100%;padding:0 max(28px,calc((100vw - 1370px)/2));border-bottom:1px solid #28404b;font-family:Arial,Helvetica,sans-serif}.site-wordmark{color:#fff!important;text-decoration:none;font-size:18px;font-weight:800;letter-spacing:1px;white-space:nowrap}.site-wordmark span{font-size:10px;color:#79d9ee;letter-spacing:1.4px;margin-left:5px}.site-shell-header nav{display:flex;align-items:center;gap:30px;font-size:14px}.site-shell-header nav a{color:#b5c8ce;text-decoration:none;padding:12px 0;border-bottom:2px solid transparent}.site-shell-header nav a:hover,.site-shell-header nav a[aria-current]{color:#fff;border-color:#79d9ee}.site-shell-header nav a[href="prijsindicatie.html"]{border:1px solid #56717b;border-radius:28px;padding:12px 18px}.site-shell-header nav a[href="prijsindicatie.html"][aria-current]{border-color:#79d9ee}.menu-toggle{display:none}.site-shell-footer{display:flex;justify-content:space-between;align-items:center;gap:28px;padding:36px max(28px,calc((100vw - 1370px)/2));background:#071f29;color:#acc2ca;font:12px Arial,Helvetica,sans-serif}.site-shell-footer div{display:flex;gap:20px;flex-wrap:wrap}.site-shell-footer a{text-decoration:none}.site-shell-footer a:hover{color:#79d9ee}.skip-link{position:fixed;top:-100px;left:16px;z-index:100;background:white;color:#09232c;padding:12px}.skip-link:focus{top:10px}.content-page{background:#f2f6f6}.hero{min-height:auto;padding-top:80px}.page-intro{background:radial-gradient(ellipse at 90% 0,#164958,#09252f 65%);color:white;padding:76px max(28px,calc((100vw - 1370px)/2))}.page-intro h1{font-size:clamp(42px,6vw,78px);letter-spacing:-3px;line-height:1.05;margin:0}.page-intro h1 span{color:#87a8b1}.page-intro>p:last-child{max-width:570px;line-height:1.8;color:#b5c8ce;margin-top:26px}.site-cta{display:flex;justify-content:space-between;align-items:center;gap:35px;background:#e1eff2;padding:55px max(28px,calc((100vw - 1370px)/2))}.site-cta h2{font-size:clamp(28px,3vw,42px);letter-spacing:-1.4px;line-height:1.1;margin:0 0 16px}.site-cta p{max-width:600px;line-height:1.7}.site-button{display:inline-flex;align-items:center;justify-content:center;gap:25px;background:#0b2a35;border-radius:32px;color:#fff;text-decoration:none;padding:17px 25px;font:500 14px Arial;white-space:nowrap;border:0;cursor:pointer}.site-button:hover{background:#175266}.site-button span{color:#79d9ee}.sample-media{display:grid;grid-template-columns:1fr 1.3fr;gap:60px;align-items:center}.sample-media h2{font-size:clamp(32px,4vw,52px);line-height:1.1;letter-spacing:-2px}.sample-media p{line-height:1.8;color:#52656d}.sample-media figure{margin:0}.sample-media video{width:100%;border-radius:12px}.sample-media figcaption{font-size:12px;color:#63777d;margin-top:10px}.sample-media .site-button{margin-top:24px}.calculator-page .intro>p{max-width:410px}.calculator-page .site-shell-header nav{letter-spacing:0}.quote-section{min-height:70vh}.quote-form input,.quote-form textarea{font-size:16px}#project-summary{border-bottom:1px solid #ffffff26;padding-bottom:18px;color:#c9e9f0;line-height:1.7;font-size:14px;white-space:pre-line}#contact-status{font-size:13px;line-height:1.6;color:#79d9ee}#model-mount{min-width:0}.calculator-page #done .site-button{margin:22px 0}.calculator-page #preview{display:none}.calculator-page #preview[open]{display:block}@media(max-width:860px){.site-shell-header{height:76px;padding:0 20px}.menu-toggle{display:flex;gap:16px;align-items:center;background:transparent;border:1px solid #56717b;border-radius:24px;color:white;padding:11px 15px;font:14px Arial;cursor:pointer}.site-shell-header nav{display:none;position:absolute;top:76px;left:0;right:0;background:#071f29;padding:16px 24px 24px;flex-direction:column;align-items:stretch;gap:5px;box-shadow:0 12px 20px #071f2930}.site-shell-header nav.is-open{display:flex}.site-shell-header nav a{padding:14px}.site-shell-footer{flex-wrap:wrap}.hero{padding-top:50px}.sample-media{grid-template-columns:1fr;gap:28px}.site-cta{flex-direction:column;align-items:start}.page-intro{padding:50px 24px}.site-shell-footer div{flex-direction:column;gap:12px}}@media(max-width:420px){.site-wordmark{font-size:16px}.site-wordmark span{display:block;font-size:9px;margin:3px 0 0}.site-shell-footer{padding:28px 20px}.site-shell-header{gap:12px}}@media(prefers-reduced-motion:reduce){.intro-video{display:none}}

.quote-copy h1{letter-spacing:-.057em;margin:0;max-width:8ch;font-size:clamp(2.8rem,5.2vw,5.2rem);font-weight:570;line-height:1.06}#clear-summary{width:fit-content;background:transparent;border:0;padding:5px 0;color:#79d9ee;text-decoration:underline;cursor:pointer;font:13px Arial}@media(max-width:860px){.quote-copy h1{max-width:12ch}}

/* Calm homepage invitation. */
.home-cta{background:#f2f6f6;border-top:1px solid #dce5e7;padding-top:38px;padding-bottom:38px}
.home-cta h2{font-size:clamp(24px,2.4vw,32px);letter-spacing:-.8px;font-weight:550;margin:0 0 10px}
.home-cta p{font-size:15px;color:#63777d;margin:0;line-height:1.65}
.home-cta-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.home-cta .site-button{min-height:50px;padding:14px 22px}
.home-cta .site-button-outline{color:#0b2a35;background:transparent;border:1px solid #aec1c8}
.home-cta .site-button-outline span{color:#35768a}
.home-cta .site-button-outline:hover{background:#e7eff1;border-color:#6c929e}
@media(max-width:560px){.home-cta{gap:22px}.home-cta-actions{width:100%}.home-cta .site-button{flex:1;gap:12px;padding-inline:17px}}

.completion-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:26px}
.calculator-page #done .completion-actions .site-button{margin:0;min-height:50px;padding:14px 20px;font-size:13px}
.calculator-page #done .restart-button{background:transparent;color:#476873;border:1px solid #cbd9de}
.calculator-page #done .restart-button:hover{background:#f2f7f8;border-color:#8baab5;color:#0b2a35}
@media(max-width:560px){.completion-actions{flex-direction:column;align-items:stretch}.completion-actions .site-button{width:100%}}

.image-credit{font-size:10px;color:#7a919a;margin:14px 0 0;line-height:1.5}.image-credit a{text-decoration:underline;text-underline-offset:2px}.image-credit a:hover{color:#176b80}

/* Vector arrows render consistently on iOS, Android and desktop. */
.skyscan-arrow{display:inline-block;width:20px;height:20px;flex-shrink:0;vertical-align:middle;pointer-events:none}
.site-button .skyscan-arrow,#next .skyscan-arrow{color:#79d9ee}.soft-note>span .skyscan-arrow{width:30px;height:30px}.site-shell-footer>a:last-child{display:flex;align-items:center;gap:9px}.model-load-error{color:#c3dde5;line-height:1.7;padding:35px;border:1px solid #476671;border-radius:12px}

.customer-choice{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:0 0 24px;padding:20px 24px;border:1px solid #dce5e7;border-radius:14px;background:#fff}
.customer-choice-title{font-size:14px;font-weight:600;color:#163944}.customer-choice p{font-size:12px;color:#63777d;margin:6px 0 0}
.customer-switch{display:flex;gap:4px;padding:4px;border:1px solid #dce5e7;border-radius:30px;background:#f2f6f6;margin:0;min-width:0}
.customer-switch label{margin:0;position:relative;cursor:pointer}.customer-switch input{position:absolute;opacity:0;width:1px;height:1px;padding:0;min-width:0}
.customer-switch label span{display:block;padding:13px 22px;border-radius:24px;color:#607c86;font-size:13px;font-weight:500}
.customer-switch input:checked+span{background:#0b2a35;color:#fff}.customer-switch input:focus-visible+span{outline:3px solid #1684a1;outline-offset:2px}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.counter-icon{width:18px;height:18px;vertical-align:middle}.counter button{display:grid;place-items:center}
@media(max-width:560px){.customer-choice{align-items:stretch;flex-direction:column;padding:18px;gap:14px}.customer-switch label{flex:1;text-align:center}.customer-switch label span{padding:13px 14px}.price-line{flex-wrap:wrap}.price-line strong{font-size:clamp(38px,11vw,55px)}}

/* Introductory offer, with the same calm cyan accents as the calculator. */
.starter-offer{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin:26px 0 8px}.starter-offer[hidden],.discount-note[hidden]{display:none}
.starter-offer s{font-size:clamp(24px,3vw,34px);font-weight:400;color:#a8c1ca;text-decoration-thickness:1.5px;letter-spacing:-1px}
.discount-badge{display:inline-flex;border:1px solid #79d9ee55;background:#79d9ee15;color:#a4e8f5;border-radius:24px;padding:8px 12px;font-size:12px;font-weight:600;white-space:nowrap}
#breakdown .discount-row{color:#a4e8f5;border-top:1px solid #ffffff20;margin-top:12px;padding-top:14px}.discount-note{color:#a8c1ca;font-size:11px;line-height:1.6;margin:14px 0 0}.service small{line-height:1.65}.contact-field-hint{display:block;font-size:12px;color:#afc6ce;font-weight:400;line-height:1.5;margin-top:7px}
@media(max-width:560px){.starter-offer{gap:10px;margin-top:22px}.starter-offer s{font-size:27px}.discount-badge{font-size:11px;padding:7px 10px}}

/* Keep contact fields aligned when one field has explanatory text. */
.quote-form .form-row{align-items:start;grid-template-columns:repeat(2,minmax(0,1fr))}.quote-form label{align-content:start;min-width:0}.quote-form input{height:54px;min-width:0}.quote-form .form-submit{flex-wrap:wrap;align-items:center}.quote-form .form-button{flex-shrink:0;white-space:nowrap;gap:18px}.quote-form .form-button svg{flex-shrink:0}.quote-form .form-submit p{flex:1 1 200px}
@media(max-width:680px){.quote-form .form-row{grid-template-columns:1fr}.quote-form .form-submit{align-items:stretch}.quote-form .form-button{width:100%;justify-content:center}.quote-form .form-submit p{flex:auto}}

/* Quiet motion: short, one-shot animations without moving the page layout. */
@keyframes skyscan-enter{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:no-preference){
 .intro,.page-intro,.quote-copy{animation:skyscan-enter .5s ease-out both}
 .panel:not([hidden]),#done:not([hidden]){animation:skyscan-enter .28s ease-out both}
 .menu-toggle[aria-expanded="true"]+nav{animation:skyscan-enter .2s ease-out both}
 .site-button,.form-button,#next,.building,.service,.quick button,.counter button,.customer-switch label span{transition:background-color .2s ease,border-color .2s ease,box-shadow .2s ease,transform .2s ease,color .2s ease}
 .skyscan-arrow{transition:transform .2s ease}
 .building .tick{transition:opacity .18s ease,transform .18s ease}
 .building.selected .tick{transform:scale(1)}
 .service:has(input:checked){box-shadow:0 0 0 1px #26869c22}
 .site-button:active,.form-button:active,#next:active,.counter button:not(:disabled):active,.quick button:active{transform:scale(.98)}
 .steps button{transition:color .2s ease,border-color .2s ease}
}
@media(hover:hover) and (prefers-reduced-motion:no-preference){
 .site-button:hover,.form-button:hover,#next:not(:disabled):hover{transform:translateY(-2px)}
 .site-button:hover .skyscan-arrow,#next:hover .skyscan-arrow{transform:translateX(3px)}
 .building:hover,.service:hover{transform:translateY(-2px);box-shadow:0 5px 15px #09232c09}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}.intro,.page-intro,.quote-copy,.panel,#done,.site-button,.form-button,#next,.building,.service,.quick button,.counter button,.customer-switch label span,.skyscan-arrow,.steps button{animation:none!important;transition:none!important}}

/* Primary navigation action. */
.site-shell-header nav a[href="prijsindicatie.html"]{display:inline-flex;align-items:center;justify-content:center;gap:10px;background:#79d9ee;color:#09232c;border:1px solid #79d9ee;font-weight:600;padding:12px 18px;white-space:nowrap}
.site-shell-header nav a[href="prijsindicatie.html"]:hover{background:#a1e6f3;border-color:#a1e6f3;color:#09232c}
.site-shell-header nav a[href="prijsindicatie.html"][aria-current]{box-shadow:0 0 0 3px #79d9ee25}
@media(min-width:861px) and (max-width:1100px){.site-shell-header{gap:20px}.site-shell-header nav{gap:18px}}
@media(max-width:860px){.site-shell-header nav a[href="prijsindicatie.html"]{margin-top:8px}}

/* Compact examples layout and prominent detail photographs. */
.examples-page .section{padding-top:52px;padding-bottom:52px}.examples-page .sample-media{gap:36px}.examples-page .application-card{min-height:0;display:flex;flex-direction:column;padding:28px}.examples-page .application-card h3{margin-top:32px}.examples-page .application-card a{margin-top:auto;padding-top:24px}.examples-page .project-photo-grid figure:first-child{grid-column:auto}.examples-page .project-photo-grid figure:last-child{grid-column:1/-1}.examples-page .project-photo-grid{gap:24px;margin-top:28px}
/* A slightly larger next-step action, retaining the existing style. */
.calculator-page #next{min-height:56px;padding:18px 28px;font-size:15px;font-weight:600;gap:26px}.calculator-page #next .skyscan-arrow{width:24px;height:24px}
/* Match mobile browser chrome and the safe area to the dark header. */
html{background:#071f29}.site-shell-header{padding-top:env(safe-area-inset-top);height:calc(86px + env(safe-area-inset-top))}
.nav-compact .menu-toggle{display:flex;position:fixed;right:max(20px,env(safe-area-inset-right));top:calc(16px + env(safe-area-inset-top));z-index:102;align-items:center;gap:14px;background:#071f29;color:#fff;border:1px solid #547884;border-radius:30px;padding:14px 20px;box-shadow:0 6px 24px #071f2933;font:600 14px Arial;cursor:pointer}
.nav-compact .site-shell-header nav{display:none}.nav-compact .site-shell-header nav.is-open{display:flex;position:fixed;top:calc(76px + env(safe-area-inset-top));right:20px;left:auto;width:min(310px,calc(100vw - 40px));max-height:calc(100dvh - 100px - env(safe-area-inset-top));overflow:auto;flex-direction:column;align-items:stretch;gap:5px;background:#071f29;border:1px solid #39515d;border-radius:18px;padding:16px;box-shadow:0 12px 32px #071f2940;z-index:101}.nav-compact .site-shell-header nav a{padding:13px}.nav-compact .site-shell-header nav a[href="prijsindicatie.html"]{margin-top:8px}
@media(prefers-reduced-motion:no-preference){.nav-compact .menu-toggle{animation:skyscan-enter .22s ease-out}}
@media(max-width:860px){.site-shell-header{height:calc(76px + env(safe-area-inset-top))}.site-shell-header nav{top:calc(76px + env(safe-area-inset-top))}}
@media(max-width:680px){.examples-page .section{padding-top:34px;padding-bottom:34px}.examples-page .project-photo-grid figure:last-child{grid-column:auto}.calculator-page #next{width:100%}}

/* Navigation folds into a persistent three-line control. */
.site-shell-header{position:sticky;top:0;transition:background .45s ease,border-color .45s ease;isolation:isolate}
.site-shell-header .site-wordmark{transition:opacity .3s ease,transform .45s cubic-bezier(.22,1,.36,1)}
.nav-compact .site-shell-header{background:transparent;border-color:transparent;pointer-events:none}
.nav-compact .site-shell-header .site-wordmark{opacity:0;transform:translateY(-12px);pointer-events:none}
.nav-compact .menu-toggle,.nav-compact #site-menu.is-open{pointer-events:auto}
.menu-toggle,.nav-compact .menu-toggle{width:58px;height:48px;padding:0;align-items:center;justify-content:center;animation:none;border-radius:26px;transition:background .3s ease,box-shadow .3s ease}
.menu-toggle:hover{background:#164958}
.menu-toggle:focus-visible{outline:3px solid #79d9ee;outline-offset:4px}
.menu-lines{width:22px;height:18px;display:flex;flex-direction:column;justify-content:space-between}
.menu-lines i{display:block;width:22px;height:2px;border-radius:2px;background:#79d9ee;transition:transform .35s ease,opacity .2s ease}
.menu-toggle[aria-expanded="true"] .menu-lines i:first-child{transform:translateY(8px) rotate(45deg)}
.menu-toggle[aria-expanded="true"] .menu-lines i:nth-child(2){opacity:0;transform:scaleX(.2)}
.menu-toggle[aria-expanded="true"] .menu-lines i:last-child{transform:translateY(-8px) rotate(-45deg)}
.nav-fold-ghost{position:fixed;z-index:105;display:flex;align-items:center;justify-content:center;gap:10px;pointer-events:none;color:#b5c8ce;font:14px Arial;text-decoration:none;white-space:nowrap;transform-origin:center}
.nav-fold-ghost:last-child{border-radius:28px}
@media(min-width:861px) and (prefers-reduced-motion:no-preference){.nav-compact .menu-toggle{animation:fold-button-in .55s cubic-bezier(.22,1,.36,1) both}@keyframes fold-button-in{0%,30%{opacity:0;transform:scale(.55)}100%{opacity:1;transform:scale(1)}}}
@media(prefers-reduced-motion:reduce){.site-shell-header,.site-shell-header .site-wordmark,.menu-lines i,.menu-toggle{transition:none!important;animation:none!important}}

/* Keep the original header space dark while the sticky navigation folds away. */
body.content-page,body.calculator-page{background-image:linear-gradient(#071f29,#071f29);background-repeat:no-repeat;background-size:100% calc(86px + env(safe-area-inset-top))}
@media(max-width:860px){body.content-page,body.calculator-page{background-size:100% calc(76px + env(safe-area-inset-top))}}

/* Shared heading typography: same family and weight, with breathable tracking. */
.hero h1,.page-intro h1,.quote-copy h1,.calculator-page h1{font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-weight:560;letter-spacing:-.025em;line-height:1.08}
.section-heading h2,.model-copy h2,.why-panel h2,.quote-copy h2,.sample-media h2,.pilot-copy h2,.pilot-story h2,.calculator-page h2{letter-spacing:-.025em;line-height:1.14}
@media(max-width:680px){.hero h1,.page-intro h1,.quote-copy h1,.calculator-page h1{letter-spacing:-.02em;overflow-wrap:normal}}
