/* komee.tdgdigital.com — concept "Kom mee." Maten in rem: vanaf 1440 px schaalt het geheel mee (geen px-plafonds). */
@font-face{font-family:"Rubik";src:url(/fonts/rubik-latin.woff2) format("woff2");font-weight:300 900;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Rubik";src:url(/fonts/rubik-latin-ext.woff2) format("woff2");font-weight:300 900;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Work Sans";src:url(/fonts/worksans-latin.woff2) format("woff2");font-weight:100 900;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Work Sans";src:url(/fonts/worksans-latin-ext.woff2) format("woff2");font-weight:100 900;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Work Sans";src:url(/fonts/worksans-italic.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Kom Arabisch";src:url(/fonts/noto-arabic-kom.woff2) format("woff2");font-weight:800;font-display:swap}

:root{--groen:#80b539;--groen-d:#3c6610;--groen-l:#eaf3da;--blauw:#0b72b9;--blauw-d:#075a95;--nacht:#0c2740;--papier:#f5f0e6;--wit:#fff;--inkt:#13273b;--zon:#f4a938;
  --lijn:rgba(19,39,59,.16);--rand:clamp(1.15rem,5vw,5.5rem);--kop-h:4.6rem;--kopfont:"Rubik","Work Sans",system-ui,sans-serif}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:calc(var(--kop-h) + 1rem);overflow-x:clip}
@media (min-width:1440px){html{font-size:clamp(100%,1.1111vw,200%)}}
body{margin:0;background:var(--papier);color:var(--inkt);font-family:"Work Sans",system-ui,sans-serif;font-size:1.0625rem;line-height:1.62;overflow-x:clip}
img,video,svg{display:block;max-width:100%;height:auto}
[hidden]{display:none!important}
p,li,dd{hyphens:manual;overflow-wrap:break-word}
h1,h2,h3,h4{font-family:var(--kopfont);hyphens:manual;overflow-wrap:normal;text-wrap:balance;margin:0;line-height:1.04;letter-spacing:-.015em}
h2{font-weight:800;font-size:clamp(2.1rem,4.6vw,4.1rem)}
h3{font-weight:700;font-size:1.3rem;line-height:1.2}
p{margin:0 0 1em}
strong,b{font-weight:700}
a{color:inherit;text-underline-offset:.2em;text-decoration-thickness:.09em}
:focus-visible{outline:.19rem solid var(--zon);outline-offset:.19rem;border-radius:.2rem}
a[href^=mailto],a[href^=tel]{hyphens:none;white-space:nowrap}
.skip{position:absolute;left:-9999px}.skip:focus{left:1rem;top:1rem;z-index:99;background:var(--wit);padding:.6rem 1rem}
.symbolen{position:absolute}
.ic{width:1.15em;height:1.15em;flex:none}
.klein{font-size:.92rem;opacity:.85}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

/* knoppen */
.knop{display:inline-flex;align-items:center;gap:.6em;min-height:3.1rem;padding:.7rem 1.35rem;border-radius:3rem 3rem 3rem .5rem;font-family:var(--kopfont);font-weight:700;font-size:1.02rem;line-height:1.15;text-decoration:none;border:.14rem solid transparent;cursor:pointer;transition:background-color .2s,color .2s,transform .2s,border-color .2s}
.knop .ic{transition:transform .25s}.knop:hover .ic{transform:translateX(.25em)}
.knop-groen{background:var(--groen);color:var(--nacht)}.knop-groen:hover{background:#93c94a}
.knop-blauw{background:var(--blauw);color:#fff}.knop-blauw:hover{background:var(--blauw-d)}
.knop-lijn{border-color:currentColor;color:#fff}.knop-lijn:hover{background:#fff;color:var(--nacht);border-color:#fff}
.knop-lijn-donker{border-color:var(--inkt);color:var(--inkt)}.knop-lijn-donker:hover{background:var(--inkt);color:#fff}
.knoppen{display:flex;flex-wrap:wrap;gap:.8rem;margin:1.6rem 0 0}
.tekstlink{display:inline-flex;align-items:center;gap:.5em;min-height:2.75rem;font-family:var(--kopfont);font-weight:700;text-decoration:underline}
.tekstknop{font:inherit;color:inherit;background:none;border:0;padding:.55rem .1rem;min-height:2.75rem;min-width:2.75rem;text-decoration:underline;text-underline-offset:.2em;cursor:pointer}
.tekstknop:hover{color:var(--groen)}

/* kop */
.kop{position:sticky;top:0;z-index:50;height:var(--kop-h);display:flex;align-items:center;gap:1.2rem;padding:0 var(--rand);background:var(--wit);box-shadow:0 .06rem 0 var(--lijn)}
.kop-logo{display:flex;align-items:center;flex:none;min-height:2.75rem}
.kop-logo img{height:2.5rem;width:auto}
.kop-nav{margin-left:auto}
.kop-nav>ul{display:flex;align-items:center;gap:.2rem;list-style:none;margin:0;padding:0}
.kop-nav a,.sub-knop{display:inline-flex;align-items:center;gap:.4rem;min-height:2.75rem;min-width:2.75rem;padding:.4rem .7rem;font-family:var(--kopfont);font-weight:600;font-size:.98rem;text-decoration:none;color:var(--inkt);background:none;border:0;cursor:pointer;border-radius:.4rem;white-space:nowrap}
.kop-nav a:hover,.sub-knop:hover,.kop-nav a[aria-current],.sub-knop.is-hier{color:var(--blauw)}
.kop-nav a[aria-current]{text-decoration:underline;text-decoration-thickness:.14rem;text-underline-offset:.4em}
.heeft-sub{position:relative}
.sub{position:absolute;top:100%;left:0;min-width:17rem;list-style:none;margin:0;padding:.6rem;background:var(--wit);border-radius:.3rem 1.2rem 1.2rem 1.2rem;box-shadow:0 1rem 2.5rem rgba(12,39,64,.18);display:none}
.heeft-sub.is-open .sub,.heeft-sub:focus-within .sub{display:block}
@media (hover:hover){.heeft-sub:hover .sub{display:block}}
.sub a{display:flex;width:100%}
.nav-extra{display:none}
.kop-aanmeld{flex:none;min-height:2.75rem;padding:.5rem 1.1rem}
.menu-knop{display:none;flex:none;align-items:center;gap:.6rem;min-height:2.75rem;min-width:2.75rem;padding:.4rem .2rem;background:none;border:0;font-family:var(--kopfont);font-weight:700;font-size:1rem;color:var(--inkt);cursor:pointer}
.menu-streep{position:relative;width:1.6rem;height:.16rem;background:currentColor;border-radius:.1rem;transition:background-color .2s}
.menu-streep::before,.menu-streep::after{content:"";position:absolute;left:0;width:100%;height:.16rem;background:var(--inkt);border-radius:.1rem;transition:transform .25s}
.menu-streep::before{top:-.5rem}.menu-streep::after{top:.5rem}
.menu-open .menu-streep{background:transparent}.menu-open .menu-streep::before{transform:translateY(.5rem) rotate(45deg)}.menu-open .menu-streep::after{transform:translateY(-.5rem) rotate(-45deg)}
@media (max-width:74.9rem){
  .menu-knop{display:inline-flex;margin-left:auto}
  .kop-aanmeld{display:none}
  .kop-nav{position:fixed;inset:var(--kop-h) 0 0 0;margin:0;padding:1.2rem var(--rand) 3rem;background:var(--wit);overflow-y:auto;visibility:hidden;opacity:0;transform:translateY(-.6rem);transition:opacity .2s,transform .2s,visibility 0s .2s}
  .menu-open .kop-nav{visibility:visible;opacity:1;transform:none;transition:opacity .2s,transform .2s}
  .kop-nav>ul{flex-direction:column;align-items:stretch;gap:0}
  .kop-nav>ul>li{border-bottom:.06rem solid var(--lijn)}
  .kop-nav a,.sub-knop{width:100%;justify-content:space-between;font-size:1.35rem;font-weight:700;padding:.85rem 0;min-height:3.2rem;white-space:normal}
  .sub{position:static;display:none;box-shadow:none;padding:0 0 .8rem 1rem;min-width:0}
  .heeft-sub.is-open .sub{display:block}.heeft-sub:focus-within .sub{display:none}.heeft-sub.is-open:focus-within .sub{display:block}
  .sub a{font-size:1.08rem;font-weight:600;padding:.55rem 0;min-height:2.75rem}
  .sub-knop svg{transition:transform .2s}.is-open>.sub-knop svg{transform:rotate(180deg)}
  .nav-extra{display:flex;flex-wrap:wrap;align-items:center;gap:1rem;margin-top:1.6rem}
  .nav-extra .nav-tel{width:auto;font-size:1.15rem}
  body.menu-open{overflow:hidden}
}
@media (max-width:74.9rem) and (hover:hover){.heeft-sub:hover .sub{display:none}.heeft-sub.is-open:hover .sub{display:block}}

/* banden */
.band{position:relative;padding:clamp(4.5rem,9vw,8.5rem) var(--rand) clamp(5.5rem,11vw,10rem);background:var(--bg);color:var(--fg)}
.band-papier{--bg:var(--papier);--fg:var(--inkt)}.band-wit{--bg:var(--wit);--fg:var(--inkt)}
.band-groen{--bg:var(--groen);--fg:var(--nacht)}.band-blauw{--bg:var(--blauw);--fg:#fff}.band-nacht{--bg:var(--nacht);--fg:#fff}
.band-tekst{--bg:var(--papier);--fg:var(--inkt);padding-top:clamp(3rem,6vw,5.5rem)}
.boog{position:absolute;left:0;bottom:calc(100% - .06rem);width:100%;height:clamp(2.2rem,6.5vw,6rem);fill:var(--bg);pointer-events:none}
.band-kop{max-width:54rem;margin-bottom:clamp(2rem,4vw,3.5rem)}
.band-kop p{font-size:1.2rem;margin-top:1.1rem;max-width:40rem}
.js [data-in]{opacity:0;transform:translateY(1.4rem);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1)}
.js [data-in].in{opacity:1;transform:none}

/* hero */
.hero{position:relative;min-height:calc(100svh - var(--kop-h));display:flex;align-items:flex-end;background:var(--nacht);color:#fff;padding:clamp(3rem,6vw,5rem) var(--rand) clamp(5.5rem,10vw,9rem);isolation:isolate}
.hero-beeld{position:absolute;inset:0;z-index:-1;overflow:hidden}
.hero-beeld img,.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:70% 50%}
.hero-video{opacity:0;transition:opacity .9s}.hero-video.speelt{opacity:1}
.hero-beeld::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(12,39,64,.86) 0%,rgba(12,39,64,.62) 34%,rgba(12,39,64,.08) 62%,rgba(12,39,64,0) 100%),linear-gradient(0deg,rgba(12,39,64,.55) 0%,rgba(12,39,64,0) 38%)}
.hero-tekst{width:min(100%,50rem)}
.hero h1{font-weight:800}
.kom{display:flex;align-items:flex-end;height:clamp(4.6rem,12.5vw,11rem);--n:7;font-size:min(clamp(4.4rem,12vw,10.6rem),calc(44rem / (var(--n) * .56)));line-height:.92;color:var(--groen);white-space:nowrap}
.kom-zin{display:block;transition:opacity .16s,transform .16s}
.kom-zin.weg{opacity:0;transform:translateY(-.22em)}
.kom-zin[lang=ar],.kom-zin[lang=ur]{font-family:"Kom Arabisch","Rubik",sans-serif;line-height:1.25;letter-spacing:0}
.hero-rest{display:block;font-size:clamp(2rem,4.6vw,3.7rem);line-height:1.02;margin-top:.12em}
.hero-intro{font-size:clamp(1.05rem,1.5vw,1.25rem);max-width:35rem;margin:1.4rem 0 0;hyphens:manual}
.talen{display:flex;flex-wrap:wrap;gap:0 .35rem;margin-top:1.7rem;border-top:.06rem solid rgba(255,255,255,.3);padding-top:.5rem;max-width:36rem}
.taal{font-family:var(--kopfont);font-weight:600;font-size:.98rem;color:#fff;background:none;border:0;min-height:2.75rem;min-width:2.75rem;padding:.4rem .55rem;cursor:pointer;opacity:.72;border-bottom:.16rem solid transparent}
.taal[lang=ar],.taal[lang=ur]{font-family:"Kom Arabisch","Rubik",sans-serif;font-size:1.05rem}
.taal:hover{opacity:1}.taal[aria-pressed=true]{opacity:1;border-bottom-color:var(--groen)}
@media (max-width:43.75rem),(max-width:68.75rem) and (orientation:portrait){
  .hero{display:block;min-height:0;padding:0 0 clamp(5rem,14vw,7rem)}
  .hero-beeld{position:relative;height:54svh;min-height:17rem;z-index:0}
  .hero-beeld img,.hero-video{object-position:76% 40%}
  .hero-beeld::after{background:linear-gradient(0deg,rgba(12,39,64,1) 0%,rgba(12,39,64,0) 34%)}
  .hero-tekst{position:relative;padding:0 var(--rand);margin-top:-2.6rem;width:100%}
  .kom{height:auto;min-height:1.25em;font-size:min(5.6rem,calc((100vw - 2 * var(--rand)) / (var(--n) * .64)))}
  .hero-rest{font-size:clamp(1.9rem,8.6vw,3.6rem)}
  .knoppen .knop{flex:1 1 auto;justify-content:center}
}
@media (orientation:landscape) and (max-height:31.25rem){
  .hero{padding-top:1.2rem;padding-bottom:4.2rem}
  .kom{height:3.6rem;font-size:min(3.6rem,calc(30rem / (var(--n) * .56)))}.hero-rest{font-size:1.7rem}.hero-intro{display:none}.talen{margin-top:.7rem}.hero .knoppen{margin-top:.8rem}
}

/* taal */
.taal-raster{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:clamp(2rem,5vw,5rem);align-items:center}
.taalband h2{max-width:14em}
.tabs{display:flex;flex-wrap:wrap;gap:.3rem 1.4rem;margin:2.2rem 0 1.3rem;border-bottom:.12rem solid rgba(12,39,64,.25)}
.tabs button{font-family:var(--kopfont);font-weight:700;font-size:1.15rem;background:none;border:0;color:var(--nacht);min-height:2.9rem;min-width:2.75rem;padding:.4rem .1rem;margin-bottom:-.12rem;border-bottom:.24rem solid transparent;cursor:pointer;opacity:.7}
.tabs button[aria-selected=true]{opacity:1;border-bottom-color:var(--nacht)}
.paneel{font-size:1.18rem;max-width:42rem;min-height:13rem}
.paneel-beeld img{width:100%;border-radius:.3rem 1.6rem 1.6rem 1.6rem}
.taal-onder{margin-top:1.6rem;font-size:1rem;max-width:42rem}
.taal-beeld img{border-radius:2.5rem 2.5rem 2.5rem .5rem;width:100%}
.download{font-weight:600}
@media (max-width:43.75rem){.taal-raster{grid-template-columns:minmax(0,1fr)}.taal-beeld{order:-1;max-width:30rem}.paneel{min-height:0}}

/* hulpaanbod */
.aanbod-raster{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2rem,6vw,6rem);align-items:start}
.aanbod-kop>p{margin-top:1.4rem;font-size:1.12rem}
.aanbod-foto,.groep-foto,.pfoto{margin:2rem 0 0;position:relative}
.aanbod-foto img,.groep-foto img,.pfoto img{width:100%;height:auto;border-radius:.5rem 3rem 3rem 3rem}
figcaption{font-size:.8rem;opacity:.7;margin-top:.4rem}
.aanbod-lijst{list-style:none;margin:0;padding:0;border-top:.14rem solid var(--inkt)}
.aanbod-lijst a{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.5rem 1.5rem;align-items:center;padding:clamp(1.3rem,2.6vw,2.2rem) 0;border-bottom:.06rem solid var(--lijn);text-decoration:none;transition:padding-left .3s,color .2s}
.aanbod-naam{hyphens:manual;font-family:var(--kopfont);font-weight:800;font-size:clamp(1.7rem,3.3vw,2.9rem);line-height:1.05;letter-spacing:-.015em}
.aanbod-tekst{grid-column:1;max-width:36rem}
.aanbod-lijst .ic{grid-row:1/3;grid-column:2;width:2.2rem;height:2.2rem;color:var(--blauw);transition:transform .3s}
.aanbod-lijst a:hover{padding-left:.8rem;color:var(--blauw-d)}.aanbod-lijst a:hover .ic{transform:translateX(.4rem)}
@media (max-width:56.25rem){.aanbod-raster{grid-template-columns:minmax(0,1fr)}.aanbod-foto{max-width:34rem}}

/* wegwijzer + kaart */
.wegwijzer{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(2rem,5vw,5rem);align-items:start}
.ww-form label{display:block;font-family:var(--kopfont);font-weight:700;font-size:1.1rem;margin-bottom:.6rem}
.ww-rij{display:flex;gap:.6rem;flex-wrap:wrap}
.ww-rij input{flex:1 1 11rem;min-width:0;min-height:3.3rem;font:inherit;font-size:1.25rem;font-weight:600;padding:.5rem 1.1rem;border-radius:.4rem;border:.14rem solid rgba(255,255,255,.5);background:rgba(255,255,255,.08);color:#fff}
.ww-rij input::placeholder{color:rgba(255,255,255,.45)}
.ww-rij input:focus{border-color:var(--groen);outline:none;background:rgba(255,255,255,.14)}
.ww-uit{margin:1.6rem 0 0;min-height:11.5rem;border-left:.3rem solid var(--groen);padding:.2rem 0 .2rem 1.3rem}
.ww-uit.nee{border-left-color:var(--zon)}
.ww-leeg{opacity:.8}
.ww-antwoord{font-family:var(--kopfont);font-weight:800;font-size:clamp(1.6rem,2.8vw,2.4rem);line-height:1.1;margin-bottom:.7rem}
.ww-uit p{margin-bottom:.7em}
.ww-uit .knoppen{margin-top:1rem}
.ww-noot{font-size:.93rem;opacity:.85}
.ww-gebieden{margin-top:2.2rem;display:grid;gap:1.1rem}
.ww-gebieden h3{font-size:1.02rem;display:flex;align-items:center;gap:.6rem}
.ww-gebieden h3::before{content:"";width:.9rem;height:.9rem;border-radius:50%;background:var(--groen);flex:none}
.ww-gebieden div:nth-child(2) h3::before{background:#63b3ea}.ww-gebieden div:nth-child(3) h3::before{background:var(--zon)}
.ww-gebieden p{margin:.1rem 0 0;line-height:1.3}
.ww-kaart{position:relative}
.kaart{width:100%;height:auto;overflow:hidden;border-radius:.5rem 2.5rem 2.5rem 2.5rem}
.g-buiten{fill:rgba(255,255,255,.055);stroke:rgba(255,255,255,.16);stroke-width:1.2}
.g-in{stroke:var(--nacht);stroke-width:2;cursor:pointer;transition:fill .25s,opacity .25s;outline:none}
.g-duo{fill:var(--groen)}.g-zw{fill:#63b3ea}.g-alphen{fill:var(--zon)}
.g-in:hover,.g-in:focus-visible{fill:#fff}
.kaart.heeft-keuze .g-in{opacity:.38}.kaart.heeft-keuze .g-in.is-gekozen{opacity:1;stroke:#fff;stroke-width:4}
.g-naam{font-family:var(--kopfont);font-weight:700;font-size:19px;fill:#fff;stroke:var(--nacht);stroke-width:5px;paint-order:stroke;stroke-linejoin:round;pointer-events:none}
.loc-ring{fill:var(--nacht)}.loc-stip{fill:#fff}
.loc.is-dichtbij .loc-ring{fill:#fff}.loc.is-dichtbij .loc-stip{fill:var(--nacht)}
.jij-ring{fill:none;stroke:#fff;stroke-width:4}.jij-stip{fill:#fff;stroke:var(--nacht);stroke-width:3}
@media (max-width:56.25rem){.g-naam{font-size:24px}}
@media (max-width:43.75rem){.wegwijzer{grid-template-columns:minmax(0,1fr)}.ww-kaart{max-width:34rem}.ww-uit{min-height:0}}

/* groepwijzer */
.groep-raster{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:clamp(2rem,6vw,6rem);align-items:start}
.groep-kop>p{margin-top:1.4rem;font-size:1.12rem}
.groepwijzer{--gwn:15.5rem;--duim:2.75rem}
.gw-kop{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:.4rem 1.5rem;margin-bottom:1rem}
.gw-kop label{font-family:var(--kopfont);font-weight:800;font-size:clamp(1.7rem,3vw,2.6rem);letter-spacing:-.015em;line-height:1.05}
.gw-getal{font-family:var(--kopfont);font-weight:800;font-size:clamp(1.7rem,3vw,2.6rem);color:var(--blauw);white-space:nowrap}
.gw-veld{position:relative}
.gw-as-rij{display:grid;grid-template-columns:var(--gwn) minmax(0,1fr);gap:0 1.4rem}
.gw-schuif{grid-column:2;min-width:0;overflow:hidden;padding-bottom:.3rem}
.gw-schuif input{display:block;width:100%;margin:0;height:var(--duim);background:none;appearance:none;-webkit-appearance:none;touch-action:pan-y;cursor:pointer}
.gw-schuif input::-webkit-slider-runnable-track{height:.4rem;border-radius:.2rem;background:var(--lijn)}
.gw-schuif input::-moz-range-track{height:.4rem;border-radius:.2rem;background:var(--lijn)}
.gw-schuif input::-webkit-slider-thumb{-webkit-appearance:none;width:var(--duim);height:var(--duim);margin-top:-1.175rem;border-radius:50% 50% 50% .4rem;background:var(--blauw);border:.25rem solid #fff;box-shadow:0 .3rem .9rem rgba(12,39,64,.3)}
.gw-schuif input::-moz-range-thumb{width:2.25rem;height:2.25rem;border-radius:50% 50% 50% .4rem;background:var(--blauw);border:.25rem solid #fff;box-shadow:0 .3rem .9rem rgba(12,39,64,.3)}
.gw-as{position:relative;height:1.4rem;margin:0 calc(var(--duim) / 2);font-size:.82rem;font-weight:600;opacity:.75}
.gw-as span{position:absolute;transform:translateX(-50%)}
.gw-lijst{list-style:none;margin:.6rem 0 0;padding:0}
.gw-rij{display:grid;grid-template-columns:var(--gwn) minmax(0,1fr);gap:.1rem 1.4rem;align-items:center;padding:.85rem 0;border-top:.06rem solid var(--lijn);transition:opacity .3s}
.gw-naam{font-family:var(--kopfont);font-weight:700;font-size:1.12rem;line-height:1.2;text-decoration:none;display:inline-flex;align-items:center;min-height:2.75rem}
.gw-naam:hover{text-decoration:underline}
.gw-baan{position:relative;height:1.5rem;margin:0 calc(var(--duim) / 2)}
.gw-balk{position:absolute;top:0;bottom:0;border-radius:.2rem 1rem 1rem 1rem;background:var(--blauw);transition:background-color .3s}
.gw-info{grid-column:2;margin:0 calc(var(--duim) / 2);font-size:.95rem}
.gw-rij.past-niet{opacity:.36}.gw-rij.past-niet .gw-balk{background:var(--inkt)}
.gw-rij.past .gw-balk{background:var(--groen)}
.gw-baan::after{content:"";position:absolute;left:calc(var(--p,.333) * 100%);top:-.4rem;bottom:-.4rem;width:.2rem;margin-left:-.1rem;border-radius:.1rem;background:var(--inkt)}
.gw-rij.past-niet .gw-baan::after{opacity:.5}
.gw-uitkomst{margin:1.3rem 0 0;font-size:1.1rem;font-weight:600;min-height:3.4em}
.groep-onder{margin-top:.6rem}
@media (max-width:43.75rem){
  .groepwijzer{--gwn:0rem}
  .gw-as-rij,.gw-rij{grid-template-columns:minmax(0,1fr);gap:.2rem}
  .gw-schuif,.gw-info{grid-column:1}.gw-naam{min-height:2.2rem}
  .gw-info{margin-inline:0}
}
@media (max-width:56.25rem){.groep-raster{grid-template-columns:minmax(0,1fr)}.groep-foto{max-width:34rem}}

/* visie + caleidoscoop */
.visie-raster{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(2rem,6vw,6rem);align-items:center}
.cal{position:relative;max-width:34rem;width:100%;justify-self:center}
.cal-doek{width:100%;height:auto;aspect-ratio:1;border-radius:50%;background:var(--blauw-d);box-shadow:0 0 0 .5rem rgba(255,255,255,.14),0 2rem 4rem rgba(5,30,60,.35);touch-action:pan-y;cursor:grab}
.cal-doek:active{cursor:grabbing}
.cal-draai{display:flex;align-items:center;gap:1rem;margin-top:1.4rem;font-family:var(--kopfont);font-weight:700}
.cal-draai input{flex:1;min-width:0;margin:0;height:2.75rem;appearance:none;-webkit-appearance:none;background:none;touch-action:pan-y;cursor:pointer}
.cal-draai input::-webkit-slider-runnable-track{height:.3rem;border-radius:.2rem;background:rgba(255,255,255,.4)}
.cal-draai input::-moz-range-track{height:.3rem;border-radius:.2rem;background:rgba(255,255,255,.4)}
.cal-draai input::-webkit-slider-thumb{-webkit-appearance:none;width:2.2rem;height:2.2rem;margin-top:-.95rem;border-radius:50%;background:#fff;border:.4rem solid var(--groen)}
.cal-draai input::-moz-range-thumb{width:1.5rem;height:1.5rem;border-radius:50%;background:#fff;border:.4rem solid var(--groen)}
.visie-tekst p{font-size:1.15rem;max-width:38rem}
.visie-tekst h2{margin-bottom:1.5rem}
.kern{list-style:none;margin:2rem 0 1.4rem;padding:0;display:flex;flex-wrap:wrap;gap:.1rem 1.4rem;font-family:var(--kopfont);font-weight:800;font-size:clamp(1.5rem,2.7vw,2.3rem);line-height:1.2;letter-spacing:-.01em}
.kern li{hyphens:none}.kern li:nth-child(even){color:#bfe38a}
.kern-donker li:nth-child(even){color:var(--blauw)}.kern-donker li:nth-child(odd){color:var(--groen-d)}
@media (max-width:56.25rem){.visie-raster{grid-template-columns:minmax(0,1fr)}.cal{max-width:24rem;justify-self:start}}

/* route */
.route-raster{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2rem,6vw,6rem);align-items:start}
.route-kop>p:first-of-type{margin-top:1.4rem;font-size:1.12rem}
.stappen{list-style:none;margin:0;padding:0;counter-reset:stap;position:relative}
.stappen::before{content:"";position:absolute;left:1.45rem;top:1.5rem;bottom:2.5rem;width:.16rem;background:repeating-linear-gradient(180deg,var(--blauw) 0 .5rem,transparent .5rem 1rem)}
.stappen li{counter-increment:stap;position:relative;padding:0 0 2.1rem 4.6rem}
.stappen li::before{content:counter(stap);position:absolute;left:0;top:-.2rem;width:3.05rem;height:3.05rem;display:grid;place-items:center;border-radius:50% 50% 50% .5rem;background:var(--blauw);color:#fff;font-family:var(--kopfont);font-weight:800;font-size:1.35rem}
.stappen li:last-child::before{background:var(--groen);color:var(--nacht)}
.stappen h3{font-size:clamp(1.4rem,2.2vw,1.9rem);font-weight:800;margin-bottom:.35rem}
.stappen p{margin:0;max-width:36rem}
@media (max-width:56.25rem){.route-raster{grid-template-columns:minmax(0,1fr)}}

/* verwijzers + keurmerken */
.verw-raster{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(2rem,6vw,6rem);align-items:center}
.verw-raster p{max-width:38rem;font-size:1.1rem;margin-top:1.2rem}
.keur-kop{margin-bottom:1.2rem}
.keur{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:center;gap:1.6rem 2.4rem}
.keur img{height:4.6rem;width:auto;max-width:13rem;object-fit:contain}
@media (max-width:56.25rem){.verw-raster{grid-template-columns:minmax(0,1fr)}.keur img{height:3.6rem}}

/* voet */
.voet{position:relative;--bg:var(--nacht);background:var(--nacht);color:#fff;padding:clamp(3rem,7vw,6rem) var(--rand) 2rem}
.voet-kop{max-width:44rem;margin-bottom:clamp(3rem,6vw,5rem)}
.voet-kop .voet-roep{font-family:var(--kopfont);font-weight:800;font-size:clamp(3.4rem,10vw,8.5rem);line-height:.95;letter-spacing:-.02em;color:var(--groen);margin:0 0 1.2rem}
.voet-kop p{font-size:1.15rem}
.voet-raster{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2.5rem clamp(2rem,5vw,5rem);padding-top:2.5rem;border-top:.06rem solid rgba(255,255,255,.22)}
.voet h2{font-size:1.25rem;font-weight:700;letter-spacing:0;margin-bottom:1rem;color:var(--groen)}
.locaties,.voet-lijst{list-style:none;margin:0;padding:0;display:grid;gap:.9rem}
.locaties li,.voet-lijst li{display:grid;line-height:1.35;hyphens:none}
.locaties em{font-style:normal;font-weight:400;opacity:.75}
.locaties span,.voet-lijst .s{font-size:.93rem;opacity:.8}
.voet-lijst .k{font-weight:600}
.voet-lijst a{font-family:var(--kopfont);font-weight:700;font-size:1.12rem;display:inline-flex;align-items:center;min-height:2.75rem;justify-self:start;color:inherit}
.voet-lijst.mails li{grid-template-columns:minmax(0,1fr)}.voet-lijst.mails a{font-size:1rem;min-height:2.75rem}
.voet-lijst.mails{gap:.1rem}
.voet-lijst.donker a{color:var(--blauw-d)}
.voet-onder{display:flex;flex-wrap:wrap;align-items:center;gap:1rem 2rem;margin-top:3rem;padding-top:1.4rem;border-top:.06rem solid rgba(255,255,255,.22);font-size:.93rem}
.voet-onder ul{display:flex;flex-wrap:wrap;gap:0 1.4rem;list-style:none;margin:0;padding:0}
.voet-onder a{display:inline-flex;align-items:center;min-height:2.75rem}
.voet-onder p{margin:0 0 0 auto}
.voet-hand{width:3.4rem;height:auto;aspect-ratio:946/478}
.hand-groen{fill:var(--groen)}.hand-blauw{fill:#3d9be0}
@media (max-width:56.25rem){.voet-raster{grid-template-columns:minmax(0,1fr)}.voet-onder p{margin-left:0}}

/* paginakop */
.pkop{position:relative;overflow:hidden;padding:clamp(1.6rem,3vw,2.6rem) var(--rand) clamp(5rem,10vw,8.5rem);color:#fff;background:var(--bg)}
.pkop-groen{--bg:var(--groen);color:var(--nacht)}.pkop-blauw{--bg:var(--blauw)}.pkop-nacht{--bg:var(--nacht)}
.kruim{display:flex;align-items:center;gap:.6rem;font-size:.93rem;font-weight:600;margin-bottom:clamp(2rem,5vw,4rem)}
.kruim a{display:inline-flex;align-items:center;min-height:2.75rem;min-width:2.75rem}
.pkop h1{position:relative;z-index:1;font-weight:800;letter-spacing:-.025em;line-height:.98;font-size:min(clamp(3rem,9vw,8.2rem),calc((100vw - 2 * var(--rand)) / (var(--n) * .69)))}
.pkop-intro{position:relative;z-index:1;font-size:1.25rem;max-width:36rem;margin:1.5rem 0 0}
.pkop-hand{position:absolute;right:-4%;bottom:-18%;width:min(46vw,40rem);height:auto;aspect-ratio:946/478;opacity:.2;pointer-events:none}
.pkop .hand-groen,.pkop .hand-blauw{fill:#fff}
.pkop-groen .hand-groen,.pkop-groen .hand-blauw{fill:var(--nacht)}.pkop-groen .pkop-hand{opacity:.13}
.pkop+.band{border-radius:0}
.pkop+.band::before{content:"";position:absolute;left:0;right:0;bottom:calc(100% - .06rem);height:clamp(2.2rem,6.5vw,6rem);background:var(--bg);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath d='M0,100 C34,100 58,22 100,0 L100,101 L0,101Z'/%3E%3C/svg%3E") center/100% 100% no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath d='M0,100 C34,100 58,22 100,0 L100,101 L0,101Z'/%3E%3C/svg%3E") center/100% 100% no-repeat;pointer-events:none}

/* tekstpagina's */
.tekst-raster{display:grid;grid-template-columns:minmax(0,7fr) minmax(17rem,4fr);gap:clamp(2rem,6vw,6rem);align-items:start}
.prose{max-width:50rem;font-size:1.1rem}
.prose>*:first-child{margin-top:0}
.prose h2{font-size:clamp(1.7rem,3vw,2.5rem);margin:2.4rem 0 .9rem}
.prose h3{font-size:1.25rem;margin:1.7rem 0 .45rem;color:var(--blauw-d)}
.prose a{color:var(--blauw-d);font-weight:600}
.prose .knop{color:var(--nacht)}
.prose ul,.prose ol{margin:0 0 1.2em;padding:0;list-style:none;display:grid;gap:.55rem}
.prose ul>li{position:relative;padding-left:2.5rem}
.prose ul>li::before{content:"";position:absolute;left:0;top:.42em;width:1.7rem;height:1rem;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 24'%3E%3Cpath d='M3 5c8-5 14 5 22 0s9 1 12-1M3 12c8-5 14 5 22 0s9 1 12-1M3 19c8-5 14 5 22 0s9 1 12-1' fill='none' stroke='%230b72b9' stroke-width='3.2' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat}
.prose ol{counter-reset:punt}
.prose ol>li{counter-increment:punt;position:relative;padding:.55rem 0 .55rem 3.2rem;border-bottom:.06rem solid var(--lijn)}
.prose ol>li::before{content:counter(punt);position:absolute;left:0;top:.4rem;width:2.2rem;height:2.2rem;display:grid;place-items:center;border-radius:50% 50% 50% .35rem;background:var(--nacht);color:#fff;font-family:var(--kopfont);font-weight:700;font-size:.98rem}
.prose ol.kern{display:flex}.prose ol.kern>li{padding:0;border:0}.prose ol.kern>li::before{content:none}
.prose ul.keur{display:flex;margin-top:1.5rem}.prose ul.keur>li{padding:0}.prose ul.keur>li::before{content:none}
.klacht figcaption{font-size:1rem;opacity:1;margin-top:.8rem}.klacht figcaption a{display:inline-flex;align-items:center;min-height:2.75rem}
.letop{padding:1.1rem 0;border-block:.14rem solid var(--inkt)}
.pfoto{margin:0 0 2rem}
.zij{position:sticky;top:calc(var(--kop-h) + 1.5rem)}
.zij-in{background:var(--wit);border-radius:.5rem 2.2rem 2.2rem 2.2rem;padding:1.7rem;display:grid;gap:.8rem}
.zij-kop{font-family:var(--kopfont);font-weight:800;font-size:1.45rem;margin:0}
.zij .knop{justify-content:center}
.zij-klein{font-size:.9rem;margin:.4rem 0 0}
.zij-links{list-style:none;margin:.3rem 0 0;padding:.6rem 0 0;border-top:.06rem solid var(--lijn)}
.zij-links a{display:inline-flex;align-items:center;min-height:2.75rem;font-weight:600}
.check{list-style:none;margin:0;padding:0;display:grid;gap:.6rem}
.check li{position:relative;padding-left:1.9rem;hyphens:none}
.check li::before{content:"";position:absolute;left:.1rem;top:.35em;width:.95rem;height:.5rem;border-left:.2rem solid var(--groen-d);border-bottom:.2rem solid var(--groen-d);transform:rotate(-45deg)}
@media (max-width:56.25rem){.tekst-raster{grid-template-columns:minmax(0,1fr)}.zij{position:static}}

/* downloads */
.downloads{list-style:none!important;margin:1.2rem 0 1.6rem!important;padding:0;display:grid!important;gap:.8rem!important}
.downloads li{padding:0!important}.downloads li::before{content:none!important}
.dl{display:flex;align-items:center;gap:1.1rem;min-height:4rem;padding:.8rem 1.2rem;background:var(--wit);border-radius:.4rem 1.6rem 1.6rem 1.6rem;text-decoration:none;color:var(--inkt)!important;transition:transform .2s,box-shadow .2s}
.dl:hover{transform:translateY(-.15rem);box-shadow:0 .8rem 1.8rem rgba(12,39,64,.14)}
.dl-vel{width:2.9rem;height:2.9rem;flex:none;display:grid;place-items:center;border-radius:50% 50% 50% .4rem;background:var(--blauw);color:#fff}
.dl-vel .ic{width:1.4rem;height:1.4rem}
.dl-tekst{display:grid;line-height:1.3}.dl-tekst span{font-size:.88rem;font-weight:400;opacity:.75}
.downloads.met-omslag{grid-template-columns:repeat(3,minmax(0,1fr))}
.met-omslag .dl{flex-direction:column;align-items:flex-start;padding:.8rem .8rem 1rem}
.met-omslag .dl img{width:100%;height:auto;border-radius:.2rem 1rem 1rem 1rem}
@media (max-width:37.5rem){.downloads.met-omslag{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* groepsaanbod-pagina */
.pagina-groep .groep-kop p{font-size:1.1rem}
.trainingen-in{display:grid;gap:0}
.training{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:1.2rem clamp(2rem,6vw,6rem);padding:clamp(2rem,4vw,3.4rem) 0;border-top:.14rem solid var(--inkt)}
.training h2{font-size:clamp(1.55rem,2.5vw,2.3rem);hyphens:auto;overflow-wrap:break-word}
.training-feit{display:grid;gap:.2rem;margin:1.1rem 0 0;font-family:var(--kopfont);font-weight:700}
.training-feit span:first-child{color:var(--blauw-d);font-size:1.25rem}
.training-tekst{max-width:46rem}
.training-tekst h3{font-size:1.02rem;color:var(--blauw-d);margin:1.3rem 0 .25rem}
.training-tekst h3:first-child{margin-top:0}
.training-tekst p{margin-bottom:.7em}
.planning{margin-top:1rem;padding-top:clamp(2rem,4vw,3.4rem);border-top:.14rem solid var(--inkt);max-width:46rem}
.planning h2{font-size:clamp(1.7rem,3.2vw,2.8rem)}
@media (max-width:56.25rem){.training{grid-template-columns:minmax(0,1fr)}}

/* vacatures */
.vac-raster h2{margin-bottom:1.6rem}
.vac-lijst{border-top:.14rem solid var(--inkt)}
.vacature{border-bottom:.06rem solid var(--lijn)}
.vacature summary{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:.3rem 2rem;padding:1.5rem 0;cursor:pointer;list-style:none;min-height:4rem}
.vacature summary::-webkit-details-marker{display:none}
.vac-titel{font-family:var(--kopfont);font-weight:800;font-size:clamp(1.6rem,3.6vw,3rem);line-height:1.05;letter-spacing:-.015em;hyphens:manual}
.vac-uren{font-family:var(--kopfont);font-weight:600;color:var(--blauw-d);white-space:nowrap}
.vac-plus{position:relative;width:2.75rem;height:2.75rem;border-radius:50% 50% 50% .4rem;background:var(--groen);flex:none}
.vac-plus::before,.vac-plus::after{content:"";position:absolute;left:50%;top:50%;width:1.1rem;height:.18rem;background:var(--nacht);transform:translate(-50%,-50%);transition:transform .25s}
.vac-plus::after{transform:translate(-50%,-50%) rotate(90deg)}
[open] .vac-plus::after{transform:translate(-50%,-50%) rotate(0)}
.vac-tekst{padding:0 0 2.5rem;max-width:52rem}
@media (max-width:43.75rem){.vacature summary{grid-template-columns:minmax(0,1fr) auto}.vac-uren{grid-row:2}.vac-plus{grid-row:1/3;grid-column:2}}

/* formulieren */
.formulier{margin-top:2.2rem;display:grid;gap:1.8rem}
.formulier fieldset{min-width:0;margin:0;padding:1.6rem;border:0;background:var(--wit);border-radius:.5rem 2rem 2rem 2rem}
.formulier legend{float:left;width:100%;font-family:var(--kopfont);font-weight:800;font-size:1.5rem;margin-bottom:1.1rem;padding:0}
.velden{clear:both;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem 1.2rem}
.veld{display:grid;gap:.35rem;align-content:start}.veld-breed{grid-column:1/-1}
.veld label,.veld-kop{font-weight:600;font-size:.98rem;line-height:1.3}
.veld-kop{clear:both;margin:1.4rem 0 .6rem}
.ster{color:#b3261e}
.veld input,.veld select,.veld textarea{width:100%;min-width:0;min-height:3rem;font:inherit;padding:.6rem .85rem;border:.1rem solid rgba(19,39,59,.4);border-radius:.4rem;background:var(--wit);color:var(--inkt)}
.veld select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%2313273b' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .9rem center;background-size:.8rem;padding-right:2.4rem}
.veld input[type=file]{padding:.55rem;background:var(--papier)}
.veld input:focus,.veld select:focus,.veld textarea:focus{border-color:var(--blauw);outline:.16rem solid rgba(11,114,185,.3)}
.veld .is-fout,.keuzes.is-fout{border-color:#b3261e;outline:.12rem solid rgba(179,38,30,.25)}
.keuzes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.4rem 1.2rem;border-radius:.4rem}
.keuzes-rij{margin-bottom:1.2rem}
.keuze{display:flex;align-items:center;gap:.7rem;min-height:2.75rem;cursor:pointer;line-height:1.3}
.keuze input{width:1.35rem;height:1.35rem;flex:none;accent-color:var(--blauw);margin:0}
.demo-noot{margin:0;padding:1rem 1.3rem;border:.14rem dashed var(--inkt);border-radius:.4rem;font-size:.98rem}
.form-uit:not(:empty){padding:1.4rem 1.6rem;background:var(--nacht);color:#fff;border-radius:.5rem 2rem 2rem 2rem}
.form-uit h3{color:var(--groen);margin-bottom:.5rem;font-size:1.5rem}
.form-uit.is-fout{background:#7d1b15}.form-uit.is-fout h3{color:#fff}
@media (max-width:43.75rem){.velden,.keuzes{grid-template-columns:minmax(0,1fr)}.formulier fieldset{padding:1.2rem}}

/* contact, media, klacht */
.contact-raster{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(2rem,6vw,6rem);align-items:start}
.contact-lijsten h2{font-size:1.5rem;margin:0 0 1rem}.contact-lijsten h2:not(:first-child){margin-top:2.4rem}
.pagina-weg .locaties{grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));margin-top:1.6rem;gap:1.2rem 2rem}
.pagina-weg .band-kop{max-width:none}
.pkop-nacht+.pagina-weg{padding-top:clamp(1.5rem,3vw,2.5rem)}.pkop-nacht+.pagina-weg::before{content:none}.p-werkgebied .pkop{padding-bottom:clamp(2.5rem,5vw,4rem)}
.pagina-weg .band-kop>p{max-width:46rem}
.flyer-duo{margin:2rem 0 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.flyer-duo img{border-radius:.4rem 1.6rem 1.6rem 1.6rem;width:100%;height:auto}
.klacht{margin:1.5rem 0 2rem;max-width:30rem}
.klacht img{width:100%;height:auto;border-radius:.4rem 1.6rem 1.6rem 1.6rem}
@media (max-width:56.25rem){.contact-raster{grid-template-columns:minmax(0,1fr)}}
@media print{.kop,.voet,.zij,.boog{display:none}}
