@import url('../intro-film/film.css?v=2');
#source-video{display:block;width:100%;height:100%;object-fit:cover;filter:none;transform:none;background:#352c21}
.film-shade{background:linear-gradient(#16130f2e,#16130f2e),radial-gradient(ellipse at center,#17150f18,transparent 90%)}
.film-cover{animation:original-arrive 1.4s ease backwards}
.film-claim-text{display:block;max-width:100%}
.film-claim-text em{font-style:italic}
.film-claim-subtitle{display:block;max-width:54ch;margin-top:clamp(20px,2.2vw,32px);font:400 clamp(16px,1.45vw,22px)/1.45 var(--font-display,WallySans,sans-serif);letter-spacing:0;text-wrap:balance}
@keyframes original-arrive{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
.source-review{position:fixed;z-index:20;bottom:22px;left:25px;display:flex;align-items:center;gap:12px;padding:10px 15px;background:#faf7efed;color:#332d24;font:12px WallySans,sans-serif;border-radius:4px}.source-review input{width:200px;accent-color:#eb601d}.source-review a{text-decoration:underline;text-underline-offset:3px}
#source-error{position:absolute;bottom:80px;left:24px;background:#faf7ef;color:#332d24;padding:16px;pointer-events:auto;max-width:420px}
@media(max-width:650px){.source-review{left:12px;right:12px;bottom:15px;gap:9px}.source-review input{width:120px;flex:1}.source-review label{display:none}}
@media(prefers-reduced-motion:reduce){.film-cover{animation:none}}

:root{--film-travel:1200svh}
.pause-frames{position:absolute;inset:0;pointer-events:none}
.pause-loop,.pause-loop-video{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;pointer-events:none}
.pause-loop{opacity:0;visibility:hidden;will-change:opacity}
.pause-loop-video{opacity:0;will-change:opacity}
.pause-frame{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;opacity:0;pointer-events:none}
.film-shade{background-image:radial-gradient(ellipse at center,#17150f0a,transparent 90%)}
#stop-state{min-width:145px;font-size:11px}
@media(max-width:650px){:root{--film-travel:1100svh}#stop-state{display:none}}
@media(prefers-reduced-motion:reduce){:root{--film-travel:100svh}.pause-frames{display:none}}

/* Discrete gestures: the movie itself carries each camera move. */
:root{--film-travel:100svh}
html.scene-locked{overflow:hidden;overscroll-behavior:none}
.scene-nav{position:fixed;z-index:20;bottom:26px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:18px;color:#fff9eb;font:12px WallySans,sans-serif;text-shadow:0 1px 12px #0008}
.scene-nav[hidden]{display:none}
.scene-nav button{border:1px solid #fff4;border-radius:50%;width:34px;height:34px;background:#211b1333;color:inherit;font:16px WallySans,sans-serif;cursor:pointer}
.scene-nav button:disabled{opacity:.25;cursor:default}
.scene-nav button:focus-visible{outline:2px solid #f48a42;outline-offset:4px}
.film-hint{bottom:72px;margin:0;padding-inline:20px;box-sizing:border-box}
@media(max-width:650px){:root{--film-travel:100svh}.scene-nav{width:max-content;max-width:95vw}}

/* A quiet first page gives the room-to-essay transition room to breathe. */
.film-page #tekst article{padding-top:0}
.chapter-opening{min-height:calc(100svh - 90px);display:flex;flex-direction:column;justify-content:center;padding:64px 0 90px;box-sizing:border-box;margin-bottom:64px}
.chapter-opening h2{font-size:clamp(54px,6.4vw,90px);margin-bottom:24px}
.chapter-opening .lead{margin:12px 0 0;max-width:660px}
@media(max-width:650px){.chapter-opening{min-height:calc(100svh - 76px);padding:50px 0 64px;margin-bottom:42px}.chapter-opening h2{font-size:clamp(46px,11vw,60px)}}

/* v8: keep the room visible while separating the title from the background. */
.film-shade{display:block;background:rgba(22,19,15,.12)}
