/* Markus' original film stage, intro, frame and final keyhole. */
.rc-film-hero{position:relative;height:calc(100svh - var(--header) - 1px);min-height:0;display:block;padding:0;overflow:hidden;isolation:isolate;background:#000}
.rc-film-hero::before{content:"";position:absolute;z-index:2;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(0,0,0,.12),transparent 22%,transparent 72%,rgba(0,0,0,.42))}
.rc-film-hero::after{content:"";position:absolute;z-index:3;inset:0;pointer-events:none;box-shadow:inset 0 0 clamp(50px,8vw,150px) rgba(0,0,0,.42)}
.rc-film-video{position:absolute;z-index:1;inset:0;width:100%;height:100%;display:block;object-fit:cover;object-position:center;background:#000}
.rc-film-intro{position:absolute;z-index:4;inset:0;overflow:hidden;pointer-events:none;background:radial-gradient(circle at 76% 50%,rgba(0,91,151,.2),transparent 24%),linear-gradient(110deg,#000 0%,#000a18 48%,#001737 100%);transition:opacity .5s ease,visibility .5s ease}
.rc-film-intro img{position:absolute;right:clamp(8%,13vw,18%);top:50%;width:clamp(190px,18vw,330px);height:auto;transform:translateY(-50%);filter:drop-shadow(0 0 34px rgba(28,176,210,.28));opacity:.96}
.rc-film-intro-ready .rc-film-intro{opacity:0;visibility:hidden}
.rc-film-frame{position:absolute;z-index:4;inset:0;border-bottom:3px solid #bb954a;pointer-events:none}
.rc-film-finale{position:absolute;z-index:5;inset:0;opacity:0;visibility:hidden;pointer-events:none;background:#000814 url('/assets/markus/rc-hero-final-keyhole.jpg') center/cover no-repeat;transition:opacity 1.2s ease,visibility 1.2s ease}
.rc-film-finale::before{content:"";position:absolute;z-index:0;inset:0;background:linear-gradient(180deg,#000d20 0%,#000d20 28%,rgba(0,13,32,.9) 34%,rgba(0,13,32,0) 45%,rgba(0,13,32,0) 66%,rgba(0,13,32,.92) 79%,#000d20 85%,#000d20 100%),radial-gradient(ellipse 26% 60% at 50% 51%,rgba(0,23,55,0) 0%,rgba(0,16,39,.08) 48%,rgba(0,7,20,.72) 100%)}
.rc-film-keyhole{position:absolute;z-index:1;left:50%;top:44.1%;width:clamp(38px,3.45vw,50px);height:clamp(78px,7.35vw,106px);transform:translate(-50%,-1%);filter:saturate(1.15) brightness(1.08);pointer-events:none}
.rc-film-keyhole::before,.rc-film-keyhole::after{content:"";position:absolute;background:radial-gradient(circle at 50% 38%,#fff 0%,#f8fbfd 34%,#e4f0f4 70%,#b9d6df 100%);box-shadow:inset 0 0 10px rgba(0,23,55,.24),0 0 14px rgba(255,255,255,.18)}
.rc-film-keyhole::before{left:8%;top:3%;width:84%;aspect-ratio:1;border-radius:50%}
.rc-film-keyhole::after{left:25%;top:39%;width:50%;height:54%;clip-path:polygon(36% 0,64% 0,100% 100%,0 100%)}
.rc-film-finale-visible .rc-film-finale{opacity:1;visibility:visible}
.rc-film-scroll,.rc-film-control{position:absolute;z-index:7;bottom:22px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,.42);border-radius:4px;color:#fff;background:rgba(0,23,55,.62);backdrop-filter:blur(8px);font:inherit;font-size:.75rem;font-weight:750;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;cursor:pointer;transition:border-color .2s ease,background .2s ease}
.rc-film-scroll{left:max(20px,calc((100vw - 1180px)/2));gap:9px;padding:0 15px}
.rc-film-control{right:max(20px,calc((100vw - 1180px)/2));padding:0 15px}
.rc-film-scroll:hover,.rc-film-control:hover{border-color:#bb954a;background:rgba(0,23,55,.86)}
/* User requirement: the original landscape movie stays landscape on phones. */
@media(max-width:1000px){
 .rc-film-hero{height:auto;aspect-ratio:16/9}
 .rc-film-video{object-fit:contain}
 .rc-film-finale{background-size:cover}
 .rc-film-keyhole{width:3.45vw;height:7.35vw}
}
@media(max-width:700px){
 .rc-film-intro img{right:50%;width:clamp(80px,24vw,150px);transform:translate(50%,-50%)}
 .rc-film-scroll,.rc-film-control{bottom:12px;min-height:40px;padding:0 10px;font-size:.65rem}
 .rc-film-scroll{left:12px}.rc-film-control{right:12px}
}
@media(prefers-reduced-motion:reduce){.rc-film-intro,.rc-film-finale{transition:none}}
