/* ==========================================================================
   Platform film — canvas scrub of the JuvNET footage (192 frames, 1440×810)
   ========================================================================== */
.pfilm{position:relative;height:760vh;background:var(--soft)}
.pfilm__stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:var(--soft)}
.pfilm__canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.pfilm__poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;display:none}
.pfilm__scrim{position:absolute;inset:0;pointer-events:none;z-index:2;opacity:0;background:linear-gradient(90deg,rgba(243,243,243,.94) 0%,rgba(243,243,243,.78) 30%,rgba(243,243,243,.2) 52%,rgba(243,243,243,0) 64%)}
.pfilm__scrim--bottom{background:linear-gradient(to top,rgba(243,243,243,.96) 0%,rgba(243,243,243,.86) 26%,rgba(243,243,243,.3) 46%,rgba(243,243,243,0) 60%)}
.pfilm__seam{position:absolute;inset:0;pointer-events:none;z-index:3;opacity:0;background:var(--white)}
.pfilm__loader{position:absolute;inset:0;z-index:9;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;background:var(--soft);transition:opacity .6s var(--ease-out),visibility .6s}
.pfilm__loader.done{opacity:0;visibility:hidden}
.pfilm__loader img{height:52px;width:auto;opacity:.9}
.pfilm__loader span{font-size:var(--fs-label);font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--fg-2)}
.pfilm__loader i{display:block;width:180px;height:1px;background:var(--line);position:relative}
.pfilm__loader i b{position:absolute;left:0;top:-1px;height:3px;width:0;background:var(--green);border-radius:var(--r-pill);transition:width .2s linear}

.pbeat{position:absolute;z-index:4;opacity:0;visibility:hidden;will-change:opacity,transform;pointer-events:none}
.pbeat.is-on{pointer-events:auto}
.pbeat .label{margin-bottom:14px}
.pbeat h1,.pbeat h2{color:var(--ink)}
.pbeat p{color:var(--fg-1)}
.pbeat .btn-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.pbeat--hero{left:var(--gutter);bottom:clamp(64px,10vh,120px);width:min(620px,52vw)}
.pbeat--hero h1{margin-bottom:20px}
.pbeat--hero p:not(.label){font-size:var(--fs-lead);font-weight:300;line-height:1.5;max-width:50ch}
.pbeat--tr{right:var(--gutter);top:calc(var(--header-h) + 2vh);width:min(500px,38vw)}
.pbeat--tl{left:var(--gutter);top:calc(var(--header-h) + 2vh);width:min(420px,31vw)}
.pbeat--strip{left:var(--gutter);top:calc(var(--header-h) + 1.5vh);width:min(760px,60vw)}
.pbeat--tr h2,.pbeat--tl h2,.pbeat--strip h2{font-size:clamp(1.5rem,2.3vw,2rem);font-weight:400;line-height:1.16;letter-spacing:-.012em;margin-bottom:12px}
.pbeat--tr p:not(.label),.pbeat--tl p:not(.label),.pbeat--strip p:not(.label){font-size:.9375rem;line-height:1.55;max-width:52ch}
.pbeat--strip p:not(.label){max-width:70ch}
.pbeat .stat-row{display:flex;gap:28px;margin-top:18px}
.pbeat .stat b{font-size:clamp(1.75rem,2.6vw,2.25rem)}
.pbeat .stat span{max-width:22ch;font-size:var(--fs-label);letter-spacing:.02em}
.pbeat--tr .link,.pbeat--tl .link,.pbeat--strip .link{margin-top:14px}
/* session 11: the beats' paragraph rules are `p:not(.label)` — the eyebrow takes the label role and the site-wide tiers, never the lead copy's 20px/300 (see film-home.css) */
.pbeat--finale{left:var(--gutter);bottom:clamp(64px,10vh,120px);width:min(640px,54vw)}
.pbeat--finale h2{margin-bottom:16px}
.pbeat--finale p:not(.label){font-size:var(--fs-lead);font-weight:300;line-height:1.5;max-width:50ch}
.pbeat .halo{position:absolute;z-index:-1;inset:-56px -90px -56px -90px;background:radial-gradient(62% 64% at 45% 46%,rgba(243,243,243,.96),rgba(243,243,243,.82) 42%,rgba(243,243,243,0) 74%);pointer-events:none}

.pfilm__readout{position:absolute;right:var(--gutter);bottom:34px;z-index:5;display:flex;align-items:center;gap:14px;font-size:var(--fs-label);font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--fg-2)}
.pfilm__readout b{font-weight:500;color:var(--ink);min-width:8.5em}
/* fg-1, not fg-3 — same contrast fix as .film__readout i (session-7 audit) */
.pfilm__readout i{font-style:normal;color:var(--fg-1)}
.pfilm__bar{width:120px;height:1px;background:var(--line);position:relative}
.pfilm__bar span{position:absolute;left:0;top:-1px;height:3px;width:0;background:var(--green);border-radius:var(--r-pill)}
.pfilm__cue{position:absolute;left:50%;bottom:34px;transform:translateX(-50%);z-index:5;width:1px;height:44px;background:linear-gradient(to bottom,transparent,var(--fg-2));opacity:.7}
.pfilm__cue::after{content:"";position:absolute;left:-2px;bottom:0;width:5px;height:5px;border-radius:50%;background:var(--fg-2);animation:cue 2.2s var(--ease-inout) infinite}
@keyframes cue{0%{transform:translateY(-36px);opacity:0}30%{opacity:1}100%{transform:translateY(0);opacity:0}}

@media (max-height:820px) and (min-width:761px){
  .pbeat--hero h1{font-size:clamp(2.5rem,5vw,4.25rem)}
  .pbeat--hero p:not(.label),.pbeat--finale p:not(.label){font-size:var(--fs-body)}
  .pbeat--hero,.pbeat--finale{bottom:48px}
  .pbeat--finale h2{font-size:clamp(2rem,3.6vw,3rem)}
}

@media (max-width:760px){
  .pfilm{height:620vh}
  .pfilm__scrim,.pfilm__scrim--bottom{background:linear-gradient(to top,rgba(243,243,243,1) 0%,rgba(243,243,243,.95) 40%,rgba(243,243,243,0) 52%)}
  .pbeat--hero,.pbeat--finale{width:calc(100% - 2*var(--gutter));bottom:64px}
  .pbeat--hero h1{font-size:2.25rem}
  .pbeat--finale h2{font-size:2rem}
  .pbeat--hero p:not(.label),.pbeat--finale p:not(.label){font-size:var(--fs-body)}
  .pbeat .more{display:none}
  .pbeat--tr,.pbeat--tl,.pbeat--strip{left:var(--gutter);right:auto;top:auto;bottom:64px;width:calc(100% - 2*var(--gutter))}
  .pbeat--tr h2,.pbeat--tl h2,.pbeat--strip h2{font-size:1.5rem}
  .pbeat .halo{display:none}
  .pfilm__readout{left:var(--gutter);right:auto;bottom:22px}
  .pfilm__readout .pfilm__bar{width:64px}
  .pfilm__cue{display:none}
}

/* static / reduced motion */
.pfilm--static{height:auto}
.pfilm--static .pfilm__stage{position:relative;height:auto;overflow:visible}
.pfilm--static .pfilm__canvas,.pfilm--static .pfilm__loader,.pfilm--static .pfilm__readout,.pfilm--static .pfilm__cue,.pfilm--static .pfilm__seam,.pfilm--static .pfilm__scrim{display:none}
.pfilm--static .pfilm__poster{display:block;position:relative;height:min(70vh,640px);margin-top:var(--header-h);object-fit:cover}
.pfilm--static .pbeat{position:relative;left:auto;right:auto;top:auto;bottom:auto;width:auto;opacity:1;visibility:visible;pointer-events:auto;transform:none!important;padding:clamp(48px,7vw,88px) var(--gutter) 0;max-width:calc(var(--container) + 2*var(--gutter));margin-inline:auto}
.pfilm--static .pbeat--finale{padding-bottom:clamp(48px,7vw,88px)}
.pfilm--static .pbeat .halo{display:none}