/* v25 — вёрстка компьютера (html[data-layout="d"]): герой в две колонки (текст | изделие),
   фильм — широкая сцена (слева огромный таймкод и «До/Після», справа переписка),
   «після» — 3D липнет слева, станции листаются справа. */

[data-layout="d"] .top { max-width: 1280px; margin: 0 auto; padding: 18px 32px; }

[data-layout="d"] .hero { max-width: 1280px; margin: 0 auto; padding: 12px 32px 56px; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 48px; align-items: center; min-height: min(760px, calc(100vh - 72px)); }
[data-layout="d"] .h1 { font-size: clamp(52px, 5.6vw, 84px); margin-bottom: 22px; }
[data-layout="d"] .lead { font-size: 19px; max-width: 32em; margin: 0 0 26px; }
[data-layout="d"] .hero-frame { flex: none; aspect-ratio: 1 / 1; max-height: calc(100vh - 150px); }
[data-layout="d"] .orbit .ob0 { top: 22px; left: 22px; }
[data-layout="d"] .orbit .ob1 { top: 22px; right: 22px; }

[data-layout="d"] .film { height: 380vh; }
[data-layout="d"] .film-stick { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: auto auto 1fr auto; column-gap: 56px; padding: 40px max(32px, calc((100vw - 1216px) / 2)) 40px; }
[data-layout="d"] .film-top { grid-column: 1; grid-row: 1; }
[data-layout="d"] .tc { font-size: clamp(72px, 8vw, 128px); }
[data-layout="d"] .bigword { grid-column: 1; grid-row: 2; font-size: clamp(96px, 12vw, 180px); margin-top: 8px; }
[data-layout="d"] .bubs { grid-column: 2; grid-row: 1 / 5; align-self: center; gap: 10px; }
[data-layout="d"] .bub { font-size: 19px; padding: 10px 16px; }
[data-layout="d"] .film-cap { grid-column: 1; grid-row: 4; font-size: 18px; max-width: 28em; }
[data-layout="d"] .film-end { left: 50%; right: max(32px, calc((100vw - 1216px) / 2)); top: 50%; transform: translateY(-50%); }
[data-layout="d"] .film-end .end1 { font-size: clamp(40px, 4vw, 60px); }
[data-layout="d"] .film-end .end2 { font-size: 19px; }
[data-layout="d"] .film.static .film-stick { grid-template-rows: auto auto auto auto; }
[data-layout="d"] .film.static .film-end { grid-column: 1 / 3; margin-top: 24px; }

[data-layout="d"] .after { max-width: 1280px; margin: 0 auto; padding: 96px 32px 40px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 56px; row-gap: 88px; }
[data-layout="d"] .stagebox { grid-column: 1; grid-row: 1 / span 4; position: sticky; top: 24px; align-self: start; }
[data-layout="d"] .stage { height: min(50vh, 560px); min-height: 300px; }
[data-layout="d"] .st { grid-column: 2; }
[data-layout="d"] .st h2 { font-size: clamp(34px, 3.4vw, 46px); }
[data-layout="d"] .st-p { font-size: 17px; }

[data-layout="d"] .one, [data-layout="d"] .easy, [data-layout="d"] .pilot { max-width: 1280px; margin: 0 auto; padding: 72px 32px 16px; }
[data-layout="d"] .one h2, [data-layout="d"] .easy h2, [data-layout="d"] .pilot h2 { font-size: clamp(36px, 3.6vw, 52px); max-width: 18em; }
[data-layout="d"] .pilot h2 { margin-left: auto; margin-right: auto; }
[data-layout="d"] .tiles { grid-template-columns: repeat(4, minmax(0, 1fr)); }
[data-layout="d"] .tile { padding: 64px 18px 20px; }
[data-layout="d"] .steps { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
[data-layout="d"] .pilot { padding-bottom: 88px; }
[data-layout="d"] .foot { max-width: 1280px; margin: 0 auto; padding: 28px 32px 48px; }

[data-layout="d"] .sticky { right: 24px; bottom: 24px; padding: 0 26px; font-size: 16px; }