.film-gallery{max-width:1060px;margin:0 auto;padding:64px 0 55px;scroll-margin-top:44px;position:relative;isolation:isolate}
.film-gallery:before{content:"";position:absolute;inset:12% 0 5%;z-index:-1;background:radial-gradient(ellipse at 70% 45%,#cff54a0f,transparent 65%);pointer-events:none}
.films-heading{padding:0 24px 28px}.films-eyebrow{display:flex;align-items:center;justify-content:space-between;color:#c5cbbf;font:11px var(--f-body);gap:8px}.films-eyebrow>span{color:#cff54a;border:1px solid #cff54a35;border-radius:50px;padding:7px 11px;font-size:10px}.films-heading h2{font:900 40px/1.16 var(--f-display);letter-spacing:-1.6px;margin:18px 0 13px}.films-heading em{color:#cff54a;font-style:normal}.films-heading p{font:14px var(--f-body);color:#a3a99b}
.films-track{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:24px;padding:0 24px 14px;scrollbar-width:none;overscroll-behavior-x:contain}.films-track::-webkit-scrollbar{display:none}.film-card{flex:0 0 82%;min-width:0;scroll-snap-align:start}.film-screen{aspect-ratio:9/14;position:relative;border-radius:25px;overflow:hidden;background:#121610;border:1px solid #ffffff22}.film-screen video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#060806}.film-cover{position:absolute;inset:0;border:0;background:#0a0c09;cursor:pointer;color:white;width:100%;padding:0}.film-cover img{width:100%;height:100%;object-fit:cover}.film-cover:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#0003,transparent 40%,#0009)}.film-number{position:absolute;top:18px;right:18px;z-index:1;font:800 13px var(--f-display);border:1px solid #ffffff50;border-radius:50px;padding:9px 11px;background:#0004}.film-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:65px;height:65px;border-radius:50%;background:#cff54a;color:#1b240b;z-index:1;font:23px sans-serif;box-shadow:0 0 0 10px #cff54a16}.film-watch{position:absolute;bottom:25px;left:0;right:0;z-index:1;font:12px var(--f-body)}.film-card.is-started .film-cover{display:none}.film-caption{display:flex;justify-content:space-between;align-items:center;padding:17px 3px;gap:10px}.film-caption span{font:10px var(--f-body);color:#8f9888}.film-caption h3{font:800 17px/1.5 var(--f-display);margin:5px 0 0}.film-toggle{border:0;background:none;color:#cff54a;font:12px var(--f-body);cursor:pointer;white-space:nowrap}.film-error{color:#ffc7ac;font-size:12px}.films-navigation{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 24px}.films-position{font:12px var(--f-display)}.films-position b{color:#cff54a;font-size:22px}.films-position span{color:#6e7766}.films-hint{font:11px var(--f-body);color:#a3a99b}.films-arrows{display:flex;gap:8px}.films-arrows button{border:1px solid #ffffff2b;color:#f2f4ef;background:#141912;border-radius:50%;width:38px;height:38px;font-size:20px;cursor:pointer}.films-arrows button:disabled{opacity:.3;cursor:default}.film-gallery button:focus-visible,.films-track:focus-visible{outline:2px solid #cff54a;outline-offset:4px}
@media(min-width:700px){.film-gallery{padding:85px 0}.films-heading h2{font-size:56px}.films-heading h2 br{display:none}.films-heading h2 em{margin-inline-start:15px}.film-card{flex-basis:calc(50% - 8px)}.film-screen{aspect-ratio:9/12}.films-track{gap:24px}.film-card{flex-basis:calc(50% - 12px)}.films-hint{display:none}.films-heading{padding-bottom:35px}}
@media(max-width:360px){.films-heading h2{font-size:35px}.film-caption h3{font-size:14px}.films-hint{font-size:9px}}
@media(prefers-reduced-motion:reduce){.films-track{scroll-behavior:auto}}
/* Keep navigation and the next-card cue visible together on the mobile proof. */
@media(max-width:699px){.film-gallery{padding-top:22px}.films-heading{padding-bottom:20px}.films-heading h2{font-size:36px;margin:13px 0 10px}.film-screen{aspect-ratio:9/13}}
/* Mobile is touch-first: native swipe, next-card peek and position count. */
@media(max-width:699px){.films-arrows{display:none}.films-navigation{justify-content:space-between}.films-hint{font-size:11px}}
#films-title{scroll-margin-top:55px}

.films-arrows button{display:grid;place-items:center}.films-arrows svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.films-follow{display:flex;justify-content:center;padding:10px 24px 0}.films-follow .tiktok-follow{margin-top:24px}
.films-arrows.is-unneeded{display:none}
