/* V4.17 — distinct doorway, projection, filmstrip, iris and rewind transitions. */
.scene-heading { padding-bottom:32px; }
.scene-eyebrow { display:block; font-size:10px; text-transform:uppercase; letter-spacing:.23em; color:#aaa6a0; }
.scene-heading h2 { font-size:clamp(46px,6.4vw,104px); line-height:.91; letter-spacing:-.065em; font-weight:500; margin:24px 0 12px; }
.film-stills { display:grid; grid-template-columns:1.8fr 1fr; gap:22px; padding-bottom:56px; }
.film-still { position:relative; margin:0; height:clamp(280px,44vh,450px); overflow:hidden; background:#171717; }
.film-still img { height:100%; width:100%; object-fit:cover; }
.film-still-wide img { object-position:50% 45%; }
.film-still-tall img { object-position:50% 35%; }
.film-still figcaption { position:absolute; inset:auto 0 0; padding:58px 24px 24px; background:linear-gradient(transparent,rgba(0,0,0,.87)); }
.film-still figcaption span { display:block; font-size:26px; letter-spacing:-.04em; }
.film-still figcaption small { display:block; font-size:9px; letter-spacing:.14em; text-transform:uppercase; margin-top:8px; color:#d0ccc4; }
.biography-portrait { margin:26px 0 0; }
.biography-portrait img { display:block; width:100%; height:auto; filter:saturate(.55); }
.biography-portrait figcaption { padding-top:14px; font-size:9px; letter-spacing:.12em; }
.reel-bg img { width:100%; height:100%; object-fit:cover; opacity:.28; filter:saturate(.5); }
.film-environment,.scene-portal { display:none; }
.film-announcement { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.film-controls[hidden] { display:none; }
html.film-mode { overflow:hidden; scroll-behavior:auto; }
.film-mode body { overflow:hidden; height:100dvh; background:#070707; }
.film-mode #top { position:fixed; inset:0; perspective:1100px; isolation:isolate; z-index:1; }
.film-mode #statement { display:none; }
.film-mode .film-scene { position:absolute; inset:0; padding:0; margin:0; border:0; display:block; height:100%; min-height:0; overflow:hidden; visibility:hidden; pointer-events:none; transform-origin:50% 50%; background:transparent; }
.film-mode .film-scene.is-current,.film-mode .film-scene.is-arriving { visibility:visible; }
.film-mode .film-scene.is-current { pointer-events:auto; }
.film-mode .scene-scroll { height:100%; overflow-y:auto; overflow-x:hidden; scrollbar-width:thin; scrollbar-color:#45443e transparent; overscroll-behavior:contain; scroll-behavior:auto; padding:calc(var(--nav-offset,88px) + 22px) 0 108px; }
.film-mode .film-scene .reveal { opacity:1; transform:none; }
.film-mode .film-scene .reveal-pending { opacity:1; transform:none; }
.film-mode .hero .scene-scroll { padding-top:0; padding-bottom:0; }
.film-mode .hero-inner { min-height:100dvh; padding-bottom:112px; }
.film-mode .hero-stage { min-height:clamp(360px,58dvh,680px); }
.film-mode .hero .hero-grid { opacity:.08; }
.film-mode .hero .hero-ambient { opacity:.5; }
.film-mode .hero .scroll { display:none; }
.film-mode .hero-bottom { grid-template-columns:1fr 1fr; }
.film-mode .portrait-wrap { right:5.2vw; }
.film-mode .profile .scene-scroll { display:flex; align-items:safe center; }
.film-mode .profile-grid { grid-template-columns:minmax(180px,.7fr) minmax(0,1.3fr); gap:clamp(40px,7vw,100px); }
.film-mode .profile-label { position:static; }
.film-mode .profile-copy h2 { font-size:clamp(34px,4.6vw,72px); }
.film-mode .profile-copy p { font-size:clamp(15px,1.25vw,18px); }
.film-mode .facts { margin-top:30px; }
.film-mode .actions { margin-top:30px; }
.film-mode .reel .scene-scroll { display:grid; place-items:center; position:relative; }
.film-mode .reel-bg { position:fixed; inset:12vh 8vw; transform:none!important; border:1px solid #ffffff25; box-shadow:0 0 140px #d8ded012; overflow:hidden; }
.film-mode .reel-bg::after { content:""; position:absolute; inset:0; background:radial-gradient(ellipse,transparent 20%,#080909 100%); }
.film-mode .reel-ring { display:none; }
.film-mode .reel-content h2 { font-size:clamp(100px,17vw,250px); }
.film-mode .contact .scene-scroll { display:flex; align-items:safe center; }
.film-mode .contact h2 { font-size:clamp(110px,18vw,270px); }
.film-mode .contact .shell { position:relative; }
.film-mode .contact .shell::before { content:"04 / The next scene"; display:block; text-transform:uppercase; letter-spacing:.23em; font-size:10px; color:var(--muted); margin-bottom:36px; }
.film-mode .topbar { background:linear-gradient(#080808ed,#08080880,transparent); border:0; }
.film-mode .topbar .nav a[aria-current="page"] { color:var(--accent); }
.film-mode .progress { display:none; }
.film-mode .film-environment { display:block; position:fixed; inset:0; overflow:hidden; z-index:0; background:radial-gradient(ellipse at 65% 38%,#1d1e1b 0%,#0b0c0c 43%,#050606 85%); pointer-events:none; }
.film-floor { position:absolute; width:160%; height:100%; left:-30%; top:55%; background-image:linear-gradient(#ffffff0c 1px,transparent 1px),linear-gradient(90deg,#ffffff0c 1px,transparent 1px); background-size:100px 100px; transform:perspective(450px) rotateX(64deg); transform-origin:50% 0; mask-image:linear-gradient(transparent,#0006 24%,transparent 80%); }
.film-light { position:absolute; inset:0; background:radial-gradient(ellipse at calc(65% + var(--scene-x,0px)) calc(36% + var(--scene-y,0px)),#c9d0b706,transparent 55%); }
.film-mode .film-controls { display:flex; position:fixed; z-index:10002; bottom:0; left:0; right:0; min-height:88px; padding:18px var(--gutter) max(18px,env(safe-area-inset-bottom)); align-items:center; justify-content:space-between; gap:20px; background:linear-gradient(transparent,#080909ed 32%); }
.film-position { display:flex; flex-direction:column; gap:7px; min-width:110px; }
.film-position span:first-child { font-size:9px; letter-spacing:.17em; color:#96978e; }
.film-position span:last-child { font-size:12px; letter-spacing:.05em; }
.film-chapters { display:flex; align-items:center; gap:12px; }
.film-chapters a { display:flex; min-height:44px; align-items:center; gap:8px; color:#82857e; font-size:9px; text-transform:uppercase; letter-spacing:.1em; }
.film-chapters i { width:22px; height:2px; background:#4e5148; transition:width .5s,background .5s; }
.film-chapters a[aria-current="page"] { color:#eee9e1; }
.film-chapters a[aria-current="page"] i { width:42px; background:var(--accent); }
.film-chapters a:hover { color:#fff; }
.film-transport { display:flex; align-items:center; gap:8px; }
.film-hint { font-size:9px; color:#96978e; margin-right:18px; letter-spacing:.08em; }
.film-transport button { width:44px; height:44px; border:1px solid #ffffff30; border-radius:50%; color:#eee9e1; background:transparent; cursor:pointer; font-size:19px; }
.film-transport button:hover:not(:disabled) { background:#eee9e1; color:#111; }
.film-transport button:disabled { opacity:.22; cursor:default; }
.film-mode .scene-portal { display:block; position:fixed; inset:0; z-index:12000; pointer-events:none; visibility:hidden; perspective:900px; overflow:hidden; }
.scene-portal.is-running { visibility:visible; }
.portal-frame { position:absolute; left:50%; top:50%; width:30vw; height:72vh; border:2px solid #abae9d; box-shadow:0 0 0 150vmax #050606,0 0 90px #d5e0c028,inset 0 0 36px #d5e0c020; transform:translate(-50%,-50%); }
.scene-portal[data-kind="projection"] .portal-frame { width:82vw; height:auto; aspect-ratio:16/9; border:2px solid #cfd0be; box-shadow:0 0 70px #d5e0c035,inset 0 0 25px #d5e0c010; }
.scene-portal:not([data-kind="doorway"]):not([data-kind="projection"]) .portal-frame { display:none; }
.film-transition-effects { position:absolute; inset:0; }
.film-transition-effects > * { display:none; }
.scene-portal[data-kind="projection"] .projection-shutter,.scene-portal[data-kind="projection"] .projection-beam { display:block; }
.projection-shutter { position:absolute; left:0; width:100%; height:50.2%; background:#030404; border-color:#dedcca50; border-style:solid; border-width:0; }
.shutter-top { top:0; border-bottom-width:1px; }
.shutter-bottom { bottom:0; border-top-width:1px; }
.projection-beam { position:absolute; inset:8% -15%; background:conic-gradient(from 67deg at 0% 50%,transparent 0deg,#d9d4b719 8deg,#e4ddc329 23deg,#d9d4b719 38deg,transparent 46deg); filter:blur(18px); transform-origin:0 50%; }
.scene-portal[data-kind="filmstrip"] .portrait-film { display:grid; }
.portrait-film { position:absolute; top:50%; left:50%; width:min(78vw,950px); padding:18px 8%; gap:18px; background:#10100e; border:1px solid #b1ac9650; box-shadow:0 0 0 12px #030404e8,0 40px 110px #000; }
.portrait-film::before,.portrait-film::after { content:""; position:absolute; width:4%; top:0; bottom:0; background:repeating-linear-gradient(180deg,transparent 0 12px,#d7d2bd 12px 32px,transparent 32px 52px); opacity:.72; }
.portrait-film::before { left:2%; }
.portrait-film::after { right:2%; }
.portrait-film-frame { position:relative; height:45vh; min-height:180px; overflow:hidden; border:1px solid #88837070; background:#070807; }
.portrait-film-frame img { display:block; width:100%; height:100%; object-fit:cover; object-position:50% 34%; filter:grayscale(1) sepia(.13) brightness(.65); }
.portrait-film-frame:nth-child(2) img { object-position:50% 19%; transform:scale(1.08); }
.portrait-film-frame span { position:absolute; bottom:12px; left:16px; color:#e0d8b5; font:10px monospace; letter-spacing:.18em; }
.scene-portal[data-kind="iris"] .lens-iris { display:block; }
.lens-iris { position:absolute; left:50%; top:50%; width:150vmax; height:150vmax; border-radius:50%; border:2px solid #aaa994; box-shadow:0 0 0 160vmax #030404,inset 0 0 45px #0009,0 0 0 20px #252622; }
.lens-iris i { position:absolute; inset:-30px; border:1px solid #57594d; border-radius:50%; }
.lens-iris i:last-child { inset:-45px; border:10px dashed #1c1e19; }
.scene-portal[data-kind="rewind"] .rewind-wipe { display:grid; }
.rewind-wipe { position:absolute; inset:-2px; grid-template-rows:repeat(6,1fr); }
.rewind-wipe i { position:relative; background:linear-gradient(90deg,#030404 0%,#10120f 70%,#262920 100%); margin-top:-1px; border-bottom:1px solid #76796635; }
.rewind-wipe i::before { content:""; position:absolute; right:8%; top:42%; width:60px; height:16px; background:repeating-linear-gradient(90deg,#b8bba4 0 8px,transparent 8px 17px); opacity:.24; }
.portal-caption { position:absolute; bottom:13%; left:0; right:0; text-align:center; text-transform:uppercase; letter-spacing:.36em; color:#e4e2d5; font-size:10px; }
.film-mode .modal { z-index:11001; }
.film-mode .modal.reel-collapse .reel-video-stage { transition-duration:.5s; }
.film-mode .modal.open ~ .film-controls { visibility:hidden; }
.film-mode body.modal-open .film-controls { visibility:hidden; }
.film-mode body.scene-travelling #top { pointer-events:none; }
@media (max-width:1000px) {
  .film-chapters span { display:none; }
  .film-hint { display:none; }
  .film-chapters a { padding:0 3px; }
  .film-chapters i { width:20px; }
  .film-chapters a[aria-current="page"] i { width:30px; }
}
@media (max-width:767px) {
  .film-mode .hero-inner { padding-bottom:100px; }
  .film-mode .hero-stage { min-height:480px; }
  .film-mode .hero-bottom { grid-template-columns:1fr; gap:16px; }
  .film-mode .hero-actions { justify-self:start; flex-direction:row; align-items:center; gap:16px; }
  .film-mode .hero-title .line:nth-child(2) { font-size:calc((100vw - (var(--gutter) * 2)) * .151); }
  .film-mode .hero-bottom p { max-width:340px; }
  .film-mode .portrait-wrap { right:0; }
  .film-mode .film-controls { min-height:80px; padding-top:14px; gap:12px; }
  .film-position { min-width:66px; }
  .film-position span:last-child { font-size:10px; }
  .film-chapters { gap:2px; }
  .film-chapters i { width:13px; }
  .film-chapters a[aria-current="page"] i { width:23px; }
  .film-transport { gap:6px; }
  .film-transport button { width:40px; height:40px; }
  .film-mode .scene-scroll { padding-top:calc(var(--nav-offset,70px) + 20px); padding-bottom:105px; }
  .film-mode .profile-grid { grid-template-columns:1fr; gap:36px; }
  .biography-portrait { max-width:360px; }
  .biography-portrait img { max-height:45vh; object-fit:cover; object-position:50% 20%; }
  .film-stills { grid-template-columns:1.3fr 1fr; gap:10px; padding-bottom:35px; }
  .film-still { height:300px; }
  .film-still figcaption { padding:50px 12px 18px; }
  .film-still figcaption span { font-size:21px; }
  .film-still figcaption small { line-height:1.5; font-size:8px; }
  .film-still-wide img { object-position:51% 50%; }
  .film-mode .reel-bg { inset:20vh 5vw; }
  .film-mode .reel-content h2 { font-size:clamp(90px,24vw,160px); }
  .film-mode .contact h2 { font-size:clamp(90px,26vw,180px); }
  .film-mode .contact .shell::before { margin-bottom:30px; }
  .portal-frame { width:60vw; height:68vh; }
  .scene-portal[data-kind="projection"] .portal-frame { width:88vw; }
  .portrait-film { width:86vw; padding:12px 7%; gap:12px; }
  .portrait-film-frame { height:36vh; }
}
@media (max-height:550px) and (min-width:600px) {
  .film-mode .hero-stage { min-height:300px; }
  .film-mode .hero-inner { min-height:600px; }
  .film-mode .profile .scene-scroll,.film-mode .contact .scene-scroll { display:block; }
}
@media (prefers-reduced-motion:reduce) {
  .scene-portal { display:none!important; }
  .film-mode .film-scene { transform:none!important; filter:none!important; }
}


/* V4.78 — one-off clapper transition into Work / Selected Credits */
.scene-portal[data-kind="clapper"] .scene-clapper-transition{display:flex;position:absolute;inset:0;align-items:center;justify-content:center;background:radial-gradient(circle at 50% 46%,#151515 0%,#070707 54%,#030303 100%);overflow:hidden}
.scene-clapper-transition::before{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 0 38%,rgba(255,255,255,.025) 48%,transparent 58%),radial-gradient(circle at 50% 44%,rgba(255,246,218,.035),transparent 40%);opacity:.85}
.scene-clapper-board{position:absolute;left:50%;top:50%;width:min(620px,78vw);aspect-ratio:1.74/1;background:#111;border:1px solid rgba(236,232,215,.36);box-shadow:0 28px 70px #000c,0 0 0 1px #000 inset;transform:translate(-50%,-50%);font-family:Arial,Helvetica,sans-serif;color:#f2efe4;letter-spacing:.08em}
.scene-clapper-stick{position:absolute;left:-1px;right:-1px;top:-15.5%;height:18%;transform-origin:4.5% 100%;background:repeating-linear-gradient(125deg,#e8e4d7 0 34px,#161616 34px 68px);border:1px solid #ddd9cc;box-shadow:0 5px 13px #0008;z-index:2}
.scene-clapper-stick::after{content:"";position:absolute;left:4.5%;bottom:-7px;width:13px;height:13px;border-radius:50%;background:#bbb8ab;border:2px solid #222;box-shadow:0 0 0 2px #0008}
.scene-clapper-face{position:absolute;inset:0;display:grid;grid-template-rows:1.25fr .85fr .85fr;padding:7.5% 8% 6%;background:linear-gradient(180deg,rgba(255,255,255,.028),transparent 22%),repeating-linear-gradient(180deg,transparent 0 32%,rgba(240,236,220,.17) 32% 32.7%,transparent 32.7% 65%,rgba(240,236,220,.17) 65% 65.7%,transparent 65.7% 100%)}
.scene-clapper-face strong,.scene-clapper-face span{display:flex;align-items:center;border-bottom:1px solid rgba(240,236,220,.12);text-shadow:0 1px 1px #000;font-weight:500}
.scene-clapper-face strong{font-size:clamp(24px,4.6vw,52px);letter-spacing:.075em;white-space:nowrap;font-weight:650}
.scene-clapper-face span{font-size:clamp(15px,2vw,23px);letter-spacing:.22em;color:#e3dece}
.scene-clapper-face span:last-child{border-bottom:0;color:#c9c3b2}
.scene-clapper-flash{position:absolute;inset:0;background:#fffaf0;opacity:0;mix-blend-mode:screen;pointer-events:none}
.scene-portal[data-kind="clapper"] .portal-caption{display:none}
@media(max-width:767px){.scene-clapper-board{width:min(86vw,560px)}.scene-clapper-stick{height:17%;top:-14.5%}.scene-clapper-face{padding:8% 7% 6%}.scene-clapper-face strong{font-size:clamp(21px,7.1vw,38px)}.scene-clapper-face span{font-size:clamp(13px,3.7vw,18px)}}

/* V5.04 — preserve every cinematic transition on touch while keeping mobile scrolling light. */
@media (pointer:coarse), (hover:none){
  .film-mode .scene-scroll{
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-y:contain;
    scrollbar-width:none;
  }
  .film-mode .scene-scroll::-webkit-scrollbar{display:none;width:0;height:0}
}
