:root{--navy:#082f4d;--blue:#0878b8;--sky:#edf7fc;--orange:#ff4b13;--ink:#0d2b43;--muted:#516a7b;--line:#dce8ef;--white:#fff}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;color:var(--ink);font:400 16px/1.45 "DM Sans",sans-serif;background:#fff}a{text-decoration:none;color:inherit}img{display:block;width:100%}button{font:inherit}.shell{width:min(1320px,calc(100% - 64px));margin:auto}.skip-link{position:fixed;top:-80px;left:15px;background:#fff;padding:10px 15px;z-index:100}.skip-link:focus{top:15px}
.topbar{height:34px;background:#0a3554;color:#fff;font-size:.76rem}.topbar .shell{height:100%;display:flex;align-items:center;justify-content:space-between}.topbar a{font-weight:700}
.header{height:78px;position:sticky;top:0;z-index:30;background:rgba(255,255,255,.98);border-bottom:1px solid #e8eff3}.header.scrolled{box-shadow:0 6px 25px rgba(8,47,77,.1)}.nav{height:100%;display:flex;align-items:center;gap:25px}.logo{display:flex;align-items:center;gap:10px;line-height:1.05;font-weight:600;white-space:nowrap}.logo-symbol{position:relative;font:800 34px/1 Manrope;color:#075c8d;letter-spacing:-8px;padding-right:7px}.logo-symbol em{font-style:normal;font-size:13px;color:#22a6ca;letter-spacing:0}.nav nav{display:flex;align-items:center;justify-content:center;gap:24px;margin-left:auto}.nav nav a{font-size:.76rem;font-weight:700;white-space:nowrap;position:relative}.nav nav a:after{content:"";position:absolute;height:2px;left:0;right:100%;bottom:-18px;background:var(--orange);transition:.2s}.nav nav a:hover:after,.nav nav a.active:after{right:0}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 24px;border:0;border-radius:7px;background:var(--orange);color:#fff;font-weight:700;font-size:.9rem;box-shadow:0 7px 18px rgba(255,75,19,.18);transition:.2s}.btn:hover{background:#e93d08;transform:translateY(-1px)}.btn-small{min-height:41px;padding-inline:17px;font-size:.78rem}.menu{display:none;background:none;border:0;padding:5px}.menu i{display:block;width:25px;height:2px;margin:5px;background:var(--navy)}
.hero{height:575px;position:relative;overflow:hidden;background:#f8fbfd}.hero-image{position:absolute;inset:0 0 0 45%;background:url("https://warmtepomp-vm.com/wp-content/uploads/2026/09/hero-heat-pump-1.png") center/cover no-repeat}.hero-fade{position:absolute;inset:0;background:linear-gradient(90deg,#fff 0%,#fff 37%,rgba(255,255,255,.85) 48%,rgba(255,255,255,0) 67%)}.hero-inner{height:100%;display:flex;align-items:center;position:relative;z-index:2}.hero-copy{width:610px}.kicker{text-transform:uppercase;color:#2790c2;letter-spacing:.09em;font-weight:700;font-size:.72rem;margin:0 0 17px}.hero h1{font:800 clamp(2.55rem,4vw,4rem)/1.05 Manrope;margin:0 0 22px;letter-spacing:-.045em;color:var(--navy)}.lead{font-size:1rem;max-width:580px;margin:0;color:#1c3d54}.actions{display:flex;gap:14px;margin:30px 0 36px}.btn-ghost{background:#fff;color:#075786;border:1px solid #1687bf;box-shadow:none}.btn-ghost:hover{background:#075786;color:#fff}.hero-trust{display:flex;gap:45px}.hero-trust>div{display:flex;gap:12px;align-items:center}.hero-trust>div>span{font-size:1.65rem;color:var(--navy)}.hero-trust p{display:grid;margin:0}.hero-trust b{font-size:.8rem}.hero-trust small{font-size:.67rem;color:var(--muted)}
.section{padding:42px 0}.card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:25px}.solution-card{border:1px solid var(--line);border-radius:10px;overflow:hidden;background:#fff}.solution-card img{height:220px;object-fit:cover}.solution-card>div{padding:23px}.solution-card h2{font:700 1.3rem Manrope;margin:0 0 8px;color:var(--navy)}.solution-card p{font-size:.9rem;color:var(--muted);margin:0 0 17px}.solution-card a{font-size:.84rem;color:#0077b7;font-weight:700}.service-wrap{padding:0 0 34px}.service-strip{display:grid;grid-template-columns:repeat(3,1fr);border-radius:11px;background:#edf7fc;padding:27px 22px}.service-strip article{display:flex;align-items:center;gap:20px;padding:0 28px;border-right:1px solid #bdddeb}.service-strip article:last-child{border:0}.service-strip article>span{font-size:2.2rem;color:#0987c2}.service-strip h3{font:700 1rem Manrope;margin:0 0 4px}.service-strip p{margin:0;color:var(--muted);font-size:.8rem}
.trust-section{background:#f2f8fb}.trust-grid{display:grid;grid-template-columns:1fr 1fr;min-height:390px}.trust-copy{padding:58px 70px 54px 0;align-self:center}.trust-copy h2,.brands h2,.section-title h2,.zone-copy h2,.faq-area h2,.contact-card h2{font:800 2.25rem/1.12 Manrope;letter-spacing:-.035em;color:var(--navy);margin:0 0 17px}.trust-copy>p:not(.kicker){max-width:590px;color:var(--muted);font-size:.92rem;margin-bottom:23px}.trust-photo{position:relative;min-height:390px}.trust-photo img{height:100%;position:absolute;object-fit:cover;object-position:center}.trust-photo:before{content:"";position:absolute;z-index:1;inset:0;background:linear-gradient(90deg,#f2f8fb,transparent 18%)}.trust-photo blockquote{position:absolute;z-index:2;right:28px;top:105px;background:#e5f2f8;color:#164b68;border-radius:10px;margin:0;padding:23px;font:600 1.18rem/1.55 cursive;transform:rotate(-4deg)}
.brands{padding:32px 0;background:#eaf5fb}.brands h2{font-size:1.75rem;margin-bottom:25px}.brand-row{display:grid;grid-template-columns:repeat(8,1fr);gap:14px}.brand-row span{height:72px;display:flex;align-items:center;justify-content:center;background:#fff;border:1px solid #dce9ef;border-radius:8px;font:800 1.05rem Manrope;text-align:center}.brand-row .green{color:#00856a}.brand-row .blue{color:#045898}.brand-row .cyan{color:#00a1d1}.brand-row .red{color:#df2626}.brand-row small{font-size:.58rem;line-height:1}
.projects{padding-top:40px}.section-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.section-title h2{font-size:1.75rem;margin:0}.section-title>a{color:#087bb6;font-size:.76rem;font-weight:700}.project-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:25px}.project{border:1px solid var(--line);border-radius:7px;overflow:hidden}.project img{height:215px;object-fit:cover}.project>div{padding:14px 20px}.project b{font-size:.82rem;color:#075b8d}.project p{font-size:.76rem;margin:7px 0 0}
.zones{padding:42px 0;background:#eaf5fb;overflow:hidden}.zone-grid{display:grid;grid-template-columns:.85fr 1.25fr .42fr;align-items:center;gap:38px}.zone-copy h2{font-size:1.9rem}.zone-copy p{max-width:430px;font-size:.9rem}.towns{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:22px}.towns span{background:#fff;text-align:center;padding:10px 8px;border-radius:10px;font-size:.82rem;font-weight:700}.map{height:270px;position:relative}.map-shape{position:absolute;background:#cae3f0;border:1px solid #fff;transform:rotate(15deg);border-radius:28%}.map-shape.a{width:290px;height:220px;left:75px;top:25px}.map-shape.b{width:230px;height:180px;left:245px;top:45px;transform:rotate(-18deg)}.map-shape.c{width:180px;height:155px;left:25px;top:70px;transform:rotate(-20deg)}.map-shape.d{width:150px;height:120px;left:205px;top:100px;background:#58a8cc}.map-core{position:absolute;left:220px;top:115px;color:#fff;font-size:.78rem;font-weight:700;z-index:3}.map>span{position:absolute;z-index:3;font-size:.74rem;font-weight:700}.zaventem{left:340px;top:65px}.tervuren{left:375px;top:125px}.halle{left:105px;top:190px}.waterloo{left:280px;top:208px}.map>span::first-letter{color:#0784bc}.hand-note{font:600 1rem/1.5 cursive;color:#164b68;transform:rotate(-5deg)}
.faq-section{padding:42px 0 32px}.faq-layout{display:grid;grid-template-columns:1.42fr .92fr;gap:45px}.accordion article{border:1px solid var(--line);border-radius:6px;margin-bottom:10px;overflow:hidden}.accordion button{display:flex;justify-content:space-between;align-items:center;width:100%;border:0;background:#fff;padding:14px 18px;color:var(--ink);font-size:.8rem;text-align:left;cursor:pointer}.accordion button b{font-size:1.2rem;color:#075b8d;transition:.2s}.accordion article>div{display:grid;grid-template-rows:0fr;transition:.25s}.accordion article>div p{overflow:hidden;margin:0;padding:0 18px;color:var(--muted);font-size:.78rem}.accordion article.open>div{grid-template-rows:1fr}.accordion article.open>div p{padding-bottom:14px}.accordion article.open button b{transform:rotate(45deg)}.contact-card{display:grid;grid-template-columns:1.4fr .6fr;overflow:hidden;border-radius:10px;background:#eef7fb;min-height:285px}.contact-card>div{padding:25px}.contact-card h2{font-size:1.65rem}.contact-card p{font-size:.8rem;color:var(--muted)}.contact-card .btn{width:100%;margin-top:8px;min-height:43px;font-size:.76rem}.contact-card>span{background:url("https://warmtepomp-vm.com/wp-content/uploads/2026/09/climatisation-1.png") 55% center/cover no-repeat}
footer{padding:37px 0 22px;background:#072d49;color:#d8e4eb}.footer-grid{display:grid;grid-template-columns:1.1fr 1fr 1.25fr .65fr;gap:50px}.footer-logo{color:#fff}.footer-logo .logo-symbol{color:#fff}.footer-grid h3{font:700 .82rem Manrope;color:#fff;margin:0 0 16px}.footer-grid p,.footer-grid a:not(.logo){display:block;font-size:.76rem;margin:0 0 10px}.footer-bottom{display:flex;justify-content:space-between;border-top:1px solid rgba(255,255,255,.14);padding-top:18px;margin-top:28px;font-size:.66rem}.footer-bottom nav{display:flex;gap:25px}
.reveal{opacity:0;transform:translateY(16px);transition:.5s}.reveal.visible{opacity:1;transform:none}
@media(max-width:1120px){.shell{width:min(100% - 40px,1320px)}.nav nav{gap:13px}.nav nav a{font-size:.69rem}.nav-cta{display:none}.hero-copy{width:570px}.brand-row{grid-template-columns:repeat(4,1fr)}}
@media(max-width:850px){html{scroll-padding-top:72px}.topbar{display:none}.header{height:72px}.menu{display:block;margin-left:auto}.nav nav{position:absolute;left:0;right:0;top:71px;display:grid;background:#fff;padding:15px 25px 25px;transform:scaleY(0);opacity:0;pointer-events:none;transform-origin:top;transition:.2s;border-bottom:1px solid var(--line)}.nav nav.open{transform:scaleY(1);opacity:1;pointer-events:auto}.nav nav a{padding:8px;font-size:.9rem}.nav nav a:after{display:none}.hero{height:auto;min-height:690px}.hero-image{inset:0 0 43% 0}.hero-fade{background:linear-gradient(0deg,#fff 0%,#fff 48%,rgba(255,255,255,0) 75%)}.hero-inner{align-items:end}.hero-copy{width:100%;padding:270px 0 42px}.hero h1 br{display:none}.card-grid,.project-grid{grid-template-columns:1fr}.solution-card{display:grid;grid-template-columns:.85fr 1.15fr}.solution-card img{height:100%}.service-strip,.trust-grid,.zone-grid,.faq-layout{grid-template-columns:1fr}.service-strip article{border-right:0;border-bottom:1px solid #bdddeb;padding:18px 10px}.service-strip article:last-child{border-bottom:0}.trust-copy{padding:48px 0}.trust-photo{min-height:360px}.zone-grid{gap:25px}.map{margin:auto;width:min(520px,100%)}.hand-note{text-align:center}.footer-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.shell{width:calc(100% - 28px)}.hero-copy{padding-top:235px}.hero h1{font-size:2.25rem}.hero-trust,.actions{display:grid;gap:12px}.actions .btn{width:100%}.solution-card{display:block}.solution-card img{height:210px}.service-strip{padding:12px 18px}.trust-copy h2{font-size:2rem}.brand-row{grid-template-columns:repeat(2,1fr)}.project img{height:200px}.map{transform:scale(.75);transform-origin:left center;margin-right:-100px}.contact-card{grid-template-columns:1fr}.contact-card>span{display:none}.footer-grid{grid-template-columns:1fr}.footer-bottom{display:grid;gap:12px}.footer-bottom nav{flex-wrap:wrap;gap:13px}.towns{grid-template-columns:repeat(2,1fr)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}}

/* Consistent line icons and readable service-area map. */
.icon-defs{position:absolute;width:0;height:0;overflow:hidden}
.icon{display:inline-block;flex:none;width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;vertical-align:-.25em}
.topbar .shell>span,.topbar .shell>a{display:inline-flex;align-items:center;gap:6px}
.topbar .icon{width:14px;height:14px}
.btn{gap:9px}.btn .icon{width:17px;height:17px}
.hero-trust>div>.icon{width:30px;height:30px;color:var(--navy)}
.service-strip article>.icon{width:39px;height:39px;color:#0987c2;stroke-width:1.5}
.solution-card a,.section-title>a{display:inline-flex;align-items:center;gap:6px}
.solution-card a .icon,.section-title>a .icon{width:15px;height:15px}
.project b{display:inline-flex;align-items:center;gap:5px}.project b .icon{width:15px;height:15px}
.footer-grid a:not(.logo),.footer-grid p{display:flex;align-items:center;gap:7px}.footer-grid .icon{width:16px;height:16px}
.zone-grid{grid-template-columns:.85fr 1.25fr .42fr;gap:38px}
.zone-copy .zone-more{margin:18px 0 0;font-size:.8rem;line-height:1.55;color:var(--muted)}
.map-panel{min-width:0;padding:10px;background:#fff;border:1px solid #cfe5f0;border-radius:14px;box-shadow:0 14px 34px rgba(8,47,77,.08)}
.map-scroll{overflow-x:auto;border-radius:9px;scrollbar-color:#99c5dc #edf7fc;scrollbar-width:thin}
.map-scroll img{display:block;width:100%;height:auto;border-radius:9px}
.map-panel>p{font-size:.73rem;color:#536e7f;margin:8px 4px 1px}
@media(max-width:850px){.zone-grid{grid-template-columns:1fr}.map-panel{max-width:720px;width:100%;margin:auto}}
@media(max-width:560px){.hero-trust>div>.icon{width:24px;height:24px}.map-panel{padding:7px}.map-scroll img{width:680px;max-width:none}.map-panel>p{font-size:.71rem}.zone-copy .zone-more{font-size:.78rem}}
