/* Blink: duidelijke secties, rustige lijnen en gerichte fotohoeken. */
:root{--soft:#dcebf3;--line:#cdd8dc}
body{overflow-wrap:break-word}
.wrap{max-width:1240px}
.section{padding-top:82px;padding-bottom:82px}
header{border:0;background:var(--cream)}
.nav-wrap{height:82px}
.nav-wrap nav a[aria-current]{border:0;background:var(--blue);padding:8px 15px;border-radius:30px}
.button{border-radius:40px;border:1px solid var(--navy);padding:15px 26px;transition:background .2s,transform .2s}
.button:hover{background:#b3d1e1;transform:translateY(-2px)}
.header-cta{padding:11px 20px}
.label{letter-spacing:.025em;font-size:14px;display:inline-block;border:1px solid #20355645;border-radius:30px;padding:6px 14px;margin-bottom:22px;line-height:1.4}
.hero{grid-template-columns:1.1fr 1fr;grid-template-rows:auto auto;column-gap:40px;row-gap:28px;padding:48px 0 66px}
.hero-copy{padding:14px 0 0}
.hero h1{font-size:clamp(2.35rem,4.15vw,4rem);line-height:1.08}
.hero h1 span{background:var(--blue);color:var(--navy);padding:9px 15px 11px;border-radius:12px 12px 32px 12px;margin-left:-15px;margin-top:12px}
.hero-intro{font-size:17px;line-height:1.7;margin-top:23px}
.hero-image{grid-column:2;grid-row:1/3;min-height:490px;margin:0}
.hero-image img{border-radius:100px 24px 110px 24px;min-height:490px}
.hero>.actions{grid-column:1;grid-row:2;margin-top:0;padding-bottom:12px}
.secondary{display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--navy);border-radius:40px;padding:14px 21px;min-height:52px;line-height:1.4}
.secondary:hover{background:var(--soft)}
.actions{gap:12px}
.audiences{border-top:0}
.section-heading h2{line-height:1.1}
.audiences>.section-heading{padding-right:0}
.audience-grid{gap:38px 30px;counter-reset:audience}
.audience{counter-increment:audience}
.audience img,.audience.a1 img,.audience.a4 img,.audience.a5 img{border-radius:26px 26px 70px 26px}
.audience h3{display:flex;gap:12px;align-items:baseline;font-size:25px;line-height:1.25}
.audience h3:before{content:"0" counter(audience);font-size:13px;letter-spacing:0;font-weight:400;flex-shrink:0;color:var(--navy)}
.audience.a2{padding-top:60px}
.audience.a4{padding-top:48px}
.audience p{line-height:1.65}
.services{background:#faf8f3;border-top:1px solid #20355618}
.service-heading{display:flex;gap:30px;align-items:flex-start;justify-content:space-between;margin-bottom:54px;padding-bottom:36px;border-bottom:1px solid #20355626}
.service-heading h2{max-width:700px;width:70%}
.service,.service:nth-child(odd){gap:62px;margin-bottom:64px;align-items:center}
.service>img{height:460px;border-radius:26px 26px 80px 26px}
.service-copy{padding:0}
.number{display:block;width:auto;height:auto;border:0;border-radius:0;font-size:15px;letter-spacing:.06em;color:var(--navy);margin-bottom:20px}
.service h3{font-size:clamp(1.9rem,3vw,2.65rem)}
.service-scope{margin-top:20px}
.service-scope>li{font-size:15px;padding:7px 0}
.text-link{background:transparent;border:0;border-bottom:2px solid var(--blue);border-radius:0;padding:0 0 6px;margin-top:23px;line-height:1.4}
.text-link:hover{background:transparent;border-bottom-color:var(--navy)}
.process{background:var(--blue);border-radius:70px 70px 0 0}
.process-heading{gap:60px}
.steps{margin-top:48px;gap:30px}
.steps article{border-color:#20355655}
.steps span{color:var(--navy);font-size:82px}
.steps p,.process-heading p{color:var(--navy)}
.why{gap:64px}
.why>img{height:550px;border-radius:26px 100px 26px 26px}
.promises li{font-weight:400;padding:11px 0}
.promises li:first-child{border-top:1px solid var(--line)}
.contact{background:var(--soft);border-top:0;border-radius:70px 70px 0 0;padding-top:72px;padding-bottom:72px}
.contact h2{max-width:750px;margin:auto}
.contact .button{background:var(--blue)}
footer{padding-top:56px}
.footer-bottom{margin-top:40px}
dialog{border-radius:26px}
@media(max-width:1100px){.nav-wrap{gap:16px}.nav-wrap nav{gap:16px}.hero h1{font-size:4vw}.hero-image,.hero-image img{min-height:470px}.service,.service:nth-child(odd){gap:38px}.why{gap:40px}.service-heading h2{width:68%}}
@media(max-width:820px){.section{padding:62px 0}.nav-wrap{height:72px}.nav-wrap nav{border-radius:0 0 24px 24px}.nav-wrap nav a[aria-current]{padding:8px 15px}.hero{grid-template-columns:1fr;grid-template-rows:auto auto auto;padding:34px 0 48px;gap:28px}.hero h1{font-size:clamp(2.1rem,6.5vw,4rem)}.hero-copy{padding:0}.hero-image{grid-column:1;grid-row:2;min-height:0;height:390px;margin-right:0}.hero-image img{min-height:0;height:390px;border-radius:70px 20px 80px 20px}.hero>.actions{grid-column:1;grid-row:3;padding:0}.hero-intro{max-width:620px}.audience.a2,.audience.a4{padding-top:0}.service-heading{display:block}.service-heading h2{width:auto}.service>img{height:400px}.process{border-radius:44px 44px 0 0}.steps span{font-size:70px}.why>img{height:420px}.contact{border-radius:44px 44px 0 0}.five-groups .a5{gap:30px}.five-groups .a5 img{height:280px}}
@media(max-width:540px){.section{padding:48px 0}.hero h1{font-size:clamp(1.65rem,6.8vw,2.6rem)}.hero h1 span{padding:8px 10px 9px;margin-left:-8px;border-radius:9px 9px 23px 9px}.hero .label{font-size:12px;margin-bottom:20px}.hero-image,.hero-image img{height:300px}.hero>.actions{flex-direction:column;align-items:stretch;gap:12px}.hero>.actions a{width:100%}.label{margin-bottom:18px}.audience h3{font-size:24px}.audience img,.audience.a1 img,.audience.a4 img,.audience.a5 img,.five-groups .a5 img{height:270px;border-radius:22px 22px 50px 22px}.service,.service:nth-child(odd){gap:24px;margin-bottom:50px}.service>img{height:290px;border-radius:22px 22px 55px 22px}.service h3{font-size:29px}.service-heading{margin-bottom:34px}.service#bouw>img{height:auto}.number{margin-bottom:16px}.steps{gap:30px 22px}.steps span{font-size:61px}.why>img{height:360px;border-radius:22px 65px 22px 22px}.why{gap:28px}.contact h2{font-size:clamp(2.5rem,10vw,3.5rem)}.contact p:not(.label){font-size:17px}.footer-bottom{margin-top:30px}.button:hover{transform:none}}
@media(prefers-reduced-motion:reduce){.button{transition:none}.button:hover{transform:none}}


/* Rechte hoeken worden afgewisseld met één gerichte afronding. */
:root{--photo-corner:56px}
.hero-image img{border-radius:0 0 var(--photo-corner) 0}
.audience img,.audience.a1 img,.audience.a4 img,.audience.a5 img{border-radius:0 var(--photo-corner) 0 0}
.audience.a2 img,.audience.a4 img{border-radius:0 0 0 var(--photo-corner)}
.service>img{border-radius:0 var(--photo-corner) 0 0}
.service:nth-child(odd)>img{border-radius:0 0 var(--photo-corner) 0}
.why>img{border-radius:0 var(--photo-corner) 0 0}
.process{border-radius:0}
@media(max-width:540px){:root{--photo-corner:36px}.five-groups .a5 img{border-radius:0 var(--photo-corner) 0 0}}

/* Acties als tekstlinks: geen gevulde knoppen of afgeronde kaders. */
.label{display:block;width:max-content;max-width:100%;border:0;border-radius:0;padding:0;font-size:13px;letter-spacing:.06em}
.nav-wrap nav a[aria-current]{background:transparent;border:0;border-bottom:2px solid var(--blue);border-radius:0;padding:10px 0}
.button,.contact .button{background:transparent;border:0;border-bottom:2px solid var(--blue);border-radius:0;min-height:0;padding:8px 0;font-size:16px;line-height:1.5;transition:border-color .2s}
.button:hover,.contact .button:hover{background:transparent;border-bottom-color:var(--navy);transform:none}
.header-cta{font-size:14px;white-space:nowrap}
.secondary{background:transparent;border:0;border-bottom:1px solid var(--navy);border-radius:0;min-height:0;padding:8px 0;line-height:1.5}
.secondary:hover{background:transparent;border-bottom-color:#3b6d88}
.actions{gap:28px;align-items:center}
.hero h1 span{background:transparent;color:#3b6d88;border-radius:0;padding:0;margin-left:0}
@media(max-width:820px){.nav-wrap nav a[aria-current]{padding:10px 0}}
@media(max-width:540px){.header-cta{padding:7px 0;font-size:12px}.hero h1 span{padding:0;margin-left:0;border-radius:0}.hero>.actions{align-items:flex-start;gap:15px}.hero>.actions a{width:auto}.label{font-size:12px}}

/* Vaste uitlijning voor sectietitels, foto's en bijbehorende tekst. */
.service-heading{display:block;text-align:left}
.service-heading h2{width:100%;max-width:none}
.service-heading .label{margin-bottom:20px}
.audience-grid{align-items:start;row-gap:48px}
.audience.a1,.audience.a2,.audience.a3,.audience.a4,.audience.a5{padding-top:0}
.audience img,.audience.a1 img,.audience.a4 img,.audience.a5 img,.five-groups .a5 img{height:340px}
.audience h3:before{display:none}
.five-groups .a5{display:block}
.five-groups .a5 .audience-copy{padding-top:21px;max-width:620px}
.service,.service:nth-child(odd){align-items:start;grid-template-columns:1fr 1fr}
.service-copy{max-width:none}
.service>img{margin-top:0}
@media(max-width:820px){.audience img,.audience.a1 img,.audience.a4 img,.audience.a5 img,.five-groups .a5 img{height:270px}.service-heading h2{width:100%}}
@media(max-width:540px){.audience-grid{row-gap:36px}.audience img,.audience.a1 img,.audience.a4 img,.audience.a5 img,.five-groups .a5 img{height:260px}.five-groups .a5 .audience-copy{padding-top:18px}.service,.service:nth-child(odd){align-items:stretch}}

/* De afsluitende offerteactie krijgt meer nadruk zonder knopvlak. */
.contact .button{font-size:clamp(1.5rem,2.6vw,2rem);font-weight:750;border-bottom:3px solid #3b6d88;padding:10px 0;margin-top:12px}
.contact .button:hover{border-bottom-color:var(--navy)}

/* Sectielabels zijn leesbaar zonder inzoomen. */
.label,.hero .label{font-size:16px;line-height:1.5;letter-spacing:.025em}
@media(max-width:540px){.label,.hero .label{font-size:15px}}

/* Zes doelgroepen: drie rustige rijen met een vaste tweekolomsuitlijning. */
.six-groups .audience{grid-column:span 6;padding-top:0}
.six-groups .audience img{height:340px}
.six-groups .a2 img,.six-groups .a4 img,.six-groups .a6 img{border-radius:0 0 0 var(--photo-corner)}
@media(max-width:820px){.six-groups .audience img{height:270px}}
@media(max-width:540px){.six-groups{display:block}.six-groups .audience{margin-bottom:36px}.six-groups .audience:last-child{margin-bottom:0}.six-groups .audience img{height:260px}.six-groups .a6 img{border-radius:0 0 0 var(--photo-corner)}}

/* De doelgroepen op Home staan per rij op dezelfde beeld- en tekstas. */
.seven-groups .a1,.seven-groups .a2,.seven-groups .a3,.seven-groups .a4,.seven-groups .a5,.seven-groups .a6{grid-column:span 6;padding-top:0}
.seven-groups .a5 img,.seven-groups .a6 img{height:340px}
.seven-groups .a5 .audience-copy,.seven-groups .a6 .audience-copy{max-width:100%}
@media(max-width:820px){.seven-groups .a5 img,.seven-groups .a6 img{height:270px}}
@media(max-width:540px){.seven-groups .a5 img,.seven-groups .a6 img{height:260px}}
