/* Fly-through stage. JS sets the section height (pinned travel + one stage). */
.flight{position:relative;background:var(--ink);color:var(--on-dark)}
.flight-stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:#0b0f15}
.flight-poster,.flight-canvas{position:absolute;inset:0;width:100%;height:100%}
.flight-poster{object-fit:cover;object-position:50% 50%}
.flight-canvas{opacity:0;transition:opacity .35s ease}
.flight--drawn .flight-canvas{opacity:1}
.flight-shade{position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(10,13,18,.55),rgba(10,13,18,0) 22%)}

/* Chapters */
.flight-chapters{position:absolute;inset:0}
.chapter{position:absolute;inset:0;display:flex;align-items:center;
  padding:calc(96px + 2vh) var(--gutter) 110px;pointer-events:none;will-change:opacity,transform}
.chapter::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(90deg,rgba(10,13,18,.82) 0%,rgba(10,13,18,.55) 32%,rgba(10,13,18,0) 62%)}
.chapter[data-align="right"]{justify-content:flex-end}
.chapter[data-align="right"]::before{background:linear-gradient(270deg,rgba(10,13,18,.82) 0%,rgba(10,13,18,.55) 32%,rgba(10,13,18,0) 62%)}
.chapter-still{display:none}
.chapter-copy{position:relative;max-width:540px;pointer-events:auto}
.chapter[inert] .chapter-copy{pointer-events:none}
.sector{display:block;color:#9cc3ff;font-weight:700;margin-bottom:14px;letter-spacing:.12em}
.chapter-heading{font-size:clamp(2.4rem,1.4rem + 4.2vw,5.4rem);color:#fff}
h2.chapter-heading{font-size:clamp(2.1rem,1.3rem + 3.3vw,4.4rem)}
.chapter-heading em,.flight h1 em{font-style:italic;color:#7fb2ff}
.chapter-body{font-size:var(--step-1);line-height:1.45;color:#dde6f1;max-width:34ch;margin:18px 0 26px}
.chapter-actions{display:flex;flex-wrap:wrap;gap:12px}
.chapter .btn-ghost{--fg:#fff;border-color:rgba(255,255,255,.75)}
.chapter .btn-ghost:hover{--bg:#fff;--fg:var(--ink)}
.chapter-promo{margin:18px 0 0}

/* Skip + HUD */
.skip-tour{position:absolute;z-index:6;top:calc(84px + env(safe-area-inset-top));right:var(--gutter);
  padding:10px 14px;border-radius:999px;background:rgba(10,13,18,.55);color:#fff;
  border:1px solid rgba(255,255,255,.35);font:700 .8rem var(--font-mono);letter-spacing:.06em;
  text-transform:uppercase;text-decoration:none;backdrop-filter:blur(8px)}
.skip-tour:hover{background:#fff;color:var(--ink)}
.flight-hud{position:absolute;left:var(--gutter);right:var(--gutter);bottom:26px;display:flex;align-items:center;gap:18px;pointer-events:none;z-index:5}
.hud-sector{color:#fff;font-size:.8rem}
.hud-sector b{color:var(--signal);font-size:1.05rem}
.hud-bar{flex:1;height:3px;background:rgba(255,255,255,.22);transform:skewX(var(--slant));overflow:hidden}
.hud-bar i{display:block;height:100%;background:var(--signal);transform-origin:0 50%;transform:scaleX(0)}
.hud-cue{color:#dfe8f3;font-size:.75rem;transition:opacity .3s}
.flight-stage::after{content:"";position:absolute;left:50%;bottom:18px;width:0;height:0}

/* Before JS runs / if it fails: all chapters readable in flow over their stills. */
.no-js .flight .flight-canvas,.no-js .flight .flight-hud{display:none}

/* Still-per-chapter fallback (reduced motion, save-data, no JS) */
.flight--static,.no-js .flight{height:auto!important}
.flight--static .flight-stage,.no-js .flight-stage{position:relative;height:auto;overflow:visible}
.flight--static .flight-poster,.flight--static .flight-canvas,.flight--static .flight-hud,.flight--static .flight-shade,
.no-js .flight-poster,.no-js .flight-shade{display:none}
.flight--static .flight-chapters,.no-js .flight-chapters{position:relative}
.flight--static .chapter,.no-js .chapter{position:relative;min-height:88vh;min-height:88svh;opacity:1!important;transform:none!important;pointer-events:auto}
.flight--static .chapter-still,.no-js .chapter-still{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.flight--static .chapter::before,.no-js .chapter::before{z-index:1}
.flight--static .chapter-copy,.no-js .chapter-copy{z-index:2}
.flight--static .skip-tour,.no-js .skip-tour{top:90px}

@media (max-width:760px){
  .chapter{align-items:flex-end;padding:96px var(--gutter) 64px}
  .chapter::before,.chapter[data-align="right"]::before{
    background:linear-gradient(0deg,rgba(10,13,18,.9) 0%,rgba(10,13,18,.72) 38%,rgba(10,13,18,0) 70%)}
  .chapter[data-align="right"]{justify-content:flex-start}
  .chapter-body{font-size:1rem;margin:10px 0 16px}
  .chapter-heading{font-size:clamp(1.9rem,8.4vw,2.6rem)}
  h2.chapter-heading{font-size:clamp(1.7rem,7.6vw,2.3rem)}
  .chapter-actions .btn{min-height:46px;padding:0 1em;font-size:.93rem}
  .chapter-promo{margin-top:12px}
  .sector{font-size:.66rem;margin-bottom:8px}
  .hud-cue{display:none}
  .flight-hud{bottom:16px}
  .skip-tour{top:calc(70px + env(safe-area-inset-top));bottom:auto;right:var(--gutter);padding:7px 11px;font-size:.66rem}
  /* Band layout: video strip on top (drawn by flight.js), copy on solid ink below it. */
  .flight--band .flight-poster{object-fit:cover;height:var(--band-bottom,45%);top:0;
    clip-path:inset(60px 0 0 0)}
  .flight--band .flight-shade{display:none}
  .flight--band .chapter{padding-top:calc(var(--band-bottom,50vh) + 18px)}
  .flight--band .chapter::before{background:none}
  .flight--band .flight-stage::before{content:"";position:absolute;left:0;right:0;z-index:1;pointer-events:none;
    top:calc(var(--band-bottom,50vh) - 36px);height:36px;background:linear-gradient(0deg,#0a0d12,rgba(10,13,18,0))}
}
@media (max-height:560px) and (min-width:761px){
  .chapter{padding-top:84px;padding-bottom:70px}
  .chapter-body{margin:10px 0 16px}
}