/* One continuous photographic stage. Chapter panels never darken the image independently. */
:root { --steel: #aab4c1; --beam: #a9c9dc; --ember: #d9b68a; }
.deck { scroll-snap-type: none; scroll-behavior: auto; }
/* Timed settling replaces the browser's too-fast mandatory snap. Native input
   stays free; continuous-story.js eases scroll, copy and film together on release. */
.deck.chapter-snapping { scroll-snap-type: none; }
.deck.chapter-snapping > section { scroll-snap-align: none; scroll-snap-stop: normal; }
.chapter-snap-point {
  position: absolute; left: 50%; width: 1px; height: 1px;
  opacity: 0; pointer-events: none;
  scroll-snap-align: none;
}
section:not(#arrival) { height: 150svh; padding: 0; overflow: visible; }
section#contact { height: 250svh; }
.scrim { display: none; }
.story-stage { transform: none; transition: opacity .5s ease; }
.story-stage video,
body[data-chapter] .story-stage video {
  opacity: 1; filter: none; transform: none; transition: none;
  object-fit: cover; object-position: center;
}
.story-stage::after {
  background: linear-gradient(90deg, rgba(3,6,10,.97) 0%, rgba(3,6,10,.88) 24%, rgba(3,6,10,.44) 40%, transparent 57%),
    linear-gradient(0deg, rgba(3,6,10,.42), transparent 22%);
}
.story-stage.film-error {
  background: #111a22;
}
.story-stage.film-error video { visibility: hidden; }
.story-progress { z-index: 2; height: 2px; opacity: .8; box-shadow: none; }
section:not(#arrival) > .inner {
  position: fixed; top: 50%; left: 6vw;
  width: min(33vw, 510px); max-height: calc(100svh - 130px);
  transform: translateY(-50%); opacity: var(--copy-opacity, 0);
  visibility: hidden; pointer-events: none; overflow: auto;
  scrollbar-width: thin;
}
section.live:not(#arrival) > .inner { visibility: visible; pointer-events: auto; }
section:not(#arrival) .fx { opacity: 1; transform: none; transition: none; }
h1, h2 { font-size: clamp(1.75rem, 3vw, 3.25rem); font-stretch: 100%; line-height: 1.03; letter-spacing: -.025em; margin-bottom: 1.6rem; }
/* Fit the longest platform word to its actual column, including where the
   desktop column caps at 510px and on narrow phones. Keep other headings intact. */
#platform > .inner { container-type: inline-size; }
#platform h1 { font-size: min(clamp(1.75rem, 3vw, 3.25rem), 9cqw); overflow-wrap: break-word; }
.eyebrow { font-size: .75rem; letter-spacing: .18em; margin-bottom: 1.25rem; }
.eyebrow::before { width: 20px; }
.lede { font-size: clamp(1rem, 1.28vw, 1.125rem); line-height: 1.7; }
.modules { gap: .45rem; margin-top: 1.5rem; }
.modules span { font-size: .75rem; letter-spacing: .06em; padding: .55em .7em; }
.specs { background: rgba(8,14,20,.55); backdrop-filter: none; }
.specs-head { padding: .75rem .85rem; font-size: .75rem; letter-spacing: .05em; }
.specs-head .dotpulse { animation: none; }
.specs-grid { grid-template-columns: 1fr; }
.specs-grid > div { padding: .48rem .85rem; font-size: .75rem; gap: .5rem; }
.specs-grid > div:nth-child(odd) { border-right: none; }
.specs-grid .k { letter-spacing: .04em; }
.specs-grid .v { letter-spacing: .02em; }
#specs h2 { margin-bottom: 1rem; }
#specs .eyebrow { margin-bottom: .75rem; }
#contact .inner { text-align: left; align-items: flex-start; }
.contact-logo { width: 100%; margin: 0 0 1.5rem; }
.tagline { font-size: clamp(1.1rem, 1.7vw, 1.6rem); letter-spacing: .01em; margin-bottom: 1.5rem; }
.mail { font-size: clamp(.875rem, 1.2vw, 1.125rem); font-family: var(--body); font-weight: 500; padding-bottom: .5rem; border-bottom-width: 1px; }
.site-links { justify-content: flex-start; gap: 1rem; margin-top: 1.7rem; }
.site-links a { font-size: .75rem; letter-spacing: .04em; }
.foot { position: fixed; opacity: 0; pointer-events: none; font-size: .75rem; letter-spacing: .04em; }
#contact.live .foot { opacity: var(--copy-opacity, 0); }
.rail { right: 1.5rem; gap: .4rem; }
.rail button { min-height: 32px; padding: 8px 0 8px 12px; }
.rail .lbl { font-size: .75rem; letter-spacing: .05em; }
.rail button.on .tick { width: 24px; box-shadow: none; }
.counter { left: 6vw; font-size: .75rem; }
.counter .now { font-size: .875rem; }
.logo-wrap.glow::before { animation: none; opacity: .45; }

/* Portrait keeps the original composition intact, in a dedicated lower image field.
   The airframe is never cropped into a close-up simply because the viewport is narrow. */
@media (max-aspect-ratio: 4/3) {
  section:not(#arrival) > .inner {
    top: 7svh; left: 7vw; width: calc(100vw - 17vw);
    max-height: 44svh; transform: none;
  }
  .story-stage video, body[data-chapter] .story-stage video {
    top: auto; bottom: 3svh; height: min(58svh, 80vw);
    width: min(100vw, 72.5svh); left: 50%; transform: translateX(-50%);
    object-fit: cover; object-position: center;
    -webkit-mask-image: linear-gradient(180deg, transparent, black 5%, black 95%, transparent), linear-gradient(90deg, transparent, black 5%, black 95%, transparent);
    -webkit-mask-composite: source-in;
    mask-image: linear-gradient(180deg, transparent, black 5%, black 95%, transparent), linear-gradient(90deg, transparent, black 5%, black 95%, transparent);
    mask-composite: intersect;
  }
  .story-stage::after {
    background: linear-gradient(180deg, #03060a 0%, rgba(3,6,10,.9) 32%, transparent 58%, rgba(3,6,10,.20) 100%);
  }
  h1, h2 { font-size: clamp(1.75rem, 5.2vw, 2.6rem); max-width: 18em; margin-bottom: 1rem; }
  #platform h1 { font-size: min(clamp(1.75rem, 5.2vw, 2.6rem), 9cqw); }
  .lede { font-size: 1rem; line-height: 1.6; max-width: 35em; }
  .eyebrow { margin-bottom: 1rem; }
  .rail { right: .5rem; }
  .rail .lbl { display: none; }
  .rail .tick { width: 9px; }
  .rail button.on .tick { width: 16px; }
  section#specs > .inner { max-height: 68svh; top: 5svh; }
  body[data-chapter="specs"] .story-stage video { top: auto; bottom: 2svh; height: min(46svh, 80vw); width: min(100vw, 57.5svh); }
  .specs-grid { grid-template-columns: 1fr 1fr; }
  .specs-grid > div { flex-direction: column; gap: .18rem; padding: .45rem .6rem; }
  .specs-grid .v { text-align: left; }
  .specs-grid .v.red { padding: 0 .25em; }
  section#contact > .inner { top: 10svh; }
  .contact-logo { max-width: 380px; margin-bottom: 1rem; }
  .mail { font-size: .95rem; }
  .foot { bottom: 1rem; font-size: .65rem; }
}
@media (max-width: 420px) {
  .modules { margin-top: 1rem; }
  .modules span { font-size: .7rem; }
  .eyebrow { font-size: .7rem; }
  .specs-grid > div { font-size: .7rem; }
}
@media (max-height: 550px) and (min-aspect-ratio: 4/3) {
  section:not(#arrival) > .inner { max-height: 88svh; }
  h1, h2 { font-size: 1.65rem; }
  #platform h1 { font-size: min(1.65rem, 9cqw); }
  .lede { line-height: 1.5; }
}
@media (prefers-reduced-motion: reduce) {
  .story-stage, .story-stage video { transition: none; }
  section:not(#arrival) > .inner { opacity: 1; }
}


/* Native-resolution imagery, with no zoom filter or full-screen cropping. */
.story-stage { background: #132432; }
.story-stage video, body[data-chapter] .story-stage video {
  object-fit: contain;
}
.image-credit {
  position: fixed; bottom: 18px; right: 30px; z-index: 4;
  color: #a9b9c4; font: 10px var(--body); letter-spacing: .025em;
  opacity: 0; pointer-events: none; transition: opacity .3s;
}
body[data-chapter="cruise"] .image-credit,
body[data-chapter="terminal"] .image-credit { opacity: .8; pointer-events: auto; }
.image-credit a { color: inherit; }
@media (min-aspect-ratio: 4/3) and (max-aspect-ratio: 177/100) {
  .story-stage video {
    -webkit-mask-image: linear-gradient(180deg, transparent, black 4%, black 96%, transparent);
    mask-image: linear-gradient(180deg, transparent, black 4%, black 96%, transparent);
  }
}
@media (max-aspect-ratio: 4/3) {
  .story-stage { background: #03060a; }
  .image-credit { bottom: 10px; right: 16px; font-size: 9px; }
}