/* Cold-gas ports and choreographed, reversible manoeuvres. */
.flight-scene{--hover-height:58px;--launch-height:94px;--wall-x:9%;--wall-scale:.54;--manoeuvre-start:0px;--release-end-y:0px}
.hero-v2 .flight-stage{overflow:clip}
.flight-scene .flight-hover{animation:none;transform:translate(0,0);transition:none}
.hero-v2 .flight-stage .roadster-object{transform:none;transition:none;filter:drop-shadow(0 3px 8px #00150d22)}
.flight-scene .flight-shadow{animation:none;opacity:.65;transform:scaleX(1);transition:opacity .8s,transform .8s}
.flight-scene .flight-field{transition:opacity 1s}
.flight-scene .thruster{left:29.6%;top:76.6%;width:7%;height:33%;background:none;clip-path:none;filter:none;opacity:0;animation:none;transform:translateX(-50%);z-index:1}
.flight-scene .thruster-rear{left:74.5%;top:73%;height:30%}
.thruster:before,.rail-jet:before{content:"";position:absolute;inset:0 28% 12%;background:linear-gradient(#f1fff8d9 0%,#e4f5ed99 14%,#d0e8db40 47%,transparent 85%);clip-path:polygon(38% 0,62% 0,100% 100%,0 100%);filter:blur(1.7px)}
.thruster:after,.rail-jet:after{content:"";position:absolute;inset:6% -55% -20%;background:radial-gradient(ellipse at 50% 10%,#e6f9ef77,transparent 50%),radial-gradient(ellipse at 32% 53%,#c5dfd12e,transparent 53%),radial-gradient(ellipse at 72% 62%,#d5e8dd21,transparent 52%);filter:blur(8px)}
.flight-scene.is-air .flight-hover{transform:translate(0,calc(-1 * var(--hover-height)));animation:controlled-hover 6s ease-in-out infinite}
.flight-scene.is-air .thruster{animation:gas-trim 2.6s ease-in-out infinite}
.flight-scene.is-air .thruster-rear{animation-delay:-1.2s}
.flight-scene.is-air .flight-shadow{opacity:.27;transform:scaleX(.65)}
.flight-scene.is-launching .flight-hover{animation:controlled-launch 3.5s cubic-bezier(.3,0,.2,1) both}
.flight-scene.is-launching .thruster{animation:gas-launch 3.5s linear both}
.flight-scene.is-launching .thruster-rear{animation-delay:.06s}
.flight-scene.is-launching .flight-shadow{animation:shadow-takeoff 3.5s ease-in-out both}
.flight-scene.is-landing .flight-hover{animation:controlled-landing 2.3s cubic-bezier(.23,.65,.25,1) both}
.flight-scene.is-landing .thruster{animation:gas-landing 2.3s linear both}
.flight-scene.is-landing .flight-shadow{animation:shadow-landing 2.3s ease-in-out both}
.launch-wave{position:absolute;left:27%;top:79%;width:45%;height:12%;border:1px solid #c0efd596;border-radius:50%;opacity:0;pointer-events:none;transform:scale(.2)}
.launch-wave:after{content:"";position:absolute;inset:15%;border:1px solid #b4dbc66b;border-radius:50%}
.is-launching .launch-wave{animation:pressure-wave 1.5s .55s ease-out both}
.is-landing .launch-wave{animation:pressure-wave 1.1s 1.2s ease-out both}
.flight-scene .flight-wall{left:53%;top:5%;height:82%;width:2px;opacity:0;background:#8bb99f;box-shadow:-8px 0 24px #6caa8125;transform:perspective(800px) translate(60px,10px) rotateY(-25deg);transition:opacity .65s,transform 1s cubic-bezier(.18,.8,.25,1)}
.flight-scene .flight-wall:before{width:190px;background:repeating-linear-gradient(0deg,transparent 0 53px,#8ac7a41d 54px 55px),linear-gradient(100deg,#061d1300,#27513e6b);border:1px solid #7dab8e4d;transform:perspective(600px) rotateY(-28deg);transform-origin:100% 50%;box-shadow:inset -30px 0 45px #6fa8840d}
.flight-scene .flight-wall:after{content:none}
.wall-visible .flight-wall,.flight-scene.is-wall .flight-wall{opacity:1;transform:perspective(800px) translate(0,0) rotateY(0)}
.wall-mark{position:absolute;right:15px;top:17px;writing-mode:vertical-rl;white-space:nowrap;font-size:6px;letter-spacing:.12em;color:#78ad90}
.wall-contact{position:absolute;left:-5px;width:12px;height:12px;border:1px solid #ade6bd7d;border-radius:50%;opacity:0}
.wall-contact-a{top:26%}.wall-contact-b{top:70%}
.is-wall-arriving .wall-contact{animation:wall-contact 1.3s 2s both}
.is-wall .wall-contact{opacity:.45;box-shadow:0 0 9px #91bda439}
.flight-scene.is-wall-arriving .flight-hover{animation:wall-approach 3.3s cubic-bezier(.25,.05,.2,1) both}
.flight-scene.is-wall-arriving .thruster{animation:gas-wall 3.3s linear both}
.flight-scene.is-wall-arriving .flight-shadow{opacity:0;transform:scaleX(.5)}
.flight-scene.is-wall .flight-hover{animation:none;transform:translate(var(--wall-x),-10%) rotate(90deg) scale(var(--wall-scale))}
.flight-scene.is-wall .thruster{opacity:0;animation:none}
.flight-scene.is-wall .flight-shadow{opacity:0;animation:none}
.flight-scene.is-wall .flight-field{opacity:.1}
.flight-scene.is-releasing .flight-hover{animation:wall-release 2.8s cubic-bezier(.23,.7,.2,1) both}
.flight-scene.is-releasing .thruster{animation:gas-release 2.8s linear both}
.flight-scene.is-releasing .flight-shadow{animation:shadow-landing 2.8s ease-in-out both}
@keyframes controlled-launch{0%{transform:translate(0,0) rotate(0)}14%{transform:translate(0,5px) rotate(-.4deg)}26%{transform:translate(-3px,-16px) rotate(2deg)}52%{transform:translate(-12px,calc(-1 * var(--launch-height))) rotate(6deg) scale(.98)}78%{transform:translate(7px,calc(-1.09 * var(--hover-height))) rotate(-1deg)}100%{transform:translate(0,calc(-1 * var(--hover-height))) rotate(0)}}
@keyframes controlled-hover{0%,100%{transform:translate(0,calc(-1 * var(--hover-height))) rotate(0)}50%{transform:translate(-4px,calc(-1 * var(--hover-height) - 7px)) rotate(.5deg)}}
@keyframes controlled-landing{0%{transform:translate(0,calc(-1 * var(--hover-height))) rotate(0)}40%{transform:translate(5px,-28px) rotate(-1deg)}75%{transform:translate(0,-4px)}88%{transform:translate(0,3px)}100%{transform:translate(0,0)}}
@keyframes gas-launch{0%,14%{opacity:0;transform:translateX(-50%) scaleY(.25)}21%{opacity:.95;transform:translateX(-50%) scaleY(1.35)}27%{opacity:.6}33%{opacity:.95}48%{opacity:.75;transform:translateX(-50%) scaleY(1.2)}61%{opacity:.28;transform:translateX(-50%) scaleY(.5)}72%{opacity:.5}84%,100%{opacity:.16;transform:translateX(-50%) scaleY(.4)}}
@keyframes gas-trim{0%,26%,65%,100%{opacity:.04;transform:translateX(-50%) scaleY(.3)}35%,42%{opacity:.2;transform:translateX(-50%) scaleY(.5)}77%,82%{opacity:.13;transform:translateX(-50%) scaleY(.4)}}
@keyframes gas-landing{0%{opacity:.18;transform:translateX(-50%) scaleY(.4)}47%{opacity:.3}66%{opacity:.65;transform:translateX(-50%) scaleY(.8)}82%{opacity:.3;transform:translateX(-50%) scaleY(.45)}100%{opacity:0;transform:translateX(-50%) scaleY(.2)}}
@keyframes shadow-takeoff{0%,15%{opacity:.65;transform:scaleX(1)}50%{opacity:.15;transform:scaleX(.5)}100%{opacity:.27;transform:scaleX(.65)}}
@keyframes shadow-landing{0%{opacity:.15;transform:scaleX(.45)}100%{opacity:.65;transform:scaleX(1)}}
@keyframes pressure-wave{0%{opacity:0;transform:scale(.25)}15%{opacity:.4}100%{opacity:0;transform:scale(2.2)}}
@keyframes wall-approach{0%{transform:translate(0,var(--manoeuvre-start)) rotate(0) scale(1)}20%{transform:translate(-6%,-12%) rotate(-8deg) scale(.96)}47%{transform:translate(13%,-18%) rotate(46deg) scale(.7)}72%{transform:translate(12%,-12%) rotate(87deg) scale(var(--wall-scale))}87%{transform:translate(8%,-10%) rotate(90deg) scale(var(--wall-scale))}100%{transform:translate(var(--wall-x),-10%) rotate(90deg) scale(var(--wall-scale))}}
@keyframes wall-release{0%{transform:translate(var(--wall-x),-10%) rotate(90deg) scale(var(--wall-scale))}22%{transform:translate(18%,-13%) rotate(90deg) scale(var(--wall-scale))}52%{transform:translate(7%,-18%) rotate(27deg) scale(.8)}78%{transform:translate(-1%,calc(var(--release-end-y) - 17px)) rotate(-3deg) scale(.98)}100%{transform:translate(0,var(--release-end-y)) rotate(0) scale(1)}}
@keyframes gas-wall{0%{opacity:.05}15%{opacity:.7;transform:translateX(-50%) scaleY(1)}32%{opacity:.45}48%{opacity:.65;transform:translateX(-50%) scaleY(.75)}61%{opacity:.1}70%,100%{opacity:0}}
@keyframes gas-release{0%,15%{opacity:0}29%{opacity:.45;transform:translateX(-50%) scaleY(.75)}47%{opacity:.7}65%{opacity:.4}83%{opacity:.25}100%{opacity:0}}
@keyframes wall-contact{0%{opacity:0;transform:scale(.5)}35%{opacity:.8;transform:scale(1.3);box-shadow:0 0 15px #acd6b855}100%{opacity:.45;transform:scale(1)}}
.rail-jet{left:29.6%;top:76.6%;width:7%;height:30%;clip-path:none;background:none;filter:none;opacity:.16}
.rail-jet-rear{left:74.5%;top:73%;height:27%}
.drive-rail[data-motion="flip"] .rail-jet{opacity:.65}
.rail-car img{filter:drop-shadow(0 3px 8px #031a142b)}
.motion-off .flight-scene .flight-hover{animation:none;transform:translate(0,0)}
.motion-off .flight-scene.is-air .flight-hover{transform:translate(0,calc(-1 * var(--hover-height)))}
.motion-off .flight-scene.is-wall .flight-hover{transform:translate(var(--wall-x),-10%) rotate(90deg) scale(var(--wall-scale))}
.motion-off .flight-scene .thruster{animation:none;opacity:0}
@media(min-width:1500px){.flight-scene{--hover-height:74px;--launch-height:110px}}
@media(max-width:1100px){.flight-scene{--hover-height:47px;--launch-height:76px}.flight-scene .flight-wall:before{width:130px}}
@media(max-width:720px){.flight-scene{--hover-height:29px;--launch-height:49px;--wall-scale:.55}.flight-scene .flight-wall:before{width:86px}.wall-mark{font-size:5px;right:10px;top:12px}.wall-contact{width:8px;height:8px;left:-3px}.thruster:after{filter:blur(4px)}}
@media(max-width:380px){.flight-scene{--hover-height:23px;--launch-height:37px}.wall-mark{font-size:4px}.flight-scene .flight-wall:before{width:65px}}
@media(prefers-reduced-motion:reduce){.flight-scene .flight-hover{animation:none;transform:translate(0,0)}.flight-scene.is-wall .flight-hover{transform:translate(var(--wall-x),-10%) rotate(90deg) scale(var(--wall-scale))}.flight-scene .thruster{opacity:0}}
