/* ═══════════════════════════════════════════════════════════════════
   Клуб «СТАТУС» — эскиз первого экрана, образ «Статус 3»: станция на ближней орбите. 23.10.2026.
   Слои обложки — как у «Спирали»: сцена (3D) → огромное имя в ореоле солнца → экипаж.
   Цвета — сталь и бронза клуба (08_Портал_подписка/sayt/sistema.css); новое — бездна глубже фона
   (#03050a), свет солнца (тёплый белый) и свет иллюминаторов. Текст — Golos, имя — Unbounded.
   ═══════════════════════════════════════════════════════════════════ */

@font-face{font-family:'Unbounded';font-style:normal;font-weight:200 900;font-display:swap;
  src:url('../shrift/Unbounded-kirillica.woff2') format('woff2');
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Unbounded';font-style:normal;font-weight:200 900;font-display:swap;
  src:url('../shrift/Unbounded-latinica.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+20BD,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD,U+2190-21FF}
@font-face{font-family:'Golos';font-style:normal;font-weight:400 900;font-display:swap;
  src:url('../shrift/GolosText-kirillica.woff2') format('woff2');
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Golos';font-style:normal;font-weight:400 900;font-display:swap;
  src:url('../shrift/GolosText-latinica.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+20BD,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD,U+2190-21FF}

/* ── 1. Токены ───────────────────────────────────────────────────── */
:root{
  --bezdna:#03050a;          /* бездна — глубже фона клуба */
  --fon:#070c15;             /* sistema.css: самый глубокий слой */
  --fon-2:#0b1220;
  --poverhnost:#101a2e;
  --liniya:rgba(142,160,196,.16);
  --liniya-2:rgba(142,160,196,.28);
  --tekst:#eee6d8;           /* тёплый кремовый, не белый */
  --tekst-2:#a8b4ca;
  --tekst-3:#7a869e;
  --bronza:#c08b41;
  --bronza-sv:#e6bb7d;
  --bronza-tmn:#8a6229;
  --bronza-tush:rgba(192,139,65,.13);
  --bronza-dym:rgba(192,139,65,.34);
  --stal:#a9bfd9;            /* холодная искра — только точками */
  --solnce:#fff1dc;          /* свет солнца и иллюминаторов */
  --na-bronze:#1b1306;

  --shrift-zag:'Unbounded',-apple-system,BlinkMacSystemFont,sans-serif;
  --shrift:'Golos',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --polya:clamp(16px,3.9vw,56px);
  --plavno:300ms cubic-bezier(.22,.61,.36,1);
  --bystro:160ms cubic-bezier(.22,.61,.36,1);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;background:var(--bezdna)}
body{margin:0;background:var(--bezdna);color:var(--tekst);font-family:var(--shrift);font-size:17px;line-height:1.58;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}
h1,h2,h3,p,ol,ul{margin:0;padding:0}
ol,ul{list-style:none}
h1,h2,h3{font-family:var(--shrift-zag);font-weight:300;line-height:1.08;text-wrap:balance}
h2{font:300 clamp(30px,4vw,58px)/1.06 var(--shrift-zag)}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
img{display:block;max-width:none}
b{font-weight:600;color:var(--tekst)}
em{font-style:normal;color:var(--bronza-sv)}
.akc{font-weight:800;letter-spacing:-.032em}
.cifry{font-variant-numeric:tabular-nums lining-nums}
a:focus-visible,button:focus-visible{outline:2px solid var(--bronza-sv);outline-offset:3px}

.metka{display:flex;align-items:center;gap:12px;font:600 11.5px/1.35 var(--shrift-zag);letter-spacing:.2em;
  text-transform:uppercase;color:var(--bronza-sv)}
.metka::before{content:"";width:6px;height:6px;border-radius:50%;flex:none;background:var(--bronza-sv);box-shadow:0 0 10px var(--bronza)}
.metka.tihaya{color:var(--tekst-3)}
.metka.tihaya::before{background:var(--tekst-3);box-shadow:none}

/* Кнопка — полированная бронза: блик по верхней кромке. */
.knopka{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:54px;padding:0 26px;
  border:1px solid transparent;border-radius:12px;cursor:pointer;white-space:nowrap;
  font:700 12.5px/1 var(--shrift-zag);letter-spacing:.1em;text-transform:uppercase;
  background:linear-gradient(180deg,#f3d6a6 0,#e6bb7d 14%,#c99549 60%,#b37e36 100%);color:var(--na-bronze);
  box-shadow:0 1px 0 rgba(255,244,222,.75) inset,0 0 0 1px rgba(255,226,180,.18) inset,0 14px 36px -12px rgba(192,139,65,.75);
  transition:transform 260ms cubic-bezier(.2,.8,.2,1),box-shadow var(--plavno),filter var(--bystro)}
.knopka:hover{transform:translateY(-2px);filter:brightness(1.06)}
.knopka .strelka{display:inline-block;transition:transform var(--bystro)}
.knopka:hover .strelka{transform:translateX(4px)}
.knopka.tekst{background:none;box-shadow:none;color:var(--tekst);padding:0;font-size:11.5px}
.knopka.tekst span{border-bottom:1px solid var(--liniya-2);padding-bottom:4px}
.knopka.malaya{min-height:40px;padding:0 16px;font-size:11px;border-radius:10px}

/* ── 2. Слои фона ────────────────────────────────────────────────── */
#scena{position:fixed;inset:0;width:100%;height:100%;z-index:0;display:block;pointer-events:none;opacity:0;transition:opacity 1.2s ease-out}
#scena.gotova{opacity:1}
.snimok #scena{transition:none}
/* Без WebGL: снимок той же сцены (люди и текст остаются HTML поверх). */
/* 25.10 (проверка v5 🟡 7): кадр обложки фоном — виден сразу, до запуска скриптов (на плохой сети первые 5 с были
   чёрными). Холст фильма (#kino) ложится сверху. При ?bezkino — не показываем, там живое 3D. */
.fon-oblozhki{position:fixed;left:0;top:0;right:0;height:100vh;height:100lvh;z-index:0;pointer-events:none;background-color:#03050a;
  /* под резким кадром — крошечная размытая копия прямо в стилях (≈1 КБ): видна сразу, пока кадр догружается */
  background-image:url(../kino/kadry/oblozhka_gor/oblozhka-v6.jpg),url(data:image/webp;base64,UklGRg4BAABXRUJQVlA4IAIBAAAwBwCdASowABsAPsFSoUsnpKMhqqwA8BgJQBUk8af3T/gJ/SpQuZGYYfs+9uXtvAnVGEhZ9BN1YmK5BpPBlsj8kDAA/uoHrz4nUNxT3QmSm+DfD+fEAXKGu+Kq4cX/+TIgYkwJSF6ADp8fG7bKJ9qvjemTbd+xIr6vjWOnQXQsA8n3C9ytmU9EM6fjwFBD7h7dyNBGpcxcs/ZQas0A6kupNkaYPaez7MVIAD9jIAeCs0AcsIHu29nRqonRAx+GsfySFpTpHfmZu0+myFAvwejnXsdwLOsdr4bowb+Niuo6tTxtsGCPhfuFAC6lZACg9RVkKSxaUTG1RYxnMobWY0AAAAA=);
  background-image:image-set(url(../kino/kadry/oblozhka_gor/oblozhka-v6.avif) type("image/avif"),url(../kino/kadry/oblozhka_gor/oblozhka-v6.jpg) type("image/jpeg")),url(data:image/webp;base64,UklGRg4BAABXRUJQVlA4IAIBAAAwBwCdASowABsAPsFSoUsnpKMhqqwA8BgJQBUk8af3T/gJ/SpQuZGYYfs+9uXtvAnVGEhZ9BN1YmK5BpPBlsj8kDAA/uoHrz4nUNxT3QmSm+DfD+fEAXKGu+Kq4cX/+TIgYkwJSF6ADp8fG7bKJ9qvjemTbd+xIr6vjWOnQXQsA8n3C9ytmU9EM6fjwFBD7h7dyNBGpcxcs/ZQas0A6kupNkaYPaez7MVIAD9jIAeCs0AcsIHu29nRqonRAx+GsfySFpTpHfmZu0+myFAvwejnXsdwLOsdr4bowb+Niuo6tTxtsGCPhfuFAC6lZACg9RVkKSxaUTG1RYxnMobWY0AAAAA=);
  background-size:cover;background-position:50% 50%;background-repeat:no-repeat}
@media (max-width:760px){.fon-oblozhki{background-image:url(../kino/kadry/oblozhka_vert/oblozhka-v6.jpg),url(data:image/webp;base64,UklGRsoAAABXRUJQVlA4IL4AAADQBgCdASobADAAPrVCm0qnI6IhtVv8AOAWiWIAuE1/4Bnz/4L1V03BSGX0fbtdVt0/7QiTI6gSXEYUtx6y2IAA/v0EYk9N34MSIJ+AsMAiIvGQKDvM2W6sKqQz7sfFhjLdKF8e+MM9JuFPW3w2OGnEXrPsf1RE29r69XzkeYe88myRnNMDjDMR4kvtnVRVeIo1z+/8tdK868fxX8YLr7NCAPtgIzH90+0tEoOH8xK3fSwykP/JfXSlaYffS7AA);
  background-image:image-set(url(../kino/kadry/oblozhka_vert/oblozhka-v6.avif) type("image/avif"),url(../kino/kadry/oblozhka_vert/oblozhka-v6.jpg) type("image/jpeg")),url(data:image/webp;base64,UklGRsoAAABXRUJQVlA4IL4AAADQBgCdASobADAAPrVCm0qnI6IhtVv8AOAWiWIAuE1/4Bnz/4L1V03BSGX0fbtdVt0/7QiTI6gSXEYUtx6y2IAA/v0EYk9N34MSIJ+AsMAiIvGQKDvM2W6sKqQz7sfFhjLdKF8e+MM9JuFPW3w2OGnEXrPsf1RE29r69XzkeYe88myRnNMDjDMR4kvtnVRVeIo1z+/8tdK868fxX8YLr7NCAPtgIzH90+0tEoOH8xK3fSwykP/JfXSlaYffS7AA)}}
html.bezkino .fon-oblozhki{display:none}
.zapas{position:fixed;inset:0;z-index:0;display:none;pointer-events:none;
  background:url(../kartinki/zapas-1440.webp) center 0/cover no-repeat,
    radial-gradient(60% 40% at 50% 26%,rgba(255,214,160,.5) 0,rgba(192,139,65,.12) 30%,rgba(3,5,10,0) 60%),var(--bezdna)}
html.bez-3d .zapas{display:block}
html.bez-3d #scena{display:none}

/* Виньетка бездны + тень под колонками текста. */
.vin{position:fixed;inset:0;z-index:1;pointer-events:none;
  /* 25.10, Игорь: «над и под СТАТУС видны слои и линии, тон неоднородный» — прежние линейные переходы с изломами
     (29 %, 37 %, 66 %, 75 %, 13 %) давали на светлом небе ESO прямоугольник с ровными краями. Теперь каждый переход —
     гладкая кривая (smootherstep, по 9 точек): затемнение без видимых границ. */
  background:
    radial-gradient(130% 110% at 50% 38%,rgba(3,5,10,0.000) 48.0%,rgba(3,5,10,0.007) 54.5%,rgba(3,5,10,0.043) 61.0%,rgba(3,5,10,0.116) 67.5%,rgba(3,5,10,0.210) 74.0%,rgba(3,5,10,0.304) 80.5%,rgba(3,5,10,0.377) 87.0%,rgba(3,5,10,0.413) 93.5%,rgba(3,5,10,0.420) 100.0%),
    linear-gradient(90deg,rgba(3,5,10,0.660) 0.0%,rgba(3,5,10,0.649) 5.8%,rgba(3,5,10,0.592) 11.5%,rgba(3,5,10,0.478) 17.2%,rgba(3,5,10,0.330) 23.0%,rgba(3,5,10,0.182) 28.8%,rgba(3,5,10,0.068) 34.5%,rgba(3,5,10,0.011) 40.2%,rgba(3,5,10,0.000) 46.0%,rgba(3,5,10,0.000) 58.0%,rgba(3,5,10,0.008) 63.2%,rgba(3,5,10,0.054) 68.5%,rgba(3,5,10,0.143) 73.8%,rgba(3,5,10,0.260) 79.0%,rgba(3,5,10,0.377) 84.2%,rgba(3,5,10,0.466) 89.5%,rgba(3,5,10,0.512) 94.8%,rgba(3,5,10,0.520) 100.0%),
    linear-gradient(180deg,rgba(3,5,10,0.550) 0.0%,rgba(3,5,10,0.541) 2.5%,rgba(3,5,10,0.493) 5.0%,rgba(3,5,10,0.399) 7.5%,rgba(3,5,10,0.275) 10.0%,rgba(3,5,10,0.151) 12.5%,rgba(3,5,10,0.057) 15.0%,rgba(3,5,10,0.009) 17.5%,rgba(3,5,10,0.000) 20.0%,rgba(3,5,10,0.000) 68.0%,rgba(3,5,10,0.010) 72.0%,rgba(3,5,10,0.064) 76.0%,rgba(3,5,10,0.171) 80.0%,rgba(3,5,10,0.310) 84.0%,rgba(3,5,10,0.449) 88.0%,rgba(3,5,10,0.556) 92.0%,rgba(3,5,10,0.610) 96.0%,rgba(3,5,10,0.620) 100.0%);
  opacity:calc(1 - var(--vin-ub,0))}
/* Зерно плёнки — неподвижное, еле заметное: снимает «компьютерную» чистоту. */
.zerno{position:fixed;inset:0;z-index:2;pointer-events:none;opacity:.55;background-size:160px 160px}
/* «Меньше движения»: смена кадра — наплывом через тёмное. */
.naplyv{position:fixed;inset:0;z-index:3;pointer-events:none;background:var(--bezdna);opacity:0}
.naplyv.idet{animation:naplyv .9s ease-out both}
@keyframes naplyv{0%{opacity:1}100%{opacity:0}}
main,.podval{position:relative;z-index:4}
/* Вход в атмосферу: тёплая дымка по краям (обложка → старт) и облака, проносящиеся мимо. Силу задаёт stranica.js. */
.dymka{position:fixed;inset:0;z-index:5;pointer-events:none;opacity:var(--dymka,0);
  background:radial-gradient(78% 70% at 50% 46%,rgba(255,170,100,0) 46%,rgba(255,140,70,.28) 76%,rgba(255,110,50,.72) 100%)}
/* Вуаль-туман на стыке обложки и старта (24.10, графика 2): цвет плотного ночного облака из 3D-спуска; под текстом.
   Светлые пряди расходятся от центра, пока вуаль тает (--obl-z) — пролёт сквозь облако к столу. */
/* 25.10: обе стороны стыка теперь фильм — вуаль не прячет 3D, а делает быстрый тёмный «монтажный» переход:
   тёмно-синяя, почти бездна (светло-серая читалась как незагрузившийся экран). */
.oblaka-let{position:fixed;inset:0;z-index:3;pointer-events:none;opacity:var(--oblaka,0);overflow:hidden;
  background:radial-gradient(120% 90% at 50% 60%,#161d2b 0,#0d121b 50%,#05080d 100%)}
.oblaka-let i{position:absolute;left:50%;top:56%;width:96vmax;height:58vmax;margin:-29vmax 0 0 -48vmax;border-radius:50%;
  background:radial-gradient(closest-side,rgba(120,132,156,.09),rgba(90,102,126,.04) 56%,rgba(0,0,0,0));   /* пряди тише: тёмный туман, не серый экран */
  transform:translate3d(calc(var(--ox) * (1 + var(--obl-z,0) * 3)),calc(var(--oy) * (1 + var(--obl-z,0) * 3)),0) scale(calc(1 + var(--obl-z,0) * var(--k)))}
.oblaka-let i:nth-child(1){--ox:-14vw;--oy:-12vh;--k:1.6}
.oblaka-let i:nth-child(2){--ox:16vw;--oy:-4vh;--k:2.2;width:80vmax}
.oblaka-let i:nth-child(3){--ox:-10vw;--oy:14vh;--k:1.9}
.oblaka-let i:nth-child(4){--ox:12vw;--oy:18vh;--k:1.3;height:44vmax}
.vspyshka{position:fixed;inset:0;z-index:6;pointer-events:none;background:#fff6e8;opacity:var(--vspyshka,0)}

/* ── 3. Шапка ────────────────────────────────────────────────────── */
.shapka{position:fixed;top:0;left:0;right:0;z-index:30;height:72px;display:flex;align-items:center;gap:28px;
  padding:0 var(--polya)}
/* 26.10, третий критик: градиент фоном не анимируется — подложка включалась скачком, а текст страницы читался
   на уровне логотипа. Подложка — отдельным слоем с плавной прозрачностью и ниже самой шапки. */
.shapka::before{content:"";position:absolute;left:0;right:0;top:0;height:150%;z-index:-1;pointer-events:none;
  background:linear-gradient(180deg,rgba(3,5,10,.99) 0,rgba(3,5,10,.975) 64%,rgba(3,5,10,0));opacity:0;transition:opacity calc(.35s * var(--zamedl,1)) ease}
.shapka.temno::before{opacity:1}
.logo{display:flex;align-items:center;gap:12px;font:700 15px/1 var(--shrift-zag);letter-spacing:.3em;text-transform:uppercase}
.logo svg{width:24px;height:24px;flex:none;fill:none;stroke:var(--bronza-sv);stroke-width:1.4;filter:drop-shadow(0 0 5px rgba(230,187,125,.5))}
.logo svg circle{fill:#141b27}
.logo svg .tochka{fill:var(--solnce);stroke:none}
.dveri{display:flex;padding:3px;border:1px solid var(--liniya);border-radius:10px;background:rgba(3,5,10,.45)}
.dver{font:500 10.5px/1 var(--shrift-zag);letter-spacing:.14em;text-transform:uppercase;color:var(--tekst-3);padding:8px 12px;border-radius:7px}
.dver.akt{color:var(--tekst);background:var(--bronza-tush);box-shadow:inset 0 0 0 1px var(--bronza-dym)}
.menyu{display:flex;gap:28px;margin-left:auto;font:500 11.5px/1 var(--shrift-zag);letter-spacing:.15em;text-transform:uppercase;color:var(--tekst-2)}
.menyu a{padding:8px 0}
.burger{display:none;margin-left:auto;width:44px;height:44px;border-radius:50%;border:1px solid var(--liniya-2);background:rgba(3,5,10,.5);position:relative;cursor:pointer}
.burger i{position:absolute;left:14px;right:14px;height:1.5px;background:var(--tekst)}
.burger i:first-child{top:18px}.burger i:last-child{top:25px}

/* ═══ 4. ОБЛОЖКА ═════════════════════════════════════════════════ */
.oblozhka{position:relative;height:150vh;--p:0;--mx:0;--my:0;--poyav:1}   /* 29.10: было 200vh — «сразу после последней буквы — запуск» */
/* 29.10, четвёртый критик: до первого кадра скрипта текст обложки виден (--poyav:1), потом гаснет и проявляется снова —
   при включённом скрипте начинаем с нуля, скрипт сам проявит (в снимках и «тихо» — сразу 1) */
html.js .oblozhka{--poyav:0}
.obl-lipkiy{position:sticky;top:0;height:100vh;height:100svh;min-height:700px;overflow:hidden}
/* Холст растворения имени: поверх имени, под людьми. Рисует stranica.js. */
.rastvor{position:absolute;inset:0;z-index:1;width:100%;height:100%;pointer-events:none;display:none}
.obl-lipkiy.rastvor-idet .rastvor{display:block}
.obl-lipkiy.rastvor-idet .titul-slovo,.obl-lipkiy.rastvor-konec .titul{opacity:0}
/* 25.10: ореол за именем гаснет быстро — иначе на месте сгоревших букв висит мутная тень */
.obl-lipkiy.rastvor-idet .titul-svet{opacity:calc((1 - var(--p)*5) * .95)}
html.tiho .titul,.obl-lipkiy.bez-rastvora .titul{opacity:calc((1 - var(--p)*1.35) * var(--poyav))}
.vypusk{position:absolute;left:var(--polya);right:var(--polya);top:var(--vypusk-y,84px);display:flex;justify-content:space-between;
  gap:20px;padding-top:12px;border-top:1px solid var(--liniya);
  font:500 11px/1.2 var(--shrift-zag);letter-spacing:.22em;text-transform:uppercase;color:var(--tekst-3);opacity:calc((1 - var(--p)*2.2) * var(--poyav))}
.vypusk b{color:var(--tekst-2);font-weight:500}

/* Имя: тёмный металл, кромки букв горят бронзой от солнца сзади; ореол солнца обтекает буквы
   (размытая светлая копия под ними, сгущается к точке, где солнце спрятано за модулем).
   На первой прокрутке гаснет — то же имя вспыхивает эмалью на борту станции. */
.titul{position:absolute;left:0;right:0;top:var(--titul-y,104px);z-index:1;display:grid;justify-items:center;
  font:800 var(--titul-kegl,17vw)/.8 var(--shrift-zag);white-space:nowrap;
  transform:translate3d(var(--titul-dx,0px),0,0);will-change:transform;
  opacity:var(--poyav)}
.titul-svet{opacity:calc((1 - var(--p)*2.2) * .95)}
.titul>span{grid-area:1/1;display:inline-block;letter-spacing:-.04em;margin-right:-.04em}
.titul-slovo{
  background:linear-gradient(180deg,#fff2dc 0%,#efd3a6 4.5%,#8a7556 10%,#2c3240 21%,#161c28 52%,#0b1019 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 0 1.1px rgba(255,232,196,.8)) drop-shadow(0 0 24px rgba(255,206,146,.26))}
.titul-svet{color:#ffe1b4;filter:blur(var(--svet-blur,16px));
  -webkit-mask-image:radial-gradient(ellipse 34% 170% at var(--ok-x,50%) var(--ok-y,66%),#000 0,rgba(0,0,0,.6) 40%,transparent 100%);
  mask-image:radial-gradient(ellipse 34% 170% at var(--ok-x,50%) var(--ok-y,66%),#000 0,rgba(0,0,0,.6) 40%,transparent 100%)}
/* 25.10, Игорь: «слово выглядит менее качественно, чем остальная графика» → имя — металлическая картинка
   (kino/titul_metall.py: тёмный шлифованный титан, фаска — золото к рассвету, серебро к звёздам). Текст остаётся
   в разметке для поиска и экранного чтения, но прозрачный; мутный ореол убран. */
.titul-slovo{background:none!important;-webkit-background-clip:border-box!important;background-clip:border-box!important;color:transparent!important;filter:none!important}
/* 25.10 вечер: «.titul>span{display:inline-block}» сильнее «.titul-svet{display:none}» — свечение оставалось видно:
   светлая полоса с прямыми краями сверху и снизу имени. Теперь гасим наверняка. */
.titul .titul-svet,.titul>.titul-svet{display:none!important}
.titul-img{position:absolute;z-index:1;left:var(--ti-x,40px);top:var(--ti-y,110px);width:var(--ti-w,calc(100% - 80px));height:var(--ti-h,auto);
  max-width:none;pointer-events:none;user-select:none;opacity:var(--poyav);
  filter:drop-shadow(0 8px 14px rgba(3,5,10,.42))}   /* 25.10: без тёмной обводки 1 px — она давала контур «наклейки» */
.obl-lipkiy.rastvor-idet .titul-img,.obl-lipkiy.rastvor-konec .titul-img{opacity:0}
html.tiho .titul-img,.obl-lipkiy.bez-rastvora .titul-img{opacity:calc((1 - var(--p)*1.35) * var(--poyav))}

/* Экипаж — пара в центре, равные. Кайма солнца на волосах и плечах запечена из маски вырезки. */
/* 25.10 (художник № 3, 8; проверка v5 🔴 1): люди не просвечивают — низ тел уходит в плотную тёмную подложку;
   по прокрутке пара темнеет и уходит вниз к доле ≈0,11 (не «наклейкой» поверх Земли), имя рассыпается за спиной. */
.lyudi{position:absolute;inset:0;z-index:2;pointer-events:none;--tuman-dl:240px;
  transform:translate3d(calc(var(--mx)*-10px),calc(var(--p)*300px + var(--my)*-6px),0);will-change:transform;
  opacity:calc(var(--ly-op,1) * var(--poyav));filter:brightness(calc(1 - var(--p)*2.5));
  -webkit-mask-image:linear-gradient(180deg,#000 0,#000 var(--tuman-y,64%),rgba(0,0,0,.35) calc(var(--tuman-y,64%) + var(--tuman-dl)*.52),transparent calc(var(--tuman-y,64%) + var(--tuman-dl)));
  mask-image:linear-gradient(180deg,#000 0,#000 var(--tuman-y,64%),rgba(0,0,0,.35) calc(var(--tuman-y,64%) + var(--tuman-dl)*.52),transparent calc(var(--tuman-y,64%) + var(--tuman-dl)))}
.chel{position:absolute}
.chel img{position:absolute;inset:0;width:100%;height:100%;user-select:none;-webkit-user-drag:none}
.chel img:first-child{
  filter:brightness(.8) contrast(1.06) saturate(.84) drop-shadow(0 -1px 0 rgba(255,222,178,.35)) drop-shadow(0 -10px 18px rgba(255,200,140,.12)) drop-shadow(0 30px 60px rgba(3,5,10,.75))}
/* Кайма солнца — только справа: в кадре обложки солнце встаёт на правом краю горизонта (художник, № 3, 17). */
.chel .kayma{mix-blend-mode:screen;opacity:1;
  -webkit-mask-image:linear-gradient(90deg,transparent 38%,#000 82%);mask-image:linear-gradient(90deg,transparent 38%,#000 82%)}
/* Правое плечо Максима — край фото ровной линией (столбец 591 из 628, 5,9 % от правого края): растушёвываем край в тень.
   26.10 вечер: при прежних «прозрачно 0 → плотно 28 %» у линии оставалось ~20 % плотности — на светлой атмосфере Земли
   читалась вертикальная граница. Теперь до 7 % от края — ноль, дальше плавный набор к 36 %. */
/* 26.10, третий критик (компьютер): спад только по горизонтали давал прямую вертикальную границу на светлой Земле.
   Добавлен эллипс (--plecho): плечо уходит в тень по округлой линии силуэта, к низу — раньше. */
.chel-maksim{--plecho:radial-gradient(74% 88% at 20% 30%,#000 62%,rgba(0,0,0,.55) 80%,transparent 100%)}
.chel-maksim img:first-child{
  /* 29.10, критик компьютера: у Максима светлая обводка по макушке — без тонкой подсветки 1 px (у Игоря она не мешает) */
  filter:brightness(.8) contrast(1.06) saturate(.84) drop-shadow(0 -10px 18px rgba(255,200,140,.12)) drop-shadow(0 30px 60px rgba(3,5,10,.75))}
.chel-maksim img{
  -webkit-mask-image:linear-gradient(270deg,transparent 0,transparent 7%,rgba(0,0,0,.22) 15%,rgba(0,0,0,.6) 25%,#000 36%),var(--plecho);-webkit-mask-composite:source-in;
  mask-image:linear-gradient(270deg,transparent 0,transparent 7%,rgba(0,0,0,.22) 15%,rgba(0,0,0,.6) 25%,#000 36%),var(--plecho);mask-composite:intersect}
/* Портретный свет: тёплый справа (солнце у горизонта), холодная тень станции слева и снизу. */
.chel::after{content:"";position:absolute;inset:0;pointer-events:none;mix-blend-mode:soft-light;
  background:linear-gradient(100deg,rgba(14,24,44,.42) 0,rgba(20,32,54,0) 38%,rgba(255,220,180,0) 58%,rgba(255,226,186,.55) 100%),
    linear-gradient(180deg,rgba(255,226,186,.18) 0,rgba(255,220,180,0) 22%,rgba(20,32,54,0) 50%,rgba(14,24,44,.5) 85%);
  -webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}
.chel-igor::after{-webkit-mask-image:url(../kartinki/igor-chernyy5.webp);mask-image:url(../kartinki/igor-chernyy5.webp)}
.chel-maksim::after{-webkit-mask-image:url(../kartinki/maksim-chernyy2.webp);mask-image:url(../kartinki/maksim-chernyy2.webp)}
/* 26.10 вечер, критик (телефон): фото плеча растворялось, а тёплая подсветка (::after) и кайма поверх него — нет,
   и доходили до обрезанного края молочной полосой с вертикальной границей. Тот же спад к правому краю — и им. */
.chel-maksim::after{
  -webkit-mask-image:url(../kartinki/maksim-chernyy2.webp),linear-gradient(270deg,transparent 0,transparent 7%,rgba(0,0,0,.22) 15%,rgba(0,0,0,.6) 25%,#000 36%),var(--plecho);
  -webkit-mask-composite:source-in;
  mask-image:url(../kartinki/maksim-chernyy2.webp),linear-gradient(270deg,transparent 0,transparent 7%,rgba(0,0,0,.22) 15%,rgba(0,0,0,.6) 25%,#000 36%),var(--plecho);
  mask-composite:intersect}
/* кайма Максима: её «справа» (.chel .kayma) × спад к краю фото — одной полосой */
.chel-maksim .kayma{
  -webkit-mask-image:linear-gradient(90deg,transparent 38%,rgba(0,0,0,.27) 50%,rgba(0,0,0,.59) 64%,rgba(0,0,0,.5) 75%,rgba(0,0,0,.33) 82%,rgba(0,0,0,.22) 85%,transparent 93%),var(--plecho);-webkit-mask-composite:source-in;
  mask-image:linear-gradient(90deg,transparent 38%,rgba(0,0,0,.27) 50%,rgba(0,0,0,.59) 64%,rgba(0,0,0,.5) 75%,rgba(0,0,0,.33) 82%,rgba(0,0,0,.22) 85%,transparent 93%),var(--plecho);mask-composite:intersect}
/* Тёмная подложка под экипажем: плотная полоса во всю ширину пары (края мягкие), набирает плотность ВЫШЕ места,
   где люди начинают таять (--tuman-y), — сквозь грудь не видно огней Земли. Идёт вместе с людьми.
   Ширина — от левого края Игоря до правого края Максима ± 70 px (stranica.js, --lyudi-l / --lyudi-r). */
.lyudi-ten{position:absolute;left:calc(var(--lyudi-l,30%) - 160px);width:calc(var(--lyudi-r,70%) - var(--lyudi-l,30%) + 320px);
  top:calc(var(--tuman-y,64%) - 60px);height:calc(100% - var(--tuman-y,64%) + 260px);z-index:2;pointer-events:none;
  /* мягкая тень-эллипс под экипажем (без прямоугольных краёв): низ фигур уходит в темноту, огни Земли сквозь них не видны */
  background:radial-gradient(50% 58% at 50% 62%,rgba(3,5,10,0.780) 0%,rgba(3,5,10,0.771) 11%,rgba(3,5,10,0.720) 22%,rgba(3,5,10,0.616) 33%,rgba(3,5,10,0.471) 44%,rgba(3,5,10,0.309) 56%,rgba(3,5,10,0.164) 67%,rgba(3,5,10,0.060) 78%,rgba(3,5,10,0.009) 89%,rgba(3,5,10,0.000) 100%);
  transform:translate3d(calc(var(--mx)*-10px),calc(var(--p)*300px + var(--my)*-6px),0);
  opacity:calc((1 - var(--p)*6) * var(--poyav))}
/* 29.10, критик компьютера: пара таяла целиком полупрозрачной («горизонт сквозь шеи»). Теперь фигуры опускаются
   (--ly-y, stranica.js) сквозь неподвижную линию тумана маски .lyudi — тонут в темноте снизу вверх, без прозрачности
   всей фигуры; гаснут (--ly-op), когда уже под линией. */
@media (min-width:761px){.lyudi .chel{transform:translate3d(0,var(--ly-y,0px),0)}}
html.tiho .lyudi .chel{transform:none!important}

.anons-glavnyy{position:absolute;z-index:3;left:var(--polya);top:var(--kolonki-y,330px);width:min(430px,30vw);
  transform:translate3d(0,calc(var(--p)*-110px),0);opacity:calc((1 - var(--p)*9) * var(--poyav));filter:brightness(calc(1 - var(--p)*6))}
/* Строка под именем — физика орбиты и суть клуба одной фразой. */
.deviz{display:flex;align-items:center;gap:14px;margin-bottom:20px;font:500 12px/1.4 var(--shrift-zag);letter-spacing:.17em;
  text-transform:uppercase;color:var(--bronza-sv);text-shadow:0 0 18px rgba(230,187,125,.25)}
.deviz::before{content:"";width:34px;height:1px;flex:none;background:linear-gradient(90deg,rgba(230,187,125,0),var(--bronza-sv));box-shadow:0 0 8px var(--bronza)}
.zag-glavnyy{font:300 clamp(24px,2.15vw,32px)/1.12 var(--shrift-zag);text-wrap:balance;text-shadow:0 2px 24px rgba(3,5,10,.7)}
.zag-glavnyy em{font-weight:800;letter-spacing:-.035em;color:var(--bronza-sv);text-shadow:0 0 34px rgba(230,187,125,.3)}
.lid{margin-top:20px;font-size:16px;line-height:1.6;color:var(--tekst-2)}
/* 29.10, критик компьютера: серый текст под заголовком лежал прямо на огнях городов — концы строк сливались */
@media (min-width:761px){
  .oblozhka .lid,.oblozhka .primechanie{text-shadow:0 1px 2px rgba(3,5,10,.95),0 0 10px rgba(3,5,10,.85),0 0 22px rgba(3,5,10,.65)}
  .anons-glavnyy::before{content:"";position:absolute;z-index:-1;inset:-70px -110px -70px -80px;pointer-events:none;
    background:radial-gradient(closest-side,rgba(3,5,10,.6),rgba(3,5,10,.42) 55%,rgba(3,5,10,0))}
}
.knopki{display:flex;flex-wrap:wrap;gap:8px 20px;margin-top:26px;align-items:center}
.primechanie{margin-top:12px;font-size:14px;color:var(--tekst-3)}
@media (min-width:761px){.oblozhka .primechanie{display:none}}

/* ── Панель на направляющих: «Три условия Банка России» ──
   Стальная плита едет по двум бронзовым направляющим из-за правого края; ползуны, винты, ручка с насечкой,
   лампа защёлки (горит, когда плита встала на упор). Движение — js/mehanika.js. */
.usloviya{position:absolute;z-index:3;right:0;top:calc(var(--kolonki-y,330px) - 30px);width:calc(var(--ya-w) + var(--polya));
  --ya-w:min(318px,22.5vw);padding:15px 0;
  transform:translate3d(0,calc(var(--p)*-80px),0);opacity:calc((1 - var(--p)*9) * var(--poyav));filter:brightness(calc(1 - var(--p)*6))}
.ya-relsy{position:absolute;left:-20px;right:0;top:0;bottom:0;pointer-events:none}
/* 29.10, критик: направляющие доходили до края экрана и перечёркивали вертикальную подпись ESO — кончаются раньше */
@media (min-width:761px){.ya-relsy{right:44px}}
.ya-rels{position:absolute;left:0;right:0;height:4px;border-radius:1px;
  background:linear-gradient(180deg,#e6bb7d 0,#a77a3a 35%,#4f3a1c 100%);box-shadow:0 1px 0 rgba(0,0,0,.7),0 0 10px rgba(192,139,65,.18)}
.ya-rels:first-child{top:5px}.ya-rels:last-child{bottom:5px}
.ya-rels::before{content:"";position:absolute;left:0;top:-4px;width:7px;height:12px;border-radius:1px;   /* упор */
  background:linear-gradient(90deg,#2a303b,#151a22);box-shadow:inset 0 0 0 1px rgba(192,139,65,.55)}
.ya-panel{position:relative;width:var(--ya-w);padding:16px 18px 14px 44px;border-radius:7px;will-change:transform;
  background:
    repeating-linear-gradient(90deg,rgba(255,255,255,.014) 0 1px,rgba(255,255,255,0) 1px 3px),
    linear-gradient(180deg,rgba(24,32,47,.95) 0,rgba(12,17,27,.96) 60%,rgba(9,13,21,.97) 100%);
  border:1px solid rgba(142,160,196,.22);
  box-shadow:inset 0 1px 0 rgba(255,236,206,.14),inset 0 -1px 0 rgba(0,0,0,.65),0 22px 44px -12px rgba(0,0,0,.8),0 0 0 1px rgba(3,5,10,.6)}
.ya-ruchka{position:absolute;left:0;top:0;bottom:0;width:32px;border:0;padding:0;cursor:pointer;background:none;
  border-right:1px solid rgba(142,160,196,.14)}
.ya-ruchka i{position:absolute;left:12px;top:50%;width:7px;height:42%;transform:translateY(-50%);border-radius:3px;
  background:repeating-linear-gradient(0deg,#5e4420 0 2px,#d7a865 2px 4px);box-shadow:0 0 0 1px rgba(0,0,0,.5),0 0 12px rgba(192,139,65,.25);
  transition:transform .16s cubic-bezier(.2,.8,.2,1.5)}
.ya-ruchka:hover i{transform:translateY(-50%) translateX(-2px)}
.usloviya.shchelk .ya-ruchka i{animation:shchelk .24s cubic-bezier(.2,.8,.2,1)}
@keyframes shchelk{0%{transform:translateY(-50%) translateX(0)}35%{transform:translateY(-50%) translateX(3px)}100%{transform:translateY(-50%) translateX(0)}}
.ya-vint{position:absolute;width:8px;height:8px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#7d8796,#2a313c 70%);box-shadow:0 0 0 1px rgba(0,0,0,.6)}
.ya-vint::after{content:"";position:absolute;left:1px;right:1px;top:3.5px;height:1px;background:rgba(0,0,0,.75);transform:rotate(-35deg)}
.ya-vint.v1{right:7px;top:7px}.ya-vint.v2{right:7px;bottom:7px}.ya-vint.v3{left:39px;top:7px}.ya-vint.v4{left:39px;bottom:7px}
.ya-vint.v2::after{transform:rotate(20deg)}.ya-vint.v3::after{transform:rotate(70deg)}
.ya-polzun{position:absolute;left:52px;width:34px;height:12px;border-radius:2px;background:linear-gradient(180deg,#323a47,#141920);
  box-shadow:inset 0 0 0 1px rgba(192,139,65,.5),0 1px 2px rgba(0,0,0,.6)}
.ya-polzun.p1{top:-12px}.ya-polzun.p2{bottom:-12px}
.ya-shapka{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;padding-bottom:9px;border-bottom:1px dashed rgba(142,160,196,.2);
  font:600 9.5px/1 var(--shrift);letter-spacing:.32em;text-transform:uppercase;color:var(--tekst-3)}
.ya-lampa{width:8px;height:8px;border-radius:50%;background:#2a2217;box-shadow:inset 0 1px 2px rgba(0,0,0,.8),0 0 0 1px rgba(0,0,0,.6);transition:background .12s,box-shadow .12s}
.usloviya.zaperta .ya-lampa{background:radial-gradient(circle at 40% 35%,#fff1dc,#e6a64f 60%);box-shadow:0 0 10px rgba(230,166,79,.85),0 0 0 1px rgba(0,0,0,.5)}
.usloviya .metka{margin-bottom:4px}
.usloviya li{display:grid;gap:4px;padding:12px 0 11px;border-bottom:1px solid var(--liniya)}
.usloviya li:last-child{border-bottom:0}
.usloviya .n{font:300 28px/1 var(--shrift-zag);letter-spacing:-.02em;color:var(--bronza-sv)}
.usloviya span{font-size:14px;line-height:1.38;color:var(--tekst)}
.usloviya .istochnik{margin-top:8px;padding-top:10px;border-top:1px solid var(--liniya);font-size:12px;line-height:1.42;color:var(--tekst-3)}

.kredit{position:absolute;z-index:3;left:50%;bottom:78px;transform:translate(-50%,calc(var(--p)*-120px));width:max-content;max-width:52vw;
  font:500 10.5px/1.4 var(--shrift-zag);letter-spacing:.16em;text-transform:uppercase;color:var(--tekst-3);text-align:center;
  opacity:calc((1 - var(--p)*9) * var(--poyav));text-shadow:0 1px 12px rgba(3,5,10,.95)}
.kredit b{font-weight:600;color:var(--tekst-2)}
/* подпись автора снимка неба (условие лицензии ESO, CC BY 4.0): видна рядом с картинкой, гаснет вместе с обложкой */
.kredit-foto{position:absolute;z-index:3;right:14px;bottom:96px;margin:0;writing-mode:vertical-rl;transform:rotate(180deg);font:500 9.5px/1.3 var(--shrift-zag);letter-spacing:.12em;
  text-transform:uppercase;color:var(--tekst-3);opacity:calc((1 - var(--p)*4) * var(--poyav) * .75);text-shadow:0 1px 8px rgba(3,5,10,.95)}
.kredit-foto a{color:inherit;text-decoration:none;border-bottom:1px solid rgba(142,160,196,.3)}

.lenta{position:absolute;z-index:4;left:var(--polya);right:var(--polya);bottom:0;height:58px;display:flex;align-items:center;
  border-top:1px solid var(--liniya-2);font:500 11px/1 var(--shrift-zag);letter-spacing:.14em;text-transform:uppercase;color:var(--tekst-3);
  opacity:calc((1 - var(--p)*3) * var(--poyav))}
.lenta-metka{color:var(--bronza-sv);padding-right:26px;display:flex;align-items:center;gap:10px;white-space:nowrap}
.lenta-metka::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--bronza-sv);box-shadow:0 0 10px var(--bronza)}
.lenta-p{display:flex;align-items:center;gap:12px;padding:0 24px;border-left:1px solid var(--liniya);height:22px;white-space:nowrap}
.lenta-p i{font-style:normal}
.lenta-p b{font:500 15px/1 var(--shrift-zag);letter-spacing:0;color:var(--tekst);font-variant-numeric:tabular-nums;text-transform:none}
.lenta-vniz{margin-left:auto;color:var(--tekst-3);white-space:nowrap}

/* ═══ 5. ОТЛЁТ — станция целиком в бездне (закреплённый экран) ═══ */
.otlyot{position:relative;height:260vh}
.otlyot-lipkiy{position:sticky;top:0;height:100vh;height:100svh;padding:0 var(--polya);overflow:hidden}
.ot-tekst{position:absolute;left:var(--polya);bottom:15vh;width:min(560px,44vw);
  opacity:var(--ot);transform:translate3d(0,calc((1 - var(--ot))*26px),0)}
.ot-tekst h2{margin-top:20px;font-size:clamp(30px,3.3vw,48px);text-shadow:0 2px 28px rgba(3,5,10,.9)}
.ot-tri{display:grid;grid-template-columns:repeat(3,1fr);gap:0 26px;margin-top:34px}
.ot-tri li{border-top:1px solid var(--liniya-2);padding-top:14px}
.ot-tri b{display:block;font:300 26px/1 var(--shrift-zag);letter-spacing:-.02em;color:var(--bronza-sv);white-space:nowrap}
.ot-tri span{display:block;margin-top:8px;font-size:14px;line-height:1.42;color:var(--tekst-2)}
.ot-podpis{position:absolute;right:var(--polya);bottom:15vh;display:grid;gap:8px;justify-items:end;text-align:right;
  font:500 10.5px/1.3 var(--shrift-zag);letter-spacing:.2em;text-transform:uppercase;color:var(--tekst-3);opacity:var(--ot)}
.ot-podpis span:first-child{color:var(--bronza-sv)}

/* ═══ 6. УРОК — ИЛЛЮМИНАТОР с затвором ═════════════════════════ */
.knopka.obvod{background:rgba(3,5,10,.45);color:var(--tekst);border-color:var(--liniya-2);box-shadow:none}
.urok{position:relative;min-height:115vh;display:grid;grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);gap:56px;align-items:center;
  padding:14vh var(--polya) 14vh}
.urok::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(180deg,rgba(3,5,10,0) 0,rgba(3,5,10,.9) 20%,rgba(3,5,10,.94) 70%,rgba(3,5,10,.98) 100%)}
.urok-tekst{max-width:430px}
.urok-tekst h2{margin-top:20px;font-size:clamp(30px,3.1vw,46px)}
.urok-lid{margin-top:18px;font-size:16.5px;line-height:1.6;color:var(--tekst-2)}
.urok .knopka.obvod{margin-top:28px}
.illyuminator{margin:0}
/* Рама: толстая сталь, бронзовая губа, кольцо болтов. Окно — скруглённый 16:9 (круг резал бы кадр). */
.il-rama{position:relative;padding:24px;border-radius:40px;
  background:
    repeating-linear-gradient(90deg,rgba(255,255,255,.012) 0 1px,rgba(255,255,255,0) 1px 3px),
    linear-gradient(160deg,#2a3241 0,#151b26 38%,#0d121b 70%,#1b2230 100%);
  box-shadow:inset 0 1px 0 rgba(255,236,206,.16),inset 0 -2px 0 rgba(0,0,0,.6),inset 0 0 0 1px rgba(142,160,196,.12),0 40px 80px -30px rgba(0,0,0,.9),0 0 0 1px rgba(3,5,10,.8)}
.il-rama::before{content:"";position:absolute;inset:15px;border-radius:30px;pointer-events:none;
  box-shadow:0 0 0 2px #8a6229,0 0 0 3px rgba(230,187,125,.55),0 0 18px rgba(192,139,65,.25)}
.il-bolty{position:absolute;inset:6px;border-radius:34px;pointer-events:none;
  background:
    radial-gradient(circle at 50% 50%,#8e98a8 0,#3a414e 2.6px,rgba(0,0,0,.7) 3.4px,transparent 4px) 26px 0/48px 12px repeat-x,
    radial-gradient(circle at 50% 50%,#8e98a8 0,#3a414e 2.6px,rgba(0,0,0,.7) 3.4px,transparent 4px) 26px 100%/48px 12px repeat-x,
    radial-gradient(circle at 50% 50%,#8e98a8 0,#3a414e 2.6px,rgba(0,0,0,.7) 3.4px,transparent 4px) 0 30px/12px 48px repeat-y,
    radial-gradient(circle at 50% 50%,#8e98a8 0,#3a414e 2.6px,rgba(0,0,0,.7) 3.4px,transparent 4px) 100% 30px/12px 48px repeat-y;
  -webkit-mask:linear-gradient(#000,#000);mask:linear-gradient(#000,#000)}
.il-okno{position:relative;aspect-ratio:16/9;border-radius:24px;overflow:hidden;background:#05070b;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.9)}
.il-okno img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.9) contrast(1.05) saturate(.92)}
/* стекло: толща и отражение по краю */
.il-okno::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;
  background:linear-gradient(118deg,rgba(255,255,255,.07) 0,rgba(255,255,255,0) 32%),radial-gradient(130% 120% at 50% 50%,rgba(0,0,0,0) 62%,rgba(0,0,0,.55) 100%);
  box-shadow:inset 0 10px 30px rgba(0,0,0,.55),inset 0 0 0 2px rgba(0,0,0,.6)}
.il-pusk{position:absolute;left:50%;top:50%;width:76px;height:76px;margin:-38px 0 0 -38px;border-radius:50%;z-index:1;
  background:rgba(3,5,10,.55);box-shadow:0 0 0 1px rgba(230,187,125,.6),0 0 30px rgba(192,139,65,.3);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);
  opacity:0;transform:scale(.92);transition:opacity .3s .15s,transform .3s .15s cubic-bezier(.2,.8,.2,1)}
.il-pusk::after{content:"";position:absolute;left:31px;top:25px;border-left:20px solid var(--bronza-sv);border-top:13px solid transparent;border-bottom:13px solid transparent}
.illyuminator.otkryt .il-pusk{opacity:1;transform:scale(1)}
/* Затвор: 9 ламелей из стали с бронзовой кромкой. Открытие — ламели встают ребром волной и уходят в раму. */
.zatvor{position:absolute;inset:0;z-index:2;perspective:900px;pointer-events:none}
.lamel{position:absolute;left:-1%;right:-1%;top:calc(var(--i) * 100% / 9 - 1px);height:calc(100% / 9 + 2px);transform-origin:50% 50%;
  backface-visibility:visible;will-change:transform;
  background:
    repeating-linear-gradient(90deg,rgba(255,255,255,.016) 0 1px,rgba(255,255,255,0) 1px 4px),
    linear-gradient(180deg,#3b4454 0,#232a36 18%,#171d27 62%,#0e131b 100%);
  border-top:1px solid rgba(230,187,125,.42);box-shadow:0 2px 3px rgba(0,0,0,.65),inset 0 -1px 0 rgba(0,0,0,.6)}
.lamel::after{content:"";position:absolute;left:3%;right:3%;top:46%;height:1px;background:rgba(0,0,0,.35)}
.illyuminator.udar .il-rama{animation:udar .22s cubic-bezier(.2,.8,.2,1)}
@keyframes udar{0%{transform:translateY(0)}30%{transform:translateY(2px)}100%{transform:translateY(0)}}
.illyuminator figcaption{display:flex;justify-content:space-between;gap:16px;margin-top:14px;padding:0 10px;
  font:500 10.5px/1.3 var(--shrift-zag);letter-spacing:.16em;text-transform:uppercase;color:var(--tekst-3)}

/* ── Тумблер «Звук» с фиксацией: рычажок переходит с доводкой ── */
.tumbler{display:flex;align-items:center;gap:10px;margin-left:4px;padding:6px 2px;border:0;background:none;cursor:pointer;
  font:500 10.5px/1 var(--shrift-zag);letter-spacing:.16em;text-transform:uppercase;color:var(--tekst-3)}
.tm-gnezdo{position:relative;width:36px;height:18px;border-radius:9px;background:linear-gradient(180deg,#070a10,#151c28);
  box-shadow:inset 0 1px 3px rgba(0,0,0,.85),0 0 0 1px var(--liniya-2)}
.tm-rychag{position:absolute;top:2px;left:2px;width:14px;height:14px;border-radius:50%;
  background:radial-gradient(circle at 35% 30%,#d9dee6,#6b7484 72%);box-shadow:0 1px 2px rgba(0,0,0,.7);
  transition:transform .2s cubic-bezier(.2,.8,.2,1.45),background .2s}
.tumbler.vkl{color:var(--bronza-sv)}
.tumbler.vkl .tm-rychag{transform:translateX(18px);background:radial-gradient(circle at 35% 30%,#fff1dc,#c08b41 70%)}
.tumbler.vkl .tm-gnezdo{box-shadow:inset 0 1px 3px rgba(0,0,0,.85),0 0 0 1px var(--bronza-dym),0 0 12px rgba(192,139,65,.3)}
/* 25.10: звук включён, но браузер ждёт первого касания — рычаг мягко пульсирует (js/zvuk.js, класс zhdet) */
.tumbler.zhdet .tm-rychag{animation:zvuk-zhdet 1.8s ease-in-out infinite}
@keyframes zvuk-zhdet{0%,100%{box-shadow:0 0 0 0 rgba(230,187,125,0)}50%{box-shadow:0 0 0 6px rgba(230,187,125,.38)}}
html.tiho .tumbler.zhdet .tm-rychag{animation:none}

.podval{background:var(--bezdna);border-top:1px solid var(--liniya);padding:32px var(--polya) 48px}
.podval p{max-width:1180px;margin:0 auto;color:var(--tekst-3);font-size:14px;line-height:1.6}
.podval p+p{margin-top:12px}

/* ═══ 6. Средние экраны ══════════════════════════════════════════ */
@media (max-width:1180px){
  .menyu{gap:20px}
  .menyu a:nth-child(1){display:none}
  .usloviya{display:none}
}

/* ═══ 7. Телефон ═════════════════════════════════════════════════ */
@media (max-width:760px){
  body{font-size:16px}
  .metka{font-size:14px;letter-spacing:.12em}
  .knopka,.knopka.malaya,.knopka.tekst{font-size:14px;letter-spacing:.06em}
  .shapka{height:64px;gap:12px}
  .menyu,.shapka>.knopka,.shapka .dveri{display:none}
  .burger{display:block}
  /* открытое меню: список под шапкой на толстом стекле, пункты в палец высотой */
  .shapka.menyu-otkryto .menyu{display:flex;flex-direction:column;gap:0;position:fixed;top:68px;left:12px;right:12px;
    padding:6px 18px;background:rgba(3,5,10,.9);border:1px solid var(--liniya-2);border-radius:16px;
    -webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);font-size:14px}
  .shapka.menyu-otkryto .menyu a{display:block;padding:15px 0;border-bottom:1px solid var(--liniya-2)}
  .shapka.menyu-otkryto .menyu a:last-child{border-bottom:0}
  .shapka.menyu-otkryto .burger i:first-child{top:21.5px;transform:rotate(45deg)}
  .shapka.menyu-otkryto .burger i:last-child{top:21.5px;transform:rotate(-45deg)}
  .logo{font-size:14px;letter-spacing:.24em}
  .zapas{background:url(../kartinki/zapas-390.webp) center 0/cover no-repeat,var(--bezdna)}
  .vin{background:linear-gradient(180deg,rgba(3,5,10,.5) 0,rgba(3,5,10,0) 10%,rgba(3,5,10,0) 46%,rgba(3,5,10,.55) 62%,rgba(3,5,10,.9) 100%)}

  .oblozhka{height:auto;min-height:0;padding-bottom:40px}
  .obl-lipkiy{position:relative;height:auto;min-height:0;overflow:visible}
  .rastvor{display:none!important}.obl-lipkiy.rastvor-idet .titul-slovo{opacity:1}
  /* телефон: обложка уезжает потоком — без затемнения по прокрутке и без подложки под экипажем */
  .lyudi,.anons-glavnyy,.usloviya{filter:none}
  .lyudi-ten{display:none}
  .kredit-foto{position:relative;right:auto;bottom:auto;margin:-14px var(--polya) 18px;font-size:10px;writing-mode:horizontal-tb;transform:none;opacity:calc(var(--poyav) * .7)}
  .vypusk{display:none}
  /* На телефоне текст обложки уезжает обычным потоком, а не растворяется по прокрутке. */
  .titul{opacity:var(--poyav)}
  .lyudi{position:relative;inset:auto;height:var(--lyudi-h,460px);--tuman-dl:120px;transform:none;opacity:var(--poyav)}
  .kredit{position:relative;left:auto;bottom:auto;transform:none;width:auto;max-width:none;margin:-10px var(--polya) 20px;
    font:400 14px/1.45 var(--shrift);letter-spacing:0;text-transform:none;text-align:left;opacity:var(--poyav)}
  .anons-glavnyy{position:relative;left:auto;top:auto;width:auto!important;margin:0 var(--polya);transform:none;opacity:var(--poyav)}
  .deviz{font-size:13px;letter-spacing:.1em;margin-bottom:14px}
  .deviz::before{width:22px}
  .zag-glavnyy{font-size:26px;line-height:1.14}
  .lid{font-size:16px;margin-top:16px}
  .knopki{flex-direction:column;align-items:stretch;margin-top:22px}
  .knopka{width:100%;min-height:56px;white-space:normal;text-align:center;line-height:1.3;padding:12px 18px}
  .knopka.tekst{justify-content:flex-start}
  .usloviya{display:block;position:relative;right:auto;top:auto;width:auto;margin:30px 0 0 var(--polya);transform:none;opacity:var(--poyav);
    --ya-w:calc(100vw - 2 * var(--polya))}
  .ya-panel{padding:14px 14px 14px 40px}
  .ya-ruchka{width:28px}.ya-ruchka i{left:10px}
  .ya-vint.v3,.ya-vint.v4{left:34px}
  .usloviya ol{display:grid;grid-template-columns:repeat(3,1fr);gap:0 10px}
  .usloviya li{border-bottom:0;border-top:1px solid var(--liniya-2);padding:10px 0 0}
  .usloviya .n{font-size:21px}
  .usloviya span{font-size:14px}
  .usloviya .istochnik{font-size:14px}
  .ya-shapka{font-size:11px}
  .lenta{display:none}
  .tumbler{margin-left:auto}.tm-podpis{display:none}
  /* звук ждёт касания — на телефоне подпись видна: «Звук ♪» рядом с рычагом (критик 25.10) */
  .tumbler.zhdet .tm-podpis{display:inline;font-size:12px;letter-spacing:.08em}
  .burger{margin-left:6px}
  .urok{grid-template-columns:1fr;gap:30px;min-height:0;padding:12vh var(--polya) 10vh}
  .il-rama{padding:12px;border-radius:24px}
  .il-rama::before{inset:7px;border-radius:18px}
  .il-bolty{display:none}
  .il-okno{border-radius:14px}
  .il-pusk{width:56px;height:56px;margin:-28px 0 0 -28px}.il-pusk::after{left:23px;top:18px;border-left-width:15px;border-top-width:10px;border-bottom-width:10px}
  .illyuminator figcaption{flex-direction:column;gap:6px;font-size:12px;letter-spacing:.06em;text-transform:none;font-family:var(--shrift)}

  .otlyot{height:220vh}
  .ot-tekst{left:var(--polya);right:var(--polya);bottom:9vh;width:auto}
  .ot-tekst h2{font-size:28px}
  .ot-tri{grid-template-columns:1fr;gap:0;margin-top:22px}
  .ot-tri li{display:grid;grid-template-columns:118px 1fr;align-items:baseline;gap:12px;padding:10px 0}
  .ot-tri b{font-size:20px}
  .ot-tri span{margin-top:0}
  .ot-podpis{display:none}
}
.dveri-tel{display:none;position:absolute;z-index:4;left:var(--polya);right:var(--polya);top:72px;padding:3px;
  border:1px solid var(--liniya-2);border-radius:12px;background:rgba(3,5,10,.78);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.dveri-tel a{flex:1;text-align:center;font:600 14px/1 var(--shrift-zag);letter-spacing:.04em;text-transform:uppercase;color:var(--tekst-3);padding:12px 6px;border-radius:9px}
.dveri-tel a.akt{color:var(--tekst);background:var(--bronza-tush);box-shadow:inset 0 0 0 1px var(--bronza-dym)}
@media (max-width:760px){.dveri-tel{display:flex}.kredit{text-shadow:0 1px 10px rgba(3,5,10,.95),0 0 3px rgba(3,5,10,.9)}}

/* Служебный ключ ?chisto — одна 3D-сцена, без текста и людей (для разбора картинки). */
html.chisto .shapka,html.chisto .vin,html.chisto .zerno,html.chisto main,html.chisto .podval{visibility:hidden}

/* ═══ 8. «Меньше движения» ═══════════════════════════════════════ */
@media (prefers-reduced-motion:reduce){
  .titul,.lyudi,.lyudi .chel,.anons-glavnyy,.usloviya,.ot-tekst{transform:none!important}
}
html.tiho .titul,html.tiho .lyudi,html.tiho .anons-glavnyy,html.tiho .usloviya,html.tiho .ot-tekst{transform:none!important}

/* ═══ 9. ПОЛЁТ: закреплённые сцены 1–3 и стекло ═══════════════════ */
.etap{position:relative}
.etap .lipkiy{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden}
.start{height:350vh}.polyot{height:400vh}.stykovka{height:350vh}
/* 29.10, Игорь: «больше динамики», «на телефоне взлёт и полёт подрежь — сразу к сути». Стоит ПОСЛЕ общего правила:
   в мобильном блоке выше его перебивало общее .polyot{height:400vh} (в 16:10 полёт так и не укоротился). */
.start{height:260vh}   /* компьютер: доля старта считается и на въезде экрана (stranica.js, granicyStarta) */
@media (max-width:760px){.start{height:250vh}.polyot{height:200vh}}   /* старт 250: отсчёт ≈63 px на цифру (критик № 1.2) */
/* 26.10 «мёртвая зона»: липкий экран сцены отпускает за экран до её конца, и целый экран прокрутки фильм стоял.
   Следующая сцена заходит на этот экран: начинается ровно там, где кончился фильм предыдущей. Экран не своей сцены прячем. */
.polyot,.stykovka{margin-top:-100vh;margin-top:-100svh}
.etap.vne-sceny>.lipkiy{visibility:hidden}
/* 29.10, разбор кода: прозрачность у родителя ломает стекло (backdrop-filter) карточки — оно «щёлкало» в конце проявления.
   Проявление старта (--vhod) — на самих элементах. */
.start .bort-podpis{opacity:var(--vhod,1)}
/* Стекло: толстое, с бронзовой кромкой, фон чуть преломляется. Не «белая плашка с blur». */
/* 25.10 (художник, № 11): над фильмом стекло гасит кадр, а не раскрашивает — иначе над огнём оранжево-бурая каша. */
.steklo{position:relative;border-radius:16px;padding:26px 28px 24px;color:var(--tekst);
  background:linear-gradient(160deg,rgba(20,28,44,.6) 0,rgba(8,13,23,.66) 55%,rgba(6,10,18,.72) 100%);
  -webkit-backdrop-filter:blur(18px) saturate(.8) brightness(.62);backdrop-filter:blur(18px) saturate(.8) brightness(.62);
  border:1px solid rgba(230,187,125,.38);
  box-shadow:inset 0 1px 0 rgba(255,236,206,.22),inset 0 -1px 0 rgba(0,0,0,.6),inset 1px 0 0 rgba(255,255,255,.05),
    0 30px 60px -24px rgba(0,0,0,.85),0 0 0 1px rgba(3,5,10,.5),0 0 40px -10px rgba(192,139,65,.18)}
.steklo::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(115deg,rgba(255,255,255,.09) 0,rgba(255,255,255,0) 28%,rgba(255,255,255,0) 70%,rgba(230,187,125,.06) 100%)}
.steklo .metka{margin-bottom:10px}
.steklo h2{font-size:clamp(22px,2vw,30px);line-height:1.12}
.ka-shapka{display:flex;justify-content:space-between;align-items:center;margin:-6px 0 14px;padding-bottom:9px;border-bottom:1px dashed rgba(142,160,196,.22);
  font:600 9.5px/1 var(--shrift);letter-spacing:.32em;text-transform:uppercase;color:var(--tekst-3)}
.steklo.zaperta .ya-lampa,.stadii li.gorit .ya-lampa{background:radial-gradient(circle at 40% 35%,#fff1dc,#e6a64f 60%);box-shadow:0 0 10px rgba(230,166,79,.85),0 0 0 1px rgba(0,0,0,.5)}
.ka-podpis{margin-top:14px;font-size:13px;line-height:1.45;color:var(--tekst-3)}

/* Сцена 1 — старт */
.start .st-tekst{position:absolute;left:var(--polya);top:50%;transform:translate3d(0,calc(-50% + var(--st-y,0px)),0);width:min(520px,36vw);opacity:calc(var(--st-op,1) * var(--vhod,1))}
.st-lid{margin-top:14px;font-size:16px;line-height:1.55;color:var(--tekst-2)}
.start .ot-tri{margin-top:22px;gap:0 18px}
.start .ot-tri b{font-size:24px}
.start .ot-tri span{font-size:13.5px}
.st-chestno{margin-top:18px;padding-top:12px;border-top:1px solid var(--liniya);font-size:13px;line-height:1.45;color:var(--tekst-3)}
.bort-podpis{position:absolute;right:var(--polya);bottom:28px;display:grid;gap:8px;justify-items:end;text-align:right;
  font:500 10.5px/1.3 var(--shrift-zag);letter-spacing:.2em;text-transform:uppercase;color:var(--tekst-3)}
.bort-podpis span:first-child{color:var(--bronza-sv)}
.bort-podpis.levo{right:auto;left:var(--polya);justify-items:start;text-align:left}
/* Обратный счёт: механические барабаны в углу */
.otschet{position:absolute;right:var(--polya);top:96px;display:grid;justify-items:end;gap:8px;opacity:calc(var(--ot-op,1) * var(--vhod,1));
  font:500 10.5px/1 var(--shrift-zag);letter-spacing:.2em;text-transform:uppercase;color:var(--tekst-3)}
.baraban{display:flex;gap:4px;padding:6px;border-radius:8px;background:linear-gradient(180deg,#0a0f18,#161e2c);
  box-shadow:inset 0 2px 6px rgba(0,0,0,.9),0 0 0 1px var(--liniya-2),0 0 24px -6px rgba(192,139,65,.25)}
.bar{position:relative;display:block;width:38px;height:54px;overflow:hidden;border-radius:4px;
  background:linear-gradient(180deg,#1b2231 0,#2a3344 50%,#1b2231 100%);box-shadow:inset 0 0 0 1px rgba(0,0,0,.6)}
.bar b{display:block;height:54px;line-height:54px;text-align:center;font:300 34px/54px var(--shrift-zag);color:var(--bronza-sv);
  transform:translate3d(0,calc(var(--pos,0) * -54px),0);transition:transform calc(.22s * var(--zamedl,1)) cubic-bezier(.2,.8,.2,1.3)}
/* 29.10 критик № 1.2, 3.4: на телефоне барабан быстрее (отсчёт короче — цифра успевает встать); «меньше движения» — без кручения */
@media (max-width:760px){.bar b{transition-duration:calc(.14s * var(--zamedl,1))}}
html.tiho .bar b{transition:none}
@media (prefers-reduced-motion:reduce){.bar b{transition:none}}
.bar::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.6),rgba(0,0,0,0) 30%,rgba(0,0,0,0) 70%,rgba(0,0,0,.6));pointer-events:none}
/* 26.10 критик: «Старт через» тонким серым шрифтом терялось на решётке башни — тёмная тень-подложка под буквами */
.ot-metka,.ot-sost{text-shadow:0 1px 2px rgba(3,5,10,.95),0 0 8px rgba(3,5,10,.85),0 0 18px rgba(3,5,10,.6)}
.ot-metka{color:#c9cfdb}
.ot-sost{color:var(--bronza-sv);transition:color calc(.3s * var(--zamedl,1))}
.otschet.gorit .ot-sost{color:#ffd9a0;text-shadow:0 0 14px rgba(255,170,80,.8)}

/* Сцена 2 — полёт: карточки справа по направляющим */
.polyot .kartochka{position:absolute;right:var(--polya);width:min(430px,31vw);top:50%;
  transform:translate3d(var(--kx,120%),-50%,0);opacity:var(--kop,0);will-change:transform}
.polyot .kartochka::after{content:"";position:absolute;left:-18px;top:18px;bottom:18px;width:4px;border-radius:1px;    /* направляющая */
  background:linear-gradient(180deg,#e6bb7d 0,#a77a3a 35%,#4f3a1c 100%);box-shadow:0 1px 0 rgba(0,0,0,.7),0 0 10px rgba(192,139,65,.18)}
.schetchik{display:grid;gap:0;margin-top:16px}
.schetchik li{display:flex;justify-content:space-between;align-items:baseline;padding:10px 0;border-top:1px solid var(--liniya)}
.schetchik span{font-size:14px;color:var(--tekst-2)}
.schetchik b{font:300 22px/1 var(--shrift-zag);color:var(--bronza-sv)}
.instr{display:grid;gap:0;margin-top:14px}
.instr li{display:grid;gap:4px;padding:11px 0;border-top:1px solid var(--liniya)}
.instr b{font:600 12px/1.3 var(--shrift-zag);letter-spacing:.06em;color:var(--bronza-sv);text-transform:uppercase}
.instr span{font-size:14px;line-height:1.42;color:var(--tekst)}
.pribory{display:grid;grid-template-columns:1fr 1fr;gap:12px 20px;margin-top:14px}
.pribory li{display:grid;gap:5px;padding:10px 12px;border-radius:8px;background:rgba(3,5,10,.5);box-shadow:inset 0 0 0 1px var(--liniya-2),inset 0 2px 6px rgba(0,0,0,.6)}
.pribory span{font:500 10px/1.2 var(--shrift-zag);letter-spacing:.14em;text-transform:uppercase;color:var(--tekst-3)}
.pribory b{font:500 20px/1 var(--shrift-zag);color:var(--tekst);font-variant-numeric:tabular-nums}

/* Сцена 3 — стыковка: прицел, дальность, стадии, форма */
.pricel{position:absolute;left:50%;top:50%;width:min(52vh,420px);height:min(52vh,420px);transform:translate(-50%,-50%) scale(var(--pr-s,1));
  color:rgba(230,187,125,.75);opacity:var(--pr-op,1);filter:drop-shadow(0 0 6px rgba(230,187,125,.35))}
.pricel .pr-ugol{stroke:#ffd9a0}
.dalnost{position:absolute;left:var(--polya);top:50%;transform:translateY(-50%);display:grid;gap:6px;opacity:var(--pr-op,1);
  font:500 10.5px/1 var(--shrift-zag);letter-spacing:.2em;text-transform:uppercase;color:var(--tekst-3)}
.dalnost b{font:300 46px/1 var(--shrift-zag);letter-spacing:-.02em;color:var(--bronza-sv);text-shadow:0 0 24px rgba(230,187,125,.3)}
.da-skorost{color:var(--tekst-2)}
.stadii{position:absolute;left:var(--polya);bottom:28px;display:flex;gap:26px;font:500 10.5px/1 var(--shrift-zag);letter-spacing:.18em;text-transform:uppercase;color:var(--tekst-3)}
.stadii li{display:flex;align-items:center;gap:10px}
.stadii li.gorit{color:var(--bronza-sv)}
.stadii .ya-lampa{display:inline-block;width:8px;height:8px;border-radius:50%;background:#2a2217;box-shadow:inset 0 1px 2px rgba(0,0,0,.8),0 0 0 1px rgba(0,0,0,.6)}
.forma-bort{position:absolute;right:var(--polya);top:50%;width:min(440px,32vw);transform:translate3d(var(--fx,110%),-50%,0);opacity:var(--fop,0)}
.forma{display:grid;gap:12px;margin-top:18px}
.forma label{display:grid;gap:6px;font:500 10px/1.2 var(--shrift-zag);letter-spacing:.16em;text-transform:uppercase;color:var(--tekst-3)}
.forma input{font:400 16px/1.3 var(--shrift);color:var(--tekst);padding:12px 14px;border-radius:9px;border:1px solid var(--liniya-2);
  background:rgba(3,5,10,.55);box-shadow:inset 0 2px 6px rgba(0,0,0,.6);outline:none}
.forma input:focus{border-color:var(--bronza);box-shadow:inset 0 2px 6px rgba(0,0,0,.6),0 0 0 3px rgba(192,139,65,.18)}
.forma input::placeholder{color:var(--tekst-3)}
.forma .knopka{margin-top:4px;transition:box-shadow calc(.3s * var(--zamedl,1)),filter calc(.3s * var(--zamedl,1)),transform calc(.26s * var(--zamedl,1))}
.forma-bort.svetit .knopka{filter:brightness(1.25);box-shadow:0 1px 0 rgba(255,244,222,.9) inset,0 0 0 1px rgba(255,226,180,.3) inset,0 0 44px rgba(255,200,120,.75),0 14px 36px -12px rgba(192,139,65,.9)}

/* Сцена 4 — внутри: урок (есть), тарифы-чертёж, финал, дверь «Для бизнеса» */
.vnutri{position:relative;background:linear-gradient(180deg,rgba(3,5,10,0) 0,rgba(3,5,10,.92) 12%,rgba(3,5,10,.97) 100%)}
.urok::before{display:none}
.tarify{padding:8vh var(--polya) 10vh;max-width:1280px;margin:0 auto}
.ta-shapka{max-width:720px}
.ta-shapka h2{margin-top:18px}
.ta-lid{margin-top:16px;font-size:16.5px;line-height:1.6;color:var(--tekst-2)}
.chertezh{display:block;width:100%;max-width:1180px;height:auto;margin:40px auto 10px;color:var(--bronza);opacity:.9}
.chertezh .ch-liniya{filter:drop-shadow(0 0 4px rgba(192,139,65,.35))}
.chertezh .ch-tochki{color:var(--bronza-sv)}
.ta-lestnica{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:14px;align-items:stretch}
/* 29.10, критик: низ карточек шёл лесенкой, кнопки на разной высоте — карточки одной высоты, список растягивается */
.ta-lestnica .steklo{padding:22px 24px 24px;display:grid;gap:12px;grid-template-rows:auto auto auto 1fr auto}
.ta-lestnica ul{align-content:start}
.ta-lestnica .steklo.glavnyy{border-color:rgba(230,187,125,.7);box-shadow:inset 0 1px 0 rgba(255,236,206,.3),0 30px 60px -24px rgba(0,0,0,.85),0 0 60px -10px rgba(192,139,65,.35)}
.ta-lestnica .ya-lampa{display:inline-block;width:8px;height:8px;border-radius:50%;background:#2a2217;box-shadow:inset 0 1px 2px rgba(0,0,0,.8),0 0 0 1px rgba(0,0,0,.6)}
.ta-lestnica .glavnyy .ya-lampa{background:radial-gradient(circle at 40% 35%,#fff1dc,#e6a64f 60%);box-shadow:0 0 10px rgba(230,166,79,.85)}
.ta-cena{display:block;font:400 14px/1.3 var(--shrift);color:var(--tekst-2)}
.ta-cena .cifry{display:block;font:300 34px/1.1 var(--shrift-zag);letter-spacing:-.02em;color:var(--bronza-sv);margin-bottom:4px}
.ta-lestnica p{font-size:15px;line-height:1.5;color:var(--tekst-2)}
.ta-lestnica ul{display:grid;gap:7px;padding-top:12px;border-top:1px solid var(--liniya)}
.ta-lestnica ul li{position:relative;padding-left:18px;font-size:14px;line-height:1.42}
.ta-lestnica ul li::before{content:"";position:absolute;left:0;top:9px;width:6px;height:6px;border-radius:50%;background:var(--bronza);box-shadow:0 0 6px rgba(192,139,65,.5)}
.ta-lestnica .knopka{margin-top:6px;width:100%}
.ta-primechanie{margin:26px auto 0;max-width:980px;font-size:13px;line-height:1.5;color:var(--tekst-3)}
.final{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:48px;align-items:center;padding:8vh var(--polya) 12vh;max-width:1280px;margin:0 auto}
.fi-tekst h2{margin-top:18px;font-size:clamp(30px,3.4vw,50px)}
.fi-shagi{display:grid;gap:0;margin-top:26px;max-width:560px}
.fi-shagi li{display:grid;grid-template-columns:44px 1fr;align-items:baseline;gap:12px;padding:12px 0;border-top:1px solid var(--liniya)}
.fi-shagi b{font:300 24px/1 var(--shrift-zag);color:var(--bronza-sv)}
.fi-shagi span{font-size:16px;color:var(--tekst)}
.final .primechanie{display:block;margin-top:16px}
/* Дверь «Для бизнеса»: маленький люк с куполом, в нём оранжевая точка Венеры */
.dver-biznes{position:relative;display:grid;gap:8px;justify-self:end;width:min(360px,100%);padding:26px 26px 26px 110px;border-radius:16px;
  background:linear-gradient(160deg,rgba(20,26,40,.6),rgba(8,12,20,.8));border:1px solid var(--liniya-2);
  box-shadow:inset 0 1px 0 rgba(255,236,206,.12),0 30px 60px -24px rgba(0,0,0,.85);transition:border-color .3s,transform .3s}
.dver-biznes:hover{border-color:rgba(255,138,43,.55);transform:translateY(-2px)}
.db-kupol{position:absolute;left:26px;top:50%;width:62px;height:62px;margin-top:-31px;border-radius:50%;
  background:radial-gradient(circle at 50% 60%,#0b1322 0,#05080f 70%);box-shadow:0 0 0 3px #8a6229,0 0 0 4px rgba(230,187,125,.4),inset 0 0 18px rgba(0,0,0,.9)}
.db-venera{position:absolute;left:50%;top:50%;width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:50%;background:#ff8a2b;box-shadow:0 0 16px 4px rgba(255,138,43,.6)}
.db-metka{font:500 10px/1.2 var(--shrift-zag);letter-spacing:.2em;text-transform:uppercase;color:#ff9a4a}
.db-zag{font:300 19px/1.2 var(--shrift-zag);color:var(--tekst)}
.db-tekst{font-size:14px;line-height:1.45;color:var(--tekst-2)}
.podval .licenzii{font-size:12.5px}

/* Сцены на телефоне: липкие экраны 100svh без прыжков, карточки снизу, текст ≥ 16 px */
@media (max-width:1180px){
  .polyot .kartochka{width:min(400px,42vw)}
  .forma-bort{width:min(400px,42vw)}
  .start .st-tekst{width:min(460px,44vw)}
}
@media (max-width:760px){
  .steklo{padding:18px 18px 18px;border-radius:14px}
  .steklo h2{font-size:21px}
  .start .st-tekst{left:var(--polya);right:var(--polya);width:auto;top:auto;bottom:16px;transform:translate3d(0,var(--st-y,0px),0);max-height:62svh;overflow:auto}
  .st-lid{font-size:16px}
  .start .ot-tri{grid-template-columns:1fr;gap:0;margin-top:12px}
  .start .ot-tri li{display:grid;grid-template-columns:110px 1fr;align-items:baseline;gap:10px;padding:8px 0;border-top:1px solid var(--liniya-2)}
  .start .ot-tri b{font-size:20px}.start .ot-tri span{font-size:16px;margin-top:0}
  .st-chestno{font-size:16px}
  .bort-podpis{display:none}
  .otschet{right:var(--polya);top:80px}
  .polyot .kartochka{left:var(--polya);right:var(--polya);width:auto;top:auto;bottom:16px;transform:translate3d(0,var(--ky,120%),0)}
  .polyot .kartochka::after{display:none}
  .schetchik span,.instr span,.ka-podpis{font-size:16px}
  .pribory{grid-template-columns:1fr 1fr;gap:8px}
  .pribory b{font-size:18px}.pribory span{font-size:12px}
  .pricel{width:60vw;height:60vw;top:38%}
  .dalnost{top:80px;left:var(--polya);transform:none}
  .dalnost b{font-size:34px}
  .stadii{bottom:auto;top:150px;gap:14px;font-size:12px}
  .forma-bort{left:var(--polya);right:var(--polya);width:auto;top:auto;bottom:16px;transform:translate3d(0,var(--fy,110%),0)}
  .forma-bort h2{font-size:19px}
  .forma input{font-size:16px}
  .tarify{padding:6vh var(--polya) 8vh}
  .ta-lestnica{grid-template-columns:1fr;gap:14px}
  .ta-lestnica p,.ta-lestnica ul li{font-size:16px}
  .ta-primechanie{font-size:16px}
  .final{grid-template-columns:1fr;gap:28px;padding:6vh var(--polya) 10vh}
  .fi-shagi span{font-size:16px}
  .dver-biznes{justify-self:stretch;width:auto;padding-left:100px}
  .db-tekst{font-size:16px}
  .podval .licenzii{font-size:16px}

  /* 24.10, графика 2 — телефон по замерам критиков: подписи не мельче 16 px, служебные шапки карточек спрятаны,
     ничего не упирается в край и не обрезается, огонь и узел не закрыты текстом. */
  /* обложка на телефоне — обычный поток, не липкий экран: правило `.etap .lipkiy` (100svh, overflow:hidden) сильнее
     `.obl-lipkiy` и срезало всё ниже первого экрана — кнопку «Зарегистрироваться», «Консультацию», панель условий */
  .oblozhka .obl-lipkiy{position:relative;height:auto;min-height:0;overflow:visible}
  /* закрытый ящик «Три условия» уезжает за правый край (видна ручка) — не даём ему расширить страницу,
     иначе айфон уменьшает всю страницу под 718 px */
  .oblozhka{overflow-x:hidden;overflow-x:clip}
  .ka-shapka{display:none}
  .ta-lestnica .ka-shapka{display:flex;margin:0 0 6px;padding-bottom:8px;font:600 16px/1.2 var(--shrift);letter-spacing:.02em;text-transform:none}
  .deviz{font-size:16px;letter-spacing:.05em}
  .kredit{font-size:16px}
  .usloviya ol{grid-template-columns:1fr}
  .usloviya li{display:grid;grid-template-columns:96px 1fr;gap:10px;align-items:baseline;padding:9px 0}
  .usloviya span,.usloviya .istochnik{font-size:16px}
  .usloviya .n{font-size:20px}
  .oblozhka .primechanie,.final .primechanie,.ta-cena{font-size:16px}
  .illyuminator figcaption{font-size:16px;letter-spacing:0}
  .db-metka{font:600 16px/1.2 var(--shrift);letter-spacing:.02em;text-transform:none}
  .podval p{font-size:16px}
  .tumbler{min-height:44px}
  /* старт: карточка короче (абзац — в трёх цифрах), без прокрутки внутри; на зажигании уезжает вниз (stranica.js) */
  .start .st-tekst{max-height:none;overflow:visible}
  .st-lid{display:none}
  .start .ot-tri{margin-top:8px}
  .start .ot-tri li{grid-template-columns:104px 1fr;padding:6px 0}
  .st-chestno{margin-top:10px;padding-top:8px}
  .otschet{top:76px;font:500 16px/1 var(--shrift);letter-spacing:0;text-transform:none}
  /* полёт: карточки на полэкрана — у трёх инструментов на телефоне только названия */
  .instr span{display:none}
  .instr li{padding:9px 0}
  .instr b{font:600 16px/1.3 var(--shrift);letter-spacing:.01em;text-transform:none}
  .pribory span{font:500 14px/1.2 var(--shrift);letter-spacing:.02em;text-transform:none}
  /* стыковка: стадии строкой сверху (16 px, без разрядки — помещаются), дальность под ними; на форме дальность гаснет */
  .stadii{top:76px;bottom:auto;left:var(--polya);right:var(--polya);justify-content:space-between;gap:8px;
    font:500 16px/1 var(--shrift);letter-spacing:0;text-transform:none;text-shadow:0 1px 8px rgba(3,5,10,.95),0 0 2px rgba(3,5,10,.9)}
  .dalnost{text-shadow:0 1px 8px rgba(3,5,10,.95)}
  .stadii li{gap:7px}
  .dalnost{top:110px;gap:4px;font:500 16px/1.1 var(--shrift);letter-spacing:0;text-transform:none}
  .dalnost b{font-size:32px}
  .forma label{font:500 16px/1.2 var(--shrift);letter-spacing:0;text-transform:none}
  .forma{gap:10px;margin-top:14px}
  .forma input{padding:11px 13px}
}

/* 29.10, разбор кода: на ноутбуках с окном ниже 700 px липкий экран обложки (min-height:700px) выше окна —
   лента рынка и подпись уходили под край. Держим их у нижнего края окна. */
@media (min-width:761px){.lenta{bottom:max(0px,calc(100% - 100svh))}.kredit{bottom:calc(78px + max(0px,calc(100% - 100svh)))}}

/* 29.10, слово Игоря: пара пока спрятана (html.bez-lyudey; снять — убрать класс в <head>). Подложка под экипажем и
   подпись «Экипаж» тоже; колонки обложки остаются на своих местах, имя и Земля — как были. */
html.bez-lyudey .lyudi,html.bez-lyudey .lyudi-ten,html.bez-lyudey .kredit{display:none}
/* телефон: блок людей стоял в потоке и держал текст под словом «СТАТУС» — без фигур оставляем ему роль отступа
   (ниже слова и имени, Земля в просвете), сами картинки спрятаны */
@media (max-width:760px){
  html.bez-lyudey .lyudi{display:block;height:calc(var(--titul-niz,230px) + 150px - 30px)}
  html.bez-lyudey .lyudi .chel,html.bez-lyudey .lyudi .kayma{display:none}
}

/* 29.10 критик: в финальной паузе заголовок лежал под полупрозрачной шапкой — финал начинается ниже шапки */
@media (min-width:761px){.final{padding-top:max(8vh,96px);scroll-margin-top:84px}}

/* 29.10, критик № 4.4: «♪ Полёт со звуком» — звук ждёт касания (нет экрана выбора: вернувшиеся гости, ссылка из ролика).
   Внизу по центру обложки, стекло станции; видна только пока звук ждёт и мы на обложке (js/zvuk.js: .vidno, .dalshe). */
.zvuk-zov{position:fixed;left:50%;bottom:max(76px,calc(env(safe-area-inset-bottom) + 18px));z-index:60;white-space:nowrap;
  transform:translate3d(-50%,8px,0);display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:11px 20px 11px 16px;
  border-radius:999px;border:1px solid rgba(230,187,125,.42);background:rgba(8,11,18,.62);
  -webkit-backdrop-filter:blur(12px) saturate(1.2);backdrop-filter:blur(12px) saturate(1.2);
  color:#f3efe6;font:500 15px/1 var(--shrift);letter-spacing:.01em;cursor:pointer;
  box-shadow:0 10px 30px -12px rgba(0,0,0,.8),0 0 0 1px rgba(0,0,0,.25);
  opacity:0;pointer-events:none;transition:opacity .45s ease,transform .45s cubic-bezier(.2,.8,.2,1)}
.zvuk-zov .zz-nota{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;
  background:rgba(230,187,125,.16);color:var(--bronza-sv);font-size:14px}
.zvuk-zov.vidno{opacity:1;pointer-events:auto;transform:translate3d(-50%,0,0)}
.zvuk-zov.vidno.dalshe{opacity:0;pointer-events:none;transform:translate3d(-50%,8px,0)}
.zvuk-zov:hover{border-color:rgba(230,187,125,.7)}
.zvuk-zov:focus-visible{outline:2px solid var(--bronza-sv);outline-offset:3px}
@media (prefers-reduced-motion:reduce){.zvuk-zov{transition:none}}
/* телефон: кнопка в потоке обложки, под «Зарегистрироваться / Консультация» — ничего не перекрывает */
.zvuk-zov.v-potoke{position:relative;left:auto;bottom:auto;z-index:auto;margin:14px 0 0;transform:translate3d(0,6px,0);display:none}
.zvuk-zov.v-potoke.vidno{display:inline-flex;transform:none}
.zvuk-zov.v-potoke.vidno.dalshe{opacity:1;pointer-events:auto;transform:none}