
:root{
  --navy:#0E3F5C;--navy-d:#0A2F45;--blauw:#1A8DCB;--blauw-k:#1474A8;--groen:#6BB84A;--groen-k:#4E9A2F;
  --lichtblauw:#E8F4FB;--lichtgroen:#EDF7E7;--bg:#F7FAFC;--lijn:#DCE8EF;--inkt:#1B2B34;--grijs:#586873;--ster:#F2B300;--wit:#fff;
  --kop:"Outfit",system-ui,sans-serif;--tekst:"DM Sans",system-ui,sans-serif;
  --grad:linear-gradient(120deg,var(--blauw) 0%,#2BB3B0 55%,var(--groen) 100%);
  --ease:cubic-bezier(.2,.8,.2,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;overflow-x:clip}
body{font-family:var(--tekst);font-size:16px;line-height:1.6;color:var(--inkt);background:var(--bg);overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
.wrap{max-width:1200px;margin:0 auto;padding:0 20px}
section{padding:80px 0;position:relative}
h1,h2,h3{font-family:var(--kop);font-weight:500;letter-spacing:-.025em;color:var(--navy);line-height:1.08}
h1{font-size:42px}
h2{font-size:32px}
h3{font-size:20px;letter-spacing:-.01em;line-height:1.25}
.label{display:inline-flex;align-items:center;gap:8px;font-size:13px;letter-spacing:.08em;text-transform:uppercase;font-weight:600;color:var(--groen-k);margin-bottom:16px}
.label::before{content:"";width:18px;height:2px;border-radius:2px;background:var(--grad)}
.intro{font-size:18px;color:var(--grijs);max-width:620px}
.head{margin-bottom:40px}
.head .intro{margin-top:14px}
.grad-text{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}

/* scroll progress */
.progress{position:fixed;top:0;left:0;height:3px;width:100%;background:var(--grad);transform-origin:0 50%;transform:scaleX(0);z-index:100}

/* knoppen */
.btn{position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:10px;height:54px;padding:0 28px;border-radius:999px;font-weight:600;font-size:16px;border:0;cursor:pointer;white-space:nowrap;transition:transform .2s var(--ease),box-shadow .3s,background .3s,color .3s}
.btn .arr{transition:transform .3s var(--ease)}
.btn:hover .arr{transform:translateX(4px)}
.btn:active{transform:scale(.97)}
.btn-p{background:var(--blauw-k);color:#fff;box-shadow:0 8px 24px rgba(20,116,168,.28)}
.btn-p:hover{background:var(--navy);box-shadow:0 12px 30px rgba(14,63,92,.3)}
.btn-p::after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.35),transparent);transform:skewX(-20deg);animation:shine 4.5s 2s infinite}
@keyframes shine{0%,70%{left:-60%}100%{left:130%}}
.btn-s{background:var(--wit);color:var(--navy);box-shadow:inset 0 0 0 1.5px var(--lijn)}
.btn-s:hover{box-shadow:inset 0 0 0 1.5px var(--blauw)}
.btn-w{background:#fff;color:var(--navy)}
.btn-w:hover{background:var(--lichtblauw)}
.btn-o{background:transparent;color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.45)}
.btn-o:hover{background:rgba(255,255,255,.1)}
.link{display:inline-flex;align-items:center;gap:8px;font-weight:600;color:var(--blauw-k);margin-top:24px}
.link span{transition:transform .3s var(--ease)}
.link:hover span{transform:translateX(4px)}

.logo-img{display:inline-block;vertical-align:middle;aspect-ratio:553/211;background:url(/assets/logo.png) center/contain no-repeat}
/* nav */
nav{position:sticky;top:0;z-index:50;background:rgba(247,250,252,.85);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);transition:box-shadow .3s}
nav.scrolled{box-shadow:0 1px 0 var(--lijn),0 8px 24px rgba(14,63,92,.05)}
.nav-in{display:flex;align-items:center;justify-content:space-between;height:72px;transition:height .3s var(--ease)}
nav.scrolled .nav-in{height:62px}
.logo-img{height:46px;transition:height .3s var(--ease)}
nav.scrolled .logo-img{height:40px}
.menu{display:none;gap:4px;font-size:15px;font-weight:500}
.menu a{padding:8px 14px;border-radius:999px;transition:background .2s,color .2s}
.menu a:hover{background:var(--lichtblauw);color:var(--blauw-k)}
.nav-r{display:flex;align-items:center;gap:14px}
.nav-tel{display:none;align-items:center;gap:8px;font-weight:600;color:var(--navy);font-size:15px}
.nav-r .btn{display:none;height:46px;padding:0 22px;font-size:15px}
.burger{width:46px;height:46px;border-radius:50%;background:#fff;border:1px solid var(--lijn);display:grid;place-items:center;cursor:pointer}
.burger i{display:block;width:18px;height:2px;border-radius:2px;background:var(--navy);box-shadow:0 -6px 0 var(--navy),0 6px 0 var(--navy)}
.mobmenu{position:fixed;inset:0;z-index:90;background:var(--bg);padding:18px 20px calc(24px + env(safe-area-inset-bottom));display:flex;flex-direction:column;clip-path:circle(0 at calc(100% - 43px) 36px);transition:clip-path .6s var(--ease);visibility:hidden}
.mobmenu.open{clip-path:circle(150% at calc(100% - 43px) 36px);visibility:visible}
.mm-top{display:flex;justify-content:space-between;align-items:center}
.close{width:46px;height:46px;border-radius:50%;border:1px solid var(--lijn);background:#fff;font-size:24px;color:var(--navy);cursor:pointer}
.mobmenu ul{list-style:none;margin-top:36px}
.mobmenu li{overflow:hidden}
.mobmenu li a{display:block;font-family:var(--kop);font-size:36px;font-weight:500;color:var(--navy);padding:6px 0;transform:translateY(110%);transition:transform .6s var(--ease)}
.mobmenu.open li a{transform:none}
.mobmenu li:nth-child(2) a{transition-delay:.05s}.mobmenu li:nth-child(3) a{transition-delay:.1s}.mobmenu li:nth-child(4) a{transition-delay:.15s}.mobmenu li:nth-child(5) a{transition-delay:.2s}.mobmenu li:nth-child(6) a{transition-delay:.25s}
.mm-bottom{margin-top:auto;display:grid;gap:10px}

/* hero */
.hero{padding:28px 0 64px;overflow:hidden;position:relative}
.blob{position:absolute;border-radius:50%;filter:blur(60px);opacity:.45;z-index:-1;animation:float 14s ease-in-out infinite}
.blob.b1{width:380px;height:380px;background:#9FD3F0;top:-80px;right:-120px}
.blob.b2{width:300px;height:300px;background:#C5E6B1;bottom:-60px;left:-120px;animation-delay:-6s}
@keyframes float{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(30px,-20px) scale(1.06)}66%{transform:translate(-20px,20px) scale(.96)}}
.hero-grid{display:grid;gap:44px}
.pill{display:inline-flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--lijn);border-radius:999px;padding:6px 14px 6px 6px;font-size:14px;font-weight:500;color:var(--navy);margin-bottom:22px;box-shadow:0 4px 14px rgba(14,63,92,.05)}
.pill b{background:var(--lichtgroen);color:var(--groen-k);border-radius:999px;padding:3px 10px;font-size:12px;font-weight:600}
.dot{width:8px;height:8px;border-radius:50%;background:var(--groen);box-shadow:0 0 0 0 rgba(107,184,74,.6);animation:ping 2s infinite}
@keyframes ping{0%{box-shadow:0 0 0 0 rgba(107,184,74,.6)}80%,100%{box-shadow:0 0 0 10px rgba(107,184,74,0)}}
.hero h1{margin-bottom:22px}
.line{display:block;overflow:hidden;padding-bottom:.06em}
.line>span{display:inline-block;transform:translateY(105%);animation:up .9s var(--ease) forwards}
.line:nth-child(2)>span{animation-delay:.12s}
@keyframes up{to{transform:none}}
.fade-up{opacity:0;transform:translateY(18px);animation:fu .9s var(--ease) forwards}
@keyframes fu{to{opacity:1;transform:none}}
.d1{animation-delay:.35s}.d2{animation-delay:.5s}.d3{animation-delay:.65s}.d4{animation-delay:.8s}
.hero .intro{margin-bottom:30px}
.hero-btns{display:flex;flex-direction:column;gap:12px}
.trust{display:flex;align-items:center;gap:14px;margin-top:30px}
.avatars{display:flex}
.avatars span{width:36px;height:36px;border-radius:50%;border:2.5px solid var(--bg);margin-left:-10px;display:grid;place-items:center;font-size:13px;font-weight:600;color:#fff}
.avatars span:first-child{margin-left:0}
.trust small{display:block;font-size:13px;color:var(--grijs);line-height:1.35}
.trust .stars{color:var(--ster);letter-spacing:1px;font-size:14px}
.hero-vis{position:relative}
.hero-photo{border-radius:32px;overflow:hidden;aspect-ratio:1/1.05;background:linear-gradient(160deg,var(--lichtblauw),var(--lichtgroen));color:transparent;clip-path:inset(100% 0 0 0 round 32px);animation:reveal 1.3s .25s var(--ease) forwards}
@keyframes reveal{to{clip-path:inset(0 0 0 0 round 32px)}}
.hero-photo img{width:100%;height:100%;object-fit:cover;transform:scale(1.15);animation:unzoom 1.8s .25s var(--ease) forwards}
@keyframes unzoom{to{transform:scale(1)}}
.float-card{position:absolute;background:rgba(255,255,255,.94);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-radius:20px;padding:14px 16px;box-shadow:0 16px 40px rgba(14,63,92,.16);display:flex;align-items:center;gap:12px;opacity:0;animation:pop .8s var(--ease) forwards,bob 6s ease-in-out infinite}
@keyframes pop{from{opacity:0;transform:translateY(16px) scale(.94)}to{opacity:1;transform:none}}
@keyframes bob{0%,100%{translate:0 0}50%{translate:0 -8px}}
.fc1{left:-6px;bottom:28px;animation-delay:1.1s,1.9s}
.fc2{right:-6px;top:26px;animation-delay:1.35s,2.4s}
.fc-ic{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;flex:none}
.fc-ic.g{background:var(--lichtgroen)}.fc-ic.b{background:var(--lichtblauw)}
.float-card b{font-family:var(--kop);font-size:20px;font-weight:600;color:var(--navy);line-height:1;display:block}
.float-card small{font-size:12.5px;color:var(--grijs);line-height:1.3;display:block;margin-top:2px}

/* marquee */
.marquee{background:var(--navy);color:#fff;padding:18px 0;overflow:hidden;white-space:nowrap}
.mq-track{display:inline-flex;gap:48px;animation:mq 32s linear infinite;padding-left:48px}
.mq-track span{display:inline-flex;align-items:center;gap:12px;font-family:var(--kop);font-size:18px;font-weight:500}
.mq-track span::after{content:"";width:6px;height:6px;border-radius:50%;background:var(--groen);margin-left:36px}
@keyframes mq{to{transform:translateX(-50%)}}

/* klachtenkiezer */
.kiezer{display:grid;gap:28px;align-items:center}
.body-wrap{position:relative;background:#fff;border:1px solid var(--lijn);border-radius:32px;padding:24px;display:grid;place-items:center}
.body-wrap>svg{width:100%;max-width:240px;height:auto;overflow:visible}
.bp{fill:#EAF3F8;stroke:#CFE3EE;stroke-width:1.5;transition:fill .4s}
.limb{stroke:#EAF3F8;stroke-linecap:round;fill:none}
.limb-o{stroke:#CFE3EE;stroke-linecap:round;fill:none}
.spot{cursor:pointer}
.spot .halo{fill:var(--blauw);opacity:.18;transform-box:fill-box;transform-origin:center;animation:halo 2.4s infinite}
.spot .core{fill:#fff;stroke:var(--blauw);stroke-width:3;transition:fill .3s,stroke .3s,r .3s}
.spot:hover .core{fill:var(--lichtblauw)}
.spot.active .core{fill:var(--groen);stroke:#fff;r:9}
.spot.active .halo{fill:var(--groen);opacity:.3}
@keyframes halo{0%{transform:scale(.6);opacity:.35}100%{transform:scale(2.2);opacity:0}}
.spot:nth-of-type(2) .halo{animation-delay:.4s}.spot:nth-of-type(3) .halo{animation-delay:.8s}.spot:nth-of-type(4) .halo{animation-delay:1.2s}.spot:nth-of-type(5) .halo{animation-delay:1.6s}.spot:nth-of-type(6) .halo{animation-delay:2s}
.tap-hint{position:absolute;top:18px;left:18px;font-size:13px;color:var(--grijs);display:flex;align-items:center;gap:8px}
.tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}
.tab{border:1px solid var(--lijn);background:#fff;border-radius:999px;padding:9px 16px;font-size:14.5px;font-weight:600;color:var(--navy);cursor:pointer;transition:all .25s}
.tab:hover{border-color:var(--blauw)}
.tab.active{background:var(--navy);border-color:var(--navy);color:#fff}
.panel{background:#fff;border:1px solid var(--lijn);border-radius:28px;padding:30px 24px;min-height:360px}
.panel-in{animation:panel .5s var(--ease)}
@keyframes panel{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.panel h3{font-size:26px;margin-bottom:10px}
.panel>div>p{color:var(--grijs)}
.panel h4{font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--grijs);margin:24px 0 10px;font-weight:600}
.checks{list-style:none;display:grid;gap:10px}
.checks li{display:flex;gap:12px;align-items:flex-start;font-size:15.5px}
.checks li::before{content:"";flex:none;width:22px;height:22px;border-radius:50%;background:var(--lichtgroen) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22'%3E%3Cpath d='M7 11.5l2.6 2.6L15 8.5' fill='none' stroke='%234E9A2F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");margin-top:1px}
.panel .btn{margin-top:28px;width:100%}

/* behandelingen */
.beh{background:#fff}
.beh-grid{display:grid;gap:14px}
.bcard{position:relative;border-radius:28px;padding:30px 26px;background:var(--bg);border:1px solid var(--lijn);overflow:hidden;transition:transform .45s var(--ease),box-shadow .45s,border-color .3s;isolation:isolate}
.bcard::before{content:"";position:absolute;inset:0;background:var(--grad);opacity:0;transition:opacity .45s;z-index:-1}
.bcard:hover{transform:translateY(-6px);box-shadow:0 24px 50px rgba(14,63,92,.14);border-color:transparent}
.bcard:hover::before{opacity:1}
.bcard:hover h3,.bcard:hover p,.bcard:hover .num,.bcard:hover .more{color:#fff}
.bcard:hover .bic{background:rgba(255,255,255,.2)}
.bcard:hover .bic svg{stroke:#fff}
.bic{width:54px;height:54px;border-radius:18px;background:#fff;display:grid;place-items:center;margin-bottom:46px;transition:background .3s}
.bic svg{transition:stroke .3s}
.bcard .num{position:absolute;top:28px;right:26px;font-family:var(--kop);color:var(--grijs);font-size:14px;transition:color .3s}
.bcard h3{margin-bottom:10px;transition:color .3s}
.bcard p{color:var(--grijs);font-size:15.5px;transition:color .3s}
.bcard .more{display:inline-flex;gap:8px;margin-top:22px;font-weight:600;color:var(--blauw-k);transition:color .3s}

/* cijfers */
.stats{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.stat{background:#fff;border:1px solid var(--lijn);border-radius:24px;padding:24px 20px}
.stat b{font-family:var(--kop);font-weight:600;font-size:40px;letter-spacing:-.03em;line-height:1;display:block}
.stat small{display:block;color:var(--grijs);font-size:14px;margin-top:8px;line-height:1.35}

/* werkwijze */
.tl{position:relative;list-style:none;display:grid;gap:30px;padding-left:56px}
.tl-track{position:absolute;left:21px;top:8px;bottom:8px;width:2px;background:var(--lijn);border-radius:2px}
.tl-fill{position:absolute;left:0;top:0;width:100%;height:100%;background:var(--grad);transform-origin:0 0;transform:scaleY(0);border-radius:2px}
.tl li{position:relative}
.tl .n{position:absolute;left:-56px;top:-4px;width:44px;height:44px;border-radius:50%;background:#fff;border:2px solid var(--lijn);display:grid;place-items:center;font-family:var(--kop);font-weight:600;color:var(--grijs);transition:all .5s var(--ease)}
.tl li.on .n{background:var(--navy);border-color:var(--navy);color:#fff;box-shadow:0 0 0 6px var(--lichtblauw)}
.tl h3{margin-bottom:6px}
.tl p{color:var(--grijs);font-size:15.5px;max-width:460px}
.work{display:grid;gap:44px}
.work-side{background:var(--navy);color:#fff;border-radius:32px;padding:34px 26px;align-self:start;position:relative;overflow:hidden}
.work-side::after{content:"";position:absolute;width:260px;height:260px;border-radius:50%;background:var(--grad);filter:blur(50px);opacity:.45;right:-90px;bottom:-110px}
.work-side h3{color:#fff;font-size:26px;position:relative}
.work-side p{color:rgba(255,255,255,.75);margin:12px 0 26px;position:relative}
.work-side .btn{position:relative;width:100%}

/* egym */
.egym{background:linear-gradient(160deg,var(--navy) 0%,#0F527A 100%);color:#fff;border-radius:40px;margin:0 12px;overflow:hidden;position:relative}
.egym .label{color:#9FD7A0}
.egym h2{color:#fff}
.egym .intro{color:rgba(255,255,255,.75)}
.eg-grid{display:grid;gap:44px;align-items:center}
.eg-list{list-style:none;display:grid;gap:14px;margin:28px 0 32px}
.eg-list li{display:flex;gap:14px;align-items:flex-start}
.eg-list .ic{flex:none;width:40px;height:40px;border-radius:12px;background:rgba(255,255,255,.1);display:grid;place-items:center}
.eg-list b{display:block;font-weight:600}
.eg-list small{color:rgba(255,255,255,.65);font-size:14.5px}
.dash{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);border-radius:28px;padding:24px;backdrop-filter:blur(8px)}
.dash-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;font-size:14px;color:rgba(255,255,255,.7)}
.dash-top b{color:#fff;font-weight:600}
.dash-mid{display:grid;grid-template-columns:150px 1fr;gap:20px;align-items:center}
.ringsvg{width:150px;height:150px;transform:rotate(-90deg)}
.ringsvg .bgc{fill:none;stroke:rgba(255,255,255,.12);stroke-width:12}
.ringsvg .fg{fill:none;stroke:url(#rg);stroke-width:12;stroke-linecap:round;stroke-dasharray:377;stroke-dashoffset:377;transition:stroke-dashoffset 1.8s var(--ease)}
.ring-wrap{position:relative}
.ring-wrap div{position:absolute;inset:0;display:grid;place-items:center;text-align:center}
.ring-wrap b{font-family:var(--kop);font-size:34px;font-weight:600;line-height:1}
.ring-wrap small{display:block;font-size:12px;color:rgba(255,255,255,.65)}
.bars{display:grid;gap:12px}
.bar small{display:flex;justify-content:space-between;font-size:13px;color:rgba(255,255,255,.75);margin-bottom:5px}
.bar i{display:block;height:8px;border-radius:8px;background:rgba(255,255,255,.12);overflow:hidden}
.bar i::after{content:"";display:block;height:100%;width:var(--w);border-radius:8px;background:var(--grad);transform:scaleX(0);transform-origin:0 0;transition:transform 1.4s var(--ease)}
.dash.in .bar i::after{transform:scaleX(1)}
.dash.in .bar:nth-child(2) i::after{transition-delay:.15s}.dash.in .bar:nth-child(3) i::after{transition-delay:.3s}
.dash-note{font-size:12px;color:rgba(255,255,255,.5);margin-top:16px}

/* team */
.team-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.tm .ph{aspect-ratio:3/4;border-radius:24px;background:linear-gradient(160deg,var(--lichtblauw),var(--lichtgroen));display:grid;place-items:center;margin-bottom:14px;overflow:hidden;position:relative;transition:transform .45s var(--ease)}
.tm:hover .ph{transform:translateY(-4px)}
.tm .ph span{font-family:var(--kop);font-size:48px;font-weight:500;color:var(--blauw-k);opacity:.45}
.tm h3{font-size:18px}
.tm p{font-size:14px;color:var(--grijs)}
.todo{color:#C2410C!important;font-weight:500}

/* reviews */
.rev{background:#fff}
.rev-top{display:grid;gap:24px;margin-bottom:36px}
.gscore{display:flex;align-items:center;gap:18px;background:var(--bg);border:1px solid var(--lijn);border-radius:24px;padding:20px 22px;align-self:start}
.gscore b{font-family:var(--kop);font-size:52px;font-weight:600;color:var(--navy);line-height:1;letter-spacing:-.03em}
.gscore .stars{color:var(--ster);font-size:18px;letter-spacing:2px}
.gscore small{display:block;color:var(--grijs);font-size:14px}
.rev-row{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 -20px;padding:4px 20px 8px;scrollbar-width:none}
.rev-row::-webkit-scrollbar{display:none}
.rcard{flex:0 0 84%;scroll-snap-align:start;background:var(--bg);border:1.5px dashed #BFD9E8;border-radius:24px;padding:26px 22px}
.rcard .stars{color:var(--ster);letter-spacing:2px}
.rcard p{margin:12px 0 18px;color:var(--grijs);font-style:italic}
.rcard .who{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:600;color:var(--navy)}
.rcard .who span{width:34px;height:34px;border-radius:50%;background:var(--lichtblauw);display:grid;place-items:center;color:var(--blauw-k)}

/* verzekeraars */
.ins{display:flex;flex-direction:column;gap:16px;padding:34px 0;border-top:1px solid var(--lijn);margin-top:56px}
.ins p{font-size:15px;color:var(--grijs);max-width:440px}
.ins-list{display:flex;flex-wrap:wrap;gap:8px}
.ins-list span{background:var(--bg);border:1px solid var(--lijn);border-radius:999px;padding:8px 16px;font-weight:600;color:var(--navy);font-size:14px}

/* afspraak */
.afspraak{display:grid;gap:36px}
.form-card{background:#fff;border:1px solid var(--lijn);border-radius:32px;padding:26px 22px;box-shadow:0 24px 60px rgba(14,63,92,.08)}
.fsteps{display:flex;gap:6px;margin-bottom:24px}
.fsteps i{flex:1;height:5px;border-radius:5px;background:var(--lijn);overflow:hidden;position:relative}
.fsteps i::after{content:"";position:absolute;inset:0;background:var(--grad);transform:scaleX(0);transform-origin:0 0;transition:transform .5s var(--ease)}
.fsteps i.on::after{transform:scaleX(1)}
.fstep{display:none}
.fstep.show{display:block;animation:panel .45s var(--ease)}
.fstep h3{font-size:22px;margin-bottom:4px}
.fstep>p{color:var(--grijs);font-size:15px;margin-bottom:20px}
.opts{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.opt{border:1.5px solid var(--lijn);background:#fff;border-radius:16px;padding:14px 12px;font-weight:600;font-size:15px;color:var(--navy);cursor:pointer;text-align:left;transition:all .2s}
.opt:hover{border-color:var(--blauw)}
.opt.sel{border-color:var(--blauw-k);background:var(--lichtblauw);box-shadow:inset 0 0 0 1px var(--blauw-k)}
.field{display:block;margin-bottom:14px}
.field span{display:block;font-size:14px;font-weight:600;margin-bottom:6px;color:var(--navy)}
.field input{width:100%;height:52px;border:1.5px solid var(--lijn);border-radius:14px;padding:0 16px;font:inherit;font-size:16px;background:var(--bg);transition:border-color .2s,background .2s}
.field input:focus{outline:0;border-color:var(--blauw);background:#fff}
.field.err input{border-color:#DC2626}
.agree{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--grijs);margin:4px 0 6px}
.agree input{width:20px;height:20px;accent-color:var(--blauw-k);margin-top:2px;flex:none}
.fnav{display:flex;gap:10px;margin-top:22px}
.fnav .btn{flex:1}
.back{background:var(--bg);color:var(--navy);flex:0 0 auto!important;width:54px;padding:0}
.done{text-align:center;padding:20px 0}
.done svg{margin:0 auto 18px}
.done circle{stroke-dasharray:190;stroke-dashoffset:190;animation:draw .8s var(--ease) forwards}
.done path{stroke-dasharray:50;stroke-dashoffset:50;animation:draw .5s .6s var(--ease) forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.done h3{font-size:24px;margin-bottom:8px}
.done p{color:var(--grijs)}
.demo{font-size:12.5px;color:var(--grijs);text-align:center;margin-top:14px}
.or{display:grid;gap:10px;margin-top:26px}
.or a{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid var(--lijn);border-radius:20px;padding:16px 18px;transition:border-color .2s,transform .3s var(--ease)}
.or a:hover{border-color:var(--blauw);transform:translateX(4px)}
.or .ic{width:44px;height:44px;border-radius:14px;background:var(--lichtblauw);display:grid;place-items:center;flex:none}
.or small{display:block;font-size:13px;color:var(--grijs)}
.or b{color:var(--navy)}

/* faq */
.faq-grid{display:grid;gap:28px}
details{border-bottom:1px solid var(--lijn)}
details:first-of-type{border-top:1px solid var(--lijn)}
summary{list-style:none;cursor:pointer;padding:22px 0;display:flex;justify-content:space-between;gap:20px;font-weight:600;font-size:17px;color:var(--navy)}
summary::-webkit-details-marker{display:none}
.pl{flex:none;width:30px;height:30px;border-radius:50%;background:var(--lichtblauw);position:relative;transition:transform .4s var(--ease),background .3s}
.pl::before,.pl::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:2px;border-radius:2px;background:var(--blauw-k);transform:translate(-50%,-50%)}
.pl::after{transform:translate(-50%,-50%) rotate(90deg);transition:opacity .3s}
details[open] .pl{transform:rotate(180deg);background:var(--lichtgroen)}
details[open] .pl::after{opacity:0}
.ans{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s var(--ease)}
details[open] .ans{grid-template-rows:1fr}
.ans>div{overflow:hidden;color:var(--grijs);font-size:15.5px;padding-right:40px}
details[open] .ans>div{padding-bottom:22px}

/* contact */
.ct-grid{display:grid;gap:24px}
.ct-list{display:grid;gap:12px}
.ct-row{display:flex;gap:14px;align-items:center;background:#fff;border:1px solid var(--lijn);border-radius:20px;padding:16px 18px}
.ct-row .ic{flex:none;width:44px;height:44px;border-radius:14px;background:var(--lichtblauw);display:grid;place-items:center}
.ct-row small{display:block;font-size:13px;color:var(--grijs)}
.ct-row b{color:var(--navy);font-weight:600}
.map{border-radius:28px;overflow:hidden;min-height:320px;border:1px solid var(--lijn);background:var(--lichtblauw)}
.map iframe{width:100%;height:100%;min-height:320px;border:0;display:block}

/* cta */
.cta-box{position:relative;overflow:hidden;background:var(--navy);border-radius:36px;padding:56px 24px;text-align:center;color:#fff;isolation:isolate}
.cta-box::before{content:"";position:absolute;inset:-40%;background:conic-gradient(from 0deg,var(--blauw),#2BB3B0,var(--groen),var(--blauw));opacity:.35;filter:blur(60px);animation:spin 16s linear infinite;z-index:-1}
@keyframes spin{to{transform:rotate(360deg)}}
.cta-box h2{color:#fff;font-size:36px;max-width:620px;margin:0 auto}
.cta-box p{color:rgba(255,255,255,.8);margin:16px auto 30px;max-width:440px}
.cta-btns{display:flex;flex-direction:column;gap:10px;max-width:340px;margin:0 auto}

/* footer */
footer{background:var(--navy-d);color:rgba(255,255,255,.7);padding:60px 0 120px;font-size:15px;margin-top:80px}
.f-grid{display:grid;gap:34px}
.logo-plate{display:inline-block;background:#fff;border-radius:18px;padding:12px 16px;margin-bottom:16px}
.logo-plate .logo-img{height:40px}
footer h4{color:#fff;font-size:13px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:14px;font-weight:600}
footer ul{list-style:none;display:grid;gap:8px}
footer a:hover{color:#fff}
.f-bottom{border-top:1px solid rgba(255,255,255,.12);margin-top:40px;padding-top:22px;font-size:13px;display:flex;flex-wrap:wrap;gap:8px 20px;justify-content:space-between}

/* mobiele actiebalk */
.actionbar{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:40;display:grid;grid-template-columns:1fr 1fr 1.5fr;gap:6px;background:rgba(255,255,255,.96);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--lijn);border-radius:999px;padding:6px;box-shadow:0 12px 34px rgba(14,63,92,.2);transform:translateY(160%);transition:transform .5s var(--ease)}
.actionbar.show{transform:none}
.actionbar a{height:48px;border-radius:999px;display:flex;align-items:center;justify-content:center;gap:7px;font-weight:600;font-size:14.5px;color:var(--navy)}
.actionbar a.main{background:var(--blauw-k);color:#fff}

/* reveal */
.rv{opacity:0;transform:translateY(24px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.rv.in{opacity:1;transform:none}
.rv-l{opacity:0;transform:translateX(-24px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.rv-l.in{opacity:1;transform:none}
.rv-s{opacity:0;transform:scale(.95);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.rv-s.in{opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .rv,.rv-l,.rv-s,.fade-up,.float-card{opacity:1!important;transform:none!important}
  .line>span{transform:none}.hero-photo{clip-path:none}.hero-photo img{transform:none}
}

/* tablet */
@media(min-width:760px){
  .wrap{padding:0 32px}
  section{padding:100px 0}
  h1{font-size:58px}h2{font-size:42px}
  .hero-btns,.cta-btns{flex-direction:row}
  .cta-btns{justify-content:center;max-width:none}
  .beh-grid{grid-template-columns:1fr 1fr}
  .stats{grid-template-columns:repeat(4,1fr)}
  .team-grid{grid-template-columns:repeat(4,1fr);gap:18px}
  .rev-row{margin:0;padding:4px 0 8px}
  .rcard{flex:0 0 calc(50% - 7px)}
  .egym{margin:0 24px}
  .f-grid{grid-template-columns:1.4fr 1fr 1fr 1fr}
  .ins{flex-direction:row;justify-content:space-between;align-items:center}
  .actionbar{display:none}
  footer{padding-bottom:44px}
  .cta-box{padding:84px 48px}.cta-box h2{font-size:48px}
  .opts{grid-template-columns:repeat(4,1fr)}
  .fc1{left:-24px}.fc2{right:-24px}
}
/* desktop */
@media(min-width:1100px){
  section{padding:130px 0}
  h1{font-size:66px}h2{font-size:48px}
  .intro{font-size:19px}
  .menu,.nav-tel,.nav-r .btn{display:flex}
  .burger{display:none}
  .nav-in{height:84px}nav.scrolled .nav-in{height:68px}
  .logo-img{height:54px}nav.scrolled .logo-img{height:44px}
  .hero{padding:48px 0 120px}
  .hero-grid{grid-template-columns:1.1fr 1fr;align-items:center;gap:72px}
  .kiezer{grid-template-columns:.85fr 1.15fr;gap:48px}
  .beh-grid{grid-template-columns:repeat(4,1fr)}
  .work{grid-template-columns:1.3fr .8fr;gap:80px}
  .work-side{position:sticky;top:110px}
  .egym{margin:0 32px}
  .eg-grid{grid-template-columns:1fr 1fr;gap:80px}
  .rev-top{grid-template-columns:1fr auto;align-items:end}
  .rcard{flex:1}
  .afspraak{grid-template-columns:.9fr 1.1fr;gap:72px;align-items:start}
  .form-card{padding:40px}
  .faq-grid{grid-template-columns:.8fr 1.2fr;gap:80px}
  .ct-grid{grid-template-columns:.9fr 1.1fr;gap:40px}
  .two{display:flex;justify-content:space-between;align-items:flex-end;gap:40px}
  .two .link{margin-top:0;flex:none}
}

/* ===== Subpagina's ===== */
.skip{position:absolute;left:-999px;top:8px;background:#fff;padding:10px 16px;border-radius:10px;z-index:200}
.skip:focus{left:12px}
.menu a.active{background:var(--lichtblauw);color:var(--blauw-k)}
.mobmenu li a.active{color:var(--blauw-k)}
.phero{padding:28px 0 56px;position:relative;overflow:hidden}
.phero h1{font-size:38px;max-width:860px;margin-bottom:18px}
.phero .intro{margin-bottom:28px}
.crumbs{font-size:14px;color:var(--grijs);margin-bottom:22px;display:flex;flex-wrap:wrap;gap:6px}
.crumbs a{color:var(--blauw-k);font-weight:500}
.crumbs a:hover{text-decoration:underline}
.sec-white{background:#fff}
.sec-tight{padding:56px 0}
.prose{max-width:720px}
.prose p{color:var(--grijs);font-size:17px;margin-bottom:16px}
.prose h2{margin-bottom:18px}
.prose h3{margin:28px 0 10px}
.prose ul{margin:0 0 16px 20px;color:var(--grijs)}
.prose li{margin-bottom:6px}
.grid2{display:grid;gap:16px}
.grid3{display:grid;gap:16px}
.box{background:#fff;border:1px solid var(--lijn);border-radius:26px;padding:28px 24px}
.box h2{font-size:26px;margin-bottom:14px}
.box h3{font-size:21px;margin-bottom:12px}
.box p{color:var(--grijs)}
.box p+p{margin-top:12px}
.box.tint{background:var(--lichtblauw);border-color:transparent}
.box.alert{background:#FFF7EA;border-color:#F3D7A6}
.box.alert h3{color:#8A5300;display:flex;gap:10px;align-items:center}
.box.alert li::before{background:#FCE9C8 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22'%3E%3Cpath d='M11 6.5v6M11 15.5h.01' fill='none' stroke='%238A5300' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E")}
.box .btn{margin-top:22px}
.kcards{display:grid;gap:12px}
.kcard{display:flex;flex-direction:column;gap:12px;background:#fff;border:1px solid var(--lijn);border-radius:24px;padding:24px 22px;transition:transform .4s var(--ease),box-shadow .4s,border-color .3s}
.kcard:hover{transform:translateY(-5px);box-shadow:0 20px 44px rgba(14,63,92,.12);border-color:transparent}
.kcard .ic{width:50px;height:50px;border-radius:16px;background:var(--lichtblauw);display:grid;place-items:center}
.kcard h3{font-size:20px}
.kcard p{color:var(--grijs);font-size:15.5px;flex:1}
.kcard .go{font-weight:600;color:var(--blauw-k);display:inline-flex;gap:8px}
.kcard .go span{transition:transform .3s var(--ease)}
.kcard:hover .go span{transform:translateX(4px)}
.treat{display:grid;gap:22px;padding:34px 0;border-top:1px solid var(--lijn);scroll-margin-top:90px}
.treat:first-child{border-top:0;padding-top:0}
.treat .num{font-family:var(--kop);font-size:15px;color:var(--groen-k);font-weight:600}
.treat h2{font-size:30px;margin:6px 0 12px}
.treat .lead{color:var(--grijs);font-size:17px}
.treat h4{font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--grijs);margin:0 0 10px;font-weight:600}
.treat .btn{margin-top:20px}
.team-full{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.tm .ph .ini{font-family:var(--kop);font-size:44px;font-weight:600;letter-spacing:-.02em;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;opacity:1}
.tm .role{font-size:14px;color:var(--grijs)}
.hours{width:100%;border-collapse:collapse;font-size:15.5px}
.hours td{padding:10px 0;border-bottom:1px solid var(--lijn)}
.hours td:last-child{text-align:right;font-weight:600;color:var(--navy)}
.panel-btns{display:grid;gap:10px;margin-top:28px}
.panel-btns .btn{margin-top:0;width:100%}
.photo{border-radius:28px;overflow:hidden;background:linear-gradient(160deg,var(--lichtblauw),var(--lichtgroen));aspect-ratio:4/3}
.photo img{width:100%;height:100%;object-fit:cover}
.photos{display:grid;gap:14px}
.notfound{min-height:60vh;display:grid;place-items:center;text-align:center}
.notfound b{font-family:var(--kop);font-size:110px;line-height:1;font-weight:600;display:block}
.thanks svg{margin:0 auto 22px;display:block}
.thanks circle{stroke-dasharray:190;stroke-dashoffset:190;animation:draw .8s .2s var(--ease) forwards}
.thanks path{stroke-dasharray:50;stroke-dashoffset:50;animation:draw .5s .8s var(--ease) forwards}
.concept{background:#FFF7EA;border:1px solid #F3D7A6;color:#8A5300;border-radius:16px;padding:14px 18px;font-size:14.5px;margin-bottom:28px}
.hp{position:absolute!important;left:-9999px!important}
.fstep.show{display:block}
@media(min-width:760px){
  .phero h1{font-size:54px}
  .grid2{grid-template-columns:1fr 1fr;gap:20px}
  .grid3{grid-template-columns:repeat(3,1fr)}
  .kcards{grid-template-columns:1fr 1fr;gap:16px}
  .team-full{grid-template-columns:repeat(3,1fr);gap:20px}
  .panel-btns{grid-template-columns:1.3fr 1fr}
  .photos{grid-template-columns:1.3fr 1fr}
  .box{padding:36px 34px}
}
@media(min-width:1100px){
  .phero{padding:44px 0 80px}
  .phero h1{font-size:64px}
  .kcards{grid-template-columns:repeat(3,1fr)}
  .team-full{grid-template-columns:repeat(4,1fr)}
  .treat{grid-template-columns:.9fr 1.1fr;gap:64px;padding:56px 0}
}

/* ===== Vergoeding ===== */
.vchk{background:linear-gradient(150deg,var(--navy) 0%,#0F527A 100%);color:#fff;border-radius:32px;padding:30px 22px;position:relative;overflow:hidden}
.vchk::after{content:"";position:absolute;width:300px;height:300px;border-radius:50%;background:var(--grad);filter:blur(70px);opacity:.35;right:-100px;bottom:-140px}
.vchk-in{position:relative;z-index:1;display:grid;gap:26px}
.vchk h2{color:#fff;font-size:28px;margin-bottom:20px}
.vsel{display:grid;gap:12px}
.vsel label span{display:block;font-size:13.5px;color:rgba(255,255,255,.75);margin-bottom:6px;font-weight:500}
.vsel select{width:100%;height:54px;border-radius:14px;border:0;padding:0 44px 0 16px;font:inherit;font-size:16px;color:var(--navy);font-weight:600;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%230E3F5C' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 16px center;-webkit-appearance:none;appearance:none;cursor:pointer}
.vsel select:disabled{opacity:.55;cursor:not-allowed}
.vres{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);border-radius:24px;padding:26px 22px;display:grid;place-items:center;text-align:center;min-height:220px}
.vres-empty{color:rgba(255,255,255,.7);font-size:15.5px;max-width:320px}
.vres-num{font-family:var(--kop);font-size:88px;font-weight:600;line-height:1;letter-spacing:-.04em;background:linear-gradient(120deg,#8FD3F5,#B5E59B);-webkit-background-clip:text;background-clip:text;color:transparent;animation:pop .6s var(--ease)}
.vres-lbl{font-size:16px;color:rgba(255,255,255,.85);margin-top:6px}
.vres-opm{font-size:13.5px;color:#FFD59A;margin-top:10px}
.vres .btn{margin-top:20px}
.vsearch{display:flex;align-items:center;gap:12px;background:var(--bg);border:1.5px solid var(--lijn);border-radius:16px;padding:0 16px;height:56px;margin-bottom:18px;transition:border-color .2s}
.vsearch:focus-within{border-color:var(--blauw)}
.vsearch input{flex:1;border:0;background:transparent;font:inherit;font-size:16px;outline:0;height:100%;color:var(--inkt)}
.vz-list{display:grid;gap:10px}
details.vz{border:1px solid var(--lijn)!important;border-radius:20px;background:#fff;overflow:hidden;transition:box-shadow .3s}
details.vz[open]{box-shadow:0 14px 34px rgba(14,63,92,.08)}
details.vz summary{padding:18px 20px;align-items:center;flex-wrap:wrap;gap:6px 16px}
.vz-n{font-family:var(--kop);font-size:19px;font-weight:500;color:var(--navy);flex:1 1 auto}
.vz-r{font-size:14px;color:var(--grijs);font-weight:500;order:3;flex-basis:100%}
details.vz .pl{order:2}
.vz-b{padding:0 20px 18px}
.vt{width:100%;border-collapse:collapse;font-size:15px}
.vt th{text-align:left;font-size:12.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--grijs);font-weight:600;padding:8px 0;border-bottom:1px solid var(--lijn)}
.vt td{padding:11px 0;border-bottom:1px solid var(--lijn);vertical-align:middle}
.vt tr:last-child td{border-bottom:0}
.vt td small{display:block;font-size:12.5px;color:#9A5B00;margin-top:2px}
.vt .vn{text-align:right;font-weight:600;color:var(--navy);width:90px;padding-left:12px;white-space:nowrap}
.vt th.vn{font-weight:600;color:var(--grijs);white-space:normal}
.vt .vb{display:none}
.vbar{display:block;height:8px;border-radius:8px;background:var(--lichtblauw);overflow:hidden}
.vbar i{display:block;height:100%;border-radius:8px;background:var(--grad)}
.vz-none{color:var(--grijs);padding:18px 4px}
.vsrc{font-size:13.5px;color:var(--grijs);margin-top:18px}
.vsrc a{color:var(--blauw-k);text-decoration:underline}
@media(min-width:760px){
  .vchk{padding:48px 44px}
  .vchk-in{grid-template-columns:1.1fr .9fr;gap:40px;align-items:center}
  .vchk h2{font-size:38px}
  .vt .vb{display:table-cell;width:28%;padding-left:20px}
  .vz-r{order:0;flex-basis:auto}
  details.vz summary{flex-wrap:nowrap}
}
@media(min-width:1100px){.menu{gap:0}.menu a{padding:8px 11px}}
.menu a,.nav-tel{white-space:nowrap}
@media(min-width:1100px) and (max-width:1319px){.nav-tel{display:none!important}.logo-img{height:46px}}

/* ===== Footer ===== */
footer{margin-top:0;padding-top:72px}
.f-brand p{max-width:300px;margin-bottom:18px}
.f-contact{list-style:none;display:grid;gap:10px}
.f-contact a{color:#fff;font-weight:600}
.f-cta p{margin-bottom:18px;max-width:300px}
.f-cta .btn{width:100%;margin-bottom:10px;height:50px}
.f-cta .btn-o{box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.3)}
footer ul a{transition:color .2s,padding .2s}
footer ul:not(.f-contact) a:hover{padding-left:4px}
@media(min-width:760px){.f-grid{grid-template-columns:1.3fr .9fr .9fr 1.1fr;gap:40px}}
main>.wrap:last-child{margin-bottom:96px}

/* ===== Home: vergoeding + verzekeraars ===== */
.home-vz{padding-bottom:40px;overflow:hidden}
.ins-mq{margin-top:44px;display:grid;gap:12px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.ins-row{overflow:hidden;white-space:nowrap}
.ins-track{display:inline-flex;gap:12px;animation:mq 60s linear infinite;padding-right:12px}
.ins-row.rev-dir .ins-track{animation-direction:reverse;animation-duration:70s}
.ins-mq:hover .ins-track{animation-play-state:paused}
.ins-track span{display:inline-flex;align-items:center;height:48px;padding:0 22px;border-radius:999px;background:#fff;border:1px solid var(--lijn);font-family:var(--kop);font-weight:500;font-size:16px;color:var(--navy);box-shadow:0 4px 14px rgba(14,63,92,.04)}

/* ===== Home: reviews ===== */
.rev-grid{display:grid;gap:32px;align-items:center}
.gcard{background:var(--bg);border:1px solid var(--lijn);border-radius:32px;padding:34px 30px;text-align:center;position:relative;overflow:hidden}
.gcard::before{content:"";position:absolute;width:220px;height:220px;border-radius:50%;background:var(--grad);filter:blur(60px);opacity:.18;top:-80px;right:-60px}
.g-top{display:inline-flex;align-items:center;gap:10px;font-weight:600;color:var(--navy);background:#fff;border:1px solid var(--lijn);border-radius:999px;padding:6px 16px 6px 8px;position:relative}
.g-score{margin:22px 0 8px;display:flex;align-items:baseline;justify-content:center;gap:8px;position:relative}
.g-score b{font-family:var(--kop);font-size:96px;font-weight:600;line-height:1;letter-spacing:-.04em;color:var(--navy)}
.g-score span{font-size:22px;color:var(--grijs);font-weight:500}
.g-stars{display:flex;justify-content:center;gap:6px;margin-bottom:12px}
.g-stars i{width:26px;height:26px;background:var(--ster);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2l3 6.3 6.9.9-5 4.8 1.2 6.9L12 17.6 5.9 20.9l1.2-6.9-5-4.8 6.9-.9z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2l3 6.3 6.9.9-5 4.8 1.2 6.9L12 17.6 5.9 20.9l1.2-6.9-5-4.8 6.9-.9z'/%3E%3C/svg%3E") center/contain no-repeat;transform:scale(0);transition:transform .5s cubic-bezier(.3,1.6,.5,1)}
.g-stars i.part{background:linear-gradient(90deg,var(--ster) 70%,#E3E8EC 70%)}
.gcard.in .g-stars i{transform:scale(1)}
.gcard.in .g-stars i:nth-child(2){transition-delay:.08s}.gcard.in .g-stars i:nth-child(3){transition-delay:.16s}.gcard.in .g-stars i:nth-child(4){transition-delay:.24s}.gcard.in .g-stars i:nth-child(5){transition-delay:.32s}
.gcard p{color:var(--grijs);position:relative}
@media(min-width:1100px){.rev-grid{grid-template-columns:1.1fr .9fr;gap:80px}}

/* ===== Animaties ===== */
@view-transition{navigation:auto}
::view-transition-old(root){animation:vt-out .25s ease-in both}
::view-transition-new(root){animation:vt-in .45s cubic-bezier(.2,.8,.2,1) both}
@keyframes vt-out{to{opacity:0;transform:translateY(-8px)}}
@keyframes vt-in{from{opacity:0;transform:translateY(12px)}}
body{animation:pagein .6s ease-out both}
@keyframes pagein{from{opacity:0}}
.hero .line>span.grad-text{background-size:220% auto;animation:up .9s var(--ease) .12s forwards,gshift 9s ease-in-out 1.2s infinite}
@keyframes gshift{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
.rv .checks li{opacity:0;transform:translateX(-10px);transition:opacity .5s var(--ease),transform .5s var(--ease)}
.rv.in .checks li{opacity:1;transform:none}
.rv.in .checks li:nth-child(2){transition-delay:.08s}.rv.in .checks li:nth-child(3){transition-delay:.16s}.rv.in .checks li:nth-child(4){transition-delay:.24s}.rv.in .checks li:nth-child(5){transition-delay:.32s}
.label::before{transform-origin:0 50%;transition:transform .8s .2s var(--ease)}
.rv:not(.in) .label::before{transform:scaleX(0)}
.tilt{transform-style:preserve-3d;will-change:transform}
.tilt.tilting{transition:transform .12s linear,box-shadow .45s,border-color .3s!important}
.phero .line>span{animation-duration:1s}
.vchk select:focus-visible,.btn:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #8FD3F5;outline-offset:3px}
@media (prefers-reduced-motion:reduce){
  ::view-transition-old(root),::view-transition-new(root){animation:none}
  .ins-track{animation:none}.g-stars i{transform:none}
  .rv .checks li{opacity:1;transform:none}
}

/* ===== Vacature-topbalk ===== */
.topbar{display:flex;align-items:center;justify-content:center;gap:10px;background:var(--grad);background-size:200% auto;animation:gshift 12s ease-in-out infinite;color:#fff;font-size:14px;padding:9px 16px;text-align:center;position:relative;z-index:51}
.topbar b{font-weight:600}
.tb-more{display:none;opacity:.9}
.tb-arr{font-weight:600;text-decoration:underline;text-underline-offset:3px}
.tb-dot{width:8px;height:8px;border-radius:50%;background:#fff;box-shadow:0 0 0 0 rgba(255,255,255,.7);animation:ping 2s infinite;flex:none}
@media(min-width:760px){.tb-more{display:inline}}

/* ===== Behandelingen: snelkeuze ===== */
.chipnav{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:0 -20px 18px;padding:4px 20px 8px;position:sticky;top:62px;z-index:20;background:linear-gradient(var(--bg) 75%,transparent)}
.chipnav::-webkit-scrollbar{display:none}
.chipnav a{flex:none;background:#fff;border:1px solid var(--lijn);border-radius:999px;padding:9px 16px;font-size:14.5px;font-weight:600;color:var(--navy);transition:all .25s}
.chipnav a:hover,.chipnav a.on{background:var(--navy);border-color:var(--navy);color:#fff}
@media(min-width:760px){.chipnav{margin:0 0 18px;padding:4px 0 10px;flex-wrap:wrap;overflow:visible}}
@media(min-width:1100px){.chipnav{top:68px}}
.more-treat{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:26px}
.more-treat span{font-weight:600;color:var(--grijs);margin-right:4px;font-size:14.5px}
.more-treat a{border:1px solid var(--lijn);background:var(--bg);border-radius:999px;padding:8px 15px;font-size:14px;font-weight:600;color:var(--navy);transition:all .25s}
.more-treat a:hover{border-color:var(--blauw);color:var(--blauw-k);transform:translateY(-2px)}

/* ===== E-Gym prijzen ===== */
.eg-cta{display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px}
.eg-price{color:rgba(255,255,255,.8);font-size:15px}
.eg-price b{color:#fff;font-family:var(--kop);font-size:22px;font-weight:600}
.prices{display:grid;gap:16px;margin-top:10px}
.price{position:relative;background:#fff;border:1px solid var(--lijn);border-radius:28px;padding:30px 26px;display:flex;flex-direction:column}
.price:first-child{border:2px solid var(--blauw);box-shadow:0 24px 50px rgba(20,116,168,.14)}
.price:first-child::before{content:"Voordeligst";position:absolute;top:-13px;right:22px;background:var(--grad);color:#fff;font-size:12.5px;font-weight:600;border-radius:999px;padding:5px 12px}
.price.start{background:var(--lichtblauw);border-color:transparent}
.p-tag{display:inline-block;align-self:flex-start;background:var(--lichtgroen);color:var(--groen-k);font-size:12.5px;font-weight:600;border-radius:999px;padding:4px 12px;margin-bottom:14px;letter-spacing:.02em}
.price h3{font-size:22px}
.p-amt{display:flex;align-items:baseline;gap:8px;margin:12px 0 10px}
.p-amt b{font-family:var(--kop);font-size:44px;font-weight:600;letter-spacing:-.03em;color:var(--navy);line-height:1}
.p-amt span{color:var(--grijs);font-size:15px}
.price>p{color:var(--grijs);font-size:15.5px;margin-bottom:16px}
.price .checks{margin-bottom:18px}
.p-start{font-size:14px!important;color:var(--navy)!important;font-weight:600;margin-top:auto!important}
.price .btn{width:100%;margin-top:6px}
@media(min-width:900px){.prices{grid-template-columns:repeat(3,1fr);gap:20px}}
.women{margin-top:22px;background:linear-gradient(135deg,#FCEFF5,#F3EEFB);border-radius:18px;padding:16px 18px;display:grid;gap:4px}
.women b{color:#8A2D5C}.women span{color:var(--grijs);font-size:15px}
.box h3+.hours{margin-top:4px}

/* ===== Vacature ===== */
.vac-tile .ph{background:var(--grad)!important;color:#fff}
.vac-in{display:grid;gap:6px;text-align:center;padding:16px}
.vac-in b{font-family:var(--kop);font-size:22px;font-weight:600;line-height:1.15}
.vac-in small{font-size:14px;opacity:.9}
.vac-in i{font-style:normal;font-weight:600;font-size:13.5px;margin-top:8px;background:rgba(255,255,255,.2);border-radius:999px;padding:6px 12px;justify-self:center;transition:background .3s}
.vac-tile:hover .vac-in i{background:rgba(255,255,255,.35)}
.vac-tile h3{color:var(--blauw-k)}
.vac-card{background:linear-gradient(135deg,var(--navy),#0F527A);color:#fff;border-radius:28px;padding:30px 26px;display:flex;flex-wrap:wrap;gap:18px;align-items:center;justify-content:space-between;position:relative;overflow:hidden}
.vac-card::after{content:"";position:absolute;width:260px;height:260px;border-radius:50%;background:var(--grad);filter:blur(60px);opacity:.4;right:-80px;top:-120px}
.vac-card>*{position:relative}
.vac-card h2{color:#fff;font-size:34px}
.vac-card p{color:rgba(255,255,255,.75)}
.vac-card .p-tag{background:rgba(255,255,255,.15);color:#fff}
.why-mini{display:grid;gap:14px;margin-top:14px}
.why-mini div{background:#fff;border-radius:18px;padding:16px 18px}
.why-mini b{display:block;color:var(--navy);margin-bottom:2px}
.why-mini span{color:var(--grijs);font-size:15px}
@media(min-width:760px){.why-mini{grid-template-columns:1fr 1fr}}
.field textarea{width:100%;border:1.5px solid var(--lijn);border-radius:14px;padding:14px 16px;font:inherit;font-size:16px;background:var(--bg);resize:vertical}
.field textarea:focus{outline:0;border-color:var(--blauw);background:#fff}

/* ===== Kwaliteit ===== */
.qbox{display:flex;gap:18px;align-items:flex-start}
.q-ic{flex:none;width:58px;height:58px;border-radius:18px;background:#fff;display:grid;place-items:center}
.f-q{display:flex;gap:10px;align-items:center;margin-top:20px;font-size:14px;color:rgba(255,255,255,.85);background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:10px 14px}
.f-vac span{font-size:11px;font-weight:600;background:var(--groen);color:#fff;border-radius:999px;padding:2px 8px;margin-left:6px;vertical-align:2px}
.vac-tile .ph .vac-in{color:#fff;opacity:1;font-size:15px;font-weight:400;font-family:var(--tekst)}
.f-small{display:block;font-size:13px;color:rgba(255,255,255,.6);margin-top:2px}
.f-hours{width:100%;border-collapse:collapse;font-size:14.5px;margin:2px 0 16px}
.f-hours td{padding:5px 0;border-bottom:1px solid rgba(255,255,255,.1)}
.f-hours td:last-child{text-align:right;color:#fff;font-weight:600}
.hours td:first-child{padding-right:12px}
body{overflow-x:visible}
.chipnav{background:var(--bg);box-shadow:0 8px 16px -12px rgba(14,63,92,.25)}
@media(min-width:760px){.chipnav{position:static;box-shadow:none;background:transparent}}
nav.scrolled{background:rgba(247,250,252,.97)}
.tar-line{margin-top:18px;background:#fff;border:1px solid var(--lijn);border-radius:18px;padding:14px 18px;color:var(--grijs);font-size:15.5px}
.tar-line b{color:var(--navy)}
.tar-line a{color:var(--blauw-k);font-weight:600;white-space:nowrap}
.hours.wt{margin-top:10px}
.hours.wt td{font-size:14.5px;padding:8px 0;border-bottom-color:rgba(138,45,92,.12)}
.hours.wt td:last-child{color:#8A2D5C}
.f-social{display:flex;gap:10px;margin-top:18px}
.f-social a{width:42px;height:42px;border-radius:50%;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);display:grid;place-items:center;transition:background .25s,transform .25s}
.f-social a:hover{background:var(--blauw);transform:translateY(-3px)}

/* ===== Praktijkfoto ===== */
.spot{padding-top:0}
.sp-frame{position:relative}
.sp-media{position:relative;border-radius:32px;overflow:hidden;aspect-ratio:4/3.3;background:var(--lichtblauw);box-shadow:0 30px 70px rgba(14,63,92,.18)}
.sp-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(14,63,92,0) 55%,rgba(14,63,92,.35));pointer-events:none}
.sp-img{width:100%;height:100%;object-fit:cover;object-position:60% 55%;transform:scale(calc(1.16 - .16 * var(--p,1)));transform-origin:60% 60%;will-change:transform}
.sp-card{position:relative;margin:-70px 14px 0;background:rgba(255,255,255,.96);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-radius:26px;padding:26px 22px;box-shadow:0 20px 50px rgba(14,63,92,.16);transform:translateY(calc(40px - 40px * var(--p,1)));opacity:calc(.3 + .7 * var(--p,1))}
.sp-card h2{font-size:28px;margin-bottom:10px}
.sp-card p{color:var(--grijs)}
.sp-facts{list-style:none;display:grid;gap:10px;margin:18px 0 22px}
.sp-facts li{display:flex;gap:12px;align-items:center;font-size:15px;font-weight:500;color:var(--navy)}
.sp-facts svg{flex:none;width:36px;height:36px;padding:8px;border-radius:12px;background:var(--lichtblauw)}
.sp-card .btn{width:100%}
@media(min-width:900px){
  .sp-media{aspect-ratio:auto;height:640px}
  .sp-card{position:absolute;left:36px;bottom:36px;margin:0;max-width:440px;padding:32px 30px}
  .sp-card .btn{width:auto}
}
@media (prefers-reduced-motion:reduce){.sp-img,.sp-card{transform:none!important;opacity:1!important}}

/* ---------- foto's van de praktijk ---------- */
.hero-photo{background:var(--lichtblauw)}
.eg-vis{position:relative}
.eg-photo{border-radius:28px;overflow:hidden;aspect-ratio:4/5;max-width:470px;margin-left:auto;box-shadow:0 30px 60px rgba(0,0,0,.25)}
.eg-photo img{width:100%;height:100%;object-fit:cover}
.eg-vis .dash{position:relative;margin:-90px 14px 0;background:rgba(14,63,92,.82);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
@media (min-width:900px){.eg-vis .dash{position:absolute;left:-10px;right:auto;bottom:34px;margin:0;width:min(420px,90%)}.eg-photo{aspect-ratio:4/5}}
.ws-photo{margin:-34px -26px 26px;aspect-ratio:16/10;overflow:hidden;position:relative;z-index:1}
.ws-photo img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.work-side:hover .ws-photo img{transform:scale(1.04)}
.p-photo{margin:-30px -26px 22px;aspect-ratio:16/10;overflow:hidden;border-radius:28px 28px 0 0;background:#1B2B34}
.p-photo img{width:100%;height:100%;object-fit:cover}
.price.start .p-tag{align-self:flex-start}
.t-photo{margin-top:26px;border-radius:24px;overflow:hidden;aspect-ratio:16/10;background:var(--lichtblauw)}
.t-photo img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.treat:hover .t-photo img{transform:scale(1.04)}
.gal{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:8px}
.g-item{margin:0;position:relative;border-radius:22px;overflow:hidden;aspect-ratio:4/3;background:var(--lichtblauw)}
.g-item img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.g-item:hover img{transform:scale(1.05)}
.g-item figcaption{position:absolute;left:12px;bottom:12px;right:12px;color:#fff;font-weight:600;font-size:14px;line-height:1.3;text-shadow:0 1px 8px rgba(0,0,0,.45)}
.g-item::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(10,47,69,.55));pointer-events:none}
.g-item figcaption{z-index:1}
.gal2 .g-item{aspect-ratio:3/2}
.vac-card + .gal{margin-top:20px}
@media (min-width:900px){
  .gal{grid-template-columns:repeat(3,1fr);gap:18px}
  .gal .g-item:nth-child(3n+1){grid-row:span 1}
  .gal2{grid-template-columns:1.4fr 1fr}
  .gal3{grid-template-columns:1.2fr 1fr 1fr}
  .treat .t-photo{max-width:520px}
}
@media (max-width:899px){.gal3 .g-item:first-child{grid-column:1/-1;aspect-ratio:16/10}}
