/* Polly.help, nieuws en werk. De held: laptop en telefoon rechts, de titel links op het donker. */
@media (min-width:1101px){.sv-held-beeld{inset:96px 0 0 38%;background-position:62% 50%}}

/* Eigen blokken: alleen --sv-*-tokens, afstanden uit de 8px-schaal. Zonder JavaScript staat alles gewoon in beeld. */
.pv-l{display:block;font-size:14px;font-weight:700;color:var(--sv-inkt-licht);margin:0 0 var(--sv-s1)}
.pv-onder{font-size:15px;line-height:1.5;color:var(--sv-inkt-licht);margin:var(--sv-s2) 0 0}
.pv-onder a{color:inherit}

/* ---- oud tegen nieuw */
.pv-vn{margin-top:var(--sv-s6);margin-bottom:var(--sv-s6)}
.pv-vn-kop{display:flex;justify-content:space-between;font-family:var(--sv-font-kop);font-weight:800;font-size:20px;color:var(--sv-inkt-sterk);margin:0 0 var(--sv-s2)}
.pv-vn-kop span:last-child{color:var(--sv-merk-donker,var(--sv-inkt-sterk))}
.pv-vn-doek{position:relative;aspect-ratio:1800/1125;border-radius:var(--sv-radius);overflow:hidden;box-shadow:var(--sv-schaduw);background:#0C0F26;touch-action:pan-y}
.pv-vn-doek img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top;display:block}
.pv-vn-oud{position:absolute;inset:0;clip-path:inset(0 calc(100% - var(--x)) 0 0)}
.pv-vn-lijn{position:absolute;top:0;bottom:0;left:var(--x);width:4px;margin-left:-2px;background:var(--sv-merk);pointer-events:none}
.pv-vn-lijn i{position:absolute;top:50%;left:50%;width:56px;height:56px;margin:-28px 0 0 -28px;border-radius:50%;background:var(--sv-merk);box-shadow:0 10px 30px rgba(0,0,0,.35)}
.pv-vn-lijn i::before,.pv-vn-lijn i::after{content:"";position:absolute;top:50%;width:10px;height:10px;border-top:3px solid var(--sv-op-merk);border-left:3px solid var(--sv-op-merk);margin-top:-5px}
.pv-vn-lijn i::before{left:12px;transform:rotate(-45deg)}
.pv-vn-lijn i::after{right:12px;transform:rotate(135deg)}
.pv-vn-schuif{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;-webkit-appearance:none;appearance:none}

/* ---- drie talen */
.pv-taal{margin-top:var(--sv-s6);margin-bottom:var(--sv-s6)}
.pv-taal-kop{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:var(--sv-s3);margin:0 0 var(--sv-s3)}
.pv-groot{font-family:var(--sv-font-kop);font-weight:800;font-size:clamp(32px,4vw,52px);line-height:1;letter-spacing:-.03em;color:var(--sv-inkt-sterk);margin:0}
.pv-groot span{color:var(--sv-inkt-licht)}
.pv-taal-knoppen{display:flex;gap:var(--sv-s1);flex-wrap:wrap}
.pv-taal-knoppen button{font:700 16px/1 var(--sv-font-tekst,inherit);min-height:48px;padding:0 var(--sv-s3);border-radius:999px;border:1.5px solid var(--sv-lijn);background:transparent;color:var(--sv-inkt-zacht);cursor:pointer;transition:background .3s,color .3s,border-color .3s}
.pv-taal-knoppen button:hover{border-color:var(--sv-inkt-sterk);color:var(--sv-inkt-sterk)}
.pv-taal-knoppen button[aria-selected="true"]{background:var(--sv-merk);border-color:var(--sv-merk);color:var(--sv-op-merk)}
.pv-taal-doek{display:grid;border-radius:var(--sv-radius);overflow:hidden;box-shadow:var(--sv-schaduw)}
.pv-taal-b{grid-area:1/1;opacity:0;transition:opacity .5s var(--sv-ease)}
.pv-taal-b.aan{opacity:1}
.pv-taal-b img{display:block;width:100%;height:auto}

/* ---- ons eigen werk */
.pv-ew{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sv-s3);margin-top:var(--sv-s5);margin-bottom:var(--sv-s6)}
.pv-ew-kaart{display:grid;grid-template-rows:auto 1fr;min-width:0;text-decoration:none;color:inherit;background:#FFFFFF;border:1px solid var(--sv-lijn);border-radius:var(--sv-radius);overflow:hidden;transition:transform .4s var(--sv-ease),box-shadow .4s var(--sv-ease),border-color .4s}
.pv-ew-kaart:hover{transform:translateY(-6px);box-shadow:var(--sv-schaduw);border-color:var(--sv-merk)}
.pv-ew-beeld img{display:block;width:100%;height:auto;aspect-ratio:1200/630;object-fit:cover}
.pv-ew-tekst{display:block;padding:var(--sv-s3)}
.pv-ew-tekst b{display:block;font-family:var(--sv-font-kop);font-size:22px;line-height:1.2;color:var(--sv-inkt-sterk);margin:0 0 var(--sv-s1)}
.pv-ew-tekst>span:last-child{display:block;font-size:17px;line-height:1.45;color:var(--sv-inkt-zacht)}
@media (max-width:700px){.pv-ew{grid-template-columns:minmax(0,1fr)}}

/* ---- scène: het speelveld. De motor zet data-s op #scene-speelveld. */
.pv-veld{position:relative;padding:0 0 var(--sv-s5) var(--sv-s5);width:100%}
.pv-veld-raster{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(180px,auto));border-left:3px solid var(--sv-inkt-sterk);border-bottom:3px solid var(--sv-inkt-sterk)}
.pv-vak{min-width:0;padding:var(--sv-s3);border:1px dashed var(--sv-lijn);display:flex;flex-direction:column;align-items:flex-start;gap:var(--sv-s1);transition:opacity .5s var(--sv-ease),background .5s var(--sv-ease),transform .5s var(--sv-ease)}
.pv-vak b{font-family:var(--sv-font-kop);font-size:22px;line-height:1.15;color:var(--sv-inkt-sterk)}
.pv-tag{font-size:14px;font-weight:700;border-radius:999px;padding:4px 12px;background:var(--sv-lijn);color:var(--sv-inkt-zacht)}
.pv-tag.ja::before{content:"\2713  "}
.pv-tag.nee::before{content:"\2715  "}
.pv-tag.ja{background:#DDF3E9;color:#0B6B43}
.pv-tag.nee{background:#F6E1DD;color:#9A3324}
.pv-vak-gat{position:relative;align-items:center;justify-content:center}
.pv-vraag{font-family:var(--sv-font-kop);font-weight:800;font-size:88px;line-height:1;color:var(--sv-inkt-licht);transition:opacity .4s}
.pv-polly{position:absolute;inset:var(--sv-s1);display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:var(--sv-s1);padding:var(--sv-s3);border-radius:var(--sv-radius);background:#0C0F26;box-shadow:0 0 0 3px #16C079,0 20px 60px rgba(22,192,121,.35);opacity:0;transform:scale(.92);transition:opacity .5s var(--sv-ease),transform .5s var(--sv-ease)}
.pv-polly b{color:#FFFFFF;font-size:clamp(20px,1.7vw,28px)}
.pv-polly .pv-l{color:#9FE7C6}
.pv-as{position:absolute;margin:0;font-size:14px;font-weight:700;color:var(--sv-inkt-zacht)}
.pv-as-x{right:0;bottom:0}
.pv-as-y{left:0;top:0;writing-mode:vertical-rl;transform:rotate(180deg)}
.sv-js #scene-speelveld .pv-vak-suite,.sv-js #scene-speelveld .pv-vak-zoek,.sv-js #scene-speelveld .pv-vak-gat{opacity:.28}
#scene-speelveld[data-s="0"] .pv-vak-suite,#scene-speelveld[data-s="1"] .pv-vak-zoek{opacity:1;background:#FFFFFF}
#scene-speelveld[data-s="2"] .pv-vak-suite,#scene-speelveld[data-s="2"] .pv-vak-zoek,#scene-speelveld[data-s="3"] .pv-vak-suite,#scene-speelveld[data-s="3"] .pv-vak-zoek{opacity:.5}
#scene-speelveld[data-s="2"] .pv-vak-gat{opacity:1;background:#FFFFFF;border:2px dashed #16C079}
#scene-speelveld[data-s="3"] .pv-vak-gat{opacity:1}
#scene-speelveld[data-s="3"] .pv-vraag{opacity:0}
#scene-speelveld[data-s="3"] .pv-polly{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.pv-vak,.pv-polly,.pv-taal-b{transition:none}}

/* ruimte voor de deelknop rechtsboven, zodat hij de taalknoppen niet bedekt */
.pv-taal-kop{padding-right:96px}
/* in de stapel liggen schermafdrukken: toon de linkerkant, daar staat de kop van de pagina */
.sv-stapel-beeld img{object-position:left top}
@media (max-width:700px){.pv-taal-kop{padding-right:56px}}
/* smal: geen assen maar drie rijen onder elkaar, zodat elke tekst in zijn vak past */
@media (max-width:900px){
 .pv-veld{padding:0}
 .pv-veld-raster{grid-template-columns:minmax(0,1fr);grid-template-rows:none;border:0;gap:var(--sv-s1)}
 .pv-vak{border-radius:12px;padding:var(--sv-s3)}
 .pv-vak-leeg,.pv-as{display:none}
 .pv-vak-suite{order:1}.pv-vak-zoek{order:2}.pv-vak-gat{order:3;min-height:170px}
 .pv-vak b{font-size:19px}
 .pv-vraag{font-size:56px}
 .pv-polly b{font-size:22px}
}
/* de merkscène: het beeld vult altijd het hele vak, ook als het vak breder wordt dan het beeld */
#scene-merk img{object-fit:cover;background:transparent}

/* ---- galerij: zes pagina's zoals je ze op een telefoon ziet, in volle lengte; elke pagina schuift mee met het scrollen (eigen.js zet --p) */
.pv-gal{background:radial-gradient(70% 60% at 50% 40%,#16306A 0,#0C0F26 70%);border-radius:var(--sv-radius);padding:var(--sv-s8) var(--sv-s5) var(--sv-s10);margin-top:var(--sv-s6);margin-bottom:var(--sv-s6);color:#FFFFFF;overflow:hidden}
.pv-gal-kop{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:var(--sv-s2);margin:0 0 var(--sv-s6);padding-right:96px}
.pv-gal .pv-groot{color:#FFFFFF}
.pv-gal .pv-groot span{color:#16C079}
.pv-gal-uitleg{margin:0;font-size:17px;line-height:1.45;color:#B9BCD3;max-width:34ch}
.pv-gal-rij{display:grid;grid-template-columns:repeat(3,minmax(0,300px));justify-content:center;gap:var(--sv-s8) var(--sv-s6)}
.pv-gal-item{margin:0;min-width:0;background:rgba(12,15,38,.02);border-radius:24px}
.pv-gal-item:nth-child(3n+2){transform:translateY(var(--sv-s8))}
.pv-gal-venster{border-radius:44px;padding:10px;background:#05060F;box-shadow:0 50px 90px -30px rgba(0,0,0,.85),0 0 0 2px #2A2E4A;transition:transform .5s var(--sv-ease),box-shadow .5s var(--sv-ease)}
.pv-gal-item:hover .pv-gal-venster{transform:translateY(-6px);box-shadow:0 60px 100px -30px rgba(0,0,0,.9),0 0 0 2px #16C079}
.pv-gal-vak{position:relative;aspect-ratio:390/780;overflow:hidden;border-radius:34px;background:#0C0F26}
.pv-gal-vak{overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none}
.pv-gal-vak::-webkit-scrollbar{display:none}
.pv-gal-vak img{display:block;width:100%;height:auto;max-width:none;cursor:zoom-in}
.pv-gal-item figcaption{padding:var(--sv-s3) var(--sv-s2) var(--sv-s1);text-align:center}
.pv-gal-item figcaption .pv-l{color:#9FE7C6}
.pv-gal-item figcaption b{display:block;font-family:var(--sv-font-kop);font-size:20px;line-height:1.2;color:#FFFFFF}
@media (max-width:1100px){.pv-gal-rij{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:900px){
 .pv-gal{padding:var(--sv-s5) var(--sv-s3) var(--sv-s6)}
 .pv-gal-kop{padding-right:56px}
 .pv-gal-rij{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:72%;justify-content:start;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:var(--sv-s2)}
 .pv-gal-item{scroll-snap-align:center}
 .pv-gal-item:nth-child(3n+2){transform:none}
}


/* ---- de hint boven de galerij: een muis met een wieltje dat beweegt */
.pv-hint{display:inline-flex;align-items:center;gap:var(--sv-s1);font-size:15px;color:#B9BCD3;margin-top:var(--sv-s1)}
.pv-muis{width:18px;height:28px;border:2px solid #9FE7C6;border-radius:10px;position:relative;flex:none}
.pv-muis::after{content:"";position:absolute;left:50%;top:5px;width:3px;height:6px;margin-left:-1.5px;border-radius:2px;background:#9FE7C6;animation:pvwiel 1.6s ease-in-out infinite}
@keyframes pvwiel{0%{transform:translateY(0);opacity:1}70%{transform:translateY(8px);opacity:0}100%{opacity:0}}
@media (prefers-reduced-motion:reduce){.pv-muis::after{animation:none}}

/* ---- drie pagina's op een groot scherm, over de hele breedte */
.pv-dt{background:radial-gradient(70% 60% at 50% 30%,#16306A 0,#0C0F26 70%);border-radius:var(--sv-radius);padding:var(--sv-s8) var(--sv-s5);margin-top:var(--sv-s6);margin-bottom:var(--sv-s6);color:#FFFFFF}
.pv-dt .pv-gal-kop{margin-bottom:var(--sv-s6)}
.pv-dt-lijst{display:grid;gap:var(--sv-s8)}
.pv-dt-item{margin:0;min-width:0;background:rgba(12,15,38,.02);border-radius:18px}
.pv-dt-venster{border-radius:16px;overflow:hidden;box-shadow:0 50px 100px -40px rgba(0,0,0,.9),0 0 0 1px rgba(255,255,255,.1)}
.pv-dt-balk{height:36px;background:#1A1D33;display:flex;align-items:center;gap:8px;padding:0 16px}
.pv-dt-balk i{width:11px;height:11px;border-radius:50%;background:#3A3E5C}
.pv-dt-balk span{margin-left:12px;font-size:14px;color:#8C90B0;background:#10132A;border-radius:6px;padding:3px 14px}
.pv-dt-vak{height:clamp(380px,64vh,720px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none;background:#0C0F26}
.pv-dt-vak::-webkit-scrollbar{display:none}
.pv-dt-vak img{display:block;width:100%;height:auto;max-width:none;cursor:zoom-in}
.pv-dt-item figcaption{display:flex;flex-wrap:wrap;gap:var(--sv-s1) var(--sv-s2);align-items:baseline;padding:var(--sv-s2) var(--sv-s2) var(--sv-s1)}
.pv-dt-item figcaption .pv-l{color:#9FE7C6;margin:0}
.pv-dt-item figcaption b{font-family:var(--sv-font-kop);font-size:22px;line-height:1.2;color:#FFFFFF}
@media (max-width:900px){.pv-dt{padding:var(--sv-s5) var(--sv-s3)}.pv-dt-vak{height:340px}.pv-dt-balk span{display:none}}

/* ---- schermvullend */
.pv-lb{position:fixed;inset:0;z-index:200;background:rgba(5,6,15,.94);display:none;align-items:center;justify-content:center}
.pv-lb.open{display:flex;animation:pvlb .25s ease-out}
@keyframes pvlb{from{opacity:0}}
.pv-lb-vlak{max-width:94vw;max-height:92vh;display:flex;align-items:center;justify-content:center}
.pv-lb-vlak img{max-width:94vw;max-height:92vh;width:auto;height:auto;border-radius:12px;box-shadow:0 40px 120px rgba(0,0,0,.6)}
.pv-lb.lang .pv-lb-vlak{display:block;overflow-y:auto;height:92vh;width:min(1100px,94vw);border-radius:12px;scrollbar-width:thin}
.pv-lb.lang .pv-lb-vlak img{max-height:none;width:100%;border-radius:0}
.pv-lb-dicht,.pv-lb-pijl{position:absolute;border:0;border-radius:50%;background:#FFFFFF;color:#0C0F26;cursor:pointer;display:grid;place-items:center;font:700 28px/1 sans-serif;width:52px;height:52px;box-shadow:0 10px 30px rgba(0,0,0,.4)}
.pv-lb-dicht{top:20px;right:20px}
.pv-lb-pijl{top:50%;margin-top:-26px;font-size:36px}
.pv-lb-pijl.vorig{left:20px}.pv-lb-pijl.volgend{right:20px}
.pv-lb.een .pv-lb-pijl{display:none}
.pv-lb-dicht:hover,.pv-lb-pijl:hover{background:var(--sv-merk)}
html.pv-lb-aan{overflow:hidden}
[data-groot]{cursor:zoom-in}
@media (max-width:700px){.pv-lb-pijl{top:auto;bottom:20px;margin:0}}
.pv-groot-houder{display:block;position:relative}
.pv-groot-houder::after{content:"";position:absolute;right:12px;bottom:12px;width:40px;height:40px;border-radius:50%;background:rgba(12,15,38,.7) url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27white%27 stroke-width=%272%27%3E%3Cpath d=%27M4 9V4h5M20 9V4h-5M4 15v5h5M20 15v5h-5%27/%3E%3C/svg%3E") center/20px no-repeat;opacity:0;transition:opacity .3s}
.pv-groot-houder:hover::after,.pv-groot-houder:focus-visible::after{opacity:1}
.pv-dt .pv-groot{color:#FFFFFF}
.pv-dt .pv-groot span{color:#16C079}
