/* V4 additions; public V3 remains the baseline. */
.film-feature{padding:7rem 0;border-bottom:1px solid var(--line);background:radial-gradient(ellipse at 60% 25%,rgba(32,82,162,.16),transparent 56%)}
.film-heading{display:flex;align-items:end;justify-content:space-between;gap:2rem;margin-bottom:2.2rem}
.film-heading h2{max-width:14ch;margin-bottom:0}
.film-heading p:last-child{max-width:33rem;color:var(--muted);font-size:1rem}
.film-frame{overflow:hidden;border:1px solid rgba(112,148,222,.25);border-radius:1.1rem;background:#020308;box-shadow:0 30px 90px rgba(0,0,0,.42)}
.film-frame video{display:block;width:100%;aspect-ratio:16/9;object-fit:contain;background:#020308}
.film-note{margin-top:1rem;color:var(--faint);font-size:.86rem}
.film-description{margin-top:1.15rem;color:var(--muted);font-size:.88rem;max-width:78ch}
.film-description summary{cursor:pointer;color:var(--cyan);font-weight:600}
.film-description p{margin-top:.7rem}
.approach-strip{overflow:hidden;border-block:1px solid var(--line);background:rgba(8,13,30,.94);padding:1.15rem 0;position:relative}
.approach-strip .strip-track{display:flex;align-items:center;width:max-content;gap:2rem;animation:approach-drift 38s linear infinite}
.approach-strip .strip-set{display:flex;align-items:center;gap:2rem;flex:none}
.approach-strip .strip-set span{font-family:var(--disp);font-size:clamp(.78rem,1.1vw,.97rem);font-weight:600;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;color:rgba(244,246,255,.78)}
.approach-strip .strip-set i{width:5px;height:5px;flex:none;border-radius:50%;background:var(--cyan)}
.strip-controls{text-align:right;padding:.7rem 1.25rem 0}
.strip-controls button{min-height:44px;padding:.4rem .9rem;border:1px solid var(--line);border-radius:4px;color:var(--muted);background:#080d1e;font:inherit;font-size:.78rem;cursor:pointer}
.strip-controls button:hover{color:#fff;border-color:var(--cyan)}
.approach-strip.is-paused .strip-track{animation-play-state:paused}
@keyframes approach-drift{to{transform:translateX(calc(-50% - 1rem))}}
@media(min-width:900px) and (max-height:800px){.hero{padding-top:5rem;padding-bottom:4rem}.hero-logo{margin-bottom:.7rem}.hero-logo img{width:clamp(104px,15svh,128px)}.tagline{margin-bottom:.9rem}.hero h1{font-size:clamp(3.1rem,min(7vw,9svh),5rem);margin-bottom:.8rem}.hero .kicker{margin-bottom:1rem}}
@media(max-width:700px){.film-feature{padding:4.5rem 0}.film-heading{display:block}.film-heading p:last-child{margin-top:1rem}}
@media(prefers-reduced-motion:reduce){.approach-strip .strip-track{animation:none;transform:none;width:auto}.approach-strip .strip-set{flex-wrap:wrap;justify-content:center;width:100%}.approach-strip .strip-set[aria-hidden="true"],.strip-controls{display:none}}

/* A clear editorial bridge into the exact, unchanged V2 Library experience. */
.library-pathways{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.8rem}
.library-pathway{display:block;text-decoration:none;color:var(--ink);padding:1.8rem 0 1rem;border-top:1px solid rgba(255,255,255,.22);transition:border-color .25s}
.library-pathway:hover{border-color:var(--cyan)}
.pathway-index{display:flex;justify-content:space-between;align-items:center;color:var(--cyan);font:600 .78rem/1.5 var(--disp);letter-spacing:.12em}
.pathway-index span{font-size:1.2rem;transition:transform .25s}
.library-pathway:hover .pathway-index span{transform:translate(3px,-3px)}
.library-pathway h3{font:600 clamp(1.45rem,2.3vw,2rem)/1.15 var(--disp);margin:1.5rem 0 .8rem;letter-spacing:-.02em}
.library-pathway p{color:var(--muted);max-width:24ch;font-size:.97rem}
@media(max-width:900px){.library-pathways{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem}.library-pathway h3{font-size:1.55rem}}
@media(max-width:420px){.library-pathways{gap:1rem}.library-pathway p{font-size:.9rem}}

/* Read the three stages naturally on phones, without a long scroll trap. */
@media(max-width:899px),(prefers-reduced-motion:reduce){
  .process .pinwrap{height:auto}.process .pin{position:static;height:auto;overflow:visible;padding:5rem 0}
  .process .stage{display:block}.process .bignum,.process .pdots{display:none}
  .process .steps{display:grid;gap:2rem;min-height:0}
  .process .step{position:static;opacity:1;transform:none;pointer-events:auto;border-top:1px solid rgba(255,255,255,.16);padding-top:1.8rem}
  .process .step .mnum{display:block}.process .step .chip{display:none}.process .step h3{font-size:2rem}
  .hero h1 .line>span{transform:none}
}
@media(prefers-reduced-motion:reduce){.hero-logo img{animation:none}.hero h1 .grad{animation:none}}
