/* Density overlay: tighter rhythm, wide-screen two-column, aspect-aware
   bands. First of the page's three layout sheets (density -> scenes ->
   layout); scenes.css owns all pacing, layout.css owns the One Continuous
   Day composition. */

/* Utility content at utility rhythm: rows earn their keep */
.seq { margin-top: 30px; }
.row { padding: 12px 0; grid-template-columns: 175px 1fr; gap: 22px; }
.row .t { font-size: clamp(19px, 1.8vw, 24px); }
.row h3 { font-size: clamp(20px, 2vw, 25px); }
.row p { font-size: 15.5px; }
.countdown { margin-top: 40px; }
.cd { padding: 11px 0; grid-template-columns: 150px 1fr; gap: 20px; }
.cd .t { font-size: clamp(17px, 1.6vw, 22px); }
.cd h3 { font-size: 21px; margin-bottom: 4px; }
.cd p { font-size: 15.5px; }
.list { margin-top: 40px; }
.li { padding: 11px 0; grid-template-columns: 175px 1fr; gap: 20px; }
.li h3 { font-size: 21px; }
.li p { font-size: 15.5px; }
.statement { font-size: clamp(48px, 6vw, 88px); }
.screen { padding: clamp(80px, 11vh, 132px) 0; }

/* Atmosphere band breathes with the image's own 3:2 frame */
.prog-band { height: auto; aspect-ratio: 3 / 2; max-height: 86vh; }

/* Framed still-lifes (injected by the frame_* transforms) */
.figure.still { margin: clamp(56px, 8vh, 96px) 0 8px; }
.figure.still img { border-radius: 16px; }
.vessel .still-wrap { margin-top: clamp(60px, 9vh, 120px); }
.vessel.no-band { padding-top: clamp(80px, 11vh, 132px); }

/* Wide screens: the right half of the viewport works for a living */
@media (min-width: 1200px) {
  .vessel > .container, #moment .container, #sequence > .container:first-of-type {
    display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
    column-gap: 72px; align-items: start;
  }
  .vessel > .container > *, #moment .container > *,
  #sequence > .container:first-of-type > * { grid-column: 1; }
  .vessel > .container > .kicker, #moment .container > .kicker,
  #sequence > .container:first-of-type > .kicker,
  #sequence > .container:first-of-type > .band-cap { grid-column: 1 / -1; }
  .vessel > .container > .list { grid-column: 2; grid-row: 2 / span 3; margin-top: 0; }
  #moment .container > .countdown { grid-column: 2; grid-row: 2 / span 3; margin-top: 0; }
  #moment .container > .dataline { grid-column: 1 / -1; }
  #sequence > .container:first-of-type > .chart-wrap { grid-column: 2; grid-row: 2 / span 5; margin-top: 0; align-self: center; }
  /* the itinerary reads in two chronological columns — half the scroll.
     Scoped to .seq.cols2 (7 rows): C's merged 11-row timeline stays single. */
  #sequence .seq.cols2 { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: repeat(4, auto); grid-auto-flow: column; column-gap: 56px; border-top: 0; }
  #sequence .seq.cols2 .row:nth-child(1), #sequence .seq.cols2 .row:nth-child(5) { border-top: 1px solid rgba(255,255,255,0.14); }
  /* F: the vessel spec block must not spend a viewport on empty sky */
  .vessel.no-band { padding-top: clamp(56px, 8vh, 96px); }
  .vessel > .container { margin-top: 0; }
}

@media (max-width: 760px) {
  .row, .cd, .li { grid-template-columns: 1fr; gap: 6px; }
}