/* ===== Stage (композиция телефон+текст, 1440x760, масштаб ≤100%) =====
     Меню и сайдбар больше НЕ внутри сцены — это отдельные position:fixed
     элементы в реальных пикселях (см. ниже), всегда прижатые к истинным
     краям экрана. #stage — то, что под меню: сама композиция.

     Масштаб теперь ограничен сверху единицей (см. js/stage.js) — контент
     никогда не увеличивается сверх нативного 1440px размера, только
     уменьшается на маленьких экранах. Поэтому stage-wrap может себе
     позволить max-width:1920px и центрирование — на экранах шире 1920
     лишнее место просто остаётся жёлтым полем по бокам.

     align-items:flex-start + transform-origin:center top — холст всегда
     начинается сразу под меню, без случайного зазора сверху (см. историю
     багов с center-center origin, когда при масштабе >1 контент уезжал
     за пределы экрана; сейчас, с потолком масштаба =1, тот баг физически
     невозможен, но top-anchoring оставляем — так поведение предсказуемее). */
  .stage-wrap{
    /* top:0 (не var(--header-h)) + padding-top:var(--header-h) — раньше было
       наоборот (top:var(--header-h), без padding), из-за чего собственная
       граница обрезки (overflow:hidden) стояла ровно под хедером: всё, что
       физически вылезает выше верха #stage (напр. .color-back — у него
       отрицательный top по дизайну, см. .color-back ниже), резалось жёстким
       швом прямо под хедером — и хедеру (см. .menubar-blur-layer, там же
       прогрессивный блюр) было physически нечего размывать. padding-top
       двигает ТОЛЬКО #stage (это flex-item, padding контейнера сдвигает его
       корректно) — визуально #stage остаётся ровно там же, где и был. Итог:
       сам холст визуально не сдвинулся ни на пиксель, просто overflow:hidden
       теперь стоит на истинном краю экрана (0), а не на границе хедера —
       ровно как уже сделано слева/снизу. Водная система слайда 3 (включая
       .cost-bleed) с тех пор убрана целиком (см. js/slide3-cost.js) — этот
       layout-приём остаётся, он нужен и для .color-back независимо от воды. */
    position:fixed; top:0; padding-top:var(--header-h); left:50%; bottom:0;
    width:100%; max-width:1920px;
    transform:translateX(-50%);
    display:flex; align-items:flex-start; justify-content:center;
    background:var(--yellow);
    overflow:hidden;
  }
  /* Высота #stage/#slide-track/.slide — не константа 760px, а выставляется
     из js/stage.js под фактическую доступную высоту экрана (см. комментарий
     там). 760px здесь — только запасное значение до первого fitStage(). */
  #stage{
    position:relative;
    width:1440px; height:760px;
    background:var(--yellow);
    /* БЕЗ overflow:hidden (было раньше) — ровно поэтому .color-back после
       увеличений (938.34×1172.34, left:-153.67/top:-173.67, см. правило
       .color-back ниже) обрезался жёстким швом слева/сверху: его отрицательный
       left/top уходил ЗА границу #stage (x=0/y=0), а у #stage была своя
       overflow:hidden граница ИМЕННО там — визуально ВНУТРИ жёлтого поля
       (margin между #stage 1440px и .stage-wrap до 1920px), а не на истинном
       краю страницы, поэтому шов был заметен. Клиппинг слайдов (переключение
       1/2/3 снэп-скроллом) теперь на #slide-viewport (см. ниже, отдельная
       обёртка вокруг #slide-track с ТЕМИ ЖЕ границами, что раньше были у
       #stage) — поведение скролла не меняется. Единственная оставшаяся
       граница обрезки для .color-back/.phone-frame (слайд 3, см.
       js/phone-shared.js BASE_PHONE/SLIDE3_PHONE) — overflow:hidden у
       .stage-wrap: он ВСЕГДА физически совпадает с краями #stage по top/
       bottom (stage-wrap.height = #stage.height по построению, см.
       js/stage.js) и по left/right либо тоже совпадает (viewport≤1920 —
       .stage-wrap растянут на всю ширину экрана), либо даёт запас ≥240px
       (viewport>1920, .stage-wrap центрирован с потолком 1920) — в обоих
       случаях бесшовно (тот же жёлтый фон вплоть до истинного края
       страницы, где обрежет html,body{overflow:hidden}), никакого
       регресса для слайда 3 (2000px "запас" рамки снизу по-прежнему
       обрезается — просто теперь границей .stage-wrap, а не #stage,
       что физически то же самое место).
       transform-origin:center top; */
    transform-origin:center top;
    flex-shrink:0;
  }
  /* Композиция (телефон+текст) вертикально центрируется в свободном месте
     через translateY, который выставляет js/stage.js: offset = (slideH-760)/2.
     inset:0 — та же система координат, что и раньше была у #stage напрямую,
     phone-shared/slide-track ничего менять не нужно. */
  #stage-content{ position:absolute; inset:0; }