/* Stijl van de live Group-site (soma-group-site/live), overgenomen door labelsite.py. Niet met de hand aanpassen. */

body{background:var(--diep);color:#fff}
.balk{position:fixed;inset:0 0 auto;z-index:20;transition:background .5s}
.balk.vast{background:var(--diep)}
.balk .wrap{display:flex;align-items:center;gap:44px;height:108px}
.balk img{height:62px}
.balk nav{display:flex;gap:34px;margin-left:auto;font-size:.9375rem}
.balk nav a{opacity:.9;transition:opacity .2s}.balk nav a:hover{opacity:1}
.balk .knop{background:transparent;color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.55);padding:.9em 1.4em;font-size:.9375rem}
.balk .knop:hover{background:#fff;color:var(--diep)}
.hero{position:relative;height:100vh;height:100svh;min-height:700px;overflow:hidden}
.hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:70% 50%;transform:scale(1.14);animation:zoom 20s linear forwards}
@keyframes zoom{to{transform:scale(1.02)}}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,22,63,.7) 0,rgba(20,22,63,0) 140px),linear-gradient(90deg,rgba(20,22,63,.92) 0%,rgba(20,22,63,.62) 33%,rgba(20,22,63,0) 56%),linear-gradient(0deg,rgba(20,22,63,.45),rgba(20,22,63,0) 28%)}
.hero .wrap{position:relative;z-index:2;height:100%;display:flex;flex-direction:column;justify-content:flex-end;padding-bottom:11vh}
.regels{font-size:clamp(1.4rem,2.1vw,2rem);font-weight:300;line-height:1.35}
.regels span{display:block;opacity:0;transform:translateY(16px);animation:in 1.2s var(--e) forwards}
.regels span:nth-child(2){animation-delay:.8s}
@keyframes in{to{opacity:1;transform:none}}
.hero h1{font-size:clamp(3.2rem,5.4vw,5.61rem);max-width:12.5em}
.hero h1 span{display:block}
.hero h1 span.licht{font-weight:300}
.hero .missie{margin-top:28px;font-size:clamp(1.15rem,1.5vw,1.375rem);font-weight:300;line-height:1.5;max-width:46ch}
.hero .missie b{font-weight:700}
.deuren{margin-top:40px;display:flex;gap:14px;flex-wrap:wrap}
.deuren a{display:inline-flex;align-items:center;gap:14px;font-weight:700;padding:1.15em 1.6em;transition:background .3s,color .3s}
.deuren .wg{background:#fff;color:var(--diep)}
.deuren .wz{box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.6)}
.deuren .wz:hover{background:#fff;color:var(--diep)}
.deuren small{font-weight:300;opacity:.9}
@media (prefers-reduced-motion:reduce){.hero h1 span,.hero .missie,.deuren{opacity:1;transform:none;animation:none}.hero img{animation:none;transform:none}}
.waarom{padding:110px 0}
.waarom .wrap{display:grid;grid-template-columns:1fr;gap:28px}
.waarom p.groot{font-size:clamp(1.9rem,3.2vw,3.2rem)!important;max-width:30ch!important}
.waarom .klein{opacity:.6;padding-top:12px}
.waarom p.groot{font-size:clamp(1.5rem,2.3vw,2.2rem);font-weight:300;line-height:1.3;letter-spacing:-.015em;max-width:30ch}
.waarom p.groot b{font-weight:700}
.waarom p.missie{margin-top:28px;font-weight:300;font-size:1.0625rem;line-height:1.6;opacity:.65;max-width:52ch}
/* De zes werkwoorden als scrollmotor */
.motor{position:relative;height:calc(6 * 38vh + 100vh);background:var(--diep)}
.motor .podium{--bg:var(--navy);--tk:#fff;background:var(--bg);color:var(--tk);transition:background .8s var(--e),color .6s}
.motor .podium.licht{--bg:#F4F3EF;--tk:#101117}
.motor .podium.licht .vakman::after{background:none}
.motor .podium{position:sticky;top:0;height:100vh;overflow:hidden}
.motor .vakman{position:absolute;right:0;top:0;bottom:52px;width:44%;}
.motor .vakman img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 45%;opacity:0;transform:scale(1.05);transition:opacity .9s var(--e),transform 2.2s var(--e)}
.motor .vakman img.aan{opacity:1;transform:none}
.motor .vakman::after{content:none}
.motor .wrap{position:relative;z-index:2;height:100%;display:flex;flex-direction:column;justify-content:center}
.motor .klein{opacity:.7}
.motor .teller{font-variant-numeric:tabular-nums}
.woorden{position:relative;height:clamp(6.5rem,13.5vw,14rem);margin-top:24px}
.woorden span.wit,.mob div.wit b{-webkit-text-stroke:clamp(1px,.02em,2.5px) #fff;paint-order:stroke fill}
.woorden span.paars,.mob div.paars b{-webkit-text-stroke:clamp(1.5px,.03em,3.5px) #fff}
.woorden span{position:absolute;left:0;top:0;font-size:clamp(5rem,10.5vw,11.5rem);font-weight:700;letter-spacing:-.055em;line-height:1;color:var(--c);opacity:0;transform:translateY(40%);transition:opacity .7s var(--e),transform .9s var(--e);white-space:nowrap}
.woorden span.aan{opacity:1;transform:none}
.woorden span.was{opacity:0;transform:translateY(-40%)}
.motor .uitleg{min-height:140px;margin-top:8px;position:relative}
.motor .uitleg div{position:absolute;left:0;top:0;opacity:0;transform:translateY(10px);transition:opacity .5s var(--e),transform .6s var(--e);max-width:40ch}
.motor .uitleg div.aan{opacity:1;transform:none;transition-delay:.15s}
.motor .uitleg b{display:block;font-size:1.25rem}
.motor .uitleg p{font-weight:300;font-size:1.1875rem;line-height:1.5;opacity:.85;margin-top:6px}
.motor .uitleg a{display:inline-block;margin-top:14px;font-weight:700;border-bottom:1.5px solid currentColor;padding-bottom:2px}
.motor .lijn{position:absolute;left:0;right:0;bottom:0;display:flex;z-index:3}
.motor .lijn button{flex:1;position:relative;height:44px;border:0;padding:0;background:none;cursor:pointer;font:inherit;color:inherit}
.motor .lijn button::after{content:"";position:absolute;left:0;right:0;bottom:0;height:8px;background:var(--c)}
.motor .lijn button::before{content:"";position:absolute;left:0;right:0;bottom:12px;height:2px;background:currentColor;transform:scaleX(0);transition:transform .5s var(--e)}
.motor .lijn button.aan::before{transform:scaleX(1)}
.motor .lijn button span{position:absolute;left:50%;bottom:20px;margin-left:-50%;width:100%;text-align:center;font-size:.75rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;opacity:0;transform:translateY(4px);transition:opacity .3s,transform .3s}
.motor .lijn button:hover span,.motor .lijn button.aan span{opacity:.75;transform:none}
.motor .lijn button:focus-visible{outline:2px solid currentColor;outline-offset:-4px}
.wijzer{padding:150px 0;background:var(--diep)}
.wijzer h2{font-size:clamp(2.4rem,4vw,4.2rem);margin-bottom:56px}
.tegels{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.tegels a{position:relative;display:flex;flex-direction:column;justify-content:space-between;gap:36px;min-height:190px;padding:28px 28px 24px;background:rgba(255,255,255,.045);overflow:hidden;transition:background .4s}
.tegels a::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--c);transform-origin:left;transform:scaleX(.16);transition:transform .6s var(--e)}
.tegels a:hover{background:rgba(255,255,255,.09)}
.tegels a:hover::before{transform:scaleX(1)}
.tegels .v{font-size:clamp(1.6rem,2.2vw,2.2rem);font-weight:700;letter-spacing:-.025em;line-height:1.08;max-width:15ch}
.tegels .o{display:flex;justify-content:space-between;align-items:end;gap:16px;font-size:.8125rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.tegels .o em{font-style:normal;opacity:.65;font-weight:300;letter-spacing:.06em;text-transform:none;font-size:.9375rem}
.tegels .pijl{font-size:1.4rem;transition:transform .35s var(--e)}
.tegels a:hover .pijl{transform:translateX(6px)}
.slot{position:relative;padding:min(38vh,360px) 0 96px;overflow:hidden;background:var(--diep)}
.slot .slotbeeld{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:70% 50%}
.slot::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(20,22,63,.92) 0%,rgba(20,22,63,.6) 40%,rgba(20,22,63,0) 70%),linear-gradient(0deg,rgba(20,22,63,1) 0%,rgba(20,22,63,.85) 28%,rgba(20,22,63,0) 58%)}
@media (max-width:900px){.slot{padding-top:62vw}.slot .slotbeeld{height:78vw;object-position:72% 50%}.slot::before{background:linear-gradient(0deg,var(--diep) calc(100% - 78vw),rgba(20,22,63,0) calc(100% - 40vw))}}
.slot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:62% 85%;opacity:.85;transform:scale(1.12) translateY(var(--p,0px))}
.slot::after{content:none}
.slot .wrap{position:relative;z-index:2}
.slot h2{font-size:clamp(2.8rem,5.2vw,5.61rem);max-width:24ch}
.slot .rij{margin-top:48px;display:flex;gap:32px;align-items:center;flex-wrap:wrap}
.slot .knop{background:#fff;color:var(--diep)}
.slot .tel{font-size:1.5rem;font-weight:700}
.slot .werk{margin-top:28px;font-weight:300;opacity:.8}
.slot .werk a{font-weight:700;border-bottom:1.5px solid currentColor}
@media (max-width:900px){
  .balk nav{display:none}.balk img{height:60px}.balk .wrap{height:92px}
  .menuknop{margin-left:auto;font:inherit;font-weight:700;color:#fff;background:none;border:1.5px solid rgba(255,255,255,.6);padding:.7em 1.1em;cursor:pointer}
  body.menu-open .balk nav{display:flex;position:fixed;inset:92px 0 0;flex-direction:column;gap:22px;padding:40px var(--rand);background:var(--diep)}
  body.menu-open .balk nav a{font-size:2rem;font-weight:700;opacity:1}
  body.menu-open{overflow:hidden}
  .hero h1{font-size:3.1rem}
  .deuren a{width:100%;justify-content:space-between}
  .waarom{padding:96px 0 72px}.waarom .wrap{grid-template-columns:1fr;gap:20px}
  .motor{height:auto;padding:88px 0 0}
  .motor .podium,.motor .podium.licht{--bg:var(--navy);--tk:#fff}
  .motor .podium{position:relative;height:auto;overflow:visible}
  .motor .vakman{display:none}
  .mob div img{width:100%;aspect-ratio:4/3;object-fit:cover;margin-bottom:16px}
  .motor .vakman::after{background:linear-gradient(0deg,var(--navy),rgba(44,47,123,0) 50%)}
  .motor .wrap{height:auto;display:block;padding-top:24px;padding-bottom:72px}
  .motor .podium .wrap{order:-1}
  .woorden,.motor .uitleg,.motor .kopregel-dt{display:none}
  .mob{display:grid;gap:8px;margin-top:28px}
  .mob div{padding:22px 0}
  .mob div.op-blauw{background:var(--navy);color:#fff;box-shadow:0 0 0 100vmax var(--navy);clip-path:inset(0 -100vmax)}
  .mob div b{display:block;font-size:3.4rem;letter-spacing:-.05em;line-height:1;color:var(--c)}
  .mob div p{font-weight:300;opacity:.85;margin-top:8px;line-height:1.5}
  .mob div a{display:inline-block;margin-top:8px;font-weight:700;border-bottom:1.5px solid currentColor}
  .motor .lijn{position:relative}.motor .lijn button span{display:none}.motor .lijn button{height:24px}
  .wijzer{padding:96px 0}.tegels{grid-template-columns:1fr}.tegels a{min-height:0;gap:18px;padding:22px 22px 20px}
  .slot{padding:120px 0}
}
@media (min-width:901px){.mob{display:none}.kort{display:none}.menuknop{display:none}}
@media (max-width:900px){.lang{display:none}}
@media (prefers-reduced-motion:reduce){.woorden span,.motor .uitleg div{transition:none}}

.waarom .wrap{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)!important;gap:clamp(40px,6vw,120px)!important;align-items:center}
.kaart{margin:0;justify-self:end;width:100%;max-width:720px}
.kaart svg{width:100%;height:auto;display:block;overflow:visible}
.kaart .stippen{fill:#fff}
.kaart .rij{opacity:.08;transition:opacity .9s var(--e);transition-delay:calc(var(--r) * 14ms)}
.kaart.zicht .rij{opacity:.6}
.kaart .maas{fill:none;stroke:rgba(255,255,255,.85);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:2 5}
.kaart .vp{opacity:0;transition:opacity .8s var(--e);transition-delay:calc(1.1s + var(--i) * .25s)}
.kaart.zicht .vp{opacity:1}
.kaart .leider{stroke:rgba(255,255,255,.45);stroke-width:1}
.kaart text{fill:#fff;font:700 15px "Mozilla Text",system-ui,sans-serif;letter-spacing:.16em}
@media (prefers-reduced-motion:reduce){.kaart .rij{opacity:.6;transition:none}.kaart .vp{opacity:1;transition:none}}
@media (max-width:900px){.waarom .wrap{grid-template-columns:1fr!important}.kaart{justify-self:stretch;max-width:none;margin-top:8px}.kaart .rij{opacity:.6}.kaart .vp{opacity:1}.feitregel{flex-direction:column}.feitregel span+span::before{display:none}}
.feitregel{margin-top:36px;display:flex;flex-wrap:wrap;gap:10px 28px;font-size:.8125rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;opacity:.85}
.feitregel span{display:inline-flex;align-items:center;gap:10px}
.feitregel span+span::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.5;margin-right:18px;margin-left:-18px}

.haspels{position:relative;height:92vh;min-height:560px;overflow:hidden;display:flex;align-items:flex-end}
.haspels img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;transform:scale(1.08);transition:transform 2.4s var(--e)}
.haspels:hover img{transform:scale(1.04)}
.haspels::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(20,22,63,.85) 0%,rgba(20,22,63,0) 45%),linear-gradient(180deg,rgba(20,22,63,.5) 0,rgba(20,22,63,0) 25%)}
.haspels .wrap{position:relative;z-index:2;width:100%;padding-bottom:72px}
.haspels .kop{font-size:clamp(2.4rem,4.6vw,4.6rem);color:#fff}
@media (max-width:900px){.haspels{height:70vh;min-height:420px}}

.slotrij{display:grid;grid-template-columns:1fr;gap:72px}
.adressen{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px 32px;border-top:1px solid rgba(255,255,255,.25);padding-top:28px}
.adressen li{font-weight:300;font-size:.9375rem;line-height:1.55;opacity:.9}
.adressen b{display:block;font-weight:700;font-size:1rem;margin-bottom:4px;opacity:1}
@media (max-width:900px){.slotrij{gap:40px}.adressen{grid-template-columns:1fr 1fr}}

/* Variant 3 (Dave, 08-11-2026): beeld groot, werkwoord wit, labelnaam in een vlakje; de kleur zit in het doek */
.motor .vakman{width:100%!important;bottom:52px}
.motor .vakman img{object-position:70% 45%}
.motor .vakman::after{content:""!important;position:absolute;inset:0;background:linear-gradient(90deg,rgba(20,22,63,.92) 0%,rgba(20,22,63,.7) 35%,rgba(20,22,63,0) 65%)!important}
.motor .podium{background:var(--diep)!important}
.woorden span{color:#fff!important;-webkit-text-stroke:0!important}
.mob div b{color:#fff!important;-webkit-text-stroke:0!important}
.motor .uitleg b{display:inline-block!important;font-size:.8125rem!important;font-weight:700;letter-spacing:.14em;text-transform:uppercase;padding:7px 12px;margin-bottom:6px}
.mob div strong{display:inline-block;font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;padding:5px 9px;margin-right:6px}
.mob div.op-blauw{background:transparent!important;box-shadow:none!important}
.motor .uitleg div:nth-child(1) b{background:var(--works);color:#fff}.mob div:nth-child(1) strong{background:var(--works);color:#fff}.motor .uitleg div:nth-child(2) b{background:var(--internationals);color:#fff}.mob div:nth-child(2) strong{background:var(--internationals);color:#fff}.motor .uitleg div:nth-child(3) b{background:var(--academy);color:#101117}.mob div:nth-child(3) strong{background:var(--academy);color:#101117}.motor .uitleg div:nth-child(4) b{background:var(--professionals);color:#101117}.mob div:nth-child(4) strong{background:var(--professionals);color:#101117}.motor .uitleg div:nth-child(5) b{background:var(--vakmeesters);color:#101117}.mob div:nth-child(5) strong{background:var(--vakmeesters);color:#101117}.motor .uitleg div:nth-child(6) b{background:var(--personeelsdiensten);color:#fff}.mob div:nth-child(6) strong{background:var(--personeelsdiensten);color:#fff}
/* Slot: één regel voor het beeld, alle zes haspels in beeld */
.slot img.slotbeeld{transform:none!important;opacity:1!important;object-position:92% 70%!important}
@media (max-width:900px){.slot img.slotbeeld{object-position:100% 60%!important}.kaart text{font-size:26px}}

/* Waarom SOMA op papier: lucht tussen het blauw */
.waarom{background:var(--papier);color:var(--inkt)}
.waarom .klein{color:var(--navy)}
.kaart .stippen{fill:var(--navy)}
.kaart.zicht .rij{opacity:.5}
.kaart .maas{stroke:var(--navy)}
.kaart .leider{stroke:rgba(16,17,23,.35)}
.kaart text{fill:var(--inkt)}
.kaart .vp circle[fill="#fff"]{fill:var(--inkt)}
@media (max-width:900px){.kaart .rij{opacity:.5}}
.certs{margin-top:22px;display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.certs .t{font-size:.8125rem;font-weight:300;margin-right:6px;opacity:.75}
.certs .c{font-size:.75rem;font-weight:700;letter-spacing:.1em;padding:7px 11px;border:1.5px solid currentColor;border-radius:2px}

.voet2{background:var(--diep);color:#fff;padding:96px 0 32px}
.v-top{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;flex-wrap:wrap;padding-bottom:64px}
.v-logo{height:84px;width:auto}
.v-contact{text-align:right;display:grid;gap:6px}
.v-tel{font-size:clamp(2rem,3.6vw,3.4rem);font-weight:700;letter-spacing:-.02em;line-height:1}
.v-mail{font-weight:300;font-size:1.25rem;opacity:.9;border-bottom:1px solid rgba(255,255,255,.4);padding-bottom:2px}
.v-adres{margin-bottom:56px;border-top:0!important;padding-top:0!important}
.v-labels{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:0}
.v-labels .vl{position:relative;display:flex;flex-direction:column;gap:18px;padding:28px 20px 24px 0;transition:background .35s}
.v-labels .vl::before{content:"";position:absolute;left:0;right:0;top:0;height:8px;background:var(--c);transition:height .4s var(--e)}
.v-labels .vl:hover::before{height:14px}
.v-labels .vl img{height:40px;width:auto;align-self:flex-start;margin-top:10px}
.v-labels .vl span{font-size:.75rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;opacity:.7}
.v-onder{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:56px;padding-top:24px;border-top:1px solid rgba(255,255,255,.14);font-size:.8125rem;opacity:.75}
.v-links{display:flex;gap:24px;flex-wrap:wrap}
.v-links a:hover{opacity:1;text-decoration:underline}
@media (max-width:900px){.v-top{flex-direction:column;align-items:flex-start}.v-contact{text-align:left}.v-labels{grid-template-columns:1fr 1fr;row-gap:8px}.v-logo{height:64px}.voet2{padding-bottom:96px}}

.certs2{margin-top:14px;opacity:.6}
.waarom .wrap{align-items:center}
/* werkwoorden: beeld rechts zodat de mensen niet onder het woord staan */
.motor .vakman{width:70%!important;left:auto!important;right:0}
.motor .vakman img{object-position:50% 38%!important}
.motor .vakman::after{background:linear-gradient(90deg,var(--diep) 0%,rgba(20,22,63,.55) 22%,rgba(20,22,63,0) 50%)!important}
/* einde van de pagina: geen restruimte */
.slot{padding-bottom:64px}
@media (max-width:900px){.voet2{padding-bottom:32px}body:has(.vastknop.toon) .voet2{padding-bottom:96px}
 .hero::after{background:linear-gradient(0deg,rgba(20,22,63,.95) 0%,rgba(20,22,63,.75) 45%,rgba(20,22,63,.1) 75%)!important}.hero img{object-position:72% 30%!important}}
.waaromkop{font-size:clamp(2.4rem,4.2vw,4.4rem);color:var(--inkt)}
.waaromkop .licht{color:var(--navy)}
.waaromtekst{margin-top:28px;font-weight:300;font-size:clamp(1.125rem,1.4vw,1.3rem);line-height:1.55;max-width:44ch}

/* voet optie 2 */
.fv{padding:80px 0 0}
/* geen tweede Group-logo in de voet: de vaste menubalk toont het al (Dave, 08-11-2026) */
.fv .ft{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;flex-wrap:wrap;padding-bottom:56px}
.fv .ft img{height:84px;width:auto}
.fv .ft a{font-weight:300;font-size:1.25rem;border-bottom:1px solid currentColor;padding-bottom:2px}
.fv .fa{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px 32px}
.fv .fa li{font-weight:300;font-size:.9375rem;line-height:1.55}
.fv .fa b{display:block;font-weight:700;font-size:1rem;margin-bottom:4px}
.fv .fo{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:56px;padding:24px 0 28px;border-top:1px solid rgba(16,17,23,.14);font-size:.8125rem;opacity:.75}
.fv .fo span:last-child{display:flex;gap:24px}
.f2{background:var(--papier);color:var(--inkt)}
.f2l{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:24px;align-items:center;margin-top:56px;padding-top:40px;border-top:1px solid rgba(16,17,23,.14)}
.f2l img{height:42px;width:auto}
@media (max-width:900px){.fv .fa{grid-template-columns:1fr 1fr}.fv .ft img{height:64px}.f2l{grid-template-columns:1fr 1fr}body:has(.vastknop.toon) .fv{padding-bottom:72px}}
/* criticus ronde 14: geen naad in het fotovlak, kaartnamen binnen beeld op mobiel */
.motor .vakman::after{background:linear-gradient(90deg,var(--diep) 0%,var(--diep) 4%,rgba(20,22,63,.7) 30%,rgba(20,22,63,0) 60%)!important}
@media (max-width:900px){.kaart svg{width:70%;margin:0 auto;overflow:visible}.kaart text{font-size:22px!important}}
.aitegel{position:absolute;z-index:4;display:grid;place-items:center;width:30px;height:30px;font-size:.6875rem;font-weight:700;letter-spacing:.06em;background:#101117;color:#fff}
.mfig{position:relative;margin:0}
.vastknop{display:none}
@media (max-width:900px){
  .vastknop{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:30;transform:translateY(110%);transition:transform .45s var(--e);gap:8px;padding:10px var(--rand) calc(10px + env(safe-area-inset-bottom,0px));background:var(--diep);box-shadow:0 -10px 30px rgba(0,0,0,.25)}
  .vastknop a{flex:1;display:flex;align-items:center;justify-content:center;min-height:48px;font-weight:700}
  .vastknop .p{background:#fff;color:var(--diep)}
  .vastknop .t{box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.5)}
  .vastknop.toon{transform:none}
  .hero .aitegel{bottom:auto!important;top:104px}
  .voet{padding-bottom:72px}
  .motor .lijn button::before{display:none}
}


/* Hero B (Dave 08-11-2026): vakman met de zes kleuren, ultrabreed beeld, kop op navy */
@media (min-width:901px){.hero img{object-position:100% 50%!important;transform:none!important;animation:none!important}.hero h1{max-width:11.5em}
.hero::after{background:linear-gradient(180deg,rgba(20,22,63,.75) 0,rgba(20,22,63,0) 150px),linear-gradient(90deg,rgba(20,22,63,.95) 0%,rgba(20,22,63,.85) 40%,rgba(20,22,63,.35) 62%,rgba(20,22,63,0) 75%),linear-gradient(0deg,rgba(20,22,63,.5),rgba(20,22,63,0) 28%)!important}}
@media (max-width:900px){.hero img{object-position:82% 50%!important}}

/* mensband (variant A, 08-11-2026) en motorbeeld zonder harde linkerrand, door tot de kleurlijn */
.mensband{background:var(--papier);color:var(--inkt);padding:110px 0}
.mb-kop{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;flex-wrap:wrap}
.mensband h2{font-size:clamp(2.2rem,3.6vw,3.6rem);max-width:20ch}
.mb-strook li{display:flex;flex-direction:column;align-items:center;gap:2px;text-align:center}
.mb-strook b{margin-top:10px;font-size:.9375rem}
.mb-strook span{font-size:.8125rem;font-weight:300;color:var(--zacht)}
.mb-knop{margin-top:44px}
.mensband .licht{color:var(--navy)}
.mensband .knop{background:var(--navy);color:#fff}
.mb-strook{list-style:none;margin:52px 0 0;padding:0;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:14px}
.mb-strook img{width:100%;aspect-ratio:1;border-radius:50%;object-fit:cover;object-position:50% 25%;box-shadow:0 0 0 3px var(--papier),0 0 0 5px var(--c)}
@media (min-width:901px){.motor .vakman{bottom:0!important;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 22%);mask-image:linear-gradient(90deg,transparent 0,#000 22%)}}
@media (max-width:900px){.mensband{padding:64px 0}.mb-strook{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}}

.pk{position:relative;background:var(--diep);color:#fff;padding:200px 0 96px}
.pk h1{font-size:clamp(3rem,6vw,5.61rem)}
.pk p{margin-top:24px;font-weight:300;font-size:clamp(1.15rem,1.5vw,1.375rem);line-height:1.5;max-width:48ch;opacity:.9}
.pk .kleurlijn{position:absolute;left:0;right:0;bottom:0}
.wijs{background:var(--papier);color:var(--inkt);padding:96px 0 120px}
.wijs .klein{color:var(--navy);margin-bottom:28px}
.wijs ol{list-style:none;margin:0;padding:0;border-top:1px solid var(--inkt)}
.wijs li > a{display:grid;grid-template-columns:132px minmax(0,1fr) 220px 40px;gap:36px;align-items:center;padding:22px 0;border-bottom:1px solid rgba(16,17,23,.14);transition:background .35s}
.wijs li > a:hover{background:rgba(255,255,255,.6)}
.wijs .duim{position:relative;width:132px;aspect-ratio:4/3;overflow:hidden}
.wijs .duim img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--e)}
.wijs details summary:hover .duim img{transform:scale(1.06)}
.wijs .duim .aitegel{right:6px;bottom:6px;width:22px;height:22px;font-size:.55rem}
.wijs .sit{font-size:clamp(1.4rem,2.1vw,2.1rem);font-weight:700;letter-spacing:-.025em;line-height:1.1}
.wijs .uit{display:block;margin-top:8px;font-weight:300;font-size:1.0625rem;color:var(--zacht)}
.wijs .lab{justify-self:start;font-size:.75rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;padding:7px 11px}
.wijs .pijl{font-size:1.6rem;transition:transform .35s var(--e)}
.wijs li > a:hover .pijl{transform:translateX(6px)}
.samen{background:#fff;color:var(--inkt);padding:110px 0}
.samen .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,6vw,120px);align-items:start}
.samen h2{font-size:clamp(2.2rem,3.6vw,3.6rem)}
.samen .licht{color:var(--navy)}
.samen p{margin-top:20px;font-weight:300;font-size:1.1875rem;line-height:1.55;max-width:44ch;color:var(--zacht)}
.samen .tel{display:block;margin-top:28px;font-size:1.75rem;font-weight:700}
.vorm{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.vorm label{display:block;font-size:.8125rem;font-weight:700;margin-bottom:6px}
.vorm input,.vorm textarea{width:100%;font:inherit;font-size:1rem;padding:14px 14px;border:1.5px solid rgba(16,17,23,.2);background:var(--papier)}
.vorm input:focus,.vorm textarea:focus{outline:none;border-color:var(--navy)}
.vorm .vol{grid-column:1/-1}
.vorm textarea{min-height:120px;resize:vertical}
.vorm .knop{background:var(--navy);color:#fff}
.vorm small{display:block;font-weight:300;color:var(--zacht);margin-top:10px}

/* uitklappende contactkaart */
.wijs details summary{list-style:none;display:grid;grid-template-columns:132px minmax(0,1fr) 220px 40px;gap:36px;align-items:center;padding:22px 0;border-bottom:1px solid rgba(16,17,23,.14);cursor:pointer;transition:background .35s}
.wijs details summary::-webkit-details-marker{display:none}
.wijs details summary:hover{background:rgba(255,255,255,.6)}
.wijs details summary:focus-visible{outline:2px solid var(--navy);outline-offset:4px}
.wijs details summary .pijl{transition:transform .4s var(--e)}
.wijs details[open] summary .pijl{transform:rotate(180deg)}
.wijs details[open] summary{border-bottom-color:transparent}
.kaartje{display:grid;grid-template-columns:200px minmax(0,1.2fr) minmax(0,1fr);gap:40px;align-items:start;padding:8px 0 40px 168px;border-bottom:1px solid rgba(16,17,23,.14);animation:open .5s var(--e)}
@keyframes open{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
.kaartje .portret{width:200px;height:200px;object-fit:cover}
.kaartje .klein{color:var(--navy);margin-bottom:10px}
.kaartje .wie b{display:block;font-size:1.75rem;letter-spacing:-.02em}
.kaartje .wie > span{display:block;margin-top:4px;font-weight:300;color:var(--zacht)}
.acties2{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.acties2 .knop{padding:.85em 1.2em;font-size:.9375rem}
.k1{background:var(--navy);color:#fff}
.k2{background:transparent;color:var(--inkt);box-shadow:inset 0 0 0 1.5px rgba(16,17,23,.3)}
.k2:hover{box-shadow:inset 0 0 0 1.5px var(--inkt)}
.naarlabel{display:inline-block;margin-top:18px;font-weight:700;font-size:.9375rem;border-bottom:1.5px solid currentColor}
.terug{background:#fff;padding:22px;display:grid;gap:6px}
.terug label{font-size:.75rem;font-weight:700;margin-top:6px}
.terug input{font:inherit;padding:11px 12px;border:1.5px solid rgba(16,17,23,.2);background:var(--papier)}
.terug .knop{margin-top:12px;justify-self:start}
.terug small{font-weight:300;color:var(--zacht)}
@media (max-width:900px){
  .wijs details summary{grid-template-columns:84px minmax(0,1fr) 24px;gap:8px 16px}
  .wijs details .lab{grid-column:2;grid-row:2}.wijs details summary .pijl{grid-column:3;grid-row:1}
  .kaartje{grid-template-columns:96px minmax(0,1fr);gap:16px;padding:4px 0 28px}
  .kaartje .portret{width:96px;height:96px}
  .terug{grid-column:1/-1}
}
@media (prefers-reduced-motion:reduce){.kaartje{animation:none}}
@media (max-width:900px){
  .pk{padding:150px 0 72px}
  .wijs li > a{grid-template-columns:84px minmax(0,1fr) 24px;gap:8px 16px}
  .wijs .duim{width:84px}
  .samen .wrap,.vorm{grid-template-columns:1fr}
}

/* eerste scherm: zes mensen boven de kleurlijn */
.pk2{position:relative;background:var(--diep);color:#fff;padding:170px 0 0;overflow:hidden}
.pk2 h1{font-size:clamp(2.8rem,5.4vw,5rem)}
.pk2-beeld{position:absolute;top:0;right:0;width:62%;height:78%;object-fit:cover;object-position:72% 45%;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 30%);mask-image:linear-gradient(90deg,transparent 0,#000 30%)}
.pk2::before{content:"";position:absolute;top:0;right:0;width:62%;height:78%;z-index:1;background:linear-gradient(90deg,var(--diep) 0%,rgba(20,22,63,.55) 30%,rgba(20,22,63,0) 60%),linear-gradient(0deg,var(--diep) 0%,rgba(20,22,63,0) 40%),linear-gradient(180deg,rgba(20,22,63,.7) 0,rgba(20,22,63,0) 140px)}
.pk2 .wrap{position:relative;z-index:2}
.pk2-ai{position:absolute;z-index:3;right:var(--rand);top:118px}
.pk2 .wrap>p{margin-top:18px;font-weight:300;font-size:clamp(1.1rem,1.4vw,1.3rem);max-width:46ch;opacity:.9}
.zes-m{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));margin-top:56px}
.zes-m .t{display:flex;flex-direction:column;align-items:center;gap:4px}
.zes-m .lb{font-size:.8125rem!important;opacity:.7!important}
.lijn6{display:none}
.feit{font-size:.8125rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--navy);margin-bottom:22px}
.zes-m a{position:relative;display:flex;flex-direction:column;align-items:center;gap:12px;padding:0 8px 30px;text-align:center;color:#fff}
.zes-m img{width:min(140px,10vw);aspect-ratio:1;border-radius:50%;object-fit:cover;object-position:50% 30%;box-shadow:0 0 0 4px var(--diep),0 0 0 6px var(--c);transition:transform .5s var(--e),box-shadow .4s}
.zes-m a:hover img,.zes-m a:focus-visible img{transform:translateY(-6px);box-shadow:0 0 0 4px var(--diep),0 0 0 9px var(--c)}
.zes-m b{font-size:1.125rem;line-height:1.2;min-height:2.4em;display:flex;align-items:flex-end;justify-content:center;text-wrap:balance}
.feit2{margin-top:22px;font-weight:700;font-size:1.0625rem;letter-spacing:.01em;color:#fff}
.feit2 span{white-space:nowrap}
.naarteam{margin-top:14px}.naarteam a{font-weight:700;color:#fff;border-bottom:1.5px solid rgba(255,255,255,.6)}
.feit2 i{font-style:normal;opacity:.55;margin:0 .5em;font-weight:300}
.pk2 .wrap>p{text-wrap:pretty}
.pk2 h1 .r{display:block}
.samen p,.rij2 .uit{text-wrap:pretty}
.zes-m span{font-weight:300;font-size:.9375rem;opacity:.85}
.zes-m a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:8px;background:var(--c);transition:height .35s var(--e)}
.zes-m a:hover::after{height:14px}
/* rijen: de mens voorop */
.rij2{display:grid;grid-template-columns:136px minmax(0,1fr) 300px;gap:36px;align-items:center;padding:30px 0;border-bottom:1px solid rgba(16,17,23,.14);scroll-margin-top:120px}
.rij2 .gezicht{width:136px;height:136px;border-radius:50%;object-fit:cover;object-position:50% 30%;box-shadow:0 0 0 4px var(--papier),0 0 0 7px var(--c)}
.rij2 h2{font-size:clamp(1.4rem,2.1vw,2.05rem);font-weight:700;letter-spacing:-.025em;line-height:1.1;text-wrap:balance;max-width:24ch}
.rij2 .uit{display:block;margin-top:8px;font-weight:300;font-size:1.0625rem;color:var(--zacht)}
.rij2 .wie{display:flex;align-items:center;gap:12px;margin-top:14px;font-size:1.0625rem}
.rij2 .wie img{display:none}
.rij2 .wie b{font-weight:700}
.rij2 .wie .fu{color:var(--zacht);font-weight:300}
.rij2 .lab2{white-space:nowrap;flex-basis:100%}
.rij2 .wie{flex-wrap:wrap;row-gap:4px}
.rij2 .wie b,.rij2 .wie .fu{white-space:nowrap}
.zes-m b{font-weight:700}
.lab2::before{width:10px!important;height:10px!important}
@media (min-width:901px){.rij2{grid-template-columns:136px minmax(0,1fr) 320px}}
.sitekaart{display:grid;gap:8px;margin-top:14px;padding:14px 16px;background:#fff;border-left:5px solid var(--c);width:100%;box-shadow:0 1px 0 rgba(16,17,23,.06);transition:transform .25s,box-shadow .25s}
.sitekaart img{height:28px;width:auto}.sitekaart span{font-size:.875rem;color:var(--zacht)}.sitekaart b{color:var(--inkt);display:inline-block;transition:transform .25s}
.sitekaart:hover{transform:translateY(-2px);box-shadow:0 10px 24px -14px rgba(16,17,23,.35)}.sitekaart:hover b{transform:translateX(5px)}
@media (max-width:900px){.sitekaart{max-width:340px}}
.contact2{display:grid;gap:8px;justify-items:start}
.contact2 .nr{font-size:1.5rem;font-weight:700;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.contact2 .links{display:flex;gap:18px;font-weight:700;font-size:.9375rem}
.contact2 .links a,.contact2 .links button{font:inherit;background:none;border:0;padding:0;cursor:pointer;color:var(--navy);border-bottom:1.5px solid currentColor}
.contact2 .mob{display:none}
/* terugbellen met naam en gezicht */
.tb2{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin:-8px 0 0 172px;padding:18px 22px;background:#fff;border-left:4px solid var(--c)}
.tb2[hidden]{display:none}
.tb2 img{width:44px;height:44px;border-radius:50%;object-fit:cover}
.tb2 b{margin-right:8px}
.tb2 input{font:inherit;padding:11px 12px;border:1.5px solid rgba(16,17,23,.2);background:var(--papier);min-width:220px}
.tb2 input:focus{outline:none;border-color:var(--navy);box-shadow:0 0 0 2px rgba(44,47,123,.2)}
.tb2 small{flex-basis:100%;color:var(--zacht)}
.weg{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
/* afsluiting in dezelfde papiertoon */
.wijs{padding-bottom:72px!important}
.samen{background:var(--papier)!important;padding:56px 0 40px!important}
.voet,footer.fv{padding-top:48px!important}
.samen .rijtje{display:flex;margin-top:22px}
.samen .rijtje img{width:52px;height:52px;border-radius:50%;object-fit:cover;object-position:50% 30%;box-shadow:0 0 0 3px var(--papier);margin-left:-10px}
.samen .rijtje img:first-child{margin-left:0}
@media (max-width:900px){
  .pk2{padding-top:130px}
  .pk2 h1{font-size:2.5rem}
  .pk2-beeld,.pk2::before{width:100%;height:420px}
  .pk2-beeld{-webkit-mask-image:none;mask-image:none}
  .pk2::before{background:linear-gradient(180deg,rgba(20,22,63,.8) 0,rgba(20,22,63,0) 130px),linear-gradient(0deg,var(--diep) 0%,rgba(20,22,63,.75) 50%,rgba(20,22,63,.35) 100%)}
  .pk2-ai{top:104px}
  .zes-m{grid-template-columns:1fr;margin-top:32px;padding-bottom:28px}
  .zes-m a{flex-direction:row;align-items:center;text-align:left;gap:16px;padding:10px 0}
  .zes-m a::after{display:none}
  .zes-m img{width:56px;box-shadow:0 0 0 3px var(--diep),0 0 0 5px var(--c)}
  .zes-m .t{align-items:flex-start;gap:2px}
  .zes-m b{min-height:0;justify-content:flex-start}
  .feit2{font-size:.9375rem;line-height:1.6}
  .wijs ol{border-top-color:rgba(16,17,23,.14)!important}
  .zes-m span{font-size:.875rem}
  .lijn6{display:flex;height:8px}.lijn6 i{flex:1;background:var(--c)}
  .wijs .feit{margin-bottom:16px}
  .rij2{grid-template-columns:1fr;gap:12px;padding:26px 0}
  .rij2 .gezicht{display:none}
  .rij2 .wie img{display:block;grid-row:1/4;width:60px;height:60px;border-radius:50%;object-fit:cover;object-position:50% 30%;box-shadow:0 0 0 3px var(--papier),0 0 0 5px var(--c)}
  .rij2 .wie{display:grid;grid-template-columns:60px minmax(0,1fr);column-gap:16px;row-gap:2px;align-items:center}
  .rij2 .wie>*:not(img){grid-column:2}
  .rij2 h2{max-width:none}
  .rij2 .lab2,.rij2 .wie b,.rij2 .wie .fu{white-space:normal}
  .contact2{display:block;margin-top:4px}
  .contact2 .mob{margin-top:0!important}
  .wijs{padding-top:56px!important;padding-bottom:48px!important}
  .samen{padding:56px 0!important}
  .contact2 .nr{display:none}
  .contact2 .links{display:none}
  .contact2 .mob{display:flex;gap:8px;width:100%}
  .contact2 .mob .knop{flex:1;justify-content:center;padding:.85em .6em;font-size:.9375rem;white-space:nowrap;border:0;font-family:inherit;cursor:pointer}
  .tb2{margin-left:0}
}

.pk3{position:relative;background:var(--diep);color:#fff;padding:180px 0 96px}
.pk3 h1{font-size:clamp(2.8rem,5.4vw,5rem)}
.pk3 .wrap>p{margin-top:20px;font-weight:300;font-size:clamp(1.1rem,1.4vw,1.3rem);line-height:1.5;max-width:48ch;opacity:.9;text-wrap:pretty}
.pk3 .kleurlijn{position:absolute;left:0;right:0;bottom:0}
.pk3 .acties{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.pk3 .knop.wit{background:#fff;color:var(--diep)}
.pk3 .knop.lijn{color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.55)}
.blad{background:var(--papier);color:var(--inkt);padding:88px 0}
.blad.wit{background:#fff}
.blad h2.kop{font-size:clamp(2rem,3.4vw,3.2rem)}
.blad .licht{color:var(--navy)}
.blad .intro{margin-top:16px;font-weight:300;font-size:1.1875rem;line-height:1.55;max-width:56ch;color:var(--zacht)}
/* routes: één rij per situatie, labelkleur als lijn links */
.route{list-style:none;margin:40px 0 0;padding:0;border-top:1px solid var(--inkt)}
.route a{display:grid;grid-template-columns:6px minmax(0,1fr) 220px 32px;gap:28px;align-items:center;padding:26px 0;border-bottom:1px solid rgba(16,17,23,.14);transition:background .3s}
.route a:hover{background:rgba(255,255,255,.65)}
.route i{align-self:stretch;background:var(--c)}
.route h3{font-size:clamp(1.3rem,2vw,1.9rem);letter-spacing:-.025em;line-height:1.15;text-wrap:balance}
.route p{margin-top:6px;font-weight:300;font-size:1.0625rem;color:var(--zacht)}
.route .lab2{font-weight:700;font-size:.9375rem}
.route .pijl{font-size:1.5rem;transition:transform .3s var(--e)}
.route a:hover .pijl{transform:translateX(6px)}
/* drie kolommen */
.drie{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;margin-top:44px}
.drie h3{font-size:1.5rem;letter-spacing:-.02em}
.drie p{margin-top:10px;font-weight:300;font-size:1.0625rem;line-height:1.55;color:var(--zacht)}
.drie .tel{display:block;margin-top:10px;font-size:1.5rem;font-weight:700;color:var(--inkt)}
/* vestigingen */
.vest{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px;margin-top:44px;border-top:1px solid var(--inkt);padding-top:28px}
.vest b{display:block;font-size:1.25rem;margin-bottom:8px}
.vest span{display:block;font-weight:300;line-height:1.6}
.vest a{display:inline-block;margin-top:8px;font-weight:700;border-bottom:1.5px solid currentColor}
/* labels op Over SOMA */
.labels6{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin-top:44px;border-top:1px solid var(--inkt)}
.labels6 a{display:block;padding:26px 24px 30px 0;border-bottom:1px solid rgba(16,17,23,.14);position:relative}
.labels6 a::before{content:"";display:block;width:44px;height:6px;background:var(--c);margin-bottom:18px;transition:width .35s var(--e)}
.labels6 a:hover::before{width:88px}
.labels6 .ww{font-size:.8125rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--zacht)}
.labels6 b{display:block;margin-top:6px;font-size:1.5rem;letter-spacing:-.02em}
.labels6 p{margin-top:8px;font-weight:300;color:var(--zacht);max-width:30ch}
.labels6 .naar{display:inline-block;margin-top:12px;font-style:normal;font-weight:700;font-size:.9375rem;border-bottom:1.5px solid currentColor}
.naarteam2{margin-top:36px}.naarteam2 a{font-weight:700;color:var(--navy);border-bottom:1.5px solid currentColor}
/* contact */
.kc{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(40px,6vw,110px);align-items:start}
.kc .drie{grid-template-columns:1fr;gap:28px;margin-top:32px}
.vorm select{width:100%;font:inherit;font-size:1rem;padding:14px;border:1.5px solid rgba(16,17,23,.2);background:var(--papier)}
.vorm .klein2{font-size:.875rem;font-weight:300;color:var(--zacht)}
.vorm .klein2 a{border-bottom:1px solid currentColor}
.ef{margin-top:36px;padding:20px 22px;background:#fff;border-left:4px solid var(--navy)}
.ef a{font-weight:700;border-bottom:1.5px solid currentColor}
/* subpagina met beeld (doorlichting 08-11-2026): zelfde taal als de home */
.pk3.metbeeld{min-height:min(82vh,760px);display:flex;align-items:flex-end;overflow:hidden}
.pk3 .pk-beeld{position:absolute;top:0;right:0;width:64%;height:100%;object-fit:cover;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 34%);mask-image:linear-gradient(90deg,transparent 0,#000 34%)}
@media (max-width:900px){.pk3 .pk-beeld{width:100%;-webkit-mask-image:none;mask-image:none}}
.pk3.metbeeld::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,22,63,.7) 0,rgba(20,22,63,0) 140px),linear-gradient(90deg,rgba(20,22,63,.94) 0%,rgba(20,22,63,.66) 34%,rgba(20,22,63,0) 58%),linear-gradient(0deg,rgba(20,22,63,.5),rgba(20,22,63,0) 30%)}
.pk3.metbeeld .wrap{position:relative;z-index:2;width:100%}
.pk3 .pk-ai{position:absolute;right:var(--rand);bottom:30px;z-index:3}
.pk3 .kleurlijn{z-index:3}
/* verhaal op Over SOMA (variant B) */
.vb-label{display:inline-block;font-size:.75rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--zacht);border:1px dashed rgba(16,17,23,.35);padding:4px 9px;margin-bottom:18px}
.splits{margin-top:56px}
.splits svg{display:block;width:100%;height:120px}
.splits .rij6{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:22px}
.splits .stap{border-top:6px solid var(--c);padding-top:18px}
@media (min-width:901px){
  .splits .rij6{grid-template-rows:repeat(6,auto);row-gap:0}
  .splits .stap{display:grid;grid-template-rows:subgrid;grid-row:span 6;align-items:start}
  .splits .stap b{align-self:start}
  .splits .stap .wie{align-self:end}
  .splits .stap .naar,.splits .stap img{justify-self:start}
}
.splits .stap img{width:72px;height:72px;border-radius:50%;object-fit:cover;object-position:50% 25%;margin-bottom:14px;box-shadow:0 0 0 3px var(--papier),0 0 0 5px var(--c)}
.splits .ww{display:block;font-size:.8125rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--zacht)}
.splits .stap b{display:block;font-size:1.125rem;letter-spacing:-.02em}
.splits .stap p{margin-top:6px;font-weight:300;font-size:.9375rem;line-height:1.55;color:var(--zacht)}
.splits .stap .wie{font-size:.875rem;font-weight:700;color:var(--inkt);margin-top:8px}
.splits .naar{display:inline-block;margin-top:10px;font-weight:700;font-size:.875rem;border-bottom:1.5px solid currentColor}
.vr-slot{margin-top:56px;display:flex;flex-wrap:wrap;align-items:center;gap:24px;font-size:1.375rem;font-weight:700}
.vr-slot .knop{background:var(--navy);color:#fff}
@media (max-width:900px){.splits svg{display:none}.splits .rij6{grid-template-columns:1fr;gap:28px}}
/* gezichtenstrook op Over SOMA */
.strook{list-style:none;margin:40px 0 0;padding:0;display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:14px}
.strook img{width:100%;max-width:120px;aspect-ratio:1;border-radius:50%;object-fit:cover;object-position:50% 25%;box-shadow:0 0 0 4px #fff,0 0 0 6px var(--c)}
/* contactkanalen met icoon (Dave 08-11-2026: subtieler, icoontje) */
.kanalen{display:flex;flex-wrap:wrap;gap:16px 40px;margin-top:32px}
.kanalen.kol{flex-direction:column;gap:18px}
.kanaal{display:inline-flex;align-items:center;gap:12px;font-weight:700;font-size:1.125rem;color:var(--inkt);min-height:44px}
.kanaal svg{width:22px;height:22px;flex:none;fill:none;stroke:var(--navy);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.kanaal:hover{color:var(--navy)}
.kanaal.ef2{font-weight:300;font-size:1rem;color:var(--zacht)}
/* privacy */
.wrap.tekst{max-width:var(--max)}
.tekst>*{max-width:68ch}
.tekst h2{font-size:1.5rem;letter-spacing:-.02em;margin-top:36px;padding-top:28px;border-top:1px solid rgba(16,17,23,.12)}
.tekst h2:first-child{margin-top:0;padding-top:0;border-top:0}
.tekst h2{max-width:56rem!important}
.tekst p{margin-top:10px;font-weight:300;font-size:1.125rem;line-height:1.6;color:var(--zacht)}
.tekst a{border-bottom:1px solid currentColor;color:var(--navy)}
.tekst h3{font-size:1.125rem;letter-spacing:-.01em;margin-top:24px}
.tekst ul{margin:12px 0 0;padding-left:1.2em;font-weight:300;font-size:1.125rem;line-height:1.6;color:var(--zacht)}
.tekst li+li{margin-top:6px}
.tekst li b,.tekst p b{font-weight:700;color:var(--inkt)}
.tekst .inhetkort{padding:24px 28px;background:#fff;border-radius:4px}
.tekst .inhetkort h2{margin-top:0;padding-top:0;border-top:0}
.tekst table{margin-top:16px;width:100%;border-collapse:collapse;font-size:1rem;line-height:1.5}
.tekst th{text-align:left;font-weight:700;color:var(--inkt);padding:10px 16px 10px 0;border-bottom:1.5px solid var(--inkt);vertical-align:bottom}
.tekst td{font-weight:300;color:var(--zacht);padding:12px 16px 12px 0;border-bottom:1px solid rgba(16,17,23,.12);vertical-align:top}
.tekst td:first-child{font-weight:700;color:var(--inkt)}
@media (max-width:640px){.tekst .inhetkort{padding:20px}.tekst thead{position:absolute;left:-9999px}.tekst tr,.tekst td{display:block}.tekst tr{padding:12px 0;border-bottom:1px solid rgba(16,17,23,.12)}.tekst td{border:0;padding:2px 0}.tekst td:not(:first-child)::before{content:attr(data-k) ": ";font-weight:700;color:var(--inkt)}}
@media (max-width:900px){
  .pk3{padding:130px 0 72px}
  .pk3 h1{font-size:2.35rem;overflow-wrap:break-word}
  .pk3.metbeeld{min-height:640px}
  .pk3.metbeeld::after{background:linear-gradient(180deg,rgba(20,22,63,.8) 0,rgba(20,22,63,0) 130px),linear-gradient(0deg,rgba(20,22,63,.96) 0%,rgba(20,22,63,.8) 48%,rgba(20,22,63,.1) 78%)}
  .pk3 .pk-ai{bottom:auto;top:104px}
  .strook{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px 12px}
  .blad{padding:60px 0}
  .route a{grid-template-columns:5px minmax(0,1fr) 24px;gap:8px 18px}
  .route .lab2{grid-column:2;grid-row:2}
  .route .pijl{grid-column:3;grid-row:1}
  .route i{grid-row:1/3}
  .drie,.labels6,.kc{grid-template-columns:1fr}
  .vest{grid-template-columns:1fr 1fr;gap:28px 20px}
}

.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}form small.goed{font-weight:700}.vorm .vink,.tb2 .vink{display:flex;gap:12px;align-items:flex-start;font-size:.9375rem;font-weight:300;line-height:1.5;margin:0;cursor:pointer}.vorm .vink input,.tb2 .vink input{width:22px;height:22px;min-width:0;flex:none;margin:1px 0 0;padding:0;accent-color:var(--navy)}.vorm .vink a,.tb2 .vink a{border-bottom:1px solid currentColor}.tb2 .vink{flex-basis:100%;font-size:.875rem;align-items:center}.vorm .vink{margin-top:10px}
/* afwerking na Ruuds eindtest, 11-11-2026 */
.balk:not(.vast)::before{content:"";position:absolute;inset:0 0 -48px;z-index:-1;pointer-events:none;background:linear-gradient(180deg,rgba(20,22,63,.82) 0,rgba(20,22,63,.5) 55%,rgba(20,22,63,0))}
body.menu-open .balk::before{display:none}
.fv .fa a{display:inline-block;padding:10px 0;margin:-10px 0}
@media (max-width:900px){
 .balk .thuis img{filter:drop-shadow(0 1px 2px rgba(20,22,63,.9)) drop-shadow(0 0 10px rgba(20,22,63,.55))}
 body.menu-open .balk nav a{min-height:44px;display:flex;align-items:center}
 .mob div a{position:relative}.mob div a::after{content:"";position:absolute;inset:-11px -4px}
 .vastknop a{padding:0 10px;text-align:center;line-height:1.2}
}
@media (max-width:400px){.vastknop .p{flex:1.45}.vastknop a{font-size:.9375rem}}

/* ===== labelsites (11-11-2026) ===== */
body.werkpagina .pk3 h1{font-size:clamp(2.4rem,4.4vw,3.8rem)}body.werkpagina .pk3{padding-bottom:64px!important}@media (min-width:901px){body.werkpagina .pk3{padding-top:150px!important}}
/* kleurlijn: op een labeluiting is alleen het eigen label fel, de andere vijf gedempt (merkafspraken 01, kleurlijn) */
.kleurlijn i{opacity:.35}.kleurlijn i:nth-child(6){opacity:1}
.pk3 .kleurlijn,.slotband .kleurlijn{background:var(--diep)}
/* home: grotere kop, zelfde taal als de subpagina's van de Group-site */
.pk3.thuis{min-height:min(92vh,820px)}
.pk3.thuis h1{font-size:clamp(3rem,5.4vw,5.4rem);max-width:12em}
.pk3 h1 del{text-decoration-color:var(--personeelsdiensten);text-decoration-thickness:.09em;font-weight:300;opacity:.85;display:block}
.pk3 .extra{margin-top:22px;font-weight:300;font-size:1rem;opacity:.85}.pk3 .extra a{font-weight:700;border-bottom:1.5px solid currentColor}
/* taalknop */
.balk .taal{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;font-weight:700;font-size:.9375rem;color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.35)}
.balk .taal:hover{box-shadow:inset 0 0 0 1.5px #fff}
@media (max-width:900px){.balk .taal{margin-left:auto}.balk .taal~.menuknop{margin-left:10px}.balk .wrap{gap:16px}}
/* antwoordblok (vraag als kop, antwoord in de eerste zin) */
.vraagblok h2.kop{font-size:clamp(2rem,3.4vw,3.2rem);max-width:20ch}
@media (max-width:420px){.vraagblok h2.kop,.blad h2.kop,.samen h2,.slotband h2{font-size:clamp(1.6rem,8vw,2rem)}}
h1.kop,h2.kop{overflow-wrap:break-word;hyphens:auto}
/* herstel na Ruud: op 320 tot 340 breed paste het langste woord van de kop niet (Administratie, Netherlands.), dus kleiner */
@media (max-width:340px){.pk3 h1.kop,.pk3.thuis h1.kop{font-size:2.5rem}}
/* focus duidelijker (herstel na Ruud): 2 px met afstand, labelkleur op licht, wit op donker; velden en vinkje ook */
:focus-visible{outline:2px solid var(--l,var(--navy));outline-offset:3px}
:is(.balk,.pk3,.slotband) :focus-visible{outline-color:#fff}
body .vorm :is(input,textarea,select):focus-visible,body .tb2 input:focus-visible{outline:2px solid var(--l,var(--navy));outline-offset:2px;border-color:var(--l,var(--navy))}
body .vink input:focus-visible{outline:2px solid var(--l,var(--navy));outline-offset:3px}
/* klikvlakken minstens 44 px: het hele vinkje met tekst, de links in de voet */
.vink,.tb2 .vink{min-height:44px}
.fv .fa a,.fv .fo a,body .fv .fo span:first-child a{display:inline-flex;align-items:center;min-height:44px;padding:0;margin:-10px 0}
.feiten{list-style:none;margin:28px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.feiten li{font-weight:700;font-size:.9375rem;padding:.55em .9em;border:1.5px solid rgba(16,17,23,.18);background:#fff}
.feiten li:first-child{border-color:var(--personeelsdiensten)}
/* blokken met twee of vier onderdelen */
.drie.twee,.drie.vier{grid-template-columns:repeat(2,minmax(0,1fr))}
.drie>div{border-top:5px solid var(--personeelsdiensten);padding-top:18px}
@media (max-width:900px){.drie.twee,.drie.vier{grid-template-columns:1fr}}
/* vergelijkingstabel */
.tabelblok{margin-top:36px}.tabelblok table{font-size:1.0625rem}.tabelblok th:last-child{box-shadow:inset 0 -3px 0 var(--personeelsdiensten)}
/* aanspreekpunt */
.wijs .rij2 h2 .licht{display:block;font-weight:300;color:var(--zacht);font-size:.75em;margin-top:6px}
.wijs ol{border-top:1px solid rgba(16,17,23,.14)}
/* slotband */
.slotband{position:relative;background:var(--diep);color:#fff;padding:110px 0 118px}
.slotband h2{font-size:clamp(2.4rem,4.4vw,4rem)}
.slotband .acties{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.slotband .knop.wit{background:#fff;color:var(--diep)}.slotband .knop.lijn{color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.55)}
.slotband .kleurlijn{position:absolute;left:0;right:0;bottom:0}
/* voet: SOMA Group en de andere labels */
.fv .fa{grid-template-columns:repeat(3,minmax(0,1fr))}
.fv .fa a{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.blad+.wijs{padding-top:8px!important}
.fv .groep{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-top:48px}
.fv .groep img{height:56px;width:auto}.fv .groep p{font-weight:300;font-size:.9375rem;max-width:40ch}
.f2l a[aria-current]{opacity:1}.f2l a{opacity:.85;transition:opacity .2s}.f2l a:hover{opacity:1}
@media (max-width:900px){.fv .fa{grid-template-columns:1fr}}
/* contactkanalen als blok */
.kc .kanalen{margin-top:28px}
.tekst .bijgewerkt{margin-top:0;font-size:1rem}
/* uitleg en veelgestelde vragen (ronde 2) */
.uitleg{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:24px 64px;align-items:start}
.uitlegtekst p{font-weight:300;font-size:1.1875rem;line-height:1.6;color:var(--zacht);max-width:60ch}.uitlegtekst p+p{margin-top:16px}
.faq{margin-top:40px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:36px 56px}
.faq h3{font-size:1.375rem;letter-spacing:-.02em}
.faq p{margin-top:10px;font-weight:300;font-size:1.0625rem;line-height:1.55;color:var(--zacht);max-width:52ch}
.vorm .letop{margin-top:6px}
@media (max-width:900px){.uitleg,.faq{grid-template-columns:1fr}.faq{gap:28px;margin-top:28px}}

/* ===== labelaccent C (11-11-2026) ===== */
body{--l:#A42545;--l-donker:#A42545;--l-tint:color-mix(in srgb,var(--l) 7%,var(--papier))}
/* A · draad: kleurlijn op wit (gedempte labels lezen als pastel), kopstreepje, tweede kopregel en randen in de labelkleur */
.kleurlijn{background:#fff!important}
:is(.pk3 h1.kop,.blad h2.kop,.slotband h2.kop)::before{content:"";display:block;width:56px;height:5px;background:var(--l);margin-bottom:24px}
:is(.pk3 h1.kop,.slotband h2.kop)::before{background:var(--l-donker)}
.blad .licht{color:var(--l)}
.feiten li{border-left:4px solid var(--l);background:#fff}
.feiten li:first-child{border:1.5px solid var(--l);border-left-width:4px}
@media (min-width:901px){.route a{grid-template-columns:8px minmax(0,1fr) 220px 32px}}
.route .pijl,.route .lab2{color:var(--l)}
.pk3 .extra a{border-bottom-color:var(--l-donker);border-bottom-width:2px}
.fv .fa a{text-decoration-color:var(--l);text-decoration-thickness:2px}
/* B · knop en vlakje: knoppen bij het aanspreekpunt en het labelvlakje op het beeld */
.wijs .knop.k1{background:var(--l);color:#fff}
.wijs .links a,.wijs .links button{text-decoration-color:var(--l)}
.vlakje{display:flex;align-items:center;position:absolute;z-index:3;left:0;top:0;pointer-events:none}
.vlakje[hidden]{display:none}
.vlakje b{background:var(--l);color:#fff;font-size:.8125rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;padding:8px 12px;box-shadow:0 0 0 1px rgba(255,255,255,.25);white-space:nowrap}
.vlakje i{display:block;width:64px;height:2px;background:#fff}
.vlakje em{display:block;flex:none;width:16px;height:16px;border-radius:50%;background:var(--l);box-shadow:0 0 0 3px #fff}
.vlakje.staand{flex-direction:column}.vlakje.staand i{width:2px;height:64px}.vlakje.rechts{flex-direction:row-reverse}
@media (max-width:900px){.vlakje b{font-size:.6875rem;padding:6px 9px}.vlakje i{width:36px}.vlakje.staand i{height:40px}}
/* C · slotband in volle labelkleur */
.slotband{background:var(--l)}
.slotband h2.kop::before{background:#fff}
.slotband .knop.wit{background:#fff;color:var(--l);box-shadow:none}
.slotband .knop.lijn{box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.7)}

/* C · knoppen in het eerste scherm in de labelkleur; lichte tint in secties op papier, niet onder 'Wat doet' (Kees) */
.balk .knop.lang,.pk3 .knop.wit{background:var(--l);color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.28)}
.balk .knop.lang:hover,.pk3 .knop.wit:hover{background:#fff;color:var(--diep)}
.blad:not(.wit){background:var(--l-tint)}
.blad:has(.vraagblok){background:var(--papier)}

/* ===== formulier in de labelkleur (voorstel, schakelaar FORMULIER_IN_LABELKLEUR in labelsite.py) ===== */
.samen .licht{color:var(--l)}
body .vorm .knop[type=submit]{background:var(--l);color:#fff}
body .vorm .knop[type=submit]:hover{background:var(--diep)}