/*
 * niramind.com: the New York scene (markup generated by web/scripts/nyc-scene.py).
 * Layers, back to front: the launch (beyond the skyline) · the city · the page content.
 * Transform and opacity animations only; a still frame for reduced motion.
 */
.nyc-scene, .launch { position: fixed; pointer-events: none; }
.nyc-scene {
  left: 0; right: 0; bottom: 0; z-index: 1;
  /* Tall enough for the whole scene and its headroom (530 of 1600 units): the torch is never cut. */
  height: min(33.2vw, 66vh);
  -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 16%);
  mask-image: linear-gradient(to bottom, transparent 0, #000 16%);
  opacity: 0; animation: nyc-in 2.4s ease-out .6s forwards;
}
.nyc-scene__svg { display: block; width: 100%; height: 100%; }
@media (max-width: 40rem) {
  .nyc-scene { height: 53vw; }
  /* Phones: the page (and its footer) stays above the scene instead of on top of the car. */
  .page-frame { padding-bottom: 60vw; }
}
@keyframes nyc-in { to { opacity: 1; } }
/* Placed by nyc-scene.js: its pad sits on the skyline's pad anchor, behind the city. */
.launch { z-index: 0; left: 0; top: 0; width: 300px; height: 1000px; opacity: 0; animation: nyc-in 2.4s ease-out .6s forwards; }
.launch__svg { display: block; width: 100%; height: 100%; overflow: visible; }

/* ── Night sky: the crescent moon and drifting clouds (behind the neural field and the city) ── */
.night-sky { position: fixed; inset: 0; z-index: 0; pointer-events: none; opacity: 0; animation: nyc-in 3s ease-out .3s forwards; }
.night-sky__svg { width: 100%; height: 100%; display: block; overflow: visible; }
.moon__glow { transform-box: fill-box; transform-origin: center; animation: moon-glow 8s ease-in-out infinite; }
@keyframes moon-glow { 50% { opacity: .7; transform: scale(1.06); } }
.cloud { animation: cloud-drift 140s linear infinite; }
.cloud--1 { animation-duration: 190s; animation-delay: -60s; } .cloud--2 { animation-duration: 160s; animation-delay: -110s; }
.cloud--3 { animation-duration: 230s; animation-delay: -30s; } .cloud--4 { animation-duration: 175s; animation-delay: -150s; }
@keyframes cloud-drift { from { transform: translateX(-320px); } to { transform: translateX(1920px); } }

/* ── City lights and the harbour ── */
.tw { opacity: .85; }
.tw-g { fill: #f6d58f; } .tw-w { fill: #f4f7ff; opacity: .78; } .tw-b { fill: #9fcaff; opacity: .7; }
.skyline--far .tw { opacity: .5; }
.tw--t { animation: nyc-twinkle 5s ease-in-out infinite; }
.tw--1 { animation-delay: -1s; } .tw--2 { animation-delay: -2s; } .tw--3 { animation-delay: -3s; } .tw--4 { animation-delay: -4s; } .tw--5 { animation-duration: 7s; }
@keyframes nyc-twinkle { 50% { opacity: .2; } }
.water__shimmer { stroke-dasharray: 6 10; animation: nyc-shimmer 6s linear infinite; }
@keyframes nyc-shimmer { 50% { stroke-opacity: .12; } to { stroke-dashoffset: -64; } }

/* ── The Statue of Liberty ── */
.flame { transform-box: fill-box; transform-origin: 50% 100%; }
.flame--0 { animation: flame-a .7s ease-in-out infinite alternate; }
.flame--1 { animation: flame-b .55s ease-in-out infinite alternate; opacity: .9; }
.flame--2 { animation: flame-c .63s ease-in-out infinite alternate; opacity: .85; }
@keyframes flame-a { 0% { transform: scale(1, .92) skewX(-4deg); } 100% { transform: scale(.92, 1.12) skewX(5deg); } }
@keyframes flame-b { 0% { transform: scale(1.05, .9) skewX(6deg); } 100% { transform: scale(.9, 1.18) skewX(-6deg); } }
@keyframes flame-c { 0% { transform: scale(.95, 1.1) skewX(-7deg); } 100% { transform: scale(1.08, .88) skewX(4deg); } }
.liberty__halo, .liberty__glint { transform-box: fill-box; transform-origin: center; }
.liberty__halo { animation: lib-halo 2.4s ease-in-out infinite; }
@keyframes lib-halo { 50% { transform: scale(1.22); opacity: .72; } }
.liberty__glint { animation: lib-glint 1.8s ease-in-out infinite; }
@keyframes lib-glint { 50% { transform: scaleY(1.3) scaleX(.8); opacity: .25; } }
.ember { opacity: 0; animation: ember 2.6s ease-out infinite; }
.ember--1 { animation-delay: .7s; } .ember--2 { animation-delay: 1.3s; } .ember--3 { animation-delay: 1.9s; }
@keyframes ember { 0% { opacity: 0; transform: translate(0, 0); } 15% { opacity: 1; } 100% { opacity: 0; transform: translate(6px, -34px); } }
/* Two beams sweep the night sky from the pedestal (rotating about their base). */
.beam { mix-blend-mode: screen; transform-box: fill-box; }
.beam--a { transform-origin: 96% 100%; animation: beam-a 11s ease-in-out infinite alternate; }
.beam--b { transform-origin: 4% 100%; animation: beam-b 13s ease-in-out infinite alternate; }
@keyframes beam-a { from { transform: rotate(-14deg); } to { transform: rotate(16deg); } }
@keyframes beam-b { from { transform: rotate(14deg); } to { transform: rotate(-16deg); } }
.liberty__reflection { animation: lib-ripple 4s ease-in-out infinite; }
@keyframes lib-ripple { 50% { opacity: .16; } }
.liberty__ripples { stroke-dasharray: 10 8; animation: nyc-shimmer 5s linear infinite; }
.liberty__lights rect { animation: nyc-twinkle 6s ease-in-out infinite; }

/* ── The launch: ignition, steam, lift-off, gravity turn; then the first stage flies back (32 s) ── */
.pad__beacon { animation: beacon 1.6s steps(2) infinite; }
@keyframes beacon { 50% { opacity: .15; } }
.pad__flash { transform-box: fill-box; transform-origin: 50% 80%; opacity: 0; animation: pad-flash 32s ease-out infinite; }
@keyframes pad-flash { 0%, 10.5% { opacity: 0; transform: scale(.4); } 12.5% { opacity: 1; transform: scale(1.15); } 22% { opacity: .55; } 34%, 100% { opacity: 0; transform: scale(.9); } }
.steam { transform-box: fill-box; transform-origin: center; opacity: 0; animation: steam 32s ease-out infinite; }
.steam--1 { animation-delay: .25s; } .steam--2 { animation-delay: .5s; } .steam--3 { animation-delay: .7s; } .steam--4 { animation-delay: .35s; }
@keyframes steam { 0%, 11% { opacity: 0; transform: scale(.2); } 16% { opacity: .9; } 34% { opacity: .55; transform: scale(2.2) translateY(-6px); } 52%, 100% { opacity: 0; transform: scale(2.8) translateY(-14px); } }
.rocket { animation: rocket-life 32s linear infinite; }
@keyframes rocket-life { 0%, 47% { opacity: 1; } 48%, 99% { opacity: 0; } 100% { opacity: 1; } }
.rocket__plume { transform-box: fill-box; transform-origin: 100% 50%; opacity: 0; animation: plume-on 32s linear infinite; }
@keyframes plume-on { 0%, 11.2% { opacity: 0; } 12% { opacity: 1; } 30% { opacity: 1; transform: scale(1.6, 1.9); } 47% { opacity: 1; transform: scale(2.4, 3); } 48%, 100% { opacity: 0; } }
.rocket__diamonds { animation: diamonds .12s ease-in-out infinite alternate; }
@keyframes diamonds { to { opacity: .45; } }
.rocket__trail { animation: trail-fade 32s linear infinite; }
@keyframes trail-fade { 0%, 12% { opacity: 1; } 50% { opacity: .85; } 66%, 100% { opacity: 0; } }
.booster { opacity: 0; animation: booster-life 32s linear infinite; }
@keyframes booster-life { 0%, 62% { opacity: 0; } 63%, 95% { opacity: 1; } 99%, 100% { opacity: 0; } }
.booster__burn { transform-box: fill-box; transform-origin: 50% 0; opacity: 0; animation: booster-burn 32s linear infinite; }
@keyframes booster-burn { 0%, 72% { opacity: 0; transform: scaleY(.4); } 74% { opacity: 1; transform: scaleY(1); } 85.5% { opacity: 1; transform: scaleY(.6); } 86.5%, 100% { opacity: 0; } }
.leg { transform-box: fill-box; transform-origin: 50% 0; animation: legs 32s ease-out infinite; }
.leg--l { --out: 28deg; } .leg--r { --out: -28deg; }
@keyframes legs { 0%, 80% { transform: rotate(0); } 84%, 100% { transform: rotate(var(--out)); } }

/* ── Concept flying car (path: SVG animateMotion) ── */
.flying-car__thruster, .flying-car__underglow { transform-box: fill-box; transform-origin: center; animation: nyc-thrust .9s ease-in-out infinite alternate; }
@keyframes nyc-thrust { to { opacity: .55; transform: scale(1.3); } }

/* The SUV parks under the centred footer (QA-NIRAMIND-5): a night-navy halo keeps the footer text readable over its
   paint and headlight beam (by day daylight.css gives the footer its own navy halo). */
.page-frame footer { text-shadow: 0 0 2px #050b16, 0 0 6px #050b16, 0 0 12px rgb(5 11 22 / .8); }

/* ── The black SUV: drives in, stops, raises its falcon-wing doors, closes them, drives on (24 s) ── */
.mx__drive { animation: mx-drive 24s infinite; }
@keyframes mx-drive {
  0% { transform: translate(-260px, 430px) scale(.78); animation-timing-function: cubic-bezier(.16, .84, .3, 1); }
  18%, 66% { transform: translate(760px, 430px) scale(.78); animation-timing-function: cubic-bezier(.6, 0, .9, .5); }
  84%, 100% { transform: translate(1860px, 430px) scale(.78); }
}
.mx__wheel { transform-box: fill-box; transform-origin: center; animation: mx-wheel 24s infinite; }
@keyframes mx-wheel {
  0% { transform: rotate(0); animation-timing-function: cubic-bezier(.16, .84, .3, 1); }
  18%, 66% { transform: rotate(2997deg); animation-timing-function: cubic-bezier(.6, 0, .9, .5); }
  84%, 100% { transform: rotate(6229deg); }
}
.mx__falcon { transform-box: fill-box; transform-origin: 50% 0; animation: mx-falcon 24s infinite; }
@keyframes mx-falcon {
  0%, 21% { transform: scaleY(1); animation-timing-function: cubic-bezier(.45, 0, .25, 1); }
  30%, 54% { transform: scaleY(-.72) skewX(-16deg); animation-timing-function: cubic-bezier(.45, 0, .25, 1); }
  63%, 100% { transform: scaleY(1); }
}
.mx__falcon-inner { opacity: 0; animation: mx-inner 24s infinite; }
@keyframes mx-inner { 0%, 25.4% { opacity: 0; } 25.6%, 58.4% { opacity: 1; } 58.6%, 100% { opacity: 0; } }
.mx__cabin { opacity: 0; animation: mx-cabin 24s infinite; }
@keyframes mx-cabin { 0%, 22% { opacity: 0; } 27%, 58% { opacity: 1; } 63%, 100% { opacity: 0; } }
.mx__tail { filter: drop-shadow(0 0 3px #ff2d3a); animation: mx-brake 24s infinite; }
@keyframes mx-brake { 0%, 13% { opacity: .55; } 16%, 64% { opacity: 1; } 67%, 100% { opacity: .55; } }
.mx__lamp { filter: drop-shadow(0 0 4px #eaf6ff); }
.road__dash { animation: nyc-road 1.2s linear infinite; }
@keyframes nyc-road { to { stroke-dashoffset: -40; } }

@media (prefers-reduced-motion: reduce) {
  .nyc-scene, .launch, .night-sky { opacity: 1; animation: none; }
  .nyc-scene *, .launch *, .night-sky * { animation: none !important; }
  .mx__drive { transform: translate(760px, 430px) scale(.78); }
  .pad__flash, .steam, .rocket__plume, .rocket__trail, .booster, .flying-car { opacity: 0; }
}