@font-face{font-family:Urbanist;src:url(/fonts/urbanist.woff2) format("woff2");font-weight:100 900;font-display:swap}
:root{--navy:#0D2354;--diep:#081736;--teal:#57BDAE;--teal-d:#1C7A6E;--teal-l:#E6F5F2;--papier:#F4F6FA;--lijn:#DCE2EC;--tekst:#1A2640;--grijs:#55617A;--wit:#fff;--r:6px;--breed:1180px;--schaduw:0 18px 40px -22px rgba(13,35,84,.35)}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font-family:Urbanist,"Segoe UI",system-ui,sans-serif;font-size:16.5px;line-height:1.7;color:var(--tekst);background:var(--wit);font-weight:450;-webkit-font-smoothing:antialiased}
img,svg{max-width:100%;display:block}
a{color:var(--teal-d);text-underline-offset:3px}
a:hover{color:var(--navy)}
h1,h2,h3,h4{font-weight:700;line-height:1.15;color:var(--navy);margin:0 0 .6em;letter-spacing:-.015em;text-wrap:balance}
h1{font-size:clamp(2rem,4.2vw,3.25rem)}
h2{font-size:clamp(1.55rem,2.7vw,2.15rem)}
h3{font-size:1.2rem;line-height:1.25}
p{margin:0 0 1.1em}
:focus-visible{outline:3px solid var(--teal);outline-offset:3px;border-radius:4px}
.kader{width:min(100% - 40px,var(--breed));margin-inline:auto}
.oog{display:inline-flex;align-items:center;gap:12px;font-size:.74rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--teal-d);margin:0 0 18px}
.oog::before{content:"";width:26px;height:2px;background:var(--teal)}
.donker .oog{color:var(--teal)}
.pijl{width:1.05em;height:1.05em;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:square;flex:none;transition:transform .25s}
.icoon{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}
.knop{display:inline-flex;align-items:center;gap:12px;background:var(--navy);color:#fff;text-decoration:none;padding:14px 22px;border-radius:var(--r);border:0;font:inherit;font-weight:700;letter-spacing:.01em;cursor:pointer;line-height:1.2;transition:background .2s,color .2s,transform .2s}
.knop:hover{background:var(--teal-d);color:#fff}
.knop:hover .pijl,a:hover>.pijl,.kaart:hover .pijl{transform:translate(3px,-3px)}
.knop.omlijnd{background:transparent;color:var(--navy);box-shadow:inset 0 0 0 1.5px var(--navy)}
.knop.omlijnd:hover{background:var(--navy);color:#fff}
.donker .knop{background:var(--teal);color:var(--diep)}.donker .knop:hover{background:#fff;color:var(--navy)}
.donker .knop.omlijnd{background:transparent;color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.45)}
.knop{justify-content:center;text-align:center}
.zijkaart .knop,.voet-merk .knop{display:flex;width:100%}
.voet-merk{max-width:260px}
@media(max-width:860px){
 .knop{display:flex;width:100%}
 .voet-merk{max-width:none}
 .held .rij{flex-direction:column}
 .kopregel .knop,.oproep .knop{width:100%}
 .proza p:has(>.knop){margin-top:1.4em}
 .mailform .knop{flex:1 1 100%}
}
.onder-rooster{margin:36px 0 0}
@media(min-width:861px){
 main a.knop:not(.rij .knop){display:flex;width:fit-content;margin-inline:auto}
 .held .rij{justify-content:center}
 .mailform{justify-content:center;max-width:620px;margin-inline:auto}
 .mailform .knop{margin-inline:0}
}
.oproep{grid-template-columns:1fr!important;text-align:center;justify-items:center;border-left:0!important;border-top:4px solid var(--teal)}
.oproep p{margin-inline:auto}
.sectie{padding:clamp(64px,9vw,120px) 0}
.donker{background:var(--navy);color:#DCE4F5}
.donker h1,.donker h2,.donker h3{color:#fff}
.zacht{background:var(--papier)}
.skip{position:absolute;left:-999px}.skip:focus{left:12px;top:12px;z-index:99;background:#fff;padding:10px 14px}

/* kop */
.strook{background:var(--diep);color:#C9D3EA;font-size:.9rem}
.strook .kader{display:flex;justify-content:space-between;gap:16px;padding:9px 0;flex-wrap:wrap}
.strook a{color:inherit;text-decoration:none;display:inline-flex;gap:8px;align-items:center}
.strook a:hover{color:var(--teal)}
.strook .icoon{width:16px;height:16px}
@media(max-width:620px){.strook .kader{justify-content:center}.strook a:first-child{display:none}}
.kop{position:sticky;top:0;z-index:40;background:rgba(255,255,255,.97);backdrop-filter:blur(12px);border-bottom:1px solid var(--lijn);transition:box-shadow .25s}
.kop.vast{box-shadow:0 12px 30px -20px rgba(13,35,84,.45)}
.kop .kader{display:flex;align-items:center;gap:28px;min-height:84px;transition:min-height .25s}
.kop.vast .kader{min-height:68px}
.merk img{height:50px;width:auto;transition:height .25s}
.kop.vast .merk img{height:42px}
.kop .knop{padding:12px 20px}
.kop .inlog-knop{padding:12px 16px;gap:8px}.inlog-knop .icoon,.nav-extra .knop .icoon{width:18px;height:18px}
.kop .kader>.inlog-knop+.knop{margin-left:-14px}
.nav{margin-left:auto}
.nav>ul{display:flex;gap:4px;list-style:none;margin:0;padding:0;align-items:center}
.nav>ul>li>a{position:relative;font-weight:600;font-size:.98rem;color:var(--navy);text-decoration:none;padding:12px 13px;display:inline-flex;align-items:center;transition:color .2s}
.nav>ul>li>a::after{content:"";position:absolute;left:13px;right:13px;bottom:5px;height:2px;background:var(--teal);transform:scaleX(0);transform-origin:left;transition:transform .28s cubic-bezier(.2,.7,.2,1)}
.nav>ul>li>a:hover::after,.nav>ul>li>a[aria-current]::after,.heeft-sub:hover>a::after,.heeft-sub.actief>a::after{transform:scaleX(1)}
.heeft-sub{position:relative;display:flex;align-items:center}
.nav>ul>li.heeft-sub>a{padding-right:2px}
.nav>ul>li.heeft-sub>a::after{right:2px}
.heeft-sub>button{background:none;border:0;cursor:pointer;width:26px;height:40px;display:inline-flex;align-items:center;justify-content:center;color:var(--navy);padding:0;border-radius:var(--r)}
.heeft-sub>button::after{content:"";width:7px;height:7px;border:solid currentColor;border-width:0 2px 2px 0;transform:translateY(-2px) rotate(45deg);transition:transform .25s}
.heeft-sub.open>button::after{transform:translateY(2px) rotate(225deg)}
.sub ul{list-style:none;margin:0;padding:12px;display:grid;grid-template-columns:1fr 1fr;gap:2px}
.sub li a{display:flex;gap:13px;align-items:center;padding:9px 12px;border-radius:var(--r);font-weight:600;font-size:.95rem;color:var(--navy);text-decoration:none;line-height:1.3;transition:background .2s}
.sub li a .icoon{width:38px;height:38px;padding:9px;background:var(--teal-l);color:var(--teal-d);border-radius:var(--r);transition:background .2s,color .2s}
.sub li a:hover,.sub li a[aria-current]{background:var(--papier)}
.sub li a:hover .icoon,.sub li a[aria-current] .icoon{background:var(--navy);color:#fff}
.sub-voet{display:flex;justify-content:space-between;gap:16px;padding:14px 24px;background:var(--papier);border-top:1px solid var(--lijn);font-size:.93rem;font-weight:700}
.sub-voet a{display:inline-flex;gap:9px;align-items:center;color:var(--navy);text-decoration:none}
.sub-voet a:hover{color:var(--teal-d)}
.sub-voet .icoon{width:18px;height:18px;color:var(--teal-d)}
.nav-extra{display:none}
.menuknop{display:none;margin-left:auto;width:46px;height:46px;border-radius:var(--r);border:1px solid var(--lijn);background:#fff;cursor:pointer;align-items:center;justify-content:center}
.menuknop span,.menuknop span::before,.menuknop span::after{content:"";display:block;width:20px;height:2px;background:var(--navy);position:relative;transition:transform .25s,top .25s,background .2s}
.menuknop span::before{position:absolute;top:-6px}.menuknop span::after{position:absolute;top:6px}
.menuknop[aria-expanded=true] span{background:transparent}
.menuknop[aria-expanded=true] span::before{top:0;transform:rotate(45deg)}
.menuknop[aria-expanded=true] span::after{top:0;transform:rotate(-45deg)}
@media(min-width:1081px){
 .heeft-sub:hover>button::after,.heeft-sub:focus-within>button::after{transform:translateY(2px) rotate(225deg)}
 .sub{position:absolute;top:100%;left:50%;width:640px;margin-left:-320px;padding-top:12px;opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .2s,transform .25s cubic-bezier(.2,.7,.2,1),visibility .2s}
 .sub-in{background:#fff;border:1px solid var(--lijn);border-top:3px solid var(--teal);border-radius:var(--r);box-shadow:0 28px 56px -28px rgba(13,35,84,.45);overflow:hidden}
 .heeft-sub:hover .sub,.heeft-sub:focus-within .sub,.heeft-sub.open .sub{opacity:1;visibility:visible;transform:none}
}
@media(max-width:1080px){
 .menuknop{display:flex}.kop .kader,.kop.vast .kader{min-height:68px;gap:12px}.merk img,.kop.vast .merk img{height:40px}
 .kop .knop.bel{display:none}
 .kop .kader>.inlog-knop{display:inline-flex;width:46px;height:46px;padding:0;order:1;margin-left:auto;flex:none}
 .kop .kader>.inlog-knop span{display:none}
 .kop .kader>.inlog-knop .icoon{width:22px;height:22px}
 .menuknop{order:2;margin-left:0}
 .nav>ul>li>a.knop.omlijnd{color:var(--navy)}
 .menu-open{overflow:hidden}
 .nav{position:absolute;left:0;right:0;top:100%;height:calc(100dvh - 68px);margin:0;background:#fff;overflow:auto;padding:6px 20px 120px;opacity:0;visibility:hidden;transform:translateY(-10px);transition:opacity .22s,transform .28s cubic-bezier(.2,.7,.2,1),visibility .22s;border-top:1px solid var(--lijn)}
 .nav.open{opacity:1;visibility:visible;transform:none}
 .nav>ul{flex-direction:column;align-items:stretch;gap:0}
 .nav>ul>li{border-bottom:1px solid var(--lijn)}
 .nav>ul>li>a{flex:1;font-size:1.15rem;font-weight:700;padding:17px 2px}
 .nav>ul>li>a::after{display:none}
 .nav>ul>li>a[aria-current],.heeft-sub.actief>a{color:var(--teal-d)}
 .heeft-sub{flex-wrap:wrap}
 .heeft-sub>button{width:54px;height:54px;border-left:1px solid var(--lijn);border-radius:0}
 .sub{display:none;width:100%}
 .heeft-sub.open .sub{display:block}
 .sub ul{grid-template-columns:1fr;padding:0 0 12px}
 .sub li a{padding:9px 2px}
 .sub-voet{display:none}
 .nav>ul>li.nav-extra{display:grid;gap:16px;border:0;padding-top:26px;justify-items:center}
 .nav>ul>li>a.knop{display:flex;width:100%;flex:none;color:#fff;font-size:1rem;padding:15px 22px;justify-content:center}
 .nav>ul>li>a.nav-tel{flex:none;font-size:1.05rem;gap:10px;padding:6px}
 .nav-tel .icoon{color:var(--teal-d);width:20px;height:20px}
}
@media(prefers-reduced-motion:reduce){.nav,.sub,.kop .kader,.merk img,.menuknop span,.menuknop span::before,.menuknop span::after{transition:none!important}}

/* held */
.held{position:relative;background:var(--diep) url(/img/hero.jpg) center/cover;color:#DCE4F5;overflow:hidden;isolation:isolate}
.held::before{content:"";position:absolute;inset:0;background:linear-gradient(100deg,var(--diep) 0%,rgba(8,23,54,.94) 42%,rgba(13,35,84,.55) 100%);z-index:-1}
.held .kader{display:grid;grid-template-columns:1.3fr .7fr;gap:clamp(32px,6vw,90px);align-items:center;padding:clamp(70px,10vw,140px) 0 clamp(70px,9vw,120px)}
.held h1{color:#fff;margin-bottom:.5em}
.held h1 em{font-style:normal;color:var(--teal)}
.held p.lead{font-size:1.12rem;max-width:60ch;color:#C9D3EA}
.held .rij{display:flex;gap:14px;flex-wrap:wrap;margin-top:34px}
.citaat{margin:0;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);border-left:3px solid var(--teal);padding:30px 30px 26px;backdrop-filter:blur(6px);border-radius:0 var(--r) var(--r) 0}
.citaat svg{width:34px;height:34px;fill:none;stroke:var(--teal);stroke-width:8;stroke-linecap:square;margin-bottom:18px}
.citaat blockquote{margin:0;font-size:1.18rem;line-height:1.5;font-weight:500;color:#fff}
.citaat figcaption{margin-top:18px;font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;color:var(--teal);font-weight:700}
@media(max-width:860px){.held .kader{grid-template-columns:1fr}}

.heldzij{display:grid;gap:26px}
.groei{width:100%;height:auto;overflow:visible}
.groei path,.groei circle{fill:none;stroke-linecap:square}
.g-raster path{stroke:rgba(255,255,255,.09);stroke-width:1}
.g-kader{stroke:rgba(255,255,255,.9);stroke-width:3;stroke-dasharray:1;stroke-dashoffset:1;animation:teken 1.1s .2s cubic-bezier(.6,0,.2,1) forwards}
.g-staven rect{fill:rgba(255,255,255,.13);transform-box:fill-box;transform-origin:50% 100%;transform:scaleY(0);animation:groei .7s calc(.7s + var(--i)*.12s) cubic-bezier(.2,.8,.2,1) forwards}
.g-staven rect:nth-child(n+5){fill:rgba(87,189,174,.38)}
.g-lijn{stroke:var(--teal);stroke-width:4;stroke-linejoin:miter;stroke-dasharray:1;stroke-dashoffset:1;animation:teken 1.3s 1.4s cubic-bezier(.5,0,.2,1) forwards}
.g-punt-pijl{stroke:var(--teal);stroke-width:4;opacity:0;animation:pijlin .45s 2.55s ease-out forwards}
.g-punten circle{fill:var(--diep)!important;stroke:var(--teal);stroke-width:3;opacity:0;animation:verschijn .3s calc(1.75s + var(--i)*.28s) forwards}
.g-loper{fill:#fff!important;filter:drop-shadow(0 0 6px rgba(87,189,174,.9));opacity:0;animation:verschijn .3s 2.8s forwards}
@keyframes teken{to{stroke-dashoffset:0}}
@keyframes groei{to{transform:scaleY(1)}}
@keyframes verschijn{to{opacity:1}}
@keyframes pijlin{from{opacity:0;transform:translate(-10px,10px)}to{opacity:1;transform:none}}
@keyframes opkomst{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.held .kader>div:first-child>*{animation:opkomst .7s cubic-bezier(.2,.7,.2,1) both}
.held .kader>div:first-child>:nth-child(2){animation-delay:.1s}
.held .kader>div:first-child>:nth-child(3){animation-delay:.22s}
.held .kader>div:first-child>:nth-child(4){animation-delay:.34s}
.held .citaat{animation:opkomst .7s .5s cubic-bezier(.2,.7,.2,1) both}
@media(max-width:860px){.heldzij{max-width:440px}}
@media(prefers-reduced-motion:reduce){.groei *,.held .kader>div:first-child>*,.held .citaat{animation:none!important;opacity:1!important;transform:none!important;stroke-dashoffset:0!important}.g-loper{display:none}}

/* twee kolommen */
.duo{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,84px);align-items:center}
.duo.boven{align-items:start}
@media(min-width:861px){.duo.boven>div:first-child>h2:only-child{position:sticky;top:120px}}
@media(max-width:860px){.duo{grid-template-columns:1fr}}
.beeld{position:relative;margin:0}
.beeld img{border-radius:var(--r);width:100%;height:auto;box-shadow:var(--schaduw)}

.uitgelicht{display:flex;gap:16px;align-items:flex-start;padding:20px 22px;border-left:3px solid var(--teal);background:var(--papier);margin:26px 0}
.uitgelicht .icoon{color:var(--teal-d);margin-top:3px}
.uitgelicht h3{margin:0 0 4px}.uitgelicht p{margin:0;color:var(--grijs)}
.vinken{list-style:none;padding:0;margin:0 0 26px;display:grid;gap:10px}
.vinken li{display:flex;gap:12px;align-items:center;font-weight:700;color:var(--navy)}
.vinken .icoon{color:var(--teal);width:22px;height:22px}
.waarden{display:grid;margin:26px 0;border-top:1px solid var(--lijn)}
.waarde{display:flex;gap:14px;align-items:center;padding:15px 0;border-bottom:1px solid var(--lijn);font-weight:700;color:var(--navy)}
.waarde .icoon{color:var(--teal-d);width:22px;height:22px}
.stelling{background:var(--navy);color:#fff;border-radius:var(--r);padding:clamp(28px,4vw,46px);position:relative;overflow:hidden}
.stelling h3{color:#fff;font-size:clamp(1.25rem,2vw,1.55rem);margin-bottom:26px;padding-top:24px;border-top:1px solid rgba(255,255,255,.18)}
.patroon{position:absolute;inset:0;opacity:.05;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='84' height='84' viewBox='0 0 84 84'%3E%3Cpath d='M22 62 60 24M34 22h28v28' fill='none' stroke='%23fff' stroke-width='6'/%3E%3C/svg%3E");pointer-events:none}

/* diensten */
.kopregel{display:flex;justify-content:space-between;align-items:end;gap:24px;flex-wrap:wrap;margin-bottom:40px}
.kopregel h2{margin:0}
.kopregel .oog{margin-bottom:14px}
.rooster{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--lijn);border:1px solid var(--lijn);border-radius:var(--r);overflow:hidden}
@media(max-width:980px){.rooster{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.rooster{grid-template-columns:1fr}}
.kaart{background:#fff;padding:32px 30px 28px;display:flex;flex-direction:column;position:relative;transition:background .25s}
.kaart:hover{background:var(--papier)}
.kaart .nr{font-size:.8rem;font-weight:700;letter-spacing:.2em;color:var(--grijs)}
.kaart .icoon{width:38px;height:38px;color:var(--teal-d);margin:18px 0 20px}
.kaart h3{font-size:1.2rem}
.kaart h3 a{color:inherit;text-decoration:none}
.kaart h3 a::after{content:"";position:absolute;inset:0}
.kaart p{color:var(--grijs);font-size:.97rem;margin-bottom:22px}
.kaart .meer{margin-top:auto;display:inline-flex;gap:10px;align-items:center;font-weight:700;color:var(--teal-d);font-size:.95rem}

/* band */
.band{position:relative;overflow:hidden}
.band{background:linear-gradient(120deg,var(--diep),var(--navy))}
.band h2{max-width:26ch;font-size:clamp(1.6rem,3vw,2.4rem)}
.band h2 b{color:var(--teal)}
.usp{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:44px;border-top:1px solid rgba(255,255,255,.18)}
.usp div{padding:24px 22px 0 0;display:flex;gap:14px;align-items:center}
.usp .icoon{color:var(--teal)}
.usp h3{font-size:1.05rem;margin:0;font-weight:600}
@media(max-width:860px){.usp{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.usp{grid-template-columns:1fr}}

/* stappen */
.stappen{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:40px}
@media(max-width:860px){.stappen{grid-template-columns:1fr}}
.stap{border:1px solid var(--lijn);border-top:3px solid var(--teal);border-radius:var(--r);padding:28px;display:flex;flex-direction:column;background:#fff}
.stap .nr{font-size:.85rem;font-weight:700;letter-spacing:.2em;color:var(--grijs)}
.stap h3{font-size:1.3rem;margin:10px 0 12px}
.stap p{color:var(--grijs);font-size:.97rem;margin-bottom:22px}
.stap a{margin-top:auto;font-weight:700;font-size:.95rem;color:var(--teal-d);text-decoration:none;display:inline-flex;gap:10px;align-items:center}

/* oproep */
.oproep{background:var(--navy);color:#DCE4F5;border-radius:var(--r);padding:clamp(32px,5vw,60px);display:grid;grid-template-columns:1.4fr auto;gap:30px;align-items:center;position:relative;overflow:hidden;border-left:4px solid var(--teal)}
.oproep h2{color:#fff;margin-bottom:.4em}
.oproep p{margin:0;max-width:60ch}
.oproep a:not(.knop){color:#fff}
.oproep .knop{background:var(--teal);color:var(--diep)}.oproep .knop:hover{background:#fff;color:var(--navy)}
@media(max-width:860px){.oproep{grid-template-columns:1fr}}

/* lopende tekst */
.proza{max-width:72ch}
.proza p,.proza li{color:#34405A}
.proza h2{font-size:clamp(1.45rem,2.4vw,1.9rem);margin-top:1.6em}
.proza>h2:first-child,.proza>:first-child{margin-top:0}
.proza .inleiding{font-size:1.2rem;font-weight:600;color:var(--navy)}
.proza .onderkop{font-size:.8rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--teal-d);margin-top:-.4em}
.proza ul,.proza ol{padding:0;margin:0 0 1.3em;list-style:none;display:grid;gap:9px}
.proza li{position:relative;padding-left:30px}
.proza ul li::before{content:"";position:absolute;left:2px;top:.42em;width:14px;height:14px;background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 19 19 5M8 5h11v11' fill='none' stroke='%231C7A6E' stroke-width='3.4'/%3E%3C/svg%3E")}
.artikel{columns:2;column-gap:64px;max-width:none}
.artikel h2{break-after:avoid;font-size:1.5rem}
.artikel p{break-inside:avoid}
@media(max-width:860px){.artikel{columns:1}}
.kenmerken{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:34px 0}
@media(max-width:700px){.kenmerken{grid-template-columns:1fr}}
.kenmerk{border:1px solid var(--lijn);border-radius:var(--r);padding:24px;background:#fff}
.kenmerk h3{display:flex;gap:10px;align-items:center}
.kenmerk h3::before{content:"";width:18px;height:18px;border:3px solid var(--teal);border-top:0;border-right:0;flex:none}
.kenmerk p{color:var(--grijs);margin:0 0 .7em;font-size:.98rem}.kenmerk p:last-child{margin:0}
.uitklap{display:grid;gap:10px;margin-top:24px}
.uitklap details{border:1px solid var(--lijn);border-radius:var(--r);background:#fff}
.uitklap summary{cursor:pointer;list-style:none;padding:17px 22px;font-weight:700;color:var(--navy);display:flex;justify-content:space-between;gap:16px;align-items:center}
.uitklap summary::-webkit-details-marker{display:none}
.uitklap details[open] summary .pijl{transform:rotate(90deg);color:var(--teal-d)}
.uitklap details>div{padding:0 22px 8px;color:var(--grijs)}

/* paginakop */
.pkop{position:relative;background:linear-gradient(120deg,var(--diep),var(--navy));color:#DCE4F5;overflow:hidden;padding:clamp(48px,7vw,96px) 0 clamp(48px,6vw,80px)}
.pkop .kader{position:relative}
.pkop h1{color:#fff;max-width:20ch;margin-bottom:.35em}
.pkop p{max-width:68ch;font-size:1.12rem;margin:0}
.kruimel{font-size:.86rem;margin-bottom:26px;display:flex;gap:10px;flex-wrap:wrap;color:#9FB0D3}
.kruimel a{color:#C9D3EA;text-decoration:none}.kruimel a:hover{color:var(--teal)}
.pkop .merkteken{position:absolute;right:-30px;top:50%;translate:0 -50%;width:260px;opacity:.1;fill:none;stroke:#fff;stroke-width:1.4}
@media(max-width:860px){.pkop .merkteken{display:none}}

/* dienstpagina */
.metzij{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:clamp(32px,5vw,72px);align-items:start}
@media(max-width:980px){.metzij{grid-template-columns:1fr}}
.blok+.blok{margin-top:48px;padding-top:48px;border-top:1px solid var(--lijn)}
.blok.waarom{background:var(--papier);border:0;border-left:3px solid var(--teal);border-radius:0 var(--r) var(--r) 0;padding:clamp(26px,4vw,40px);margin-top:48px}
.blok.waarom+.blok{border-top:0;padding-top:0}
.blok .proza p:last-child{margin-bottom:0}
.zij{position:sticky;top:106px;display:grid;gap:20px}
.zijkaart{border:1px solid var(--lijn);border-radius:var(--r);padding:22px}
.zijkaart h2{font-size:.8rem;letter-spacing:.2em;text-transform:uppercase;color:var(--grijs);margin-bottom:12px}
.zijkaart ul{list-style:none;margin:0;padding:0}
.zijkaart li a{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid var(--lijn);font-weight:600;font-size:.97rem;color:var(--navy);text-decoration:none;line-height:1.3}
.zijkaart li:last-child a{border:0}
.zijkaart.alle{margin-top:36px;padding:26px 28px}
.zijkaart.alle ul{display:grid;grid-template-columns:1fr 1fr;column-gap:48px}
.zijkaart.alle li a,.zijkaart.alle li:last-child a{border-bottom:1px solid var(--lijn)}
.zijkaart.alle li:nth-last-child(-n+2) a{border-bottom:0}
@media(max-width:700px){.zijkaart.alle ul{grid-template-columns:1fr}.zijkaart.alle li:nth-last-child(2) a{border-bottom:1px solid var(--lijn)}}
.zijkaart li a:hover,.zijkaart li a[aria-current]{color:var(--teal-d)}
.zijkaart.donker{border:0;position:relative;overflow:hidden}
.zijkaart.donker h2{color:var(--teal)}
.zijkaart.donker p{position:relative}.zijkaart.donker .tel{font-size:1.5rem;font-weight:800;color:#fff;text-decoration:none;display:block;margin-bottom:14px}

/* formulieren */
.form{display:grid;gap:16px}
.form .twee{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:600px){.form .twee{grid-template-columns:1fr}}
.form label{display:grid;gap:6px;font-weight:600;color:var(--navy);font-size:.93rem}
.paneel h2{font-size:1.5rem;margin-bottom:22px}
.form .knop{justify-content:center}
.form input,.form select,.form textarea{font:inherit;font-weight:500;padding:13px 14px;border:1.5px solid var(--lijn);border-radius:var(--r);background:#fff;color:var(--tekst);width:100%}
.form input:focus,.form select:focus,.form textarea:focus{outline:0;border-color:var(--teal-d);box-shadow:0 0 0 3px rgba(87,189,174,.3)}
.form .klein{font-size:.86rem;color:var(--grijs);margin:0}
.verborgen{position:absolute;left:-9999px}
.mailform{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}
.mailform label{flex:1 1 240px}.mailform input{font:inherit;width:100%;padding:13px 16px;border-radius:var(--r);border:1.5px solid var(--lijn)}
.paneel{background:#fff;border:1px solid var(--lijn);border-top:3px solid var(--teal);border-radius:var(--r);padding:clamp(22px,4vw,40px);box-shadow:var(--schaduw)}
.gegevens{display:grid;gap:22px;margin-top:30px}
.gegeven{display:flex;gap:16px;align-items:flex-start}
.gegeven .icoon{color:var(--teal-d);margin-top:4px}
.gegeven h3{margin:0 0 2px;font-size:1.05rem}.gegeven h3 a{color:inherit;text-decoration:none}
.gegeven p{margin:0;color:var(--grijs)}
.kaartje{border:0;width:100%;height:420px;display:block;filter:saturate(.7)}

/* voet */
.voet,.voet.donker{background:var(--diep);color:#B9C5DF;position:relative;overflow:hidden}
.voet a{color:inherit;text-decoration:none}.voet a:hover{color:var(--teal)}
.voet-top{display:grid;grid-template-columns:1.3fr auto;gap:30px;align-items:center;padding:clamp(48px,7vw,84px) 0;border-bottom:1px solid rgba(255,255,255,.14)}
.voet-top h2{color:#fff;max-width:22ch;margin-bottom:.3em}
.voet-top p{margin:0}
.voet-top .rechts{display:grid;gap:10px;justify-items:start}
.voet-top .rechts a{display:inline-flex;gap:12px;align-items:center;font-weight:700;color:#fff;font-size:1.1rem}
.voet-top .icoon{color:var(--teal)}
.voet-kol{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;gap:36px;padding:56px 0}
.voet-kol img{height:54px;width:auto;margin-bottom:18px}
.voet-merk p{max-width:26ch;margin-bottom:22px}
.voet-kol p{margin-bottom:.8em}
.voet-kol h3:not(:first-child){margin-top:26px}
.voet h3{color:#fff;font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;margin-bottom:16px}
.voet ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.voet-onder{border-top:1px solid rgba(255,255,255,.14);padding:20px 0;font-size:.88rem;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
@media(max-width:980px){.voet-kol{grid-template-columns:1fr 1fr}.voet-top{grid-template-columns:1fr}}
@media(max-width:560px){.voet-kol{grid-template-columns:1fr}}
.wa{position:fixed;right:18px;bottom:18px;z-index:50;background:#1FA855;color:#fff;font-weight:800;text-decoration:none;padding:12px 18px 12px 14px;border-radius:999px;display:inline-flex;gap:10px;align-items:center;box-shadow:0 10px 24px -8px rgba(0,0,0,.4);font-size:.95rem}
.wa:hover{color:#fff;background:#178a45}
.wa svg{width:22px;height:22px;fill:currentColor}
@media(max-width:560px){.wa span{display:none}.wa{padding:14px}}

.js .toon{opacity:0;transform:translateY(18px);transition:opacity .6s,transform .6s}
.js .toon.zichtbaar{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.js .toon{opacity:1;transform:none;transition:none}html{scroll-behavior:auto}.pijl{transition:none}}
.werk{width:100%;height:auto;display:block;margin-bottom:26px}
.w-schaduw{fill:rgba(13,35,84,.08)}
.w-stoel{fill:#C5CEE0}
.w-pak,.w-haar,.w-blad,.w-oog,.w-stempelvoet{fill:var(--navy)}
.w-hemd{fill:#fff}.w-das,.w-stempel{fill:var(--teal-d)}
.w-huid{fill:#F0C6A0}
.w-mond{fill:none;stroke:var(--navy);stroke-width:2;stroke-linecap:round}
.w-paneel{fill:rgba(13,35,84,.07)}.w-poot{fill:#33456F}
.w-arm{fill:none;stroke:var(--navy);stroke-width:17;stroke-linecap:round}
.w-stapel rect{fill:#fff;stroke:#B4BFD4;stroke-width:1}
.w-stapel .w-merk{fill:var(--teal);stroke:none}
.w-vel rect{fill:#fff;stroke:#B4BFD4;stroke-width:1.200}
.w-regels{fill:none;stroke:rgba(13,35,84,.28);stroke-width:2.400;stroke-linecap:round}
.w-vink{fill:none;stroke:var(--teal-d);stroke-width:4.500;stroke-linecap:round;stroke-linejoin:round}
.w-vaart path{fill:none;stroke:var(--teal);stroke-width:3;stroke-linecap:round}
.w-klaar circle{fill:var(--teal)}.w-klaar path{fill:none;stroke:#fff;stroke-width:5;stroke-linecap:round;stroke-linejoin:round}
.w-l,.w-r,.w-vel,.w-vink,.w-stempelarm,.w-klaar,.w-vaart{animation-duration:6s;animation-iteration-count:infinite;animation-timing-function:cubic-bezier(.45,0,.3,1)}
.w-stempelarm{transform-origin:292px 180px;animation-name:w-arm}
.w-hoofd{transform-origin:260px 140px;animation:w-knik 0.48s ease-in-out infinite}
.w-vel{animation-name:w-vel}.w-vink{animation-name:w-vink}
.w-klaar{transform-box:fill-box;transform-origin:center;animation-name:w-klaar}
.w-vaart{animation-name:w-vaart}
@keyframes w-knik{0%,100%{transform:rotate(0)}50%{transform:rotate(3deg) translateY(1.500px)}}
@keyframes w-klaar{0%,81%{opacity:0;transform:scale(.3)}85%{opacity:1;transform:scale(1.150)}87%,95%{opacity:1;transform:scale(1)}99%,100%{opacity:0;transform:scale(.3)}}
@keyframes w-vaart{0%,78%{opacity:.9}82%,100%{opacity:0}}
.w-vaart path{stroke-dasharray:10 8;animation:w-streep .35s linear infinite}
@keyframes w-streep{to{stroke-dashoffset:-18}}
@keyframes w-l9{0%,0%{opacity:1;transform:none}0.2%,90%{opacity:0;transform:translateY(-34px)}96.4%{opacity:0;transform:translateY(-34px)}98.4%,100%{opacity:1;transform:none}}.w-l9{animation-name:w-l9}
@keyframes w-r0{0%,7.4%{opacity:0;transform:none}7.8%,88%{opacity:1;transform:none}93%,100%{opacity:0;transform:translateX(46px)}}.w-r0{animation-name:w-r0}
@keyframes w-l8{0%,8%{opacity:1;transform:none}8.2%,90%{opacity:0;transform:translateY(-34px)}95.8%{opacity:0;transform:translateY(-34px)}97.8%,100%{opacity:1;transform:none}}.w-l8{animation-name:w-l8}
@keyframes w-r1{0%,15.4%{opacity:0;transform:none}15.8%,88%{opacity:1;transform:none}93%,100%{opacity:0;transform:translateX(46px)}}.w-r1{animation-name:w-r1}
@keyframes w-l7{0%,16%{opacity:1;transform:none}16.2%,90%{opacity:0;transform:translateY(-34px)}95.2%{opacity:0;transform:translateY(-34px)}97.2%,100%{opacity:1;transform:none}}.w-l7{animation-name:w-l7}
@keyframes w-r2{0%,23.4%{opacity:0;transform:none}23.8%,88%{opacity:1;transform:none}93%,100%{opacity:0;transform:translateX(46px)}}.w-r2{animation-name:w-r2}
@keyframes w-l6{0%,24%{opacity:1;transform:none}24.2%,90%{opacity:0;transform:translateY(-34px)}94.6%{opacity:0;transform:translateY(-34px)}96.6%,100%{opacity:1;transform:none}}.w-l6{animation-name:w-l6}
@keyframes w-r3{0%,31.4%{opacity:0;transform:none}31.8%,88%{opacity:1;transform:none}93%,100%{opacity:0;transform:translateX(46px)}}.w-r3{animation-name:w-r3}
@keyframes w-l5{0%,32%{opacity:1;transform:none}32.2%,90%{opacity:0;transform:translateY(-34px)}94%{opacity:0;transform:translateY(-34px)}96%,100%{opacity:1;transform:none}}.w-l5{animation-name:w-l5}
@keyframes w-r4{0%,39.4%{opacity:0;transform:none}39.8%,88%{opacity:1;transform:none}93%,100%{opacity:0;transform:translateX(46px)}}.w-r4{animation-name:w-r4}
@keyframes w-l4{0%,40%{opacity:1;transform:none}40.2%,90%{opacity:0;transform:translateY(-34px)}93.4%{opacity:0;transform:translateY(-34px)}95.4%,100%{opacity:1;transform:none}}.w-l4{animation-name:w-l4}
@keyframes w-r5{0%,47.4%{opacity:0;transform:none}47.8%,88%{opacity:1;transform:none}93%,100%{opacity:0;transform:translateX(46px)}}.w-r5{animation-name:w-r5}
@keyframes w-l3{0%,48%{opacity:1;transform:none}48.2%,90%{opacity:0;transform:translateY(-34px)}92.8%{opacity:0;transform:translateY(-34px)}94.8%,100%{opacity:1;transform:none}}.w-l3{animation-name:w-l3}
@keyframes w-r6{0%,55.4%{opacity:0;transform:none}55.8%,88%{opacity:1;transform:none}93%,100%{opacity:0;transform:translateX(46px)}}.w-r6{animation-name:w-r6}
@keyframes w-l2{0%,56%{opacity:1;transform:none}56.2%,90%{opacity:0;transform:translateY(-34px)}92.2%{opacity:0;transform:translateY(-34px)}94.2%,100%{opacity:1;transform:none}}.w-l2{animation-name:w-l2}
@keyframes w-r7{0%,63.4%{opacity:0;transform:none}63.8%,88%{opacity:1;transform:none}93%,100%{opacity:0;transform:translateX(46px)}}.w-r7{animation-name:w-r7}
@keyframes w-l1{0%,64%{opacity:1;transform:none}64.2%,90%{opacity:0;transform:translateY(-34px)}91.6%{opacity:0;transform:translateY(-34px)}93.6%,100%{opacity:1;transform:none}}.w-l1{animation-name:w-l1}
@keyframes w-r8{0%,71.4%{opacity:0;transform:none}71.8%,88%{opacity:1;transform:none}93%,100%{opacity:0;transform:translateX(46px)}}.w-r8{animation-name:w-r8}
@keyframes w-l0{0%,72%{opacity:1;transform:none}72.2%,90%{opacity:0;transform:translateY(-34px)}91%{opacity:0;transform:translateY(-34px)}93%,100%{opacity:1;transform:none}}.w-l0{animation-name:w-l0}
@keyframes w-r9{0%,79.4%{opacity:0;transform:none}79.8%,88%{opacity:1;transform:none}93%,100%{opacity:0;transform:translateX(46px)}}.w-r9{animation-name:w-r9}
@keyframes w-vel{0%{opacity:1;transform:translate(105px,163.5px) scale(1.950,.120)}2.8%,5.2%{opacity:1;transform:translate(260px,206px) scale(1) rotate(-4deg)}7.5%{opacity:1;transform:translate(415px,244.5px) scale(1.950,.120)}7.9%{opacity:0;transform:translate(415px,244.5px) scale(1.950,.120)}8%{opacity:1;transform:translate(105px,172.5px) scale(1.950,.120)}10.8%,13.2%{opacity:1;transform:translate(260px,206px) scale(1) rotate(-4deg)}15.5%{opacity:1;transform:translate(415px,235.5px) scale(1.950,.120)}15.9%{opacity:0;transform:translate(415px,235.5px) scale(1.950,.120)}16%{opacity:1;transform:translate(105px,181.5px) scale(1.950,.120)}18.8%,21.2%{opacity:1;transform:translate(260px,206px) scale(1) rotate(-4deg)}23.5%{opacity:1;transform:translate(415px,226.5px) scale(1.950,.120)}23.9%{opacity:0;transform:translate(415px,226.5px) scale(1.950,.120)}24%{opacity:1;transform:translate(105px,190.5px) scale(1.950,.120)}26.8%,29.2%{opacity:1;transform:translate(260px,206px) scale(1) rotate(-4deg)}31.5%{opacity:1;transform:translate(415px,217.5px) scale(1.950,.120)}31.9%{opacity:0;transform:translate(415px,217.5px) scale(1.950,.120)}32%{opacity:1;transform:translate(105px,199.5px) scale(1.950,.120)}34.8%,37.2%{opacity:1;transform:translate(260px,206px) scale(1) rotate(-4deg)}39.5%{opacity:1;transform:translate(415px,208.5px) scale(1.950,.120)}39.9%{opacity:0;transform:translate(415px,208.5px) scale(1.950,.120)}40%{opacity:1;transform:translate(105px,208.5px) scale(1.950,.120)}42.8%,45.2%{opacity:1;transform:translate(260px,206px) scale(1) rotate(-4deg)}47.5%{opacity:1;transform:translate(415px,199.5px) scale(1.950,.120)}47.9%{opacity:0;transform:translate(415px,199.5px) scale(1.950,.120)}48%{opacity:1;transform:translate(105px,217.5px) scale(1.950,.120)}50.8%,53.2%{opacity:1;transform:translate(260px,206px) scale(1) rotate(-4deg)}55.5%{opacity:1;transform:translate(415px,190.5px) scale(1.950,.120)}55.9%{opacity:0;transform:translate(415px,190.5px) scale(1.950,.120)}56%{opacity:1;transform:translate(105px,226.5px) scale(1.950,.120)}58.8%,61.2%{opacity:1;transform:translate(260px,206px) scale(1) rotate(-4deg)}63.5%{opacity:1;transform:translate(415px,181.5px) scale(1.950,.120)}63.9%{opacity:0;transform:translate(415px,181.5px) scale(1.950,.120)}64%{opacity:1;transform:translate(105px,235.5px) scale(1.950,.120)}66.8%,69.2%{opacity:1;transform:translate(260px,206px) scale(1) rotate(-4deg)}71.5%{opacity:1;transform:translate(415px,172.5px) scale(1.950,.120)}71.9%{opacity:0;transform:translate(415px,172.5px) scale(1.950,.120)}72%{opacity:1;transform:translate(105px,244.5px) scale(1.950,.120)}74.8%,77.2%{opacity:1;transform:translate(260px,206px) scale(1) rotate(-4deg)}79.5%{opacity:1;transform:translate(415px,163.5px) scale(1.950,.120)}79.9%{opacity:0;transform:translate(415px,163.5px) scale(1.950,.120)}80%,100%{opacity:0;transform:translate(105px,160px) scale(1.950,.120)}}@keyframes w-vink{0%,4.1%{opacity:0}4.5%,7.9%{opacity:1}8%,12.1%{opacity:0}12.5%,15.9%{opacity:1}16%,20.1%{opacity:0}20.5%,23.9%{opacity:1}24%,28.1%{opacity:0}28.5%,31.9%{opacity:1}32%,36.1%{opacity:0}36.5%,39.9%{opacity:1}40%,44.1%{opacity:0}44.5%,47.9%{opacity:1}48%,52.1%{opacity:0}52.5%,55.9%{opacity:1}56%,60.1%{opacity:0}60.5%,63.9%{opacity:1}64%,68.1%{opacity:0}68.5%,71.9%{opacity:1}72%,76.1%{opacity:0}76.5%,79.9%{opacity:1}80%,100%{opacity:0}}@keyframes w-arm{2.4%{transform:rotate(-34deg)}4.2%,5%{transform:rotate(0)}10.4%{transform:rotate(-34deg)}12.2%,13%{transform:rotate(0)}18.4%{transform:rotate(-34deg)}20.2%,21%{transform:rotate(0)}26.4%{transform:rotate(-34deg)}28.2%,29%{transform:rotate(0)}34.4%{transform:rotate(-34deg)}36.2%,37%{transform:rotate(0)}42.4%{transform:rotate(-34deg)}44.2%,45%{transform:rotate(0)}50.4%{transform:rotate(-34deg)}52.2%,53%{transform:rotate(0)}58.4%{transform:rotate(-34deg)}60.2%,61%{transform:rotate(0)}66.4%{transform:rotate(-34deg)}68.2%,69%{transform:rotate(0)}74.4%{transform:rotate(-34deg)}76.2%,77%{transform:rotate(0)}0%{transform:rotate(-34deg)}83%,96%{transform:rotate(-8deg)}100%{transform:rotate(-34deg)}}
@media(prefers-reduced-motion:reduce){.werk *{animation:none!important}.w-vel,.w-vaart,.w-klaar{display:none}}
