/* ChiPro — сайт. Токены взяты из приложения КОДАМИ (контракт оформления зафиксирован,
   память design-contract-locked): Manrope в display-заголовках, Inter в тексте,
   #089981/#F23645 направление, #2563EB симуляция, #E04F3F live. Подбирать на глаз нельзя.

   🔴 Igor msg 2238: акцент САЙТА = цвет Live (#E04F3F), а не синий. Синий в продукте означает
   СИМУЛЯЦИЮ, и красить им витрину было неверно: сайт продаёт живой сервис. Все акценты берут
   --c-accent; синий остаётся только там, где он и должен быть — на элементах симулятора. */
:root{
  --c-blue:#2563EB; --c-blue-l:#EEF4FF;
  --c-accent:#E04F3F; --c-accent-l:rgba(224,79,63,.10); --c-accent-sh:rgba(224,79,63,.18);
  /* accent/blue-ink — те же цвета для МЕЛКОГО текста, доведённые до контраста 4.5:1 (a11y). */
  --c-accent-ink:#C8412F; --c-blue-ink:#2563EB;
  --c-green:#089981; --c-green-ink:#067A68; --c-green-l:#E4F3EF; --c-green-line:#B7DED5;
  --c-red:#F23645;   --c-red-ink:#C92F3B;   --c-red-l:#FDE8EA;   --c-red-line:#F5BEC4;
  --c-live:#E04F3F;  --c-live-soft:rgba(224,79,63,.12); --c-live-line:rgba(224,79,63,.32);
  --c-orange:#F59E0B; --c-orange-l:#FEF3C7;

  --bg:#FFFFFF; --surface:#FFFFFF; --surface2:#F5F7FA; --inset:#F5F7FA;
  --ink:#111827; --ink2:#6B7280; --ink3:#6B7280; --line:#E5E7EB;
  --shadow-card:0 8px 24px rgba(0,0,0,.08);

  --font-ui:'Inter',-apple-system,system-ui,'Segoe UI',sans-serif;
  --font-display:'Manrope','Inter',-apple-system,sans-serif;
  --rad-card:24px; --rad-btn:20px; --rad-tag:16px;
  --wrap:1120px; --gutter:clamp(16px,4vw,32px);
  --t:.2s cubic-bezier(.4,0,.2,1);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#0F1115; --surface:#171A21; --surface2:#1E222B; --inset:#1E222B;
    --ink:#F3F4F6; --ink2:#8B93A7; --ink3:#8B93A7; --line:rgba(255,255,255,.09);
    --c-green-l:#18332E; --c-green-line:#24594F; --c-green-ink:#3CB9A4;
    --c-red-l:#351F25;   --c-red-line:#6A313A;   --c-red-ink:#FF747E;
    --c-blue-l:rgba(37,99,235,.18); --c-orange-l:rgba(245,158,11,.16);
    --c-live-soft:rgba(224,79,63,.22); --c-live-line:rgba(224,79,63,.40);
    --c-accent-l:rgba(224,79,63,.18); --c-accent-sh:rgba(224,79,63,.26);
    --shadow-card:0 8px 24px rgba(0,0,0,.35);
    --c-accent-ink:#EC6A5A; --c-blue-ink:#6B9BFF;
  }
}
:root[data-theme="dark"]{
  --bg:#0F1115; --surface:#171A21; --surface2:#1E222B; --inset:#1E222B;
  --ink:#F3F4F6; --ink2:#8B93A7; --ink3:#8B93A7; --line:rgba(255,255,255,.09);
  --c-green-l:#18332E; --c-green-line:#24594F; --c-green-ink:#3CB9A4;
  --c-red-l:#351F25;   --c-red-line:#6A313A;   --c-red-ink:#FF747E;
  --c-blue-l:rgba(37,99,235,.18); --c-orange-l:rgba(245,158,11,.16);
  --c-live-soft:rgba(224,79,63,.22); --c-live-line:rgba(224,79,63,.40);
  --c-accent-l:rgba(224,79,63,.18); --c-accent-sh:rgba(224,79,63,.26);
  --shadow-card:0 8px 24px rgba(0,0,0,.35);
  --c-accent-ink:#EC6A5A; --c-blue-ink:#6B9BFF;
}

*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;scroll-padding-block-start:76px;}
@media (prefers-reduced-motion: reduce){ html{scroll-behavior:auto;} *{animation:none!important;transition:none!important;} }
body{font-family:var(--font-ui);background:var(--bg);color:var(--ink);
  font-size:15px;line-height:21px;-webkit-font-smoothing:antialiased;overflow-x:hidden;}
h1,h2,h3{font-family:var(--font-display);font-weight:700;letter-spacing:-.018em;}
a{color:inherit;text-decoration:none;}
svg{display:block;}
.num{font-variant-numeric:tabular-nums;}
.wrap{max-inline-size:var(--wrap);margin-inline:auto;padding-inline:var(--gutter);}
.eyebrow{font-size:10px;line-height:13px;font-weight:600;letter-spacing:.06em;
  text-transform:uppercase;color:var(--ink3);}
:focus-visible{outline:2px solid var(--c-accent);outline-offset:2px;border-radius:6px;}
.skip{position:absolute;inset-block-start:-60px;inset-inline-start:12px;background:var(--ink);color:var(--bg);
  padding:10px 16px;border-radius:12px;z-index:100;transition:inset-block-start var(--t);}
.skip:focus{inset-block-start:12px;}

/* ===== ШАПКА ===== */
.hdr{position:sticky;inset-block-start:0;z-index:50;background:color-mix(in srgb,var(--bg) 88%,transparent);
  backdrop-filter:blur(20px) saturate(1.4);-webkit-backdrop-filter:blur(20px) saturate(1.4);
  border-block-end:1px solid var(--line);}
.hdr .in{display:flex;align-items:center;gap:26px;block-size:64px;}
.brand{display:flex;align-items:center;gap:9px;font-family:var(--font-display);
  font-size:20px;letter-spacing:-.02em;font-weight:700;}
/* знак ChiPro: пропорции 102:57 из оригинала, слэш берёт цвет текста (currentColor) */
.brand .mk{inline-size:50px;block-size:28px;flex:0 0 auto;color:var(--ink);}
.fcol .brand .mk{inline-size:43px;block-size:24px;}
.nav{display:flex;gap:22px;margin-inline-start:auto;font-size:14px;font-weight:500;color:var(--ink2);}
.nav a{transition:color var(--t);} .nav a:hover{color:var(--ink);}
.hdr .act{display:flex;align-items:center;gap:10px;margin-inline-start:auto;}
.nav + .act{margin-inline-start:0;}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:11px 20px;border-radius:var(--rad-btn);font-size:14px;font-weight:600;
  border:1px solid transparent;cursor:pointer;transition:transform .12s ease,opacity var(--t),background var(--t);white-space:nowrap;}
.btn:active{transform:scale(.98);}
.btn.pri{background:var(--c-accent);color:#fff;}
.btn.pri:hover{opacity:.9;}
.btn.sec{background:transparent;color:var(--ink);border-color:var(--line);}
.btn.sec:hover{background:var(--surface2);}
.btn.lg{padding:15px 26px;font-size:16px;}
.thm{inline-size:38px;block-size:38px;border-radius:12px;border:1px solid var(--line);
  background:transparent;color:var(--ink2);display:grid;place-content:center;cursor:pointer;font-size:15px;}
.thm:hover{color:var(--ink);background:var(--surface2);}
.ti{inline-size:19px;block-size:19px;flex:0 0 auto;}      /* значок темы: луна или солнце */
.nav a.on{color:var(--ink);font-weight:600;}                      /* активный раздел при прокрутке */

/* бургер и мобильное меню (Igor msg 2239): до 900px шапка = логотип + «Открыть» + бургер */
.burger{display:none;inline-size:40px;block-size:40px;border-radius:12px;border:1px solid var(--line);
  background:transparent;cursor:pointer;padding:11px 10px;flex-direction:column;justify-content:space-between;}
.burger span{display:block;block-size:2px;inline-size:100%;background:var(--ink);border-radius:2px;
  transition:transform var(--t),opacity var(--t);}
body.menu-on .burger span:nth-child(1){transform:translateY(7px) rotate(45deg);}
body.menu-on .burger span:nth-child(2){opacity:0;}
body.menu-on .burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
.mobcta{display:none;}
.mscrim{position:fixed;inset:0;z-index:60;background:rgba(0,0,0,.34);opacity:0;transition:opacity var(--t);}
body.menu-on .mscrim{opacity:1;}
.mmenu{position:fixed;z-index:70;inset-block-start:64px;inset-inline:12px;padding:10px;
  background:var(--surface);border:1px solid var(--line);border-radius:var(--rad-card);
  box-shadow:var(--shadow-card);display:flex;flex-direction:column;gap:2px;
  transform:translateY(-8px);opacity:0;transition:opacity var(--t),transform var(--t);}
body.menu-on .mmenu{transform:none;opacity:1;}
.mmenu a{padding:14px 16px;border-radius:16px;font-size:16px;font-weight:500;color:var(--ink2);}
.mmenu a.on{background:var(--c-accent-l);color:var(--c-accent-ink);font-weight:600;}
.mmenu a:active{background:var(--surface2);}
/* разделитель — отдельной линией на контейнере, а не рамкой кнопки: border на самой кнопке
   выглядел подчёркиванием, а обводка фокуса Safari дорисовывала вокруг него прямоугольник */
.mmenu .msep{block-size:1px;background:var(--line);margin:8px 10px 6px;}
.mthm{background:transparent;color:var(--ink2);font:inherit;font-size:16px;font-weight:500;cursor:pointer;
  display:flex;align-items:center;gap:12px;padding:14px 16px;border:0;border-radius:16px;text-align:start;}
.mthm:active{color:var(--ink);background:var(--surface2);}
/* Safari на iOS оставляет кольцо фокуса после ТАПА. Гасим его для указателя, для клавиатуры
   (:focus-visible) оставляем — и скругляем, чтобы оно совпадало с формой элемента. */
.mmenu,.mmenu a,.mthm,.burger{-webkit-tap-highlight-color:transparent;}
.mthm:focus:not(:focus-visible),.mmenu a:focus:not(:focus-visible),.burger:focus:not(:focus-visible){outline:none;}
.mthm:focus-visible,.mmenu a:focus-visible{outline:2px solid var(--c-accent);outline-offset:-2px;border-radius:16px;}

@media(max-width:900px){
  .nav{display:none;}
  .burger{display:flex;}
  .deskcta{display:none;}
  .mobcta{display:inline-flex;padding:11px 16px;}
  .thm{display:none;}                                             /* тема переехала внутрь меню */
  .hdr .in{gap:12px;}
  .nav + .act{margin-inline-start:auto;}   /* .nav скрыт, но остаётся в DOM — без этого группа
                                              кнопок прилипала к логотипу, а справа зияла пустота */
}
@media(min-width:901px){ .mmenu,.mscrim{display:none!important;} }
/* Название прячем только на совсем узких телефонах (SE и подобные). На iPhone 15 и шире
   места хватает, слово «ChiPro» остаётся (Igor msg 2241). */
@media(max-width:360px){ .hdr .brand{font-size:0;gap:0;} }

/* ===== ГЕРОЙ ===== */
.hero{padding-block:clamp(44px,7vw,84px) clamp(36px,6vw,64px);}
.hero .in{display:grid;gap:clamp(32px,5vw,56px);grid-template-columns:1fr;align-items:center;}
@media(min-width:940px){ .hero .in{grid-template-columns:1.05fr .95fr;} }
.hero h1{font-size:clamp(32px,5.4vw,52px);line-height:1.08;letter-spacing:-.028em;}
.hero .lead{margin-block-start:18px;font-size:clamp(16px,1.6vw,18px);line-height:1.55;color:var(--ink2);max-inline-size:52ch;}
.hero .cta{margin-block-start:28px;display:flex;flex-wrap:wrap;gap:12px;}
.hero .fine{margin-block-start:14px;font-size:12px;line-height:17px;color:var(--ink3);}
.trust{margin-block-start:26px;display:flex;flex-wrap:wrap;gap:10px 22px;font-size:12px;color:var(--ink2);}
.trust span{display:flex;align-items:center;gap:7px;}
.trust i{inline-size:5px;block-size:5px;border-radius:50%;background:var(--c-green);display:block;}

/* карточка сигнала — тот же язык, что в приложении и в канале */
.shot{background:var(--surface);border:1px solid var(--line);border-radius:var(--rad-card);
  box-shadow:var(--shadow-card);padding:18px 18px 16px;max-inline-size:440px;inline-size:100%;margin-inline:auto;}
.shot .top{display:flex;align-items:center;gap:10px;}
.shot .sym{font-size:14px;line-height:18px;font-weight:600;text-transform:uppercase;}
.pill{font-size:10px;line-height:13px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;
  padding:5px 9px;border-radius:var(--rad-tag);}
.pill.long{background:var(--c-green-l);color:var(--c-green-ink);border:1px solid var(--c-green-line);}
/* 🐞 29.07: класса .pill.short не было вовсе — на витрине стоял только LONG-пример, и SHORT
   рисовался голым текстом без подложки (видно на пломбе #0063). Токены те же, что у направления. */
.pill.short{background:var(--c-red-l);color:var(--c-red-ink);border:1px solid var(--c-red-line);}
.pill.q{background:var(--c-accent-l);color:var(--c-accent-ink);margin-inline-start:auto;border:1px solid transparent;}
.shot .px{margin-block-start:12px;display:flex;align-items:baseline;gap:9px;flex-wrap:wrap;}
.shot .px b{font-size:24px;line-height:28px;font-weight:700;letter-spacing:-.012em;}
.shot .px s{font-size:12px;color:var(--c-green-ink);text-decoration:none;font-weight:600;}
.shot .cv{margin-block-start:12px;border-radius:14px;overflow:hidden;background:var(--inset);}
.shot .grid3{margin-block-start:14px;display:grid;grid-template-columns:repeat(3,1fr);gap:10px;}
.shot .kv{background:var(--inset);border-radius:14px;padding:10px 11px;}
.shot .kv .k{font-size:10px;line-height:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ink3);}
.shot .kv .v{margin-block-start:5px;font-size:14px;line-height:18px;font-weight:600;}
.shot .seal{margin-block-start:12px;padding:10px 12px;border-radius:14px;background:var(--c-accent-l);
  font-size:11px;line-height:16px;color:var(--ink2);overflow-wrap:break-word;}
.shot .seal b{color:var(--ink);font-weight:600;}
.shot .seal code{font-family:ui-monospace,Menlo,Consolas,monospace;word-break:break-all;}

/* ===== СЕКЦИИ ===== */
section{padding-block:clamp(44px,6vw,76px);}
section.alt{background:var(--surface2);}
.shead{max-inline-size:64ch;}
.shead h2{margin-block-start:10px;font-size:clamp(24px,3.2vw,34px);line-height:1.15;}
.shead p{margin-block-start:12px;font-size:16px;line-height:24px;color:var(--ink2);}
.cards{margin-block-start:32px;display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--rad-card);
  padding:22px 22px 24px;box-shadow:var(--shadow-card);}
.card .n{inline-size:30px;block-size:30px;border-radius:10px;background:var(--inset);color:var(--ink2);
  display:grid;place-content:center;font-size:13px;font-weight:700;}
.card h3{margin-block-start:14px;font-size:17px;line-height:22px;font-weight:600;letter-spacing:normal;font-family:var(--font-ui);}
.card p{margin-block-start:8px;font-size:14px;line-height:21px;color:var(--ink2);}

/* ===== БЛОКИ ТЕКСТА Igor msg 2237 ===== */
.wide{margin-block-start:16px;font-size:16px;line-height:25px;color:var(--ink2);max-inline-size:74ch;}
.sub{margin-block-start:34px;font-size:19px;line-height:26px;font-weight:600;
  font-family:var(--font-ui);letter-spacing:normal;}
.lbl{font-size:14px;line-height:20px;font-weight:600;color:var(--ink);}
.twocol{margin-block-start:28px;display:grid;gap:20px;grid-template-columns:1fr;align-items:start;}
@media(min-width:840px){ .twocol{grid-template-columns:1fr 1fr;gap:32px;} }
.blist{margin-block-start:12px;display:flex;flex-direction:column;gap:10px;list-style:none;}
.blist li{position:relative;padding-inline-start:20px;font-size:15px;line-height:23px;color:var(--ink2);}
.blist li::before{content:"";position:absolute;inset-inline-start:2px;inset-block-start:9px;
  inline-size:6px;block-size:6px;border-radius:50%;background:var(--c-accent);}
.blist li b{color:var(--ink);font-weight:600;}
.note{background:var(--surface);border:1px solid var(--line);border-radius:var(--rad-card);
  padding:22px 24px;box-shadow:var(--shadow-card);}
.note p{font-size:15px;line-height:23px;color:var(--ink2);}
.note p + p{margin-block-start:12px;}
.note .btn{margin-block-start:18px;}
.pull{margin-block-start:22px;padding-inline-start:16px;border-inline-start:3px solid var(--c-accent);
  font-size:17px;line-height:26px;font-weight:600;color:var(--ink);max-inline-size:60ch;}

/* риск/прибыль: стоп 0,2-0,3 ATR против цели ~1 ATR */
.rrviz{margin-block-start:24px;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--rad-card);padding:22px 24px;box-shadow:var(--shadow-card);max-inline-size:640px;}
.rrow{display:grid;grid-template-columns:52px 1fr auto;align-items:center;gap:14px;}
.rrow + .rrow{margin-block-start:14px;}
.rk{font-size:13px;font-weight:600;color:var(--ink2);}
.rbar{block-size:14px;border-radius:7px;background:var(--inset);display:block;overflow:hidden;}
.rbar i{display:block;block-size:100%;border-radius:7px;}
.rbar.stop i{background:var(--c-red);}   /* НЕ .risk: это имя занято плашкой риск-дисклеймера в подвале */
.rbar.goal i{background:var(--c-green);}
.rv{font-size:13px;font-weight:600;color:var(--ink);white-space:nowrap;}
.rres{margin-block-start:18px;padding-block-start:16px;border-block-start:1px solid var(--line);
  font-size:14px;color:var(--ink2);}
.rres b{color:var(--ink);font-size:16px;}

/* безубыточный Win Rate */
.mtable{margin-block-start:12px;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--rad-card);padding:6px 20px 16px;box-shadow:var(--shadow-card);}
.mrow{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding-block:12px;
  font-size:15px;color:var(--ink2);}
.mrow + .mrow{border-block-start:1px solid var(--line);}
.mrow b{font-size:17px;color:var(--ink);font-weight:700;}
.mcap{margin-block-start:10px;font-size:11px;line-height:15px;font-weight:600;letter-spacing:.06em;
  text-transform:uppercase;color:var(--ink3);}
.exbox{margin-block-start:24px;background:var(--c-accent-l);border-radius:var(--rad-card);
  padding:20px 24px;max-inline-size:760px;}
.exbox .blist li::before{background:var(--c-accent);}

/* пломбы */
.sealbox{margin-block-start:30px;display:grid;gap:16px;grid-template-columns:1fr;}
@media(min-width:840px){ .sealbox{grid-template-columns:1fr 1fr;} }
.sealcard{background:var(--surface);border:1px solid var(--line);border-radius:var(--rad-card);padding:20px 22px;box-shadow:var(--shadow-card);}
.sealcard .st{display:flex;align-items:center;gap:9px;font-size:13px;font-weight:600;}
.sealcard .st i{inline-size:8px;block-size:8px;border-radius:50%;display:block;}
.sealcard .mono{margin-block-start:12px;font-family:ui-monospace,'SFMono-Regular',Menlo,Consolas,monospace;
  font-size:12px;line-height:19px;color:var(--ink2);word-break:break-all;background:var(--inset);
  border-radius:12px;padding:11px 12px;}
.sealcard .mono b{color:var(--ink);}
.sealnote{margin-block-start:16px;font-size:13px;line-height:20px;color:var(--ink2);}

/* статистика */
.tiers{margin-block-start:30px;display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));}
.tier{background:var(--surface);border:1px solid var(--line);border-radius:var(--rad-card);padding:22px;box-shadow:var(--shadow-card);}
.tier .tn{font-size:17px;line-height:22px;font-weight:600;}
.tier .td{margin-block-start:4px;font-size:13px;color:var(--ink2);}
.tier .big{margin-block-start:16px;font-size:36px;line-height:40px;font-weight:700;letter-spacing:-.02em;font-family:var(--font-display);}
.tier .big small{font-size:20px;}
.tier .bl{font-size:12px;color:var(--ink3);margin-block-start:2px;}
.tier .row{margin-block-start:16px;padding-block-start:14px;border-block-start:1px solid var(--line);
  display:flex;justify-content:space-between;font-size:13px;}
.tier .row.tight{margin-block-start:8px;padding-block-start:8px;border:0;}
.tier .row span{color:var(--ink2);}
.disc{margin-block-start:20px;font-size:12px;line-height:18px;color:var(--ink3);max-inline-size:76ch;}

/* тарифы */
.plans{margin-block-start:32px;display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));align-items:start;}
.plan{background:var(--surface);border:1px solid var(--line);border-radius:var(--rad-card);padding:24px;box-shadow:var(--shadow-card);position:relative;}
.plan.best{border-color:var(--c-accent);box-shadow:0 8px 24px var(--c-accent-sh);}
.plan .tag{position:absolute;inset-block-start:-11px;inset-inline-start:24px;background:var(--c-accent);color:#fff;
  font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:5px 10px;border-radius:var(--rad-tag);}
.plan .pn{font-size:17px;line-height:22px;font-weight:600;}
.plan .pp{margin-block-start:14px;font-size:30px;line-height:36px;font-weight:700;font-family:var(--font-display);letter-spacing:-.02em;}
.plan .pp small{font-size:14px;font-weight:600;color:var(--ink2);font-family:var(--font-ui);letter-spacing:normal;}
.plan .ps{margin-block-start:6px;font-size:13px;line-height:19px;color:var(--ink2);min-block-size:38px;}
.plan ul{margin-block-start:18px;display:flex;flex-direction:column;gap:9px;list-style:none;}
.plan li{display:flex;gap:9px;font-size:14px;line-height:20px;color:var(--ink2);}
.plan li b{color:var(--ink);font-weight:600;}
.plan li i{color:var(--c-green);font-style:normal;flex:0 0 auto;}
.plan li.no i{color:var(--ink3);} .plan li.no{color:var(--ink3);}
.plan .btn{margin-block-start:22px;inline-size:100%;}
.paynote{margin-block-start:20px;font-size:12px;line-height:18px;color:var(--ink3);max-inline-size:76ch;}

/* FAQ */
.faq{margin-block-start:28px;max-inline-size:800px;}
.faq details{border-block-end:1px solid var(--line);}
.faq summary{list-style:none;cursor:pointer;padding-block:18px;display:flex;align-items:center;gap:14px;
  font-size:16px;line-height:23px;font-weight:600;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:"+";margin-inline-start:auto;font-size:20px;color:var(--ink3);font-weight:400;transition:transform var(--t);}
.faq details[open] summary::after{transform:rotate(45deg);}
.faq .ans{padding-block-end:20px;font-size:15px;line-height:23px;color:var(--ink2);max-inline-size:70ch;}

/* низ */
.final{text-align:center;}
.final h2{font-size:clamp(24px,3.4vw,36px);line-height:1.12;}
.final p{margin-block-start:14px;font-size:16px;line-height:24px;color:var(--ink2);}
.final .cta{margin-block-start:26px;display:flex;justify-content:center;flex-wrap:wrap;gap:12px;}
footer{border-block-start:1px solid var(--line);padding-block:40px 48px;background:var(--surface2);}
.fgrid{display:grid;gap:28px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));}
.fcol h2{font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ink3);font-family:var(--font-ui);}
.fcol a,.fcol p{display:block;margin-block-start:10px;font-size:14px;line-height:20px;color:var(--ink2);}
.fcol a:hover{color:var(--ink);}
.risk{margin-block-start:30px;padding:16px 18px;border-radius:18px;background:var(--c-orange-l);
  font-size:12px;line-height:19px;color:var(--ink2);}
.risk b{color:var(--ink);}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .risk{color:#C9CFDB;} }
:root[data-theme="dark"] .risk{color:#C9CFDB;}
.copy{margin-block-start:22px;font-size:12px;color:var(--ink3);}
.ph{background:var(--c-orange-l);border-radius:6px;padding:0 5px;color:var(--ink);font-weight:600;}

/* ===== ЮРИДИЧЕСКИЕ СТРАНИЦЫ ===== */
.doc{padding-block:clamp(32px,5vw,56px) clamp(48px,7vw,84px);}
.doc .back{font-size:13px;color:var(--ink2);display:inline-flex;gap:7px;align-items:center;}
.doc .back:hover{color:var(--ink);}
.docbody{margin-block-start:22px;max-inline-size:74ch;}
.docbody h1{font-size:clamp(26px,3.6vw,36px);line-height:1.15;}
.docbody h2{margin-block-start:34px;font-size:21px;line-height:27px;}
.docbody h3{margin-block-start:24px;font-size:17px;line-height:23px;font-family:var(--font-ui);font-weight:600;letter-spacing:normal;}
.docbody p{margin-block-start:14px;font-size:15px;line-height:24px;color:var(--ink2);}
.docbody ul,.docbody ol{margin-block-start:12px;padding-inline-start:22px;}
.docbody li{margin-block-start:8px;font-size:15px;line-height:24px;color:var(--ink2);}
.docbody strong{color:var(--ink);font-weight:600;}
.docbody code{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:13px;background:var(--inset);
  border-radius:6px;padding:1px 5px;}
.docbody hr{margin-block:26px;border:0;border-block-start:1px solid var(--line);}
.docbody .tablewrap{margin-block-start:16px;overflow-x:auto;}
.docbody table{border-collapse:collapse;min-inline-size:100%;font-size:14px;}
.docbody th,.docbody td{border:1px solid var(--line);padding:9px 12px;text-align:start;vertical-align:top;color:var(--ink2);}
.docbody th{color:var(--ink);font-weight:600;background:var(--surface2);}
.docnote{margin-block-start:30px;padding:16px 18px;border-radius:18px;background:var(--c-orange-l);
  font-size:13px;line-height:20px;color:var(--ink2);}
.docnote b{color:var(--ink);}

/* ===== КАРТОЧКИ ПРОДУКТА (Igor 29.07: на сайте должно быть ровно то, что в приложении и канале)
   Оформление берёт токены темы, поэтому карточки одинаково живут в светлой и тёмной. Цвета
   направления (#089981/#F23645) и Live (#E04F3F) — фиксированные: это контракт оформления. */
.shotwrap{max-inline-size:440px;inline-size:100%;margin-inline:auto;}
.pcard{background:var(--surface);border:1px solid var(--line);border-radius:var(--rad-card);
  box-shadow:var(--shadow-card);padding:16px 16px 14px;}
.pchead{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.pchead .spacer{flex:1 1 auto;}
.pcsym{font-family:var(--font-display);font-size:20px;line-height:24px;font-weight:800;letter-spacing:-.01em;}
.pcnum{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12px;color:var(--ink3);}
.pctf{font-size:10px;line-height:13px;font-weight:700;letter-spacing:.05em;padding:5px 8px;
  border-radius:var(--rad-tag);background:var(--surface2);color:var(--ink2);border:1px solid var(--line);}
.pcstatus{margin-inline-start:auto;display:inline-flex;align-items:center;gap:6px;font-size:10px;
  line-height:13px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding:5px 9px;
  border-radius:var(--rad-tag);background:var(--surface2);color:var(--ink2);border:1px solid var(--line);}
.pcstatus i{inline-size:7px;block-size:7px;border-radius:50%;background:var(--ink3);}
.pcstatus.zone{color:var(--c-green-ink);background:var(--c-green-l);border-color:var(--c-green-line);}
.pcstatus.zone i{background:var(--c-green);}
.pcstatus.near{color:var(--c-orange);background:var(--c-orange-l);border-color:transparent;}
.pcstatus.near i{background:var(--c-orange);}
.pcstats{margin-block-start:14px;display:grid;grid-template-columns:repeat(4,1fr);gap:8px;
  padding-block-end:12px;border-block-end:1px solid var(--line);}
.pcstats .k{display:block;font-size:9px;line-height:12px;font-weight:600;letter-spacing:.06em;
  text-transform:uppercase;color:var(--ink3);}
.pcstats b{display:block;margin-block-start:4px;font-size:14px;line-height:18px;font-weight:700;}
.pcstats b.up{color:var(--c-green-ink);} .pcstats b.down{color:var(--c-red-ink);}
.pcchart{position:relative;margin-block:12px;border-radius:14px;overflow:hidden;background:var(--inset);}
.pcwrap{position:relative;display:block;}
.pclab{position:absolute;inset-inline-end:8px;transform:translateY(-50%);
  font-family:ui-monospace,Menlo,Consolas,monospace;font-size:11px;line-height:14px;
  padding:2px 6px;border-radius:8px;background:var(--surface);color:var(--ink2);
  border:1px solid var(--line);white-space:nowrap;}
.pcfoot{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;}
.pcfoot .k{display:block;font-size:9px;line-height:12px;font-weight:600;letter-spacing:.06em;
  text-transform:uppercase;color:var(--ink3);}
.pcfoot b{display:block;margin-block-start:4px;font-size:15px;line-height:19px;font-weight:700;}
.pcticker{margin-block-start:6px;font-family:var(--font-display);font-size:26px;line-height:30px;
  font-weight:800;letter-spacing:-.015em;}
.pccap{font-size:12px;line-height:18px;color:var(--ink2);font-family:ui-monospace,Menlo,Consolas,monospace;}
.pcbrand{margin-block-start:10px;padding-block-start:10px;border-block-start:1px solid var(--line);
  display:flex;justify-content:space-between;font-size:11px;color:var(--ink3);}
.pcbrand span:first-child{color:var(--c-accent-ink);font-weight:600;}
.pcard.seal{text-align:center;}
.pcard.seal .slock{color:var(--ink3);display:flex;justify-content:center;}  /* svg{display:block} глобально — центрируем контейнером */
.pcard.seal .slock svg{inline-size:26px;block-size:26px;}
.pcard.seal .stitle{margin-block-start:6px;font-size:12px;font-weight:700;letter-spacing:.22em;
  text-transform:uppercase;color:var(--ink2);}
.pcard.seal .ssub{margin-block:6px 14px;font-size:12px;color:var(--ink3);}
.pcard.seal .srow{display:flex;align-items:center;gap:9px;padding-block:9px;
  border-block-start:1px solid var(--line);text-align:start;}
.pcard.seal .srow .num{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12px;color:var(--ink2);}
.pcard.seal .srow code{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:11px;
  color:var(--ink3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.pcard.reveal .stitle{font-size:12px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;
  color:var(--ink2);}
.pcard.reveal .rrow{margin-block-start:10px;display:flex;gap:9px;align-items:flex-start;}
.pcard.reveal .rrow .num{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12px;color:var(--ink2);}
.pcard.reveal .rrow code{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:11px;
  line-height:16px;color:var(--c-accent-ink);overflow-wrap:anywhere;}
.pcard.reveal .rnote{margin-block-start:12px;font-size:12px;color:var(--ink3);}
.lbl.mt{margin-block-start:28px;}

/* --- экран согласий перед созданием аккаунта (00_internal_screens §1) --- */
.consent label{display:flex;gap:11px;align-items:flex-start;margin-block:14px;cursor:pointer;
  font-size:14.5px;line-height:1.5;}
.consent input[type=checkbox]{flex:none;inline-size:18px;block-size:18px;margin-block-start:3px;
  accent-color:var(--c-accent);}
.consent .btn{margin-block-start:10px;}

/* ============================== ЛЕНДИНГ (landing.html, ТЗ 31.07) ==============================
   Слой поверх токенов: те же цвета/шрифты/радиусы, больше воздуха и крупнее заголовки.
   Ничего из этого не трогает существующие страницы: все секции лендинга начинаются с .ld */
section[class^="ld"]{padding-block:clamp(64px,9vw,128px);}
.center{text-align:center;}
.shead.big h2{font-size:clamp(30px,4.6vw,46px);line-height:1.1;letter-spacing:-.025em;}
.shead.big{max-inline-size:70ch;}
.shead.big.center{margin-inline:auto;}
.shead.big .pull{margin-block-start:20px;}

/* --- герой --- */
.ldhero{padding-block:clamp(56px,8vw,110px) clamp(48px,7vw,90px);}
.ldhero .in{display:grid;gap:clamp(36px,5vw,64px);grid-template-columns:1fr;align-items:center;}
@media(min-width:960px){ .ldhero .in{grid-template-columns:1.04fr .96fr;} }
.ldhero h1{font-size:clamp(34px,5.8vw,60px);line-height:1.06;letter-spacing:-.03em;}
.ldhero .acc{color:var(--c-accent);}
.ldhero .lead{margin-block-start:20px;font-size:clamp(16px,1.7vw,19px);line-height:1.6;color:var(--ink2);max-inline-size:54ch;}
.ldhero .cta{margin-block-start:30px;display:flex;flex-wrap:wrap;gap:12px;}
/* сцена: настоящая карточка приложения, за ней — карточка канала */
.ldstage{position:relative;max-inline-size:480px;inline-size:100%;margin-inline:auto;}
.ldstage .front{position:relative;z-index:2;}
.ldstage .back{position:absolute;inset-block-start:-26px;inset-inline-end:-34px;z-index:1;
  transform:rotate(3deg) scale(.94);opacity:.55;filter:saturate(.9);pointer-events:none;}
@media(max-width:959px){ .ldstage .back,.ldstage .glow,.ldstage .spark{display:none;} }   /* на телефоне — одна карточка, без наслоения и декора (декор распирал страницу) */

/* --- сплит «без/с» (экраны 2 и 19) --- */
.duo{margin-block-start:40px;display:grid;gap:20px;grid-template-columns:1fr;align-items:stretch;}
@media(min-width:880px){ .duo{grid-template-columns:1fr 1fr;gap:28px;} }
.pane{border-radius:var(--rad-card);padding:26px 26px 28px;border:1px solid var(--line);}
.pane.chaos{background:var(--surface2);}
section.alt .pane.chaos{background:var(--bg);}
.pane.calm{background:var(--surface);box-shadow:var(--shadow-card);border-color:var(--c-accent-sh);}
.pane .pt{font-size:12px;line-height:16px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--ink3);}
.pane .pt.on{color:var(--c-accent-ink);}
.pane .blist,.pane .chain{margin-block-start:18px;}
.pane .pn2{margin-block-start:18px;font-size:13px;line-height:20px;color:var(--ink3);}
/* хаос чужих окон — абстрактные рамки, не интерфейс ChiPro */
.mess{margin-block-start:18px;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;}
.mess i{display:block;block-size:34px;border-radius:8px;border:1px dashed var(--line);background:var(--inset);}
.mess i:nth-child(2n){block-size:46px;} .mess i:nth-child(3n){opacity:.6;}

/* --- вертикальная цепочка этапов (экраны 3, 14, 19) --- */
.chain{margin-block-start:36px;list-style:none;display:flex;flex-direction:column;align-items:center;max-inline-size:520px;margin-inline:auto;}
.chain li{background:var(--surface);border:1px solid var(--line);border-radius:999px;
  padding:11px 22px;font-size:15px;line-height:21px;font-weight:500;color:var(--ink);text-align:center;}
.chain li + li{margin-block-start:26px;position:relative;}
.chain li + li::before{content:"";position:absolute;inset-block-start:-27px;inset-inline-start:50%;
  transform:translateX(-50%);block-size:28px;inline-size:2px;
  background:linear-gradient(var(--line) 60%,transparent 0) 0 0/2px 7px repeat-y;}
.chain li.hot{background:var(--c-accent);border-color:var(--c-accent);color:#fff;font-weight:600;box-shadow:0 8px 24px var(--c-accent-sh);}
.chain li.you{background:var(--ink);border-color:var(--ink);color:var(--bg);font-weight:600;}
.chain.small{align-items:stretch;margin-inline:0;max-inline-size:none;}
.chain.small li{padding:9px 16px;font-size:13.5px;line-height:19px;border-radius:14px;text-align:start;}
.chain.small li + li{margin-block-start:16px;}
.chain.small li + li::before{inset-block-start:-17px;block-size:18px;inset-inline-start:24px;transform:none;}
.chain.small.ok li{border-color:var(--c-green-line);background:var(--c-green-l);color:var(--c-green-ink);}
.chain.long{max-inline-size:560px;}

/* --- сетки карточек --- */
.cards.four{grid-template-columns:repeat(auto-fit,minmax(230px,1fr));margin-block-start:44px;}
.cards.three{grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin-block-start:44px;}
.cards + .pull,.duo + .pull{margin-block-start:36px;}

/* --- анатомия карточки (экран 4) --- */
.anat{margin-block-start:48px;display:grid;gap:24px;grid-template-columns:1fr;align-items:center;justify-items:center;}
@media(min-width:960px){ .anat{grid-template-columns:1fr auto 1fr;}
  .anat .tags.l{justify-items:end;} .anat .tags.r{justify-items:start;} }
.tags{list-style:none;display:grid;gap:14px;}
.tags li{background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:9px 18px;
  font-size:13.5px;font-weight:600;color:var(--ink2);box-shadow:var(--shadow-card);white-space:nowrap;}
@media(max-width:959px){ .tags{grid-auto-flow:column;grid-auto-columns:max-content;overflow-x:auto;
  max-inline-size:100%;padding-block:4px;} .tags li{box-shadow:none;} }
.undershot{margin-block-start:26px;text-align:center;font-size:15px;color:var(--ink2);}

/* --- воронка (экран 5) --- */
.funnel{margin-block-start:44px;text-align:center;}
.funnel .ft{font-size:15px;font-weight:600;color:var(--ink2);}
.fnk{margin-block:14px 12px;display:flex;flex-direction:column;align-items:center;gap:7px;}
.fnk span{display:block;block-size:9px;border-radius:6px;background:var(--c-accent-l);}
.fnk span:nth-child(1){inline-size:min(300px,64vw);}
.fnk span:nth-child(2){inline-size:min(190px,44vw);}
.fnk span:nth-child(3){inline-size:min(100px,26vw);background:var(--c-accent);}
.funnel .fm{font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--c-accent-ink);}
.fout{margin-block-start:18px;display:flex;flex-wrap:wrap;justify-content:center;gap:10px;}
.fout span{background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:10px 18px;
  font-size:14px;font-weight:600;box-shadow:var(--shadow-card);display:inline-flex;align-items:center;gap:8px;}
.fout span::before{content:"";inline-size:8px;block-size:8px;border-radius:50%;background:var(--c-accent);}

/* --- тёмная полоса: переход к главе 2 (ТЗ: «фон постепенно становится темнее») ---
   Внутри просто действуют токены тёмной темы, поэтому все компоненты живут без доработок;
   в тёмной теме полоса сливается со страницей — так и задумано. */
.band{--bg:#0F1115;--surface:#171A21;--surface2:#1E222B;--inset:#1E222B;
  --ink:#F3F4F6;--ink2:#8B93A7;--ink3:#8B93A7;--line:rgba(255,255,255,.09);
  --c-accent-ink:#EC6A5A;--c-blue-ink:#6B9BFF;
  --c-green-l:#18332E;--c-green-line:#24594F;--c-green-ink:#3CB9A4;
  --c-red-l:#351F25;--c-red-line:#6A313A;--c-red-ink:#FF747E;
  --c-accent-l:rgba(224,79,63,.18);--c-accent-sh:rgba(224,79,63,.26);
  --c-live-soft:rgba(224,79,63,.22);--c-live-line:rgba(224,79,63,.40);
  --shadow-card:0 8px 24px rgba(0,0,0,.35);
  background:var(--bg);color:var(--ink);}
.ldbridge{padding-block-end:clamp(40px,6vw,72px);}
.ldbridge .bcap{font-size:14px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--ink3);}
.ldbridge .bline{margin-block-start:16px;font-size:clamp(24px,3.6vw,38px);line-height:1.18;
  letter-spacing:-.022em;max-inline-size:26ch;margin-inline:auto;}
.ldbridge .shotwrap{margin-block-start:44px;}
.shotwrap.grow{max-inline-size:560px;}
.ldbridge .btn{margin-block-start:36px;}

/* --- точность направления (экран 6) --- */
.ldproof{padding-block-start:clamp(40px,6vw,72px);}
.proof{margin-block-start:44px;display:grid;gap:36px;grid-template-columns:1fr;align-items:center;}
@media(min-width:900px){ .proof{grid-template-columns:auto 1fr;gap:64px;} }
.pstat{display:flex;flex-direction:column;gap:8px;}
.pstat .pk{font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink3);}
.pstat .pv{font-family:var(--font-display);font-size:clamp(64px,11vw,124px);line-height:.95;
  font-weight:700;letter-spacing:-.04em;color:var(--c-accent);}
.pstat .pl{font-size:13px;line-height:19px;color:var(--ink3);max-inline-size:26ch;}
.ptxt p{font-size:16px;line-height:25px;color:var(--ink2);max-inline-size:56ch;}
.ptxt p + p{margin-block-start:14px;}
.ptxt .pull{margin-block-start:22px;}

/* --- контекст цифр (экран 8) --- */
.ctx{margin-block-start:40px;}
.kvgrid{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));}
.kvgrid .kv{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:16px 18px;}
.kvgrid .kv b{display:block;font-size:15px;font-weight:600;}
.kvgrid .kv span{display:block;margin-block-start:5px;font-size:13px;line-height:19px;color:var(--ink2);}
.ctx .pull{margin-block-start:32px;}

/* --- симулятор: единственное место с синим (контракт: синий = симуляция) --- */
.eyebrow.sim{color:var(--c-blue-ink);}
.blist.sim li::before{background:var(--c-blue);}
.btn.sim{background:var(--c-blue);color:#fff;margin-block-start:18px;}
.btn.sim:hover{opacity:.9;}

/* --- финал главы 2 --- */
.chips{margin-block-start:32px;display:flex;flex-wrap:wrap;gap:10px;list-style:none;}
.chips li{background:var(--surface);border:1px solid var(--line);border-radius:999px;
  padding:10px 18px;font-size:14px;font-weight:500;color:var(--ink2);}
.ldtrust .cta{margin-block-start:32px;display:flex;flex-wrap:wrap;gap:12px;}
.ldtrust .pull{margin-block-start:36px;}

/* --- три колонки (экран 15) --- */
.tri{margin-block-start:44px;display:grid;gap:32px;grid-template-columns:1fr;}
@media(min-width:900px){ .tri{grid-template-columns:1fr 1fr 1fr;gap:0;}
  .tri .tcol{padding-inline:32px;border-inline-start:1px solid var(--line);}
  .tri .tcol:first-child{padding-inline-start:0;border-inline-start:0;} }
.tri h3{font-size:19px;line-height:25px;}
.tri .blist{margin-block-start:16px;}

/* --- прочее --- */
.ldfree .cta,.ldfinal .cta{margin-block-start:36px;display:flex;flex-wrap:wrap;gap:12px;}
.ldfinal{text-align:center;padding-block:clamp(80px,12vw,160px);}
.ldfinal h2{font-size:clamp(32px,5.2vw,54px);line-height:1.08;letter-spacing:-.028em;}
.ldfinal .lead{margin-block-start:20px;font-size:clamp(16px,1.7vw,18px);line-height:1.6;
  color:var(--ink2);max-inline-size:62ch;margin-inline:auto;}
.ldfinal .lead b{color:var(--ink);}
.ldfinal .cta{justify-content:center;}
.ldfinal .disc{margin-inline:auto;}
.ldday .pull,.ldwhere .wide{margin-block-start:36px;}
.paynote{margin-block-start:24px;}

/* --- ЛЕНДИНГ: движение (ТЗ: только функциональные анимации; появление, лёгкое смещение) ---
   Все скрытые стартовые состояния живут под .ldjs: класс ставит скрипт, и он НЕ ставится при
   prefers-reduced-motion — без JS и при reduce страница полностью видима без анимаций. */
.ldjs .ldrv{opacity:0;translate:0 22px;transition:opacity .7s ease,translate .7s ease;}
.ldjs .ldrv.in{opacity:1;translate:0 0;}


/* фон героя: мягкое свечение + тонкая линия графика, медленный дрейф (ТЗ, экран 1) */
.ldstage .glow{position:absolute;inset:-12% -18%;z-index:0;pointer-events:none;border-radius:50%;
  background:radial-gradient(closest-side,var(--c-accent-l),transparent 72%);
  animation:ldglow 16s ease-in-out infinite alternate;}
.ldstage .spark{position:absolute;inset-block-start:-64px;inset-inline-end:-72px;z-index:0;
  inline-size:96%;color:var(--ink3);opacity:.10;pointer-events:none;
  animation:ldspark 38s linear infinite alternate;}
@keyframes ldglow{from{transform:translate3d(-3%,2%,0) scale(.96);}to{transform:translate3d(3%,-2%,0) scale(1.05);}}
@keyframes ldspark{from{transform:translateX(-2%);}to{transform:translateX(4%);}}

/* цепочки: узлы загораются сверху вниз; финальный акцент — «Уведомление» */
.ldjs .chain li{opacity:0;translate:0 12px;transition:opacity .5s ease,translate .5s ease;}
.ldjs .chain li{transition-delay:calc(var(--i,0)*.22s);}
.ldjs .chain.go li{opacity:1;translate:0 0;}
.ldjs .chain.go li.hot{animation:ldhot 1.5s ease 1.5s 2;}
@keyframes ldhot{0%,100%{box-shadow:0 8px 24px var(--c-accent-sh);}
  50%{box-shadow:0 0 0 10px var(--c-accent-l),0 8px 24px var(--c-accent-sh);}}

/* экран 19: окна чужих сервисов перетекают в сторону панели ChiPro */
.mess.flow i{transition:opacity .9s ease,transform .9s ease;}
.mess.flow i:nth-child(1){transition-delay:.05s;} .mess.flow i:nth-child(2){transition-delay:.2s;}
.mess.flow i:nth-child(3){transition-delay:.35s;} .mess.flow i:nth-child(4){transition-delay:.5s;}
.mess.flow i:nth-child(5){transition-delay:.65s;} .mess.flow i:nth-child(6){transition-delay:.8s;}
.mess.flow.go i{opacity:.18;transform:translateX(46px) scale(.85);}

/* переход глав: карточка растёт при прокрутке (ТЗ, экран 5→6).
   🔴 Было на animation-timeline: view() — это Chrome/Edge, в Safari и Firefox сцена не работала.
   Теперь рост считает скрипт (--p) в секции «СЦЕНЫ ГЛАВ 2-3» ниже: одинаково во всех браузерах. */

/* лёгкий подъём карточек при наведении (ТЗ: увеличение карточек при наведении) */
@media(hover:hover){
  .card,.plan,.kvgrid .kv,.pane.calm,.fout span{transition:transform .25s ease,box-shadow .25s ease;}
  .card:hover,.kvgrid .kv:hover,.fout span:hover{transform:translateY(-4px);box-shadow:var(--shadow-card);}
  .plan:hover{transform:translateY(-4px);}
  .pane.calm:hover{transform:translateY(-3px);}
}

/* мини-лента внутри панели «С ChiPro» (экран 2) */
.pane .shotwrap.mini{margin:18px 0 4px;max-inline-size:380px;}
.pane .shotwrap.mini .pcard{box-shadow:none;}

/* кнопки героя — в одну строку на десктопе */
.ldhero .cta .btn.lg{padding:14px 22px;font-size:15px;}

/* --- экран 10: история модели --- */
.ldhist .cta{margin-block-start:32px;display:flex;flex-wrap:wrap;gap:12px;}
.ldhist .pull{margin-block-start:32px;}

/* ================== СЦЕНЫ ГЛАВ 2-3 (визуальные концепции ТЗ дизайнера) ==================
   Прогресс прокрутки лежит в переменной --p (0..1), её ставит скрипт лендинга. Значение по
   умолчанию 1 = финальное состояние: без JS и при prefers-reduced-motion страница просто
   показывает результат, ничего не пропадает. Scroll-driven animations браузера НЕ используем —
   они есть только в Chrome, а сцены обязаны работать везде (Igor 31.07). */
[data-prog]{--p:1;}

/* --- переход к главе 2: карточки сходятся в одну, она растёт, загорается Reach Rate --- */
.mrgstage{position:relative;margin-block-start:56px;}
.mrgset{position:absolute;inset-block-start:0;inset-inline:0;display:flex;justify-content:center;
  pointer-events:none;z-index:1;}
.mrgset .mrgc{position:absolute;inline-size:min(262px,68vw);
  transform:translate3d(calc((1 - var(--p)) * var(--dx,0px)),calc((1 - var(--p)) * var(--dy,0px)),0)
            scale(calc(1 - .22 * var(--p)));
  opacity:calc((1 - var(--p) * 1.5) * .95);}
.mrgset .mrgc:nth-child(1){--dx:-352px;--dy:54px;}
.mrgset .mrgc:nth-child(2){--dx:0px;--dy:-52px;}
.mrgset .mrgc:nth-child(3){--dx:352px;--dy:54px;}
.mrgset .pcard{box-shadow:var(--shadow-card);}
/* итоговая карточка проявляется во второй половине пути — иначе четыре карточки наложились бы */
.ldbridge .shotwrap.grow{position:relative;z-index:2;
  transform:scale(calc(.84 + .16 * var(--p)));opacity:calc(var(--p) * 2 - .5);}
.rrflash{position:absolute;inset-block-end:-14px;inset-inline-start:50%;translate:-50% 0;
  display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:999px;
  background:var(--c-accent);color:#fff;font-size:12px;line-height:16px;white-space:nowrap;
  box-shadow:0 8px 24px var(--c-accent-sh);opacity:calc((var(--p) - .72) * 4);}
.rrflash b{font-weight:700;}
@media(max-width:879px){ .mrgset{display:none;} .ldbridge .shotwrap.grow{transform:none;opacity:1;} }

/* --- экран 6: график «разворачивается», следом появляется Reach Rate --- */
.unroll{margin-block-start:30px;clip-path:inset(0 0 calc((1 - var(--p)) * 100%) 0);
  opacity:calc(.2 + .8 * var(--p));}
.bigchart{background:var(--surface);border:1px solid var(--line);border-radius:var(--rad-card);
  padding:16px 18px;box-shadow:var(--shadow-card);}
.bchead{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.bclv{margin-inline-start:auto;font-size:12px;color:var(--ink3);}
.bcbody{margin-block-start:12px;}
.bcbody .pcwrap{position:relative;}

/* --- экран 13: отдельные сервисы сходятся в одно рабочее пространство --- */
.merge2{margin-block-start:40px;display:grid;gap:24px;grid-template-columns:1fr;align-items:center;}
@media(min-width:900px){ .merge2{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:36px;} }
.svc{list-style:none;display:flex;flex-wrap:wrap;gap:10px;}
.svc li{padding:9px 14px;border-radius:14px;border:1px dashed var(--line);color:var(--ink3);
  font-size:13px;line-height:18px;background:var(--surface);
  transform:translateX(calc(var(--p) * 34px)) scale(calc(1 - .08 * var(--p)));
  opacity:calc(1 - .72 * var(--p));}
.wsp{border:1px solid var(--line);border-radius:var(--rad-card);background:var(--surface2);
  overflow:hidden;box-shadow:var(--shadow-card);}
.wsptop{display:flex;align-items:center;gap:6px;padding:10px 14px;
  border-block-end:1px solid var(--line);background:var(--surface);}
.wsptop i{inline-size:8px;block-size:8px;border-radius:50%;background:var(--line);}
.wsptop span{margin-inline-start:8px;font-size:11px;font-weight:600;letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink3);}
.wspbody{padding:16px;display:grid;gap:14px;}
.wspbody.two{grid-template-columns:1fr;}
@media(min-width:820px){ .wspbody.two{grid-template-columns:1.05fr .95fr;align-items:start;} }
.fstack{display:grid;gap:14px;}

/* --- экран 14: метка «одна сделка» идёт по цепочке --- */
/* 🔴 container-type:size схлопывает высоту блока (size-containment) — позицию бегунка считаем
   процентами от высоты .pathwrap, это работает без контейнерных запросов. */
.pathwrap{position:relative;}
.runner{position:absolute;inset-inline-end:calc(50% - 330px);display:inline-flex;
  align-items:center;gap:8px;padding:7px 13px;border-radius:999px;background:var(--c-accent-l);
  color:var(--c-accent-ink);font-size:12px;line-height:16px;font-weight:600;white-space:nowrap;
  inset-block-start:calc(var(--p) * (100% - 34px));}
.runner i{inline-size:8px;block-size:8px;border-radius:50%;background:var(--c-accent);}
@media(max-width:1023px){ .runner{display:none;} }

/* --- экран 15: одна и та же сделка проходит три раздела, внимание идёт за ней --- */
.tri{position:relative;}
.trirun{position:absolute;inset-block-start:-34px;display:inline-flex;
  align-items:center;gap:8px;padding:6px 13px;border-radius:999px;background:var(--c-accent);
  color:#fff;font-size:11.5px;line-height:16px;font-weight:600;white-space:nowrap;z-index:1;
  box-shadow:0 8px 24px var(--c-accent-sh);
  inset-inline-start:calc(var(--p) * (100% - 210px));}
.trirun i{inline-size:7px;block-size:7px;border-radius:50%;background:#fff;}
.tri .tcol{transition:opacity .4s ease;}
/* ⚠ первым ребёнком .tri идёт бегунок, поэтому колонки — это nth-of-type 2, 3 и 4 */
.tri[data-stage="0"] .tcol:nth-of-type(3),
.tri[data-stage="0"] .tcol:nth-of-type(4),
.tri[data-stage="1"] .tcol:nth-of-type(2),
.tri[data-stage="1"] .tcol:nth-of-type(4),
.tri[data-stage="2"] .tcol:nth-of-type(2),
.tri[data-stage="2"] .tcol:nth-of-type(3){opacity:.45;}
@media(max-width:899px){ .trirun{display:none;} .tri .tcol{opacity:1;} }

/* --- экран 16: активная карточка превращается в завершённую, вокруг появляются разделы --- */
.afterstage{margin-block-start:36px;display:grid;gap:24px;grid-template-columns:1fr;
  align-items:start;}
@media(min-width:900px){ .afterstage{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;} }
.astack{position:relative;}
/* смена быстрая: если карточки долго держатся вместе, тексты наезжают друг на друга */
.astack .acard.live{opacity:calc(2.7 - var(--p) * 5);}
.astack .acard.done{position:absolute;inset-block-start:0;inset-inline:0;
  opacity:calc(var(--p) * 5 - 2.3);}
.around{list-style:none;display:flex;flex-wrap:wrap;gap:10px;}
.around li{padding:8px 14px;border-radius:999px;border:1px solid var(--line);
  background:var(--surface);font-size:12.5px;line-height:17px;color:var(--ink2);
  opacity:calc((var(--p) - .25) * 2);transform:translateY(calc((1 - var(--p)) * 10px));}
.aside{display:grid;gap:18px;}
.pcard.done .pcstats{grid-template-columns:repeat(3,1fr);}
.pcard.done .pcfoot{grid-template-columns:repeat(2,1fr);}
.pcard.jrn .stitle{font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
  color:var(--ink3);}
.jrow{display:flex;align-items:center;gap:10px;margin-block-start:12px;font-size:13px;
  line-height:18px;}
.jrow .num{font-size:12px;color:var(--ink3);}
.jsym{font-weight:700;}
.jout{margin-inline-start:auto;font-size:11.5px;}
.jout.ok{color:var(--c-green-ink);} .jout.no{color:var(--ink3);}

/* --- экран 17: параметры риска (поля приложения) --- */
.riskstage{margin-block-start:36px;max-inline-size:520px;}
.pcard.risk .rrows{margin-block-start:6px;}
.rr{display:flex;align-items:baseline;gap:12px;padding-block:9px;
  border-block-end:1px solid var(--line);}
.rr:last-child{border-block-end:0;}
.rr .k{flex:0 0 42%;font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;
  color:var(--ink3);}
.rr b{font-size:13.5px;line-height:19px;font-weight:600;}
.rr b.soft{color:var(--ink3);font-weight:500;}

/* --- экран 18: один продукт, несколько способов работы --- */
.frames{margin-block-start:40px;display:grid;gap:24px;grid-template-columns:1fr;align-items:end;}
@media(min-width:900px){ .frames{grid-template-columns:1.25fr .75fr 1fr;gap:28px;} }
.frm{margin:0;}
.frm .fbody{border:1px solid var(--line);border-radius:18px;background:var(--surface2);padding:14px;}
.frm .ftop{display:flex;align-items:center;gap:6px;padding:9px 12px;border:1px solid var(--line);
  border-block-end:0;border-start-start-radius:18px;border-start-end-radius:18px;
  background:var(--surface);}
.frm .ftop i{inline-size:8px;block-size:8px;border-radius:50%;background:var(--line);}
.frm .ftop span{margin-inline-start:8px;font-size:11px;font-weight:600;letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink3);}
.frm.desk .fbody{border-start-start-radius:0;border-start-end-radius:0;}
.frm.phone .fbody{border-radius:26px;padding:12px;max-inline-size:280px;margin-inline:auto;}
.frm figcaption{margin-block-start:12px;text-align:center;font-size:12px;font-weight:600;
  letter-spacing:.06em;text-transform:uppercase;color:var(--ink3);}
.frm .pcard{box-shadow:none;}
/* на телефоне рамка «телефон» не нужна — пользователь и так смотрит с телефона, а три одинаковые
   карточки подряд превращаются в простыню */
@media(max-width:899px){ .frm.phone{display:none;} }

/* --- экран 20 и финал: рабочее пространство целиком --- */
.freeview,.finalspace{margin-block-start:36px;}
.finalspace{transform:scale(calc(.94 + .06 * var(--p)));opacity:calc(.55 + .45 * var(--p));}
.ldfinal .wsp{text-align:start;}

/* ============ ТЕЛЕФОН ============
   🔴 iPhone/Safari 31.07 (Igor): сцены, привязанные к прокрутке, на телефоне застревали
   на середине — ярлыки бледные, колонка приглушена, карточка ещё не проявилась и на её месте
   пустота. Палец пролетает экран мгновенно, следить за ним бессмысленно. Поэтому на узком
   экране скрипт проигрывает сцену целиком по появлению блока (см. landing.html), а CSS
   остаётся прежним. Здесь — только то, что на телефоне обязано лежать иначе. */
@media(max-width:899px){
  /* колонки экрана 15 подсвечиваются по прокрутке — на телефоне все три равны */
  .tri .tcol{opacity:1!important;}
  /* бейдж Reach Rate на телефоне стоит ПОД карточкой, а не наезжает на её нижнюю строку */
  .rrflash{position:static!important;translate:none!important;margin-block-start:16px;
    align-self:center;}
  .ldbridge .shotwrap.grow{display:flex;flex-direction:column;align-items:center;}
}

/* экран 4: подписи к карточке переносятся по строкам, а не уезжают за край экрана
   (было: горизонтальная прокрутка — на телефоне читалось как обрезанный блок) */
@media(max-width:959px){
  .tags{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;overflow:visible;
    max-inline-size:100%;}
}

/* экран 2: «окна чужих сервисов» — с шапкой и парой строк содержимого, иначе пустые
   пунктирные прямоугольники читаются как незагрузившиеся картинки (Igor, iPhone) */
.mess i{background-image:linear-gradient(var(--line),var(--line)),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 20' preserveAspectRatio='none'%3E%3Cpolyline points='0,16 7,11 14,14 21,6 28,9 35,3 42,7 49,2 60,5' fill='none' stroke='%239CA3AF' stroke-width='1.6' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-size:100% 7px,calc(100% - 18px) calc(100% - 22px);
  background-position:0 0,9px 15px;background-repeat:no-repeat;}

/* ================== ЖИВЫЕ БЛОКИ ==================
   🔴 Igor, iPhone 31.07: «на экране ничего не происходит». Одноразовые появления при
   прокрутке на телефоне не читаются как жизнь. Ниже — постоянное, но сдержанное движение
   ТОЛЬКО в иллюстративных блоках (хаос без ChiPro, воронка отбора, цепочка анализа, фон
   героя). Тексты, карточки с данными и кнопки не двигаются: стиль-ТЗ запрещает мельтешение.
   При prefers-reduced-motion всё это гасится глобальным сбросом в начале файла. */

/* смена карточки в живом hero: старая уходит вниз, новая проявляется */
.ldstage .front{transition:opacity .24s ease,transform .24s ease;}
.ldstage .front.swap{opacity:0;transform:translateY(8px);}

/* экран 2: «десятки открытых графиков, постоянное переключение» — окна оживают по очереди,
   как будто в них что-то происходит и внимание прыгает между ними */
.mess i{animation:ldwin 6s ease-in-out infinite;}
.mess i:nth-child(2){animation-delay:.5s;} .mess i:nth-child(3){animation-delay:1.1s;}
.mess i:nth-child(4){animation-delay:1.7s;} .mess i:nth-child(5){animation-delay:2.3s;}
.mess i:nth-child(6){animation-delay:2.9s;} .mess i:nth-child(7){animation-delay:3.5s;}
.mess i:nth-child(8){animation-delay:4.1s;} .mess i:nth-child(9){animation-delay:4.7s;}
@keyframes ldwin{
  0%,72%,100%{border-color:var(--line);background-color:var(--inset);transform:none;}
  78%{border-color:var(--c-accent-l);background-color:var(--surface);transform:translateY(-2px);}
  86%{border-color:var(--line);background-color:var(--inset);transform:none;}
}

/* экран 5: воронка отбора — поток идёт сверху вниз, отобранные возможности загораются
   по очереди (ТЗ: «тысячи движений рынка -> ChiPro анализирует -> три возможности») */
.fout span{animation:ldpick 5.1s ease-in-out infinite;}
.fout span:nth-child(2){animation-delay:1.7s;} .fout span:nth-child(3){animation-delay:3.4s;}
@keyframes ldpick{
  0%,60%,100%{box-shadow:none;border-color:var(--line);}
  22%{box-shadow:0 8px 24px var(--c-accent-sh);border-color:var(--c-accent);}
  42%{box-shadow:none;border-color:var(--line);}
}
.fout span::before{animation:lddot 5.1s ease-in-out infinite;}
.fout span:nth-child(2)::before{animation-delay:1.7s;}
.fout span:nth-child(3)::before{animation-delay:3.4s;}
@keyframes lddot{0%,60%,100%{transform:scale(1);}22%{transform:scale(1.6);}}

/* экраны 3 и 14: по цепочке анализа постоянно идёт импульс сверху вниз — видно, что система
   работает в фоне, а не нарисована один раз */
.ldjs .chain.go li{animation:ldpulse 6s ease-in-out infinite;
  animation-delay:calc(var(--i,0) * .28s);}
@keyframes ldpulse{
  0%,26%,100%{box-shadow:none;}
  8%{box-shadow:0 0 0 6px var(--c-accent-l);}
  18%{box-shadow:none;}
}
.ldjs .chain.go li.hot{animation:ldhotloop 6s ease-in-out infinite;
  animation-delay:calc(var(--i,0) * .28s);}
@keyframes ldhotloop{
  0%,26%,100%{box-shadow:0 8px 24px var(--c-accent-sh);}
  8%{box-shadow:0 0 0 12px var(--c-accent-l),0 8px 24px var(--c-accent-sh);}
}

/* экран 19: окна чужих сервисов утекают в сторону ChiPro не один раз, а по кругу */
.mess.flow.go i{animation:ldflowaway 7s ease-in-out infinite;}
.mess.flow.go i:nth-child(2){animation-delay:.3s;} .mess.flow.go i:nth-child(3){animation-delay:.6s;}
.mess.flow.go i:nth-child(4){animation-delay:.9s;} .mess.flow.go i:nth-child(5){animation-delay:1.2s;}
.mess.flow.go i:nth-child(6){animation-delay:1.5s;}
@keyframes ldflowaway{
  0%{opacity:1;transform:none;}
  45%{opacity:.14;transform:translateX(52px) scale(.82);}
  70%{opacity:.14;transform:translateX(52px) scale(.82);}
  100%{opacity:1;transform:none;}
}

/* фон героя: график живее дрейфует (ТЗ, экран 1: «на фоне медленно движутся графики») */
.ldstage .spark{animation:ldspark2 26s ease-in-out infinite alternate;}
@keyframes ldspark2{
  from{transform:translate3d(-3%,4px,0) scale(1);}
  to{transform:translate3d(5%,-6px,0) scale(1.04);}
}

/* ================== РИСОВАННЫЕ СЦЕНЫ (SVG) ==================
   Igor 31.07: «понаставлял примитивов». Пунктирные плашки заменяются векторными сценами —
   окна графиков со свечами, лента уведомлений, курсор. Цвета берутся токенами (SVG лежит
   в разметке, не картинкой), поэтому сцена живёт в обеих темах и остаётся резкой на любом
   экране. Движение — ниже; при prefers-reduced-motion гаснет глобальным сбросом. */
.scene{inline-size:100%;block-size:auto;margin-block-start:18px;display:block;overflow:visible;}

/* статус «В ЗОНЕ ВХОДА» на карточке пульсирует ровно так же, как в приложении
   (.vx .st-zone .pd, keyframes pulse 1.7s) — на витрине карточка обязана вести себя как живая */
.pcstatus.zone i{animation:pulse 1.7s infinite;}
@keyframes pulse{0%{box-shadow:0 0 0 0 currentColor;}70%{box-shadow:0 0 0 6px transparent;}100%{}}

/* --- экран 2: как выглядит работа без ChiPro --- */
.chaos-scene .win rect{fill:var(--surface);stroke:var(--line);stroke-width:1.2;}
.chaos-scene .win .bar{fill:var(--inset);}
.chaos-scene .win .dot{fill:var(--line);stroke:none;}
.chaos-scene .candles path{stroke-width:5;stroke-linecap:round;fill:none;}
.chaos-scene .candles .up{stroke:var(--c-green);}
.chaos-scene .candles .dn{stroke:var(--c-red);}
.chaos-scene .toast rect{fill:var(--surface);stroke:var(--line);stroke-width:1.2;}
.chaos-scene .toast .line{fill:var(--ink3);stroke:none;opacity:.45;}
.chaos-scene .toast .line.s{opacity:.28;}
.chaos-scene .toast .mark{fill:var(--c-accent);stroke:none;}
.chaos-scene .cursor{fill:var(--ink);stroke:var(--bg);stroke-width:1.2;}

/* окна перекрывают друг друга и по очереди выходят вперёд — «постоянное переключение» */
.chaos-scene .win{transform-box:fill-box;transform-origin:center;
  animation:ldswitch 9s ease-in-out infinite;}
.chaos-scene .w2{animation-delay:2.25s;} .chaos-scene .w3{animation-delay:4.5s;}
.chaos-scene .w4{animation-delay:6.75s;}
@keyframes ldswitch{
  0%,22%,100%{opacity:.55;transform:scale(.985);}
  6%{opacity:1;transform:scale(1.015);}
  16%{opacity:1;transform:scale(1);}
}
/* уведомления приходят одно за другим и никуда не деваются */
.chaos-scene .toast{animation:ldtoast 6s ease-in-out infinite;}
.chaos-scene .t2{animation-delay:.9s;} .chaos-scene .t3{animation-delay:1.8s;}
@keyframes ldtoast{
  0%,72%,100%{opacity:.3;transform:translateX(10px);}
  10%{opacity:1;transform:translateX(0);}
  60%{opacity:.75;transform:translateX(0);}
}
/* курсор мечется между окнами — «часы анализа» */
.chaos-scene .cursor{animation:ldcursor 9s cubic-bezier(.6,0,.3,1) infinite;}
@keyframes ldcursor{
  0%{transform:translate(180px,150px);}
  12%{transform:translate(180px,150px);}
  25%{transform:translate(330px,86px);}
  37%{transform:translate(330px,86px);}
  50%{transform:translate(404px,220px);}
  62%{transform:translate(404px,220px);}
  75%{transform:translate(200px,300px);}
  88%{transform:translate(200px,300px);}
  100%{transform:translate(180px,150px);}
}

/* --- экран 13: отдельные сервисы затягивает в одно рабочее пространство --- */
.tools-scene{max-inline-size:420px;margin-inline:auto;}
.tools-scene .tool rect{fill:var(--surface);stroke:var(--line);stroke-width:1.2;}
.tools-scene .tool .bar{fill:var(--inset);}
.tools-scene .tool .dot{fill:var(--line);stroke:none;}
.tools-scene .tool text{fill:var(--ink2);font-family:var(--font-ui);font-size:12px;font-weight:600;}
.tools-scene .tool .line{fill:var(--ink3);stroke:none;opacity:.4;}
.tools-scene .tool .line.s{opacity:.25;}
.tools-scene .tool{transform-box:fill-box;transform-origin:center;
  animation:ldsuck 7s ease-in-out infinite;animation-delay:var(--d,0s);}
@keyframes ldsuck{
  0%,8%{opacity:1;transform:none;}
  46%{opacity:.22;transform:translate(78px,26px) scale(.72);}
  62%{opacity:.22;transform:translate(78px,26px) scale(.72);}
  84%,100%{opacity:1;transform:none;}
}
.tools-scene .arrow{fill:none;stroke:var(--c-accent);stroke-width:1.6;opacity:.35;
  stroke-dasharray:6 8;animation:ldarrow 1.6s linear infinite;animation-delay:var(--d,0s);}
@keyframes ldarrow{to{stroke-dashoffset:-28;}}

/* --- экран 19: окна утекают в единый интерфейс справа --- */
.flow-scene{max-inline-size:320px;}
.flow-scene .fw rect{fill:var(--surface);stroke:var(--line);stroke-width:1.1;}
.flow-scene .fw .bar{fill:var(--inset);}
.flow-scene .candles path{stroke-width:3.4;stroke-linecap:round;}
.flow-scene .candles .up{stroke:var(--c-green);}
.flow-scene .candles .dn{stroke:var(--c-red);}
.flow-scene .fw{transform-box:fill-box;transform-origin:center;
  animation:ldsweep 8s ease-in-out infinite;animation-delay:var(--d,0s);}
@keyframes ldsweep{
  0%,6%{opacity:1;transform:none;}
  44%{opacity:.22;transform:translateX(96px) scale(.78);}
  66%{opacity:.22;transform:translateX(96px) scale(.78);}
  88%,100%{opacity:1;transform:none;}
}

/* --- экран 5: отбор (ситуации заходят -> сито -> лишнее отсеивается -> проходит сигнал) ---
   Логика Igor 31.07: «графики собираются, отметаются, а годное попадает как сигнал». */
.sieve-scene{margin-block:18px 12px;max-inline-size:600px;margin-inline:auto;}
.sieve-scene .cand rect{fill:var(--surface);stroke:var(--line);stroke-width:1.1;}
.sieve-scene .candles path{stroke-width:3.2;stroke-linecap:round;}
.sieve-scene .candles .up{stroke:var(--c-green);}
.sieve-scene .candles .dn{stroke:var(--c-red);}
.sieve-scene .mesh{stroke:var(--c-accent);stroke-width:2;opacity:.5;
  stroke-dasharray:14 10;animation:ldmesh 2.4s linear infinite;}
.sieve-scene .mesh.d{opacity:.28;stroke-dasharray:8 14;animation-direction:reverse;}
@keyframes ldmesh{to{stroke-dashoffset:-24;}}

/* верхний ряд: ситуации подходят к отбору волной */
.sieve-scene .cand{transform-box:fill-box;transform-origin:center;
  animation:ldcome 6.4s ease-in-out infinite;animation-delay:var(--d,0s);}
/* ⚠ ни одна фаза не должна быть пустой: на статичном взгляде пустая сцена читается как баг,
   поэтому минимальная непрозрачность — не ноль, а призрак */
@keyframes ldcome{
  0%{opacity:.22;transform:translateY(-14px);}
  14%{opacity:1;transform:none;}
  62%{opacity:1;transform:none;}
  78%{opacity:.3;transform:translateY(16px) scale(.93);}
  90%,100%{opacity:.22;transform:translateY(-14px);}
}
/* нижний ряд: отсеянное падает и гаснет */
.sieve-scene .cand[class*="r"]{animation-name:lddrop2;}
@keyframes lddrop2{
  0%,10%{opacity:.18;transform:translateY(-18px) scale(.95);}
  30%{opacity:.9;transform:none;}
  56%{opacity:.55;transform:translateY(18px) rotate(-3deg);}
  78%,100%{opacity:.18;transform:translateY(40px) rotate(-6deg) scale(.88);}
}
/* прошедший отбор превращается в сигнал */
.sieve-scene .passed rect{fill:var(--surface);stroke:var(--c-accent);stroke-width:1.6;}
.sieve-scene .passed .pd{fill:var(--c-accent);}
.sieve-scene .passed text{fill:var(--ink);font-family:var(--font-ui);font-size:13px;
  font-weight:700;}
.sieve-scene .passed .ln{fill:var(--ink3);opacity:.45;}
.sieve-scene .passed .ln.s{opacity:.28;}
.sieve-scene .passed{transform-box:fill-box;transform-origin:center;
  animation:ldpassed 6.4s ease-in-out infinite;}
@keyframes ldpassed{
  0%,36%{opacity:.2;transform:translateY(-12px) scale(.95);}
  56%{opacity:1;transform:none;}
  94%{opacity:1;transform:none;}
  100%{opacity:.2;transform:scale(.97);}
}

/* мобильные варианты сцен: на телефоне отдельная композиция, а не сжатый десктоп
   (Igor 31.07: «для мобильной версии нужна другая вёрстка, чтобы логика соблюдалась») */
.scene.mob{display:none;}
@media(max-width:719px){
  .scene.mob{display:block;}
  .scene:not(.mob){display:none;}
  .sieve-scene.mob{max-inline-size:none;}
  .tools-scene.mob{max-inline-size:none;}
}

/* --- экран 6: сцена «как приходит сигнал» (механика из онбординга приложения) --- */
.story{margin-block-start:30px;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--rad-card);padding:16px 18px 12px;box-shadow:var(--shadow-card);}
.sthead{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-block-end:8px;}
.stnum{margin-inline-start:auto;font-size:12px;color:var(--ink3);}
.stchart{display:block;inline-size:100%;block-size:auto;}
.stchart text{font-family:var(--font-ui);}
/* бары появляются по одному, как в онбординге (ocnd) */
.stbar{opacity:0;transform:translateY(7px);transition:opacity .26s ease,transform .26s ease;}
.stbar.on{opacity:1;transform:none;}
.stln{opacity:0;transition:opacity .5s ease;}
.stln.on{opacity:1;}
.stmk{opacity:0;transform:scale(.4);transform-box:fill-box;transform-origin:center;
  transition:opacity .3s ease,transform .38s cubic-bezier(.3,1.6,.4,1);}
.stmk.on{opacity:1;transform:scale(1);}
.stview{transition:transform .5s cubic-bezier(.3,.7,.25,1);will-change:transform;}
.stmsg{min-block-size:24px;margin-block-start:8px;text-align:center;font-size:13.5px;
  font-weight:600;color:var(--ink3);}
.stmsg .acc{color:var(--c-accent-ink);} .stmsg .ok{color:var(--c-green-ink);}
.stmsg .far{color:#6682FF;}
@media(max-width:719px){
  .story{padding:12px 12px 10px;}
  .stchart{min-block-size:200px;}
}

/* свечи в сценах: фитиль линией, тело прямоугольником — как на настоящем графике */
.scene .up .wick,.scene .up .body{stroke:var(--c-green);fill:var(--c-green);}
.scene .dn .wick,.scene .dn .body{stroke:var(--c-red);fill:var(--c-red);}
.scene .wick{stroke-width:1.4;fill:none;stroke-linecap:round;}
.scene .body{stroke:none;}

/* ================================================================================
   РЕДИЗАЙН ЛЕНДИНГА (.ld2) — ТЗ 02.08, docs/plans/landing_redesign_tz_2026-08-02.md.
   Премиальный тёмный fintech. Два смысловых цвета (решение Igor 02.08):
   оранжевый #E04F3F — возможность и действие; синий #002FED — система и доказательства.
   Тема только тёмная, поэтому переключатель темы на этой странице спрятан.
   ================================================================================ */
body.ld2{
  /* токены ТЗ п.1.2 (оранжевый заменён на фирменный Live по решению Igor) */
  --bg-primary:#08090D; --bg-secondary:#0D0F15; --bg-tertiary:#12151D;
  --bg-elevated:#171A23; --bg-deep:#06070A;
  --text-primary:#F5F6F8; --text-secondary:#A3A7B2; --text-muted:#707580;
  --border-default:rgba(255,255,255,.08); --border-strong:rgba(255,255,255,.14);
  --orange:#E04F3F; --orange-soft:rgba(224,79,63,.13); --orange-line:rgba(224,79,63,.30);
  --orange-glow:rgba(224,79,63,.22);
  --brand-blue:#002FED; --brand-blue-light:#6682FF; --brand-blue-soft:rgba(0,47,237,.13);
  --brand-blue-surface:rgba(0,47,237,.20); --brand-blue-line:rgba(0,47,237,.34);
  --brand-blue-glow:rgba(0,47,237,.24);
  /* мост к общим токенам: живые карточки (.pcard) и шапка перекрашиваются сами */
  --bg:var(--bg-primary); --surface:var(--bg-tertiary); --surface2:var(--bg-elevated);
  --inset:#0D1017; --ink:var(--text-primary); --ink2:var(--text-secondary);
  --ink3:var(--text-muted); --line:var(--border-default);
  --c-accent:var(--orange); --c-accent-ink:#EC6A5A;
  --c-accent-l:var(--orange-soft); --c-accent-sh:var(--orange-glow);
  --c-blue-ink:var(--brand-blue-light); --c-blue-l:var(--brand-blue-soft);
  --c-green-l:#122B27; --c-green-line:#1F4E45; --c-green-ink:#3CB9A4;
  --c-red-l:#331F25; --c-red-line:#5E2E36; --c-red-ink:#FF747E;
  --c-live-soft:rgba(224,79,63,.22); --c-live-line:rgba(224,79,63,.40);
  --shadow-card:0 18px 48px rgba(0,0,0,.22);
  background:var(--bg-primary); color:var(--text-primary);
}
/* ---- общий каркас ---- */
.ld2 .wrap{max-inline-size:1240px;}
.ld2 main section{padding-block:144px;}
.ld2 .thm,.ld2 .mthm,.ld2 .msep{display:none;}     /* тема одна — тёмная */
.ld2 h1,.ld2 h2,.ld2 h3{font-family:var(--font-display);}
.ld2 h2{font-size:clamp(44px,4vw,60px);line-height:1.05;font-weight:620;
  letter-spacing:-.045em;max-inline-size:900px;}
.ld2 h3{font-size:28px;line-height:1.18;font-weight:600;letter-spacing:-.025em;}
.ld2 p{font-size:18px;line-height:1.65;}
.ld2 .l2head{margin-block-end:56px;}
.ld2 .l2head p:not(.l2label){margin-block-start:18px;color:var(--text-secondary);
  max-inline-size:680px;}
.ld2 .l2head.center{text-align:center;}
.ld2 .l2head.center h2,.ld2 .l2head.center p:not(.l2label){margin-inline:auto;}
.ld2 .l2label{font-size:12px;line-height:16px;font-weight:600;letter-spacing:.08em;
  text-transform:uppercase;color:var(--text-muted);margin-block-end:16px;}
.ld2 .l2label.blue{color:var(--brand-blue-light);}
.ld2 .l2note{font-size:14px;line-height:1.55;color:var(--text-muted);margin-block-start:32px;}
.ld2 .l2note.center{text-align:center;}
.ld2 .l2note a{color:var(--brand-blue-light);}
.ld2 .center{text-align:center;}

/* ---- кнопки ---- */
.l2btn{display:inline-flex;align-items:center;justify-content:center;block-size:52px;
  padding-inline:26px;border-radius:12px;font-size:15px;font-weight:600;letter-spacing:-.01em;
  transition:filter var(--t),background var(--t),border-color var(--t);}
.l2btn.pri{background:var(--orange);color:#fff;}
.l2btn.pri:hover{filter:brightness(1.08);}
.l2btn.sec{border:1px solid var(--border-strong);color:var(--text-primary);}
.l2btn.sec:hover{background:rgba(255,255,255,.05);}
.l2btn.sm{block-size:42px;padding-inline:18px;font-size:14px;border-radius:10px;}

/* ---- фирменная скобка (ТЗ п.6) — на странице не более 5-6 ---- */
.brk-b,.brk-o{position:relative;padding-inline-start:24px;}
.brk-b::before,.brk-o::before{content:"";position:absolute;inset-inline-start:0;
  inset-block:8px;inline-size:4px;border-radius:0 4px 4px 0;}
.brk-b::before{background:var(--brand-blue);
  box-shadow:0 0 18px color-mix(in srgb,var(--brand-blue) 24%,transparent);}
.brk-o::before{background:var(--orange);
  box-shadow:0 0 18px color-mix(in srgb,var(--orange) 24%,transparent);}
.brk-b.large::before,.brk-o.large::before{inset-block:20px;inline-size:5px;
  border-radius:0 5px 5px 0;}

/* ---- glass (ТЗ п.7) ---- */
.ld2 .glass-p{background:rgba(18,21,29,.62);border:1px solid rgba(255,255,255,.08);
  border-radius:20px;backdrop-filter:blur(16px) saturate(1.1);
  -webkit-backdrop-filter:blur(16px) saturate(1.1);
  box-shadow:0 18px 48px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.035);}
.ld2 .glass-lg{background:rgba(18,21,29,.76);border:1px solid rgba(255,255,255,.10);
  border-radius:28px;backdrop-filter:blur(22px) saturate(1.15);
  -webkit-backdrop-filter:blur(22px) saturate(1.15);
  box-shadow:0 32px 80px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.05);}
.ld2 .glass-pill{background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.08);
  border-radius:999px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);}

/* ---- шапка: прозрачная, при прокрутке фон + blur (ТЗ п.10) ---- */
.ld2 .hdr{background:transparent;border-block-end:1px solid transparent;
  backdrop-filter:none;-webkit-backdrop-filter:none;
  transition:background var(--t),border-color var(--t);}
.ld2 .hdr .in{block-size:72px;}
.ld2 .nav{font-size:14px;gap:30px;color:var(--text-secondary);}
.ld2 .nav a.on,.ld2 .nav a:hover{color:var(--text-primary);}
body.ld2.scrolled .hdr{background:rgba(8,9,13,.76);backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);border-block-end:1px solid rgba(255,255,255,.06);}
.ld2 .hdr .btn.pri{block-size:40px;padding-inline:17px;border-radius:10px;
  background:rgba(255,255,255,.08);color:var(--text-primary);box-shadow:none;}
.ld2 .hdr .btn.pri:hover{background:rgba(255,255,255,.13);}

/* ---- живые карточки на тёмном ---- */
.ld2 .pcard{box-shadow:none;}
.ld2 .glass-lg .pcard,.ld2 .glass-p .pcard{background:transparent;border:0;box-shadow:none;}

/* ================= 1. Hero ================= */
.l2hero{position:relative;min-block-size:860px;display:flex;align-items:center;
  padding-block-start:150px!important;overflow:hidden;}
.l2hero .l2grid{position:absolute;inset:0;opacity:.1;pointer-events:none;
  background-image:linear-gradient(var(--border-strong) 1px,transparent 1px),
    linear-gradient(90deg,var(--border-strong) 1px,transparent 1px);
  background-size:56px 56px;
  mask-image:radial-gradient(circle at 72% 40%,#000 0%,transparent 62%);
  -webkit-mask-image:radial-gradient(circle at 72% 40%,#000 0%,transparent 62%);}
.l2hero .wrap.in{display:grid;grid-template-columns:7fr 5fr;gap:56px;align-items:center;
  position:relative;}
.l2htxt h1{font-size:clamp(58px,5.3vw,78px);line-height:.98;font-weight:650;
  letter-spacing:-.055em;max-inline-size:740px;}
.l2htxt h1 .acc{color:var(--c-accent-ink);}
.l2sub{margin-block-start:28px;font-size:20px;line-height:1.55;letter-spacing:-.01em;
  max-inline-size:680px;color:var(--text-secondary);}
.l2cta{margin-block-start:36px;display:flex;gap:14px;flex-wrap:wrap;}
.l2cta.center{justify-content:center;}
.l2trust{margin-block-start:34px;display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  font-size:14px;color:var(--text-secondary);}
.l2trust i{inline-size:5px;block-size:5px;border-radius:50%;background:var(--orange);
  box-shadow:0 0 10px var(--orange-glow);}
.l2stage{position:relative;display:flex;justify-content:center;}
.l2glow{position:absolute;inset-block-start:50%;inset-inline-start:50%;
  transform:translate(-50%,-50%);inline-size:560px;block-size:560px;pointer-events:none;
  background:radial-gradient(circle,rgba(224,79,63,.17) 0%,rgba(0,47,237,.13) 43%,transparent 72%);
  filter:blur(30px);}
.l2spark{position:absolute;inset-block-start:-8%;inset-inline-end:-6%;inline-size:78%;
  color:var(--brand-blue-light);opacity:.22;pointer-events:none;}
.l2maincard{position:relative;inline-size:min(480px,100%);padding:18px;
  transition:opacity .24s ease,transform .24s ease;}
.l2maincard.swap{opacity:0;transform:translateY(8px);}
.l2rr{position:absolute;inset-block-end:-18px;inset-inline-start:-6px;
  padding:10px 16px;font-size:13px;color:var(--text-secondary);display:flex;gap:7px;
  align-items:baseline;white-space:nowrap;}
.l2rr b{color:var(--brand-blue-light);font-weight:650;}
.l2rr span{font-size:11px;color:var(--text-muted);}

/* ================= 2. Сравнение ================= */
.l2cmp{background:var(--bg-secondary);}
.l2duo{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:24px;}
.l2pane{min-block-size:440px;padding:40px;border-radius:24px;display:flex;
  flex-direction:column;gap:22px;}
.l2pane.bad{background:radial-gradient(circle at 20% 20%,rgba(240,100,100,.06),transparent 48%),
  rgba(255,255,255,.018);border:1px solid var(--border-default);}
.l2pane.good{background:radial-gradient(circle at 80% 20%,rgba(224,79,63,.11),transparent 52%),
  rgba(18,21,29,.62);}
.l2pane .scene{inline-size:100%;flex:1 1 auto;}
.l2pt{font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
  color:var(--text-muted);}
.l2pt.on{color:var(--c-accent-ink);}
.l2minicard{flex:1 1 auto;display:flex;align-items:center;}
.l2minicard .pcard{inline-size:100%;background:var(--bg-elevated);border:1px solid var(--border-default);}
.l2sum{font-size:16px;line-height:1.5;color:var(--text-secondary);}
.l2vs{position:absolute;inset-block-start:50%;inset-inline-start:50%;z-index:2;
  transform:translate(-50%,-50%);inline-size:46px;block-size:46px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;
  letter-spacing:.06em;color:var(--text-secondary);background:var(--bg-elevated);
  border:1px solid var(--border-strong);}

/* ================= 3. Диаграмма работы ================= */
.l2chain{display:flex;align-items:stretch;gap:0;}
.l2sys{flex:1 1 auto;}
.l2syscap{font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
  color:var(--brand-blue-light);margin-block-end:22px;}
.l2nodes{list-style:none;display:flex;justify-content:space-between;gap:8px;position:relative;
  padding-block-start:0;}
.l2nodes::before{content:"";position:absolute;inset-inline:24px;inset-block-start:24px;
  block-size:1px;background:var(--brand-blue-line);}
.l2nodes li{position:relative;flex:1 1 0;display:flex;flex-direction:column;align-items:center;
  gap:12px;text-align:center;}
.l2nodes li i{inline-size:48px;block-size:48px;border-radius:50%;background:var(--bg-secondary);
  border:1px solid var(--brand-blue-line);position:relative;z-index:1;}
.l2nodes li i::after{content:"";position:absolute;inset:19px;border-radius:50%;
  background:var(--brand-blue-light);opacity:.85;}
.l2nodes li span{font-size:13px;line-height:1.35;color:var(--text-secondary);max-inline-size:110px;}
.l2gap{inline-size:48px;flex:0 0 48px;}
.l2you{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:12px;
  text-align:center;padding-block-start:0;margin-block-start:0;}
.l2you i{inline-size:48px;block-size:48px;border-radius:50%;background:var(--orange-soft);
  border:1px solid var(--orange-line);position:relative;}
.l2you i::after{content:"";position:absolute;inset:17px;border-radius:50%;
  background:var(--orange);box-shadow:0 0 14px var(--orange-glow);}
.l2you span{font-size:13px;font-weight:600;color:var(--text-primary);max-inline-size:110px;}
.l2you.brk-o{padding-inline-start:24px;}
.l2flow .l2note.center{max-inline-size:640px;margin-inline:auto;}

/* ================= 4. Showcase карточки ================= */
.l2show{background:var(--bg-tertiary);position:relative;}
.l2show::before,.l2show::after{content:"";position:absolute;inset-inline:0;block-size:1px;
  background:linear-gradient(90deg,transparent,rgba(224,79,63,.22),transparent);}
.l2show::before{inset-block-start:0;}
.l2show::after{inset-block-end:0;}
.l2anat{position:relative;inline-size:fit-content;margin-inline:auto;padding:16px 190px;}
.l2bigcard{inline-size:min(660px,100%);padding:26px;}
.l2bigcard .pcard{font-size:16px;}
.l2tag{position:absolute;display:inline-flex;align-items:center;gap:8px;
  padding:8px 12px;font-size:13px;color:var(--text-secondary);white-space:nowrap;
  background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.08);
  border-radius:999px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);}
.l2tag i{inline-size:6px;block-size:6px;border-radius:50%;background:var(--orange);flex:0 0 auto;}
.l2tag.blue i{background:var(--brand-blue-light);}
.l2tag::before{content:"";position:absolute;block-size:1px;inline-size:44px;
  background:var(--border-strong);}
/* позиции девяти выносок финального текста — ниже, в блоке «БЛОКИ ФИНАЛЬНОГО ТЕКСТА»
   (прежние пять правил убраны 02.08: они складывались с новыми и растягивали теги) */

/* ================= 5. Funnel ================= */
.l2funnel .l2big{font-size:clamp(30px,3.2vw,40px);line-height:1.12;font-weight:620;
  letter-spacing:-.035em;max-inline-size:880px;margin-inline:auto;font-family:var(--font-display);}
.l2fun{inline-size:min(900px,100%);margin-block-start:64px;}
.l2fun .fdots circle{fill:var(--text-muted);opacity:.45;}
.ldjs .l2fun .fdots circle{animation:l2drift 5s ease-in-out infinite;animation-delay:var(--d);}
@keyframes l2drift{0%,100%{transform:translateX(0);opacity:.45;}
  50%{transform:translateX(26px);opacity:.7;}}
.l2fun .ffilters rect{fill:var(--brand-blue-line);}
.l2fun .fout circle{fill:var(--orange);filter:drop-shadow(0 0 8px var(--orange-glow));}
.l2funcap{inline-size:min(900px,100%);margin-inline:auto;display:flex;
  justify-content:space-between;gap:12px;margin-block-start:10px;font-size:13px;
  color:var(--text-muted);}
.l2funcap .blue{color:var(--brand-blue-light);}
.l2funcap .orange{color:var(--c-accent-ink);}

/* ================= 6. Глава доверия ================= */
.l2proof{padding-block:168px!important;
  background:radial-gradient(circle at 75% 10%,rgba(0,47,237,.16),transparent 40%),#0B0C13;}
.l2proofpanel{display:grid;grid-template-columns:1fr 300px;gap:36px;align-items:center;
  padding:44px;margin-block-start:8px;}
.l2proofpanel .story{min-block-size:280px;}
@media (max-width:767px){
  /* Igor 03.08: график должен занимать высоту, а не оставлять пустое поле снизу */
  .l2proofpanel{padding:20px 16px;}
  .l2proofpanel .story{min-block-size:0;}
  .ld2 .story .stchart{block-size:auto;}
}
.l2pstat{display:flex;flex-direction:column;gap:6px;text-align:start;}
.l2pv{font-size:88px;line-height:.95;font-weight:650;letter-spacing:-.06em;
  color:var(--brand-blue-light);font-family:var(--font-display);}
.l2pk{font-size:15px;font-weight:600;color:var(--text-primary);margin-block-start:10px;}
.l2pl{font-size:13px;color:var(--text-muted);}
.l2prooftxt{margin-block-start:44px;max-inline-size:680px;}
.l2prooftxt p{color:var(--text-secondary);}
.l2prooftxt p+p{margin-block-start:14px;}
/* история сигнала внутри панели */
.ld2 .story .sthead{display:flex;align-items:center;gap:8px;margin-block-end:10px;}
.ld2 .story .stnum{margin-inline-start:auto;font-size:12px;color:var(--text-muted);}
.ld2 .story .stchart{inline-size:100%;block-size:auto;}
.ld2 .story .stbar{opacity:0;}
.ld2 .story .stbar.on{opacity:1;}
.ld2 .story .stln,.ld2 .story .stmk{opacity:0;transition:opacity .3s ease;}
.ld2 .story .stln.on,.ld2 .story .stmk.on{opacity:1;}
.ld2 .story .stview{transition:transform .17s linear;}
.ld2 .story .stmsg{min-block-size:22px;margin-block-start:8px;font-size:14px;
  color:var(--text-secondary);}
.ld2 .story .stmsg .acc{color:var(--c-accent-ink);}
.ld2 .story .stmsg .ok{color:var(--c-green-ink);}
.ld2 .story .stmsg .far{color:var(--brand-blue-light);}   /* «цена пошла дальше — 2 ATR» */
.ld2 .bigchart .bchead{display:flex;align-items:center;gap:8px;margin-block-end:10px;}
.ld2 .bigchart .bclv{margin-inline-start:auto;font-size:12px;color:var(--text-muted);}

/* ================= 7. Reach ≠ Win ================= */
.l2math{background:var(--bg-secondary);}
.l2mathgrid{display:grid;grid-template-columns:5fr 7fr;gap:24px;align-items:stretch;}
.l2terms{display:flex;flex-direction:column;gap:14px;}
.l2term{background:rgba(255,255,255,.025);border:1px solid var(--border-default);
  border-radius:20px;padding:28px;flex:1 1 auto;}
.l2term .tt{font-size:15px;font-weight:650;letter-spacing:.02em;margin-block-end:10px;}
.l2term.blue .tt{color:var(--brand-blue-light);}
.l2term:not(.blue) .tt{color:var(--c-accent-ink);}
.l2term p:not(.tt){font-size:15px;line-height:1.55;color:var(--text-secondary);}
.l2neq{align-self:center;font-size:30px;color:var(--text-muted);line-height:1;}
.l2calc{padding:32px;}
.l2calccap{font-size:13px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;
  color:var(--text-muted);}
.l2bars{display:flex;gap:28px;align-items:flex-end;margin-block-start:26px;block-size:180px;}
.l2bar{display:flex;flex-direction:column;align-items:center;gap:8px;flex:1 1 0;
  block-size:100%;justify-content:flex-end;}
.l2bar b{font-size:19px;color:var(--brand-blue-light);}
.l2bar i{inline-size:min(64px,100%);block-size:calc(var(--h)*120px);border-radius:8px 8px 0 0;
  background:linear-gradient(180deg,var(--brand-blue-surface),rgba(0,47,237,.06));
  border:1px solid var(--brand-blue-line);border-block-end:0;}
.l2bar span{font-size:13px;color:var(--text-secondary);}
.l2ex{margin-block-start:28px;border-block-start:1px solid var(--border-default);
  padding-block-start:22px;}
.l2ex p.num{margin-block-start:8px;font-size:16px;color:var(--text-secondary);}
.l2ex p.num b{color:var(--c-green-ink);}
.l2disc{margin-block-start:44px;font-size:14px;line-height:1.6;color:var(--text-muted);
  max-inline-size:760px;}
.l2disc i{display:none;}

/* ================= 8. Контекст показателей ================= */
.l2map{display:grid;grid-template-columns:1fr auto 1fr;gap:44px;align-items:center;
  max-inline-size:1080px;margin-inline:auto;}
.l2params{list-style:none;display:flex;flex-direction:column;gap:30px;}
.l2params li{display:flex;gap:14px;align-items:flex-start;}
.l2params svg{inline-size:20px;block-size:20px;flex:0 0 auto;margin-block-start:2px;
  fill:none;stroke:var(--brand-blue-light);stroke-width:1.6;stroke-linecap:round;
  stroke-linejoin:round;}
.l2params b{display:block;font-size:16px;font-weight:600;}
.l2params span{display:block;margin-block-start:3px;font-size:14px;color:var(--text-muted);}
.l2params.l{text-align:end;}
.l2params.l li{flex-direction:row-reverse;}
.l2mapcard{inline-size:230px;block-size:270px;border:1px solid var(--border-strong);
  border-radius:20px;background:var(--bg-tertiary);padding:22px;display:flex;}
.l2mapcard .mc{display:flex;flex-direction:column;gap:12px;inline-size:100%;}
.l2mapcard .mrow{display:block;block-size:10px;border-radius:5px;
  background:rgba(255,255,255,.10);}
.l2mapcard .mrow.w60{inline-size:60%;}
.l2mapcard .mrow.w40{inline-size:40%;background:var(--orange-soft);}
.l2mapcard .mrow.w80{inline-size:80%;}
.l2mapcard .mchart{flex:1 1 auto;border-radius:12px;background:
  linear-gradient(135deg,var(--brand-blue-soft),transparent 60%),rgba(255,255,255,.03);
  border:1px solid var(--border-default);}

/* ================= 9. Пломба и история ================= */
.l2seal{background:rgba(0,47,237,.055);
  border-block-start:1px solid rgba(0,47,237,.16);
  border-block-end:1px solid rgba(0,47,237,.16);}
.l2sealgrid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start;}
.l2sealgrid .l2head{margin-block-end:0;}
.l2steps{list-style:none;position:relative;display:flex;flex-direction:column;gap:26px;
  padding-inline-start:0;}
.l2steps::before{content:"";position:absolute;inset-inline-start:8px;
  inset-block:10px;inline-size:1px;background:var(--brand-blue-line);}
.l2steps li{position:relative;padding-inline-start:34px;font-size:16px;
  color:var(--text-secondary);}
.l2steps li i{position:absolute;inset-inline-start:2px;inset-block-start:3px;
  inline-size:13px;block-size:13px;border-radius:50%;background:var(--bg-secondary);
  border:1px solid var(--brand-blue-light);}
.l2steps li:last-child i{background:var(--brand-blue-light);}
.sl2status{position:relative;padding:24px 24px 24px 28px;margin-block:30px 22px;
  background:rgba(18,21,29,.62);border:1px solid rgba(255,255,255,.08);border-radius:20px;
  backdrop-filter:blur(16px) saturate(1.1);-webkit-backdrop-filter:blur(16px) saturate(1.1);}
.sl2status::before{content:"";position:absolute;inset-inline-start:0;inset-block:8px;
  inline-size:4px;border-radius:0 4px 4px 0;background:var(--brand-blue);
  box-shadow:0 0 18px color-mix(in srgb,var(--brand-blue) 24%,transparent);}
.sl2ok{display:flex;align-items:center;gap:10px;font-size:15px;font-weight:600;}
.sl2ok svg{inline-size:18px;block-size:18px;color:var(--c-green-ink);flex:0 0 auto;}
.sl2hash{display:block;margin-block-start:14px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:13px;color:var(--brand-blue-light);background:rgba(0,0,0,.24);
  border:1px solid rgba(0,47,237,.22);border-radius:10px;padding:12px 14px;
  overflow-wrap:anywhere;}
.sl2meta{margin-block-start:10px;font-size:12px;color:var(--text-muted);}
.l2hist{margin-block-start:72px;}
.htwrap{inline-size:100%;overflow-x:auto;border:1px solid var(--border-default);
  border-radius:16px;background:var(--bg-tertiary);}
.htable{inline-size:100%;border-collapse:collapse;font-size:14px;min-inline-size:640px;}
.htable th{font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;
  color:var(--text-muted);text-align:start;padding:14px 16px;
  border-block-end:1px solid var(--border-default);}
.htable td{padding:13px 16px;border-block-end:1px solid var(--border-default);
  color:var(--text-secondary);}
.htable tr:last-child td{border-block-end:0;}
.htable .hsym{font-weight:650;color:var(--text-primary);}
.htable code{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12px;
  color:var(--text-muted);}
.htable a{color:var(--brand-blue-light);font-weight:500;}
.htable .hout.ok{color:var(--c-green-ink);}
.htable .hout.no{color:var(--c-red-ink);}
.htable .hout.wait{color:var(--text-muted);}
.sl2ok.wait svg{color:var(--brand-blue-light);}

/* ================= 10. Симулятор ================= */
.l2simgrid{display:grid;grid-template-columns:5fr 7fr;gap:56px;align-items:center;}
.l2simtxt p:not(.l2label){margin-block:18px 30px;color:var(--text-secondary);}
.l2simfeat{margin-block-start:28px;display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  font-size:13px;color:var(--text-muted);}
.l2simfeat i{inline-size:4px;block-size:4px;border-radius:50%;
  background:var(--brand-blue-light);}
.l2simmock{padding:0;overflow:hidden;}
.l2wtop{display:flex;align-items:center;gap:7px;padding:13px 18px;
  border-block-end:1px solid var(--border-default);}
.l2wtop i{inline-size:9px;block-size:9px;border-radius:50%;background:rgba(255,255,255,.14);}
.l2wtop span{margin-inline-start:8px;font-size:12px;font-weight:600;letter-spacing:.03em;
  color:var(--text-muted);}
.l2wtop .simbadge{margin-inline-start:auto;font-style:normal;font-size:10px;font-weight:700;
  letter-spacing:.08em;text-transform:uppercase;color:var(--brand-blue-light);
  border:1px solid var(--brand-blue-line);border-radius:999px;padding:3px 10px;
  background:var(--brand-blue-soft);}
.l2simbody{display:grid;grid-template-columns:1fr 272px;gap:0;}
.l2simchart{padding:20px;min-inline-size:0;display:flex;}
/* панель настоящая (Igor 03.08) — отступы держит сама .l2order */
.l2simside{border-inline-start:1px solid var(--border-default);display:flex;flex-direction:column;}
.l2simside .sr{display:flex;flex-direction:column;gap:3px;font-size:12px;}
.l2simside .sr span{color:var(--text-muted);font-size:10px;font-weight:600;
  letter-spacing:.06em;text-transform:uppercase;}
.l2simside .sr b{color:var(--text-secondary);font-weight:600;}
.l2simside .srbtn{margin-block-start:auto;text-align:center;padding:11px;border-radius:10px;
  background:var(--orange);color:#fff;font-size:13px;font-weight:600;}
.l2simside .srstep{text-align:center;padding:10px;border-radius:10px;
  border:1px solid var(--border-strong);font-size:13px;color:var(--text-secondary);}

/* ================= 11. Тезис ================= */
.l2thesis{padding-block:88px!important;}
.l2thesis p{font-size:30px;line-height:1.3;max-inline-size:840px;margin-inline:auto;
  font-family:var(--font-display);font-weight:600;letter-spacing:-.02em;}

/* ================= 12. Рабочее пространство ================= */
.l2space{background:var(--bg-secondary);overflow:hidden;}
.l2spacegrid{display:grid;grid-template-columns:5fr 7fr;gap:56px;align-items:center;}
.l2spacetxt p:not(.l2label){margin-block-start:18px;color:var(--text-secondary);}
.l2wsp{padding:0;overflow:hidden;inline-size:min(860px,100%);}
.l2wbody{display:grid;grid-template-columns:52px 1fr 268px;}
.l2wnav{border-inline-end:1px solid var(--border-default);padding-block:18px;
  display:flex;flex-direction:column;align-items:center;gap:20px;}
.l2wnav svg{inline-size:19px;block-size:19px;fill:none;stroke:var(--text-muted);
  stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;}
.l2wnav svg:first-child{stroke:var(--c-accent-ink);}
.l2wmain{padding:16px;min-inline-size:0;}
/* справа — настоящая панель сделки, отступы держит .l2order (Igor 03.08) */
.l2wside{border-inline-start:1px solid var(--border-default);display:flex;
  flex-direction:column;min-inline-size:0;}
.l2wside .pcard{background:transparent;border:0;box-shadow:none;padding:0;font-size:13px;}
/* снизу — журнал: тот самый шаг «результат сохранился и попал в статистику» */
.l2wfoot{border-block-start:1px solid var(--border-default);padding:14px 18px;}
.l2wfoot .pcard{background:transparent;border:0;box-shadow:none;padding:0;font-size:13px;}
.l2wfoot .jrow{font-size:12px;}

/* ================= 13. Путь сделки ================= */
.l2stages{list-style:none;counter-reset:l2s;display:grid;
  grid-template-columns:repeat(3,1fr);gap:40px 28px;max-inline-size:1080px;
  margin-inline:auto;}
.l2stages li{counter-increment:l2s;position:relative;padding-block-start:58px;}
.l2stages li::before{content:counter(l2s,decimal-leading-zero);position:absolute;
  inset-block-start:0;inset-inline-start:0;inline-size:40px;block-size:40px;
  display:flex;align-items:center;justify-content:center;border-radius:50%;
  border:1px solid var(--border-strong);font-size:13px;font-weight:650;
  color:var(--text-secondary);font-variant-numeric:tabular-nums;}
.l2stages li:first-child::before{border-color:var(--orange-line);
  color:var(--c-accent-ink);background:var(--orange-soft);}
.l2stages li b{display:block;font-size:17px;font-weight:650;letter-spacing:-.015em;}
.l2stages li span{display:block;margin-block-start:6px;font-size:13px;
  color:var(--text-muted);}

/* ================= 14. Торговля · Аналитика · Развитие ================= */
.l2triple{background:var(--bg-secondary);}
.l2orbit{max-inline-size:980px;margin-inline:auto;}
.l2center{inline-size:fit-content;margin-inline:auto;padding:14px 30px;border-radius:999px;
  background:var(--bg-elevated);border:1px solid var(--border-strong);font-size:15px;
  font-weight:650;}
.l2lines{display:block;inline-size:min(900px,100%);block-size:70px;margin-inline:auto;}
.l2lines path{fill:none;stroke:rgba(255,255,255,.2);stroke-width:1;}
.l2sectors{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.l2sector{background:rgba(255,255,255,.025);border:1px solid var(--border-default);
  border-radius:20px;padding:28px;}
.l2sector h3{font-size:19px;margin-block-end:12px;}
.l2sector.orange h3{color:var(--c-accent-ink);}
.l2sector.blue h3{color:var(--brand-blue-light);}
.l2sector p{font-size:14px;line-height:1.7;color:var(--text-secondary);}

/* ================= 15. Цикл после сделки ================= */
.l2cyclewrap{display:flex;justify-content:center;}
.l2ring{inline-size:min(460px,100%);}
.l2ring .ringbg{fill:none;stroke:var(--border-strong);stroke-width:1;}
.l2ring .ringarrows path{fill:none;stroke:var(--text-muted);stroke-width:1.3;
  stroke-linecap:round;stroke-linejoin:round;opacity:.7;}
.l2ring .cynode circle{fill:var(--bg-elevated);stroke:var(--border-strong);stroke-width:1;}
.l2ring .cynode.orange circle{fill:var(--orange);stroke:none;}
.l2ring .cynode.blue circle{fill:var(--brand-blue-light);stroke:none;}
.l2ring .cynode.white circle{fill:#fff;stroke:none;}
.l2ring .cynode text{fill:var(--text-secondary);font-size:14px;text-anchor:middle;
  font-family:var(--font-ui);}
.l2ring .cycenter{fill:var(--text-primary);font-size:15px;font-weight:600;text-anchor:middle;
  font-family:var(--font-ui);}

/* ================= 16. Управление риском ================= */
.l2riskgrid{display:grid;grid-template-columns:5fr 7fr;gap:56px;align-items:center;}
.l2risktxt p{margin-block:18px 24px;color:var(--text-secondary);}
.l2principles{list-style:none;display:flex;flex-direction:column;gap:12px;}
.l2principles li{position:relative;padding-inline-start:24px;font-size:16px;
  color:var(--text-secondary);}
.l2principles li::before{content:"";position:absolute;inset-inline-start:0;
  inset-block-start:9px;inline-size:8px;block-size:8px;border-radius:50%;
  background:var(--orange-soft);border:1px solid var(--orange-line);}
.l2riskpanel{padding:30px;}
.l2riskpanel .rrows .rr{display:flex;justify-content:space-between;gap:16px;
  padding-block:11px;border-block-end:1px solid var(--border-default);font-size:14px;}
.l2riskpanel .rrows .rr:last-child{border-block-end:0;}
.l2riskpanel .rr .k{color:var(--text-muted);}
.l2riskpanel .rr b{font-weight:600;text-align:end;}
.l2riskpanel .rr b.soft{color:var(--text-secondary);font-weight:500;}
.l2scale{margin-block-start:20px;border-block-start:1px solid var(--border-default);
  padding-block-start:20px;}
.l2scale .sc-cap{font-size:11px;font-weight:600;letter-spacing:.06em;
  text-transform:uppercase;color:var(--text-muted);}
.l2scale .sc-track{margin-block-start:12px;block-size:8px;border-radius:4px;
  background:rgba(255,255,255,.07);position:relative;overflow:hidden;}
.l2scale .sc-track i{position:absolute;inset-block:0;inset-inline-start:0;
  inline-size:calc(var(--v)*100%);border-radius:4px;
  background:linear-gradient(90deg,var(--orange-soft),var(--orange));}
.l2scale .sc-marks{margin-block-start:8px;display:flex;justify-content:space-between;
  font-size:11px;color:var(--text-muted);}

/* ================= 17. Устройства ================= */
.l2devices{background:radial-gradient(circle at 50% 40%,rgba(0,47,237,.12),transparent 54%),
  var(--bg-primary);}
.l2devcomp{position:relative;display:flex;justify-content:center;align-items:flex-end;
  gap:0;max-inline-size:980px;margin-inline:auto;}
.l2dev{margin:0;position:relative;}
.l2dev figcaption{margin-block-start:14px;font-size:13px;color:var(--text-muted);
  text-align:center;}
.l2dev.desk{inline-size:min(520px,52%);z-index:1;background:var(--bg-tertiary);
  border:1px solid var(--border-default);border-radius:18px;overflow:visible;}
.l2dev.desk .l2devbody{padding:14px;}
.l2dev.phone{inline-size:min(270px,30%);z-index:2;margin-inline-start:-60px;
  background:var(--bg-elevated);border:1px solid var(--border-strong);border-radius:26px;
  padding:12px 8px;box-shadow:0 32px 80px rgba(0,0,0,.4);}
.l2dev.phone .pcard{font-size:12px;}
.l2dev.tg{inline-size:min(300px,30%);z-index:3;margin-inline-start:-40px;
  margin-block-end:26px;padding:12px;}
.l2dev .pcard{background:transparent;border:0;box-shadow:none;}
.l2dev.desk .pcard{background:var(--bg-secondary);border:1px solid var(--border-default);}

/* ================= 18. Тарифы ================= */
.l2plans{background:var(--bg-secondary);}
.l2planrow{display:flex;justify-content:center;gap:24px;flex-wrap:wrap;}
.l2plan{inline-size:min(440px,100%);border-radius:24px;padding:38px;position:relative;
  background:rgba(255,255,255,.02);border:1px solid var(--border-default);
  display:flex;flex-direction:column;}
.l2plan.pro{border:1px solid rgba(224,79,63,.34);
  background:radial-gradient(circle at 80% 0%,rgba(224,79,63,.11),transparent 42%),
  rgba(255,255,255,.03);}
.l2protag{position:absolute;inset-block-start:-13px;inset-inline-start:38px;
  font-size:11px;font-weight:650;letter-spacing:.05em;text-transform:uppercase;
  color:var(--c-accent-ink);background:var(--bg-secondary);
  border:1px solid rgba(224,79,63,.34);border-radius:999px;padding:5px 12px;}
.l2plan .pn{font-size:26px;font-weight:650;font-family:var(--font-display);}
.l2plan .ps{margin-block:6px 20px;font-size:14px;color:var(--text-muted);}
.l2plan ul{list-style:none;display:flex;flex-direction:column;gap:11px;flex:1 1 auto;
  margin-block-end:28px;}
.l2plan li{position:relative;padding-inline-start:26px;font-size:15px;line-height:1.5;
  color:var(--text-secondary);}
.l2plan li::before{content:"";position:absolute;inset-inline-start:0;inset-block-start:6px;
  inline-size:14px;block-size:8px;border-inline-start:1.8px solid var(--c-green-ink);
  border-block-end:1.8px solid var(--c-green-ink);transform:rotate(-48deg) scale(.9);}

/* ================= 19. FAQ ================= */
.l2faqlist{max-inline-size:900px;margin-inline:auto;}
.l2faqlist details{padding-block:24px;border-block-end:1px solid var(--border-default);}
.l2faqlist summary{display:flex;align-items:center;gap:18px;cursor:pointer;
  font-size:18px;font-weight:500;list-style:none;}
.l2faqlist summary::-webkit-details-marker{display:none;}
.l2faqlist summary i{margin-inline-start:auto;position:relative;inline-size:16px;
  block-size:16px;flex:0 0 auto;}
.l2faqlist summary i::before,.l2faqlist summary i::after{content:"";position:absolute;
  background:var(--text-muted);transition:transform var(--t);}
.l2faqlist summary i::before{inset-block-start:7px;inset-inline:0;block-size:1.6px;}
.l2faqlist summary i::after{inset-inline-start:7px;inset-block:0;inline-size:1.6px;}
.l2faqlist details[open] summary i::after{transform:scaleY(0);}
.l2faqlist .ans{margin-block-start:14px;font-size:16px;line-height:1.65;
  color:var(--text-secondary);max-inline-size:760px;}

/* ================= 20. Финальный CTA ================= */
.l2final{background:
  radial-gradient(circle at 20% 30%,rgba(224,79,63,.16),transparent 36%),
  radial-gradient(circle at 80% 20%,rgba(0,47,237,.17),transparent 42%),#0A0B10;
  border-block-start:1px solid rgba(255,255,255,.08);}
.l2final h2{font-size:clamp(46px,5vw,68px);line-height:1.02;max-inline-size:900px;
  margin-inline:auto;font-weight:650;letter-spacing:-.05em;}
.l2final .l2sub{margin-inline:auto;margin-block-start:26px;font-size:18px;}
.l2final .l2cta{justify-content:center;}
.l2final .l2note{margin-block-start:26px;}

/* ================= подвал ================= */
.ld2 footer{background:#07080B;border-block-start:1px solid rgba(255,255,255,.06);
  padding-block:72px 40px;}
/* заголовки колонок футера — это h2, и общее правило .ld2 h2 (60px) их раздувало:
   колонки наезжали друг на друга (Igor 03.08). Возвращаем футеру его собственный размер. */
.ld2 footer .fcol h2{font-size:11px;line-height:16px;font-weight:600;letter-spacing:.06em;
  text-transform:uppercase;color:var(--text-muted);font-family:var(--font-ui);
  max-inline-size:none;}
.ld2 footer .risk{font-size:12px;line-height:1.6;color:var(--text-muted);
  max-inline-size:1100px;}

/* ================================================================================
   БЛОКИ ФИНАЛЬНОГО ТЕКСТА (02.08, docs/plans/landing_final_copy_2026-08-02.md):
   экраны, которых не было в первом каркасе редизайна — списки в сравнении, «что делает
   ChiPro», переход к главе 2, крупные цифры, темп достижения цели, потенциал хода,
   два рабочих процесса, блок Free. Токены и ритм те же, что у остальной .ld2.
   ================================================================================ */

/* ---- списки-пункты в панелях (экраны 2, 12) ---- */
.l2plist{list-style:none;display:flex;flex-direction:column;gap:12px;margin-block-start:auto;
  padding-inline-start:0;}
.l2plist li{position:relative;padding-inline-start:22px;font-size:15px;line-height:1.5;
  color:var(--text-secondary);}
.l2plist li::before{content:"";position:absolute;inset-inline-start:0;inset-block-start:9px;
  inline-size:6px;block-size:6px;border-radius:50%;background:var(--text-muted);}
.l2plist.on li::before{background:var(--orange);box-shadow:0 0 10px var(--orange-glow);}
.l2simtxt .l2plist{margin-block:24px 32px;}

/* ---- что делает ChiPro (экран 3) ---- */
.l2do{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-block-start:72px;}
.l2docard{background:rgba(255,255,255,.025);border:1px solid var(--border-default);
  border-radius:20px;padding:26px;}
.l2docard .dk{font-size:15px;font-weight:650;letter-spacing:.01em;color:var(--text-primary);
  margin-block-end:10px;}
.l2docard p{font-size:15px;line-height:1.55;color:var(--text-secondary);}

/* ---- выноски карточки: их девять, по четыре слева и пять справа (экран 4).
       Столбцы выровнены по внутреннему краю, поэтому все соединительные линии одной длины. ---- */
.l2anat{padding-inline:250px;}
/* сброс: первый каркас позиционировал пять выносок через inset-block-end/inline-start —
   без явного auto старые значения складывались бы с новыми и теги наезжали друг на друга */
.l2tag{max-inline-size:210px;white-space:normal;line-height:1.3;
  inset-block-end:auto;inset-inline-start:auto;inset-inline-end:auto;}
.l2tag.t1,.l2tag.t2,.l2tag.t3,.l2tag.t4{inset-inline-end:calc(100% - 206px);
  justify-content:flex-end;text-align:end;}
.l2tag.t5,.l2tag.t6,.l2tag.t7,.l2tag.t8,.l2tag.t9{inset-inline-start:calc(100% - 206px);}
.l2tag.t1{inset-block-start:2%;}
.l2tag.t2{inset-block-start:24%;}
.l2tag.t3{inset-block-start:46%;}
.l2tag.t4{inset-block-start:68%;}
.l2tag.t5{inset-block-start:1%;}
.l2tag.t6{inset-block-start:21%;}
.l2tag.t7{inset-block-start:41%;}
.l2tag.t8{inset-block-start:61%;}
.l2tag.t9{inset-block-start:81%;}
.l2tag.t1::before,.l2tag.t2::before,.l2tag.t3::before,
.l2tag.t4::before{inset-inline-end:-44px;inset-block-start:50%;}
.l2tag.t5::before,.l2tag.t6::before,.l2tag.t7::before,.l2tag.t8::before,
.l2tag.t9::before{inset-inline-start:-44px;inset-block-start:50%;}

/* ---- переход к главе 2 (экран 5) ---- */
.l2bridge{margin-block-start:64px;padding-block-start:44px;
  border-block-start:1px solid var(--border-default);}
.l2bridge p{max-inline-size:760px;margin-inline:auto;color:var(--text-secondary);}
.l2bridge .l2btn{margin-block-start:28px;}

/* ---- крупные цифры (экраны 6, 9) ---- */
.l2facts{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-block-start:56px;}
.l2facts.two{grid-template-columns:repeat(2,1fr);max-inline-size:840px;margin-inline:auto;}
.l2fact{background:rgba(255,255,255,.025);border:1px solid var(--border-default);
  border-radius:20px;padding:30px;display:flex;flex-direction:column;gap:10px;}
.l2fact b{font-size:44px;line-height:1;font-weight:650;letter-spacing:-.045em;
  font-family:var(--font-display);color:var(--brand-blue-light);}
.l2fact span{font-size:14px;line-height:1.5;color:var(--text-secondary);}
.l2facts.two .l2fact b{color:var(--c-accent-ink);}

/* ---- темп достижения цели (экран 7) ---- */
.l2speed{background:var(--bg-secondary);}
.l2speedgrid{display:grid;grid-template-columns:1.15fr .85fr;gap:36px;align-items:start;}
.l2tempo{border-radius:24px;padding:34px;}
.l2tbars{display:flex;flex-direction:column;gap:18px;margin-block-start:26px;}
.l2tbar{display:grid;grid-template-columns:88px 1fr 52px;align-items:center;gap:14px;}
.l2tbar .th{font-size:13px;color:var(--text-secondary);}
.l2tbar .tt{position:relative;block-size:18px;border-radius:999px;
  background:rgba(255,255,255,.05);}
.l2tbar i{position:absolute;inset-block:0;inset-inline-start:0;inline-size:100%;
  border-radius:999px;transform:scaleX(var(--w));transform-origin:left center;
  background:linear-gradient(90deg,rgba(0,47,237,.55),rgba(0,47,237,.22));
  border:1px solid var(--brand-blue-line);}
.ldjs .l2tempo i{transform:scaleX(0);transition:transform .9s cubic-bezier(.22,.7,.3,1);}
.ldjs .l2tempo.run i{transform:scaleX(var(--w));}
.l2tbar b{font-size:16px;font-weight:650;color:var(--brand-blue-light);text-align:end;}
.l2speedfacts{list-style:none;display:flex;flex-direction:column;gap:20px;
  padding-inline-start:0;}
.l2speedfacts li{display:flex;flex-direction:column;gap:6px;padding-inline-start:22px;
  border-inline-start:2px solid var(--orange-line);}
.l2speedfacts b{font-size:30px;line-height:1.1;font-weight:650;letter-spacing:-.035em;
  font-family:var(--font-display);color:var(--text-primary);}
.l2speedfacts span{font-size:14px;line-height:1.5;color:var(--text-secondary);}

/* ---- потенциал больше цели (экран 9) ---- */
.l2scaleviz{max-inline-size:840px;margin:0 auto;}
.l2sline{display:flex;justify-content:space-between;gap:20px;margin-block-end:14px;}
.l2spt{display:flex;flex-direction:column;gap:4px;}
.l2spt b{font-size:20px;font-weight:650;font-family:var(--font-display);}
.l2spt span{font-size:13px;color:var(--text-muted);}
.l2spt.one b{color:var(--c-accent-ink);}
.l2spt.two{text-align:end;}
.l2spt.two b{color:var(--brand-blue-light);}
.l2strack{position:relative;block-size:14px;border-radius:999px;
  background:rgba(255,255,255,.05);overflow:hidden;}
.l2strack i{position:absolute;inset-block:0;border-radius:999px;}
.l2strack .s1{inset-inline-start:0;inline-size:50%;background:var(--orange);opacity:.85;}
.l2strack .s2{inset-inline-start:50%;inline-size:50%;
  background:linear-gradient(90deg,var(--brand-blue-surface),rgba(0,47,237,.08));
  border-inline-start:1px solid rgba(255,255,255,.14);}

/* ---- пломба: пара кнопок, заглушка канала до публичности (решение Igor 02.08) ---- */
.l2sealbtns{display:flex;gap:12px;flex-wrap:wrap;margin-block-start:24px;}
.l2btn.off{color:var(--text-muted);border:1px dashed var(--border-strong);cursor:default;
  gap:8px;}
.l2btn.off em{font-size:11px;font-style:normal;letter-spacing:.06em;text-transform:uppercase;
  color:var(--text-muted);opacity:.75;}

/* ---- история модели отдельной секцией (экран 11) ---- */
.l2histsec{background:var(--bg-secondary);}
.l2histsec .l2hist{margin-block-start:0;}

/* ---- безубыточность: подпись под столбиком (экран 12A) ---- */
.l2bar em{font-size:11px;font-style:normal;line-height:1.35;color:var(--text-muted);
  text-align:center;max-inline-size:120px;}
.l2bar.on i{background:linear-gradient(180deg,rgba(224,79,63,.30),rgba(224,79,63,.06));
  border-color:var(--orange-line);}
.l2bar.on b{color:var(--c-accent-ink);}
.l2math .l2neq{color:var(--text-muted);}

/* ---- два рабочих процесса (экран 19) ---- */
.l2procs{display:grid;grid-template-columns:1fr 1fr;gap:24px;}
.l2proc{border-radius:24px;padding:36px;border:1px solid var(--border-default);
  background:rgba(255,255,255,.018);}
.l2proc.good{background:radial-gradient(circle at 80% 0%,rgba(224,79,63,.07),transparent 46%),
  rgba(18,21,29,.62);border-color:rgba(224,79,63,.24);}
.l2procsteps{list-style:none;counter-reset:pstep;display:flex;flex-direction:column;gap:0;
  padding-inline-start:0;margin-block-start:24px;}
.l2procsteps li{counter-increment:pstep;position:relative;padding:12px 0 12px 42px;
  font-size:15px;line-height:1.45;color:var(--text-secondary);}
.l2procsteps li::before{content:counter(pstep);position:absolute;inset-inline-start:0;
  inset-block-start:10px;inline-size:26px;block-size:26px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600;
  color:var(--text-muted);background:rgba(255,255,255,.05);
  border:1px solid var(--border-default);}
.l2procsteps li+li::after{content:"";position:absolute;inset-inline-start:13px;
  inset-block-start:-14px;block-size:24px;inline-size:1px;background:var(--border-default);}
.l2procsteps.on li{color:var(--text-primary);}
.l2procsteps.on li::before{color:#fff;background:var(--orange-soft);
  border-color:var(--orange-line);}
.l2procsteps.on li+li::after{background:var(--orange-line);}

/* ---- начните бесплатно (экран 20) ---- */
.l2freegrid{display:grid;grid-template-columns:1.05fr .95fr;gap:44px;align-items:center;}
.l2freetxt h2+p{margin-block-start:20px;color:var(--text-secondary);max-inline-size:560px;}
.l2freetxt .l2btn{margin-block-start:32px;}
.l2freetxt .l2note{margin-block-start:20px;}
.l2freelist{list-style:none;border-radius:24px;padding:34px;display:flex;
  flex-direction:column;gap:16px;padding-inline-start:34px;}
.l2freelist li{position:relative;padding-inline-start:30px;font-size:16px;
  color:var(--text-secondary);}
.l2freelist li::before{content:"";position:absolute;inset-inline-start:0;inset-block-start:6px;
  inline-size:16px;block-size:9px;border-inline-start:2px solid var(--orange);
  border-block-end:2px solid var(--orange);transform:rotate(-45deg);}

/* ---- ЭКРАН СИМУЛЯТОРА: шапка с уровнем, метрики, график, ряд ТФ (Igor 03.08) ---- */
.l2simscr{display:flex;flex-direction:column;gap:0;}
.l2sshead{display:flex;align-items:center;gap:10px;padding-block-end:10px;}
.l2sshead .pcsym{font-size:17px;font-weight:700;letter-spacing:-.01em;}
.l2sslvl{margin-inline-start:auto;font-size:12px;color:var(--text-muted);}
.l2sslvl b{font-size:15px;color:var(--text-primary);font-weight:650;margin-inline-end:6px;
  font-variant-numeric:tabular-nums;}
.l2ssmet{display:flex;flex-wrap:wrap;gap:6px 26px;padding-block:10px;font-size:12px;
  color:var(--text-muted);border-block:1px solid var(--border-default);}
.l2ssmet b{color:var(--text-primary);font-weight:650;margin-inline-start:6px;
  font-variant-numeric:tabular-nums;}
.l2ssmet b.warn{color:#E8A33D;}
.l2ssmet b.bad{color:var(--c-red-ink);}
.l2ssmet b.ok{color:var(--c-green-ink);}
/* график занимает всю оставшуюся высоту панели, а не висит полосой сверху (Igor 03.08) */
.l2simscr{block-size:100%;}
.l2ssbody{padding-block:14px;min-inline-size:0;flex:1 1 auto;display:flex;}
.l2ssbody .pcwrap{inline-size:100%;position:relative;}
.l2ssbody svg{inline-size:100%;block-size:100%;min-block-size:260px;display:block;}
.l2sstf{display:flex;align-items:center;gap:14px;padding-block-start:10px;font-size:12px;
  color:var(--text-muted);border-block-start:1px solid var(--border-default);}
.l2sstf span.on{color:var(--text-primary);background:var(--brand-blue-soft);
  border:1px solid var(--brand-blue-line);border-radius:8px;padding:3px 9px;}
.l2sstf i{flex:1 1 auto;}
.l2simact{display:flex;gap:10px;padding:14px 18px;border-block-start:1px solid var(--border-default);}
.l2simact span{flex:1 1 0;text-align:center;padding:10px;border-radius:10px;font-size:13px;
  font-weight:600;color:var(--text-secondary);border:1px solid var(--border-default);}
.l2simact span.pri{color:var(--text-primary);background:rgba(255,255,255,.06);}
.l2simact span.off{opacity:.45;}

/* ---- НАСТОЯЩАЯ панель сделки (Igor 03.08): повторяет vxSimOrderSheet приложения ---- */
.l2order{display:flex;flex-direction:column;gap:2px;padding:20px 22px;font-family:var(--font-ui);}
.l2ohead{display:flex;align-items:center;gap:8px;margin-block-end:14px;flex-wrap:wrap;}
.l2ohead .pcsym{font-size:16px;font-weight:700;letter-spacing:-.01em;}
.l2olvl{margin-inline-start:auto;font-size:12px;color:var(--text-muted);}
.l2order .tkrow{display:flex;align-items:center;gap:12px;padding-block:11px;
  border-block-end:1px solid var(--border-default);font-size:14px;}
.l2order .tkrow.flat{border-block-end:0;padding-block-start:14px;}
.l2order .tkrow .lb{color:var(--text-secondary);}
.l2order .tkrow .lb.rr{margin-inline-start:auto;}
.l2order .ctr{margin-inline-start:auto;display:flex;align-items:center;gap:10px;}
.l2order .ctr button{inline-size:26px;block-size:26px;border-radius:8px;font-size:15px;
  color:var(--text-secondary);background:rgba(255,255,255,.05);
  border:1px solid var(--border-default);line-height:1;}
.l2order .ctr b,.l2order .tkrow>b{font-size:15px;font-weight:650;font-variant-numeric:tabular-nums;}
.l2order .ctr b.neg{color:var(--c-red-ink);}
.l2order .ctr b.pos{color:var(--c-green-ink);}
.l2seg{display:flex;gap:6px;margin-block:14px 4px;}
.l2seg button{flex:1 1 0;block-size:34px;border-radius:10px;font-size:13px;font-weight:600;
  color:var(--text-secondary);background:rgba(255,255,255,.04);
  border:1px solid var(--border-default);}
.l2seg button.on{color:#fff;background:var(--brand-blue-surface);border-color:var(--brand-blue-line);}
.l2slider{block-size:3px;border-radius:2px;background:rgba(255,255,255,.10);margin-block:16px 4px;
  position:relative;}
.l2slider i{position:absolute;inset-block:0;inset-inline-start:0;inline-size:12%;border-radius:2px;
  background:var(--brand-blue-light);}
.l2slider::after{content:"";position:absolute;inset-block-start:50%;inset-inline-start:12%;
  inline-size:14px;block-size:14px;border-radius:50%;background:#fff;transform:translate(-50%,-50%);}
.l2onote{font-size:12px;line-height:1.45;color:var(--text-muted);margin-block:14px 0;}
.l2obtn{margin-block-start:16px;block-size:46px;border-radius:12px;display:flex;align-items:center;
  justify-content:center;font-size:15px;font-weight:650;color:#fff;background:var(--brand-blue);}
.l2obtn.live{background:var(--orange);}     /* контракт: синий = симуляция, оранжевый = live */
.l2obar{margin-block-start:10px;block-size:44px;border-radius:12px;display:flex;align-items:center;
  justify-content:center;font-size:15px;font-weight:650;color:var(--text-primary);
  background:rgba(255,255,255,.06);border:1px solid var(--border-default);}

/* ---- обязательный дисклеймер в финале ---- */
.l2legal{margin-block-start:40px;padding-block-start:28px;
  border-block-start:1px solid rgba(255,255,255,.08);font-size:12px;line-height:1.6;
  color:var(--text-muted);max-inline-size:820px;margin-inline:auto;}

/* ---- адаптив новых блоков ---- */
@media (max-width:1099px){
  .l2do{grid-template-columns:repeat(2,1fr);}
  .l2speedgrid,.l2freegrid{grid-template-columns:1fr;gap:32px;}
  /* выноски встают столбиком под карточкой — выравнивание одно для всех девяти */
  .l2anat{padding-inline:0;}
  .l2tag{max-inline-size:none;text-align:start;justify-content:flex-start;}
  .l2tag.t1,.l2tag.t2,.l2tag.t3,.l2tag.t4,.l2tag.t5,.l2tag.t6,.l2tag.t7,.l2tag.t8,
  .l2tag.t9{inset:auto;text-align:start;justify-content:flex-start;}
  .l2facts{grid-template-columns:1fr;}
  .l2facts.two{grid-template-columns:1fr;}
}
@media (max-width:899px){
  .l2procs{grid-template-columns:1fr;}
}
@media (max-width:767px){
  .l2do{grid-template-columns:1fr;gap:14px;margin-block-start:48px;}
  .l2docard,.l2fact,.l2tempo,.l2proc,.l2freelist{padding:24px;}
  .l2fact b{font-size:36px;}
  .l2tbar{grid-template-columns:66px 1fr 44px;gap:10px;}
  .l2speedfacts b{font-size:26px;}
  .l2bar em{display:none;}
  .l2sline{flex-direction:row;gap:12px;}
  .l2spt b{font-size:17px;}
  .l2bridge{margin-block-start:44px;padding-block-start:32px;}
}

/* ================= появление (fade-up 16-24px, ТЗ п.33) ================= */
.ldjs .ld2rv-init{}
.ld2 .ldrv{opacity:0;transform:translateY(20px);
  transition:opacity .6s ease,transform .6s ease;}
.ld2 .ldrv.in{opacity:1;transform:none;}

/* ================= адаптивность ================= */
@media (max-width:1099px){
  .l2hero .wrap.in{grid-template-columns:1fr;gap:56px;}
  .l2hero{min-block-size:0;padding-block-start:120px!important;}
  .l2stage{justify-content:flex-start;}
  .l2anat{padding:16px 0;inline-size:100%;display:flex;flex-direction:column;
    align-items:center;gap:0;}
  .l2tag{position:static;margin:6px 4px 0 0;}
  .l2tag::before{display:none;}
  .l2anat .l2bigcard{order:-1;margin-block-end:18px;}
  .l2proofpanel{grid-template-columns:1fr;gap:28px;}
  .l2pstat{flex-direction:row;align-items:baseline;gap:16px;flex-wrap:wrap;}
  .l2mathgrid,.l2simgrid,.l2spacegrid,.l2riskgrid,.l2sealgrid{grid-template-columns:1fr;
    gap:36px;}
  .l2map{grid-template-columns:1fr;gap:36px;}
  .l2params.l{text-align:start;}
  .l2params.l li{flex-direction:row;}
  .l2mapcard{display:none;}
  .l2wsp{inline-size:100%;}
  .l2stages{grid-template-columns:repeat(2,1fr);}
  .l2sectors{grid-template-columns:1fr;}
  .l2lines{display:none;}
  .l2center{margin-block-end:24px;}
}
@media (max-width:1023px){
  .ld2 main section{padding-block:112px;}
  .l2proof{padding-block:112px!important;}
  .ld2 .l2head{margin-block-end:44px;}
}
@media (max-width:899px){
  .l2duo{grid-template-columns:1fr;}
  .l2vs{display:none;}
  .l2pane{min-block-size:0;}
  /* диаграмма работы: вертикальный timeline (ТЗ п.13) */
  .l2chain{flex-direction:column;}
  .l2nodes{flex-direction:column;gap:24px;align-items:flex-start;}
  .l2nodes::before{inset-inline:24px auto;inset-inline-start:24px;inset-block:24px;
    inline-size:1px;block-size:auto;}
  .l2nodes li{flex-direction:row;text-align:start;gap:16px;}
  .l2nodes li span{max-inline-size:none;}
  .l2gap{inline-size:auto;block-size:48px;flex:0 0 48px;}
  .l2you{flex-direction:row;text-align:start;gap:16px;}
  .l2you span{max-inline-size:none;}
  .l2simbody{grid-template-columns:1fr;}
  .l2simside{border-inline-start:0;border-block-start:1px solid var(--border-default);}
  .l2wbody{grid-template-columns:52px 1fr;}
  .l2wside{display:none;}
  .l2devcomp{flex-direction:column;align-items:center;gap:28px;}
  .l2dev.desk{inline-size:min(520px,100%);}
  .l2dev.phone{inline-size:min(300px,86%);margin-inline-start:0;}
  .l2dev.tg{inline-size:min(320px,92%);margin:0;}
}
@media (max-width:767px){
  .ld2 main section{padding-block:88px;}
  .l2proof{padding-block:88px!important;}
  .l2thesis{padding-block:64px!important;}
  .ld2 h2{font-size:32px;line-height:1.08;letter-spacing:-.035em;}
  .ld2 h3{font-size:23px;line-height:1.2;}
  .ld2 p{font-size:16px;line-height:1.6;}
  .l2htxt h1{font-size:38px;line-height:1.04;letter-spacing:-.04em;}
  .l2sub{font-size:17px;line-height:1.55;}
  .l2cta{flex-direction:column;align-items:stretch;}
  .l2cta .l2btn{inline-size:100%;}
  .l2final .l2cta{align-items:center;}
  .l2final .l2cta .l2btn{inline-size:min(360px,100%);}
  .l2maincard{inline-size:100%;}
  .l2glow{inline-size:340px;block-size:340px;}
  .l2pane{padding:24px;}
  .l2pv{font-size:64px;}
  .l2stages{grid-template-columns:1fr;gap:30px;}
  .l2thesis p{font-size:22px;}
  .l2funcap{font-size:11px;}
  .l2big{letter-spacing:-.025em;}
  .l2bars{gap:14px;}
  .l2plan{padding:28px;}
  .l2protag{inset-inline-start:28px;}
  .l2faqlist summary{font-size:16px;}
  .l2faqlist .ans{font-size:15px;}
  .l2hero{padding-block-start:104px!important;}
  .l2rr{inset-inline-start:50%;transform:translateX(-50%);}
}
@media (max-width:519px){
  .l2simchart{padding:12px;}
  .l2wmain{padding:10px;}
  .l2tag{white-space:normal;}
}
@media (min-width:1360px){
  .l2space .wrap{max-inline-size:1360px;}
  .l2wsp{margin-inline-end:-48px;}      /* лёгкий выход интерфейса за границу (ТЗ п.22) */
}
/* тонкая сетка для больших экранов: тексту просторно, но не шире контейнера ТЗ */
@media (max-width:1279px) and (min-width:768px){
  .ld2 .wrap{padding-inline:24px;}
}
@media (prefers-reduced-motion: reduce){
  .ldjs .l2fun .fdots circle{animation:none;}
}
