/* Het parkverhaal als scrollfilm (9 nov 2026), bij template-parts/parkfilm.php en assets/js/parkfilm.js. */
.psf{position:relative;background:radial-gradient(1400px 900px at 70% 35%,#fff 0%,#F8F6FD 45%,#ECE7F7 100%)}
.psf-vast{position:sticky;top:0;height:100vh;overflow:hidden;background:radial-gradient(120vw 90vh at 68% 40%,#fff 0%,#F8F6FD 45%,#ECE7F7 100%)}
.psf-balk{position:absolute;left:0;right:0;top:0;height:3px}
.psf-balk i{display:block;height:100%;width:0;background:#C4A149}
.psf-film{position:absolute;left:32vw;top:50%;width:min(66vw,117vh);aspect-ratio:16/9;height:auto;transform:translateY(-50%)}
.psf-film canvas,.psf-svg,.psf-laag{position:absolute;inset:0;width:100%;height:100%}
.psf-svg{overflow:visible}.psf-svg *{vector-effect:non-scaling-stroke}
.psf-laag{font-size:var(--u,14px)}
.psf-pin{position:absolute;width:0;height:0}
.psf-pin b{position:absolute;left:-.5px;bottom:0;width:1.5px;height:2.6em;background:#6E5214;transform-origin:50% 100%;transform:scaleY(0);transition:transform .35s cubic-bezier(.34,1.56,.64,1)}
.psf-pin i{position:absolute;left:-1em;bottom:2.4em;width:2em;height:2em;border-radius:50%;background:#C9A55A;color:#fff;font:700 .95em/2.1 Manrope,system-ui,sans-serif;font-style:normal;text-align:center;box-shadow:0 .25em .5em rgba(31,27,46,.3);transform:scale(0);transform-origin:50% 160%;transition:transform .45s cubic-bezier(.34,1.56,.64,1)}
.psf-pin.h i{background:#1C2A4A}
.psf-pin u{position:absolute;left:-.45em;top:-.18em;width:.9em;height:.36em;border-radius:50%;background:rgba(31,27,46,.28);transform:scale(0);transition:transform .3s}
.psf-pin.op b{transform:scaleY(1)}.psf-pin.op i,.psf-pin.op u{transform:scale(1)}
.psf-pin img{position:absolute;bottom:-.35em;max-width:none;height:auto;transform:translateX(-50%) scale(0);transform-origin:50% 92%;transition:transform .5s cubic-bezier(.34,1.56,.64,1);filter:drop-shadow(0 .2em .25em rgba(31,27,46,.25))}
.psf-pin.op img{transform:translateX(-50%) scale(1)}
.psf-kaarten{position:absolute;left:calc(62vw + min(18.3vh,11.4vw) + 2.2vw);top:50%;width:min(21vw,330px);transform:translateY(-50%)}
.psf-sc{background:#fff;border-radius:14px;padding:1em 1.2em;margin:0 0 .8em;box-shadow:0 10px 30px rgba(31,27,46,.10),0 2px 6px rgba(31,27,46,.06);opacity:0;transform:translateX(40px);transition:opacity .4s,transform .5s cubic-bezier(.22,1,.36,1)}
.psf-sc.aan{opacity:1;transform:none}
.psf-sc small{display:block;font:700 clamp(9px,.68vw,12px)/1.4 Manrope,system-ui,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#8A6516}
.psf-sc b{display:block;font:500 clamp(15px,1.15vw,21px)/1.25 futura-pt,"Futura PT",Futura,Poppins,system-ui,sans-serif;color:#1F1B2E;margin:.3em 0 .25em}
.psf-sc span{display:block;font:400 clamp(12px,.82vw,15px)/1.5 Manrope,system-ui,sans-serif;color:rgba(31,27,46,.72)}
.psf-sc i{display:block;font-style:normal;color:#C9A55A;letter-spacing:.15em;margin-top:.35em}
.psf-co{position:absolute;width:15em;margin-left:-7.5em;text-align:center;opacity:0;transition:opacity .3s}
.psf-co.boven{transform:translateY(-100%)}
.psf-co small{display:block;font:700 .7em/1.4 Manrope,system-ui,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#8A6516}
.psf-co span{display:block;font:500 .9em/1.35 Manrope,system-ui,sans-serif;color:#1F1B2E;margin-top:.2em}
.psf-tel{position:absolute;left:62vw;top:50%;height:min(74vh,46vw);aspect-ratio:643/1300;transform:translate(-50%,calc(-50% + 120vh)) rotate(4deg);
  filter:drop-shadow(0 30px 40px rgba(31,27,46,.28)) drop-shadow(0 6px 10px rgba(31,27,46,.18));will-change:transform}
.psf-scr{position:absolute;overflow:hidden;border-radius:12% / 5.9%;background:#F5F1E9}
.psf-rol{display:flex;height:100%;will-change:transform}
.psf-rol img{height:100%;object-fit:cover;object-position:top;display:block;max-width:none}
.psf-kader{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;max-width:none}
.psf-tk{position:absolute;left:6.8vw;top:50%;width:min(28vw,520px);transform:translateY(-50%);opacity:0;transition:opacity .35s,transform .35s;pointer-events:none}
.psf-tk.aan{opacity:1;pointer-events:auto}
.psf-tk small{display:block;font:600 clamp(11px,.85vw,15px)/1.4 Manrope,system-ui,sans-serif;letter-spacing:.18em;text-transform:uppercase;color:#8A6516;margin-bottom:.9em}
.psf-tk h3{font:500 clamp(24px,2.1vw,40px)/1.16 futura-pt,"Futura PT",Futura,Poppins,system-ui,sans-serif;text-transform:uppercase;color:#1F1B2E;margin:0}
.psf-tk p{font:400 clamp(14px,1.12vw,20px)/1.55 Manrope,system-ui,sans-serif;color:rgba(31,27,46,.78);margin:1em 0 0}
.psf-tk ol{list-style:none;margin:1.4em 0 0;padding:0}
.psf-tk li{font:600 clamp(12px,.95vw,17px)/1.3 Manrope,system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:#1F1B2E;margin:0 0 1.1em;padding-left:2.2em;position:relative}
.psf-tk li i{position:absolute;left:0;font-style:normal;color:#8A6516}
.psf-tk li span{display:block;font:400 clamp(12px,.9vw,16px)/1.5 Manrope,system-ui,sans-serif;letter-spacing:0;text-transform:none;color:rgba(31,27,46,.7);margin-top:.35em}
@media (max-width:820px){
  .psf-film{left:50%;top:38vh;width:124vw;transform:translateX(-50%)}
  .psf-co,.psf-svg .co,.psf-kaarten{display:none}
  .psf-tk{left:16px;right:16px;width:auto;top:9vh;transform:none}
  .psf-tk ol.psf-lang li span{display:none}
  .psf-tel{left:50%;top:64%;height:min(56vh,120vw)}
}
@media (prefers-reduced-motion:reduce){.psf-tk{transition:none}}
