/* Home-page title sequence. All moving artwork is provided by raster assets. */
.cinema-intro[hidden]{display:none}
.intro-pending .cinema-intro{display:grid}
.intro-pending,.intro-pending body{overflow:hidden}
.intro-pending .hero-copy>*{animation-play-state:paused!important}
.cinema-intro{--card-w:min(clamp(100px,12vw,170px),20vh);--orbit:min(24vw,24vh,260px);position:fixed;inset:0;z-index:10000;isolation:isolate;display:grid;place-items:center;overflow:hidden;background:#080a09;color:#f5f5ec;font-family:inherit;perspective:1200px;overscroll-behavior:contain}
.intro-atmosphere{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 47%,#a3b25b17 0%,#11160e26 30%,transparent 65%)}
.intro-atmosphere::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#080a09b0,transparent 23%,transparent 77%,#080a09b0);box-shadow:inset 0 0 160px #0009}
.cinema-intro:focus{outline:none}
.intro-topline,.intro-bottomline{position:absolute;left:clamp(24px,4vw,64px);right:clamp(24px,4vw,64px);z-index:7;display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:12px;font-weight:500;letter-spacing:.15em;color:#b6b9ae}
.intro-topline{top:clamp(14px,2.2vh,25px)}
.intro-bottomline{bottom:clamp(15px,2.2vh,25px)}
.intro-replay:focus-visible{outline:2px solid #d8ff36;outline-offset:5px}
.intro-hook{position:absolute;inset:0;z-index:4;display:grid;place-items:center;padding:30px;opacity:0;text-align:center;pointer-events:none}
.intro-hook h2{font-size:clamp(36px,6.6vw,94px);font-weight:600;line-height:1.3;letter-spacing:-.055em}
.intro-hook h2 span,.intro-hook h2 strong{display:block}
.intro-hook h2 span{color:#d9ded0;font-weight:450}
.intro-hook h2 strong{color:#d8ff36;font-weight:700;margin-top:.09em}
.intro-pick-prompt{position:absolute;left:24px;right:24px;top:11%;margin:0;text-align:center;font-size:clamp(21px,2.6vw,35px);font-weight:500;letter-spacing:-.04em;color:#e4e9dc;opacity:0;transform:translateY(10px);transition:opacity .45s,transform .45s;pointer-events:none;z-index:4}
.intro-deck{position:absolute;left:50%;top:56%;width:0;height:0;perspective:1200px;transform-style:preserve-3d;opacity:0}
.intro-slot{position:absolute;left:0;top:0;width:0;height:0;transform:rotate(var(--angle)) translateX(var(--orbit)) rotate(calc(-1 * var(--angle)));transform-style:preserve-3d}
.intro-card{position:absolute;left:0;top:0;width:var(--card-w);aspect-ratio:2/3;padding:0;border:0;background:none;transform:translate(-50%,-50%) rotate(var(--lean)) rotateY(-18deg);transform-style:preserve-3d;transition:filter .25s;cursor:pointer;touch-action:manipulation}
.intro-card:disabled{pointer-events:none;cursor:default}
.intro-card:focus-visible{outline:3px solid #e5ff93;outline-offset:8px;border-radius:calc(var(--card-w) * .055)}
.intro-choosing .intro-card:hover{filter:brightness(1.25) drop-shadow(0 0 18px #d8ff3644)}
.intro-card-turn{position:absolute;inset:0;transform-style:preserve-3d}
.intro-card-face{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;border-radius:calc(var(--card-w) * .055);backface-visibility:hidden;-webkit-backface-visibility:hidden;box-shadow:0 20px 48px #0009;border:1px solid #d3d8af24;background:#111512}
.intro-card-face{background-color:#171914}
.intro-card-front{transform:rotateY(180deg);background-color:#f1eadb}
.intro-selected{z-index:10}
.intro-selected .intro-card::after{content:"";position:absolute;inset:-1px;border:1px solid #e5ffa4;border-radius:calc(var(--card-w) * .055);box-shadow:0 0 20px #d8ff3677,0 0 80px #d8ff363f,0 0 140px #a9ce3624;opacity:0;pointer-events:none}
.intro-caption{position:absolute;left:20px;right:20px;top:56%;margin:0;transform:translateY(-50%);text-align:center;font-size:14px;letter-spacing:.01em;color:#a7b497;opacity:0;transition:opacity .45s;pointer-events:none}
.intro-choosing .intro-pick-prompt{opacity:1;transform:none}
.intro-choosing .intro-caption{opacity:1}
.intro-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.intro-title{position:absolute;z-index:4;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;pointer-events:none;opacity:0;text-align:center}
.intro-title p{margin:0 0 clamp(25px,5vh,52px);font-size:clamp(12px,1.3vw,16px);letter-spacing:.3em;color:#d8ff36}
.intro-title strong{font-size:clamp(90px,18vw,250px);font-weight:900;letter-spacing:-.055em;line-height:1.07;margin-left:-.055em}
.intro-title span{display:block;font-size:clamp(22px,4.2vw,52px);font-weight:400;letter-spacing:.4em;margin:.55em -.4em 0 0}
.intro-title small{margin-top:clamp(30px,6vh,60px);font-size:clamp(12px,1.2vw,15px);font-weight:500;letter-spacing:.22em;color:#b6b9ae}
.intro-running .intro-hook{animation:intro-question 2.35s ease both}
.intro-running .intro-deck{animation:deck-arrival .65s 1.85s ease-out both,deck-orbit 2.3s 1.85s cubic-bezier(.15,.55,.23,1) both}
.intro-picked .intro-slot:not(.intro-selected){animation:card-departure .9s .08s cubic-bezier(.3,0,.3,1) both}
.intro-picked .intro-selected{animation:card-selection .8s cubic-bezier(.2,.8,.2,1) both}
.intro-picked .intro-selected .intro-card{animation:card-upright .8s cubic-bezier(.2,.8,.2,1) both,card-portal .85s 1.95s cubic-bezier(.5,0,.4,1) forwards}
.intro-picked .intro-selected .intro-card-turn{animation:card-turn 1.05s .7s cubic-bezier(.28,.7,.25,1) both}
.intro-picked .intro-selected .intro-card::after{animation:card-radiance 2.1s ease-in-out both}
.intro-picked .intro-title{animation:title-credit 1.7s 2.05s cubic-bezier(.2,.75,.3,1) both}
.intro-picked{animation:intro-exit .65s 3.6s ease-in-out forwards}
.intro-replay{display:inline-flex;align-items:center;gap:12px;border:0;background:none;color:inherit;font:inherit;font-size:14px;padding:8px 0;cursor:pointer}
.intro-replay[hidden]{display:none}
.intro-replay span{font-size:20px;color:var(--lime)}
@keyframes deck-arrival{from{opacity:0}to{opacity:1}}
@keyframes intro-question{0%{opacity:0;transform:translateY(18px)}18%,74%{opacity:1;transform:none}100%{opacity:0;transform:translateY(-18px)}}
@keyframes deck-orbit{from{transform:rotateX(25deg) rotateZ(-250deg) scale(.68)}65%{transform:rotateX(10deg) rotateZ(-20deg) scale(1)}to{transform:rotateX(0) rotateZ(0) scale(1)}}
@keyframes card-departure{0%{opacity:.85}to{opacity:0;transform:rotate(var(--angle)) translateX(calc(var(--orbit) * 1.75)) rotate(calc(-1 * var(--angle))) scale(.75)}}
@keyframes card-selection{from{transform:rotate(var(--angle)) translateX(var(--orbit)) rotate(calc(-1 * var(--angle)))}to{transform:rotate(0deg) translateX(0) rotate(0deg)}}
@keyframes card-upright{from{transform:translate(-50%,-50%) rotate(var(--lean)) rotateY(-18deg)}to{transform:translate(-50%,-50%) rotate(0deg) rotateY(0deg) scale(1.2)}}
@keyframes card-turn{from{transform:rotateY(0)}to{transform:rotateY(180deg)}}
@keyframes card-radiance{0%{opacity:0}30%,75%{opacity:1}100%{opacity:.2}}
@keyframes card-portal{0%{transform:translate(-50%,-50%) scale(1.2);opacity:1}100%{transform:translate(-50%,-50%) scale(7);opacity:0}}
@keyframes title-credit{0%{opacity:0;transform:scale(1.12);filter:blur(8px)}25%,80%{opacity:1;filter:blur(0)}100%{opacity:1;transform:scale(1);filter:blur(0)}}
@keyframes intro-exit{to{opacity:0;visibility:hidden}}
@media(max-width:600px){.cinema-intro{--card-w:clamp(76px,20vw,110px);--orbit:min(35vw,23vh,170px)}.intro-topline,.intro-bottomline{letter-spacing:.09em}.intro-bottomline{font-size:12px}.intro-hook{padding-inline:20px}.intro-hook h2{font-size:clamp(27px,8.7vw,48px);line-height:1.4}.intro-pick-prompt{top:17%;font-size:23px}.intro-deck{top:54%}.intro-caption{top:54%;font-size:13px;letter-spacing:0}.intro-title strong{font-size:clamp(76px,24vw,144px)}.intro-title span{font-size:clamp(21px,6vw,36px)}.intro-title p{letter-spacing:.1em;font-size:15px}.intro-title small{letter-spacing:.16em}}
@media(max-height:560px) and (min-width:601px){.cinema-intro{--card-w:70px;--orbit:100px}.intro-hook h2{font-size:44px}.intro-pick-prompt{top:11%;font-size:23px}.intro-deck{top:55%}.intro-title strong{font-size:100px}.intro-title p{margin-bottom:20px}.intro-title span{font-size:26px}.intro-title small{margin-top:25px}.intro-caption{top:55%;font-size:12px}}
@media(prefers-reduced-motion:reduce){.cinema-intro,.intro-pending .cinema-intro{display:none!important}.intro-pending,.intro-pending body{overflow:visible}.intro-replay{display:none}.intro-running *{animation:none!important}}