/* ============================================================================
   AI-АГЕНТ ДЛЯ ОБЩЕНИЯ С КЛИЕНТАМИ — стили лендинга
   Визуальный язык: интерфейс продукта. Чаты, поля, статусы, база знаний.
   ========================================================================== */

/* --- 1. Токены ----------------------------------------------------------- */
:root{
  --ink:        #0A1020;
  --ink-2:      #1C2434;
  --muted:      #5A6478;
  --muted-2:    #838DA0;

  --bg:         #FBFCFE;
  --surface:    #F2F5FA;
  --surface-2:  #E9EEF6;
  --white:      #FFFFFF;

  --line:       #E2E8F2;
  --line-2:     #D2DAE8;

  --blue:       #1B5CFF;
  --blue-deep:  #0F3FCC;
  --blue-soft:  #EDF2FF;
  --blue-line:  #C3D3FF;

  --green:      #12A05B;
  --green-soft: #E7F6EE;
  --amber:      #B0700A;
  --amber-soft: #FBF2E0;

  --r-xs: 8px;
  --r-sm: 12px;
  --r:    18px;
  --r-lg: 26px;
  --r-xl: 34px;

  --max: 1200px;
  --pad: 24px;

  --shadow-sm: 0 1px 2px rgba(10,16,32,.05);
  --shadow:    0 8px 26px -14px rgba(10,16,32,.22);
  --shadow-lg: 0 34px 70px -38px rgba(10,16,32,.34);

  --sans: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
  --mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

/* --- 2. Сброс и база ----------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box;min-width:0;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:88px;}
body{
  margin:0;background:var(--bg);color:var(--ink);
  font-family:var(--sans);font-size:17px;line-height:1.55;font-weight:500;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
}
h1,h2,h3,h4{margin:0;font-weight:800;line-height:1.08;letter-spacing:-0.015em;text-wrap:balance;}
p{margin:0;}
ul,ol{margin:0;padding:0;list-style:none;}
a{color:inherit;text-decoration:none;}
button,input,textarea{font:inherit;color:inherit;}
img,svg{display:block;max-width:100%;}
:focus-visible{outline:3px solid var(--blue);outline-offset:3px;border-radius:4px;}
::selection{background:var(--blue);color:#fff;}

.skip{
  position:absolute;left:-9999px;top:0;z-index:200;
  background:var(--ink);color:#fff;padding:12px 18px;border-radius:0 0 var(--r-sm) 0;
}
.skip:focus{left:0;}

/* --- 3. Каркас ----------------------------------------------------------- */
.wrap{width:100%;max-width:var(--max);margin:0 auto;padding:0 var(--pad);}
.sec{padding:104px 0;position:relative;}
.sec--tight{padding:76px 0;}
.sec--surface{background:var(--surface);}
.sec--line{border-top:1px solid var(--line);}
.sec--dark{background:var(--ink);color:#fff;}
.sec--dark h2,.sec--dark h3{color:#fff;}

.eyebrow{
  font-family:var(--mono);font-size:12px;font-weight:600;
  letter-spacing:.09em;text-transform:uppercase;color:var(--blue);
  display:inline-flex;align-items:center;gap:9px;
}
.sec--dark .eyebrow{color:#8FB0FF;}
.eyebrow--muted{color:var(--muted);}

h2.h2{font-size:clamp(29px,3.7vw,46px);}
h3{font-size:20px;font-weight:800;}
.lead{font-size:clamp(17px,1.5vw,19px);color:var(--muted);font-weight:500;max-width:60ch;line-height:1.6;}
.sec--dark .lead{color:#A9B4C8;}
.sec-head{max-width:760px;margin-bottom:56px;}
.sec-head .eyebrow{margin-bottom:18px;}
.sec-head .lead{margin-top:20px;}
.note{font-size:13px;color:var(--muted-2);line-height:1.5;}

.tag{
  font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.07em;
  text-transform:uppercase;padding:5px 10px;border-radius:99px;
  background:var(--surface-2);color:var(--muted);display:inline-block;white-space:nowrap;
}
.tag--demo{background:var(--amber-soft);color:var(--amber);}
.tag--live{background:var(--green-soft);color:var(--green);}
.tag--beta{background:var(--blue-soft);color:var(--blue-deep);}

.dot{width:7px;height:7px;border-radius:50%;background:var(--green);flex:none;}
.dot--pulse{box-shadow:0 0 0 0 rgba(18,160,91,.45);animation:pulse 2.6s ease-out infinite;}
@keyframes pulse{70%{box-shadow:0 0 0 9px rgba(18,160,91,0);}100%{box-shadow:0 0 0 0 rgba(18,160,91,0);}}

/* --- 4. Кнопки ----------------------------------------------------------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-height:52px;padding:0 26px;border-radius:99px;border:1px solid transparent;
  font-size:16px;font-weight:700;cursor:pointer;text-align:center;
  transition:background .18s ease,color .18s ease,border-color .18s ease,transform .18s ease,box-shadow .18s ease;
}
.btn--primary{background:var(--blue);color:#fff;box-shadow:0 10px 24px -12px rgba(27,92,255,.7);}
.btn--primary:hover{background:var(--blue-deep);transform:translateY(-1px);}
.btn--primary[disabled]{opacity:.55;cursor:default;transform:none;}
.btn--ghost{background:transparent;color:var(--ink);border-color:var(--line-2);}
.btn--ghost:hover{background:var(--white);border-color:var(--ink);}
.sec--dark .btn--ghost{color:#fff;border-color:rgba(255,255,255,.28);}
.sec--dark .btn--ghost:hover{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.5);}
.btn--sm{min-height:44px;padding:0 20px;font-size:15px;}
.btn--full{width:100%;}
.btn:active{transform:translateY(0);}

/* --- 5. Шапка ------------------------------------------------------------ */
.hdr{
  position:sticky;top:0;z-index:60;
  background:rgba(251,252,254,.82);backdrop-filter:saturate(1.6) blur(14px);
  border-bottom:1px solid transparent;transition:border-color .25s ease,box-shadow .25s ease;
}
.hdr.is-stuck{border-bottom-color:var(--line);box-shadow:0 1px 20px -12px rgba(10,16,32,.3);}
.hdr__in{display:flex;align-items:center;gap:28px;height:70px;}
.brand{display:flex;align-items:center;gap:11px;font-weight:800;letter-spacing:-.02em;flex:none;}
.brand__mark{
  width:32px;height:32px;border-radius:10px;background:var(--blue);flex:none;
  display:grid;place-items:center;color:#fff;font-family:var(--mono);font-size:14px;font-weight:700;
}
.brand__sub{font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.08em;
  text-transform:uppercase;color:var(--blue);border:1px solid var(--blue-line);
  background:var(--blue-soft);padding:3px 7px;border-radius:6px;}
.nav{display:flex;align-items:center;gap:26px;margin-left:auto;}
.nav a{font-size:15px;font-weight:600;color:var(--muted);transition:color .16s ease;
  padding:11px 0;} /* вертикальные отступы ради нормальной области попадания */
.nav a:hover{color:var(--ink);}
.hdr .btn{flex:none;}
.burger{display:none;width:46px;height:46px;border:1px solid var(--line-2);border-radius:12px;
  background:var(--white);align-items:center;justify-content:center;cursor:pointer;margin-left:auto;}
.burger span{display:block;width:18px;height:2px;background:var(--ink);border-radius:2px;position:relative;}
.burger span::before,.burger span::after{content:'';position:absolute;left:0;width:18px;height:2px;
  background:var(--ink);border-radius:2px;transition:transform .22s ease,opacity .22s ease;}
.burger span::before{top:-6px;}.burger span::after{top:6px;}
.burger[aria-expanded="true"] span{background:transparent;}
.burger[aria-expanded="true"] span::before{transform:translateY(6px) rotate(45deg);}
.burger[aria-expanded="true"] span::after{transform:translateY(-6px) rotate(-45deg);}

/* --- 6. Hero ------------------------------------------------------------- */
.hero{padding:76px 0 96px;position:relative;overflow:hidden;}
.hero::before{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(760px 460px at 78% 6%, rgba(27,92,255,.09), transparent 62%),
    linear-gradient(180deg, #FFFFFF 0%, var(--bg) 58%);
}
.hero__in{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,470px);
  gap:52px;align-items:center;}
.hero h1{font-size:clamp(33px,3.9vw,50px);letter-spacing:-0.022em;margin:20px 0 22px;}
.hero .lead{font-size:clamp(17px,1.5vw,19px);max-width:38ch;}
.hero__cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px;}
.hero__signals{display:flex;flex-wrap:wrap;align-items:center;gap:10px 20px;margin-top:32px;}
.signal{display:inline-flex;align-items:center;gap:9px;font-size:14px;font-weight:600;color:var(--ink-2);
  background:var(--white);border:1px solid var(--line);border-radius:99px;padding:8px 15px;box-shadow:var(--shadow-sm);}
.signal--muted{background:transparent;border-color:transparent;color:var(--muted);box-shadow:none;padding-left:0;}

/* --- 7. Мокап чата (общий компонент) ------------------------------------- */
.chat{
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);
  box-shadow:var(--shadow-lg);overflow:hidden;
}
.chat__bar{
  display:flex;align-items:center;gap:10px;padding:14px 18px;
  border-bottom:1px solid var(--line);background:linear-gradient(180deg,#fff,#FBFCFE);
}
.chat__src{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink);display:inline-flex;align-items:center;gap:7px;}
.chat__src i{width:16px;height:16px;border-radius:5px;background:#04E061;flex:none;display:block;}
.chat__status{margin-left:auto;display:inline-flex;align-items:center;gap:7px;
  font-family:var(--mono);font-size:11px;font-weight:600;color:var(--green);letter-spacing:.05em;}
.chat__body{padding:20px 18px 22px;display:flex;flex-direction:column;gap:9px;background:var(--bg);}
.chat__who{font-size:12px;font-weight:700;color:var(--muted-2);letter-spacing:.02em;margin:4px 0 -2px;}
.chat__who--ai{color:var(--blue);}

.msg{
  max-width:86%;padding:12px 15px;border-radius:16px;font-size:15px;line-height:1.5;
  border:1px solid var(--line);background:var(--white);box-shadow:var(--shadow-sm);
}
/* Двойной класс намеренно: пузырь встречается внутри блоков, где у p задан
   свой цвет текста, и без повышения веса белый текст на синем терялся. */
.msg.msg--in{align-self:flex-start;border-bottom-left-radius:6px;
  background:var(--surface);color:var(--ink);}
.msg.msg--out{align-self:flex-end;border-bottom-right-radius:6px;
  background:var(--blue);color:#fff;border-color:var(--blue);}
.chat__foot{padding:12px 18px 16px;border-top:1px solid var(--line);background:var(--white);
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.chat__foot .note{margin-right:auto;}

/* --- 8. Возможности («Он знает Ваш бизнес») ------------------------------ */
.knows{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;}
.knows__item{background:var(--white);padding:36px 34px 34px;display:flex;flex-direction:column;gap:14px;
  transition:background .2s ease;}
.knows__item:hover{background:#FCFDFF;}
.knows__n{font-family:var(--mono);font-size:12px;font-weight:700;color:var(--blue);letter-spacing:.08em;}
.knows__item p{color:var(--muted);font-size:16px;}
.knows__vis{margin-top:auto;padding-top:22px;}

.chips{display:flex;flex-wrap:wrap;gap:7px;}
.chip{font-size:13px;font-weight:600;padding:7px 12px;border-radius:99px;
  background:var(--surface);border:1px solid var(--line);color:var(--ink-2);}
.chip--blue{background:var(--blue-soft);border-color:var(--blue-line);color:var(--blue-deep);}

.minichat{display:flex;flex-direction:column;gap:6px;}
.minichat .msg{font-size:13.5px;padding:9px 12px;max-width:92%;}

.memory{display:flex;flex-direction:column;gap:8px;}
.memory__row{display:flex;align-items:center;gap:10px;font-size:13.5px;color:var(--muted);
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm);padding:9px 12px;}
.memory__row b{color:var(--ink);font-weight:700;}
.memory__row--now{background:var(--blue-soft);border-color:var(--blue-line);color:var(--blue-deep);}

.handoff{display:flex;align-items:center;gap:12px;}
.handoff__card{flex:1;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm);
  padding:12px 14px;font-size:13.5px;font-weight:700;text-align:center;}
.handoff__card--to{background:var(--ink);color:#fff;border-color:var(--ink);flex:0 0 auto;padding:12px 22px;}
.handoff__arrow{color:var(--blue);flex:none;}

/* --- 9. Обучение агента -------------------------------------------------- */
.train{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,420px);gap:60px;align-items:start;}
.train__steps{display:flex;flex-direction:column;}
.train__step{display:grid;grid-template-columns:44px minmax(0,1fr);gap:20px;padding-bottom:30px;position:relative;}
.train__step::before{content:'';position:absolute;left:21px;top:44px;bottom:2px;width:2px;
  background:linear-gradient(180deg,var(--blue-line),var(--line));}
/* За последним шагом идёт кнопка, поэтому :last-child здесь не сработал бы */
.train__step[data-train="3"]{padding-bottom:22px;}
.train__step[data-train="3"]::before{display:none;}
.train__num{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;
  font-family:var(--mono);font-size:13px;font-weight:700;background:var(--white);
  border:1px solid var(--line);color:var(--muted);position:relative;z-index:1;
  transition:background .35s ease,border-color .35s ease,color .35s ease;}
.train__step.is-active .train__num{background:var(--blue);border-color:var(--blue);color:#fff;}
.train__step h3{font-size:19px;margin-bottom:6px;}
.train__step p{color:var(--muted);font-size:15.5px;}
.train__cta{padding-left:64px;margin-top:4px;}
.train__aside{position:sticky;top:100px;display:flex;flex-direction:column;gap:16px;}

.voice{background:var(--white);border:1px solid var(--line);border-radius:var(--r);
  padding:16px 18px;box-shadow:var(--shadow);display:flex;align-items:center;gap:14px;}
.voice__play{width:40px;height:40px;border-radius:50%;background:var(--blue);flex:none;
  display:grid;place-items:center;color:#fff;}
.voice__wave{flex:1;display:flex;align-items:center;gap:3px;height:32px;}
.voice__wave i{flex:1;background:var(--blue-line);border-radius:2px;display:block;min-height:4px;
  transition:background .4s ease;}
.voice.is-playing .voice__wave i{background:var(--blue);}
.voice__time{font-family:var(--mono);font-size:12px;color:var(--muted);flex:none;}
.voice__text{font-size:14.5px;color:var(--muted);line-height:1.55;padding:0 2px;}
.voice__text b{color:var(--ink);font-weight:700;}

.qcard{background:var(--white);border:1px solid var(--line);border-radius:var(--r);padding:18px 20px;
  box-shadow:var(--shadow-sm);}
.qcard__head{display:flex;align-items:center;gap:9px;margin-bottom:12px;}
.qcard__head span{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.07em;
  text-transform:uppercase;color:var(--blue);}
.qcard ul{display:flex;flex-direction:column;gap:8px;}
.qcard li{font-size:14.5px;color:var(--ink-2);padding-left:18px;position:relative;}
.qcard li::before{content:'';position:absolute;left:2px;top:9px;width:6px;height:6px;border-radius:50%;
  background:var(--blue-line);}

.kbuild{background:var(--white);border:1px solid var(--line);border-radius:var(--r);padding:18px 20px;
  box-shadow:var(--shadow-sm);display:flex;flex-direction:column;gap:10px;}
.kbuild__row{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:600;}
.kbuild__row svg{color:var(--green);flex:none;}
.kbuild__bar{height:6px;border-radius:99px;background:var(--surface-2);overflow:hidden;}
.kbuild__bar i{display:block;height:100%;background:var(--blue);border-radius:99px;width:0;
  transition:width 1.1s cubic-bezier(.4,0,.2,1);}
.kbuild.is-done .kbuild__bar i{width:100%;}

/* --- 10. Как работает (тёмная секция) ------------------------------------ */
.flow{display:flex;flex-direction:column;}
.flow__step{display:grid;grid-template-columns:38px minmax(0,1fr);gap:18px;align-items:start;
  padding:16px 0;position:relative;opacity:.42;transition:opacity .45s ease;}
.flow__step.is-on{opacity:1;}
.flow__step::before{content:'';position:absolute;left:18px;top:42px;bottom:-6px;width:1px;
  background:rgba(255,255,255,.14);}
.flow__step:last-child::before{display:none;}
.flow__bullet{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);color:#8FB0FF;
  transition:background .45s ease,border-color .45s ease,color .45s ease;}
.flow__step.is-on .flow__bullet{background:var(--blue);border-color:var(--blue);color:#fff;}
.flow__step h3{font-size:17px;margin-bottom:3px;}
.flow__step p{font-size:14.5px;color:#A9B4C8;}

.pipe{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:26px;align-items:stretch;
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:var(--r-lg);
  padding:22px;}
.pipe__node{text-align:center;padding:20px 12px;border-radius:var(--r);
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);
  transition:background .4s ease,border-color .4s ease,transform .4s ease;position:relative;}
.pipe__node.is-on{background:rgba(27,92,255,.22);border-color:#4B7CFF;transform:translateY(-2px);}
.pipe__node b{display:block;font-family:var(--mono);font-size:12px;font-weight:700;letter-spacing:.08em;
  text-transform:uppercase;color:#fff;margin-bottom:5px;}
.pipe__node span{font-size:13px;color:#A9B4C8;}
.pipe__node::after{content:'';position:absolute;right:-20px;top:50%;width:14px;height:1px;
  background:rgba(255,255,255,.24);}
.pipe__node:last-child::after{display:none;}

/* --- 11. Режимы ---------------------------------------------------------- */
.modes{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,520px);gap:52px;align-items:start;}
.modes__list{display:flex;flex-direction:column;gap:14px;}
.mode{background:var(--white);border:1px solid var(--line);border-radius:var(--r);padding:24px 26px;
  box-shadow:var(--shadow-sm);}
.mode--hi{border-color:var(--blue-line);box-shadow:0 16px 40px -26px rgba(27,92,255,.55);}
.mode__top{display:flex;align-items:center;gap:11px;flex-wrap:wrap;margin-bottom:10px;}
.mode__key{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  color:var(--muted);background:var(--surface);border:1px solid var(--line);border-radius:6px;padding:4px 8px;}
.mode--hi .mode__key{color:var(--blue-deep);background:var(--blue-soft);border-color:var(--blue-line);}
.mode h3{font-size:19px;}
.mode p{color:var(--muted);font-size:15.5px;margin-top:6px;}

/* ASSIST-панель */
.assist{background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);
  box-shadow:var(--shadow-lg);overflow:hidden;position:sticky;top:100px;}
.assist__bar{display:flex;align-items:center;gap:10px;padding:14px 18px;border-bottom:1px solid var(--line);}
.assist__bar b{font-size:14px;font-weight:800;}
.assist__body{padding:18px;display:flex;flex-direction:column;gap:12px;}
.assist__client{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm);padding:12px 14px;}
.assist__client span{font-size:12px;font-weight:700;color:var(--muted-2);display:block;margin-bottom:4px;}
.assist__client p{font-size:14.5px;}
.assist__label{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.08em;
  text-transform:uppercase;color:var(--muted);display:flex;align-items:center;gap:8px;}
.draft{border:1px solid var(--line-2);border-radius:var(--r-sm);padding:11px 13px;font-size:14.5px;
  background:var(--white);position:relative;min-height:44px;
  transition:border-color .25s ease,background .25s ease;}
.draft.is-edit{border-color:var(--blue);background:var(--blue-soft);}
.draft__cursor{display:inline-block;width:2px;height:1em;background:var(--blue);vertical-align:-2px;
  margin-left:1px;animation:blink 1s steps(2) infinite;}
@keyframes blink{50%{opacity:0;}}
.draft__tag{position:absolute;top:-9px;right:12px;font-family:var(--mono);font-size:10px;font-weight:700;
  letter-spacing:.07em;text-transform:uppercase;background:var(--blue);color:#fff;padding:2px 7px;
  border-radius:5px;opacity:0;transition:opacity .25s ease;}
.draft.is-edit .draft__tag{opacity:1;}
.assist__foot{padding:16px 18px;border-top:1px solid var(--line);background:var(--bg);
  display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.assist__sent{display:inline-flex;align-items:center;gap:7px;font-size:14px;font-weight:700;color:var(--green);
  opacity:0;transform:translateX(-6px);transition:opacity .3s ease,transform .3s ease;}
.assist.is-sent .assist__sent{opacity:1;transform:none;}

/* --- 12. База знаний ----------------------------------------------------- */
.kb{display:grid;grid-template-columns:minmax(0,430px) minmax(0,1fr);gap:44px;align-items:start;}
.kb__panel{background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);
  box-shadow:var(--shadow);overflow:hidden;}
.kb__head{padding:15px 18px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:10px;}
.kb__head b{font-size:14px;font-weight:800;}
.kb__count{margin-left:auto;font-family:var(--mono);font-size:11px;color:var(--muted);}
.kb__list{display:flex;flex-direction:column;}
.kb__item{padding:14px 18px;border-bottom:1px solid var(--line);display:flex;align-items:center;
  gap:8px 14px;flex-wrap:wrap;transition:background .4s ease;}
.kb__item.is-hit{background:var(--blue-soft);}
.kb__item b{font-size:14.5px;font-weight:700;flex:1 0 auto;}
.kb__spec{font-family:var(--mono);font-size:12px;color:var(--muted);flex:none;}
.kb__price{font-size:14px;font-weight:800;flex:none;}
.kb__stock{font-size:12px;font-weight:700;color:var(--green);flex:none;}
.kb__stock--order{color:var(--amber);}
.kb__more{padding:14px 18px;font-size:13px;color:var(--muted);text-align:center;
  background:var(--surface);font-family:var(--mono);}

/* --- 13. Преимущества + экономика ---------------------------------------- */
.adv{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;}
.adv__i{background:var(--white);padding:30px 28px;display:flex;flex-direction:column;gap:9px;}
.adv__i h3{font-size:17px;}
.adv__i p{font-size:15px;color:var(--muted);}
.adv__i svg{color:var(--blue);margin-bottom:6px;}

.econ{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,400px);gap:48px;align-items:center;
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-xl);padding:48px;
  box-shadow:var(--shadow);margin-top:56px;}
.econ__fig{font-size:clamp(58px,7.6vw,92px);font-weight:800;letter-spacing:-.04em;line-height:1;color:var(--blue);}
.econ__label{font-size:17px;color:var(--muted);margin-top:12px;max-width:34ch;}
.econ__foot{margin-top:18px;max-width:46ch;}
.econ__vis{display:flex;flex-direction:column;gap:10px;}
.econ__online{display:flex;align-items:center;gap:10px;background:var(--ink);color:#fff;
  border-radius:var(--r);padding:14px 18px;font-family:var(--mono);font-size:12px;font-weight:700;
  letter-spacing:.08em;text-transform:uppercase;}
.econ__online span:last-child{margin-left:auto;color:#7BE7AC;}
.econ__par{display:flex;flex-direction:column;gap:8px;}
.econ__row{display:flex;align-items:center;gap:12px;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r-sm);padding:11px 14px;font-size:14px;}
.econ__row b{font-weight:700;}
.econ__row span{margin-left:auto;font-family:var(--mono);font-size:11.5px;color:var(--green);font-weight:600;}

/* --- 14. Avito Beta ------------------------------------------------------ */
.beta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;}
.beta__col{border:1px solid var(--line);border-radius:var(--r-lg);padding:32px 30px;background:var(--white);}
.beta__col--next{background:transparent;border-style:dashed;border-color:var(--line-2);}
.beta__col h3{font-family:var(--mono);font-size:12px;font-weight:700;letter-spacing:.1em;
  text-transform:uppercase;color:var(--muted);margin-bottom:22px;}
.beta__col--now h3{color:var(--green);}
.beta__col ul{display:flex;flex-direction:column;gap:13px;}
.beta__col li{display:flex;align-items:flex-start;gap:12px;font-size:16px;font-weight:600;}
.beta__col li svg{flex:none;margin-top:4px;color:var(--green);}
.beta__col--next li{color:var(--muted);font-weight:500;}
.beta__col--next li svg{color:var(--line-2);}
.beta__soon{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;
  color:var(--muted-2);border:1px solid var(--line-2);border-radius:5px;padding:2px 6px;margin-left:auto;flex:none;}

/* --- 15. Настройка (таймлайн) -------------------------------------------- */
.steps{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));position:relative;}
/* Направляющая обрывается на центре последнего кружка, а не у края секции */
.steps::before{content:'';position:absolute;left:0;right:calc(20% - 26px);top:26px;height:1px;
  background:var(--line);}
.step{padding:0 20px 0 0;position:relative;}
.step__n{width:52px;height:52px;border-radius:50%;background:var(--white);border:1px solid var(--line);
  display:grid;place-items:center;font-family:var(--mono);font-size:14px;font-weight:700;color:var(--blue);
  position:relative;z-index:1;margin-bottom:20px;}
.step h3{font-size:17px;margin-bottom:7px;}
.step p{font-size:14.5px;color:var(--muted);}

/* --- 16. До / После ------------------------------------------------------ */
.ba{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;align-items:start;}
.ba__col{border-radius:var(--r-lg);padding:32px 30px;border:1px solid var(--line);background:var(--white);}
.ba__col--after{background:var(--ink);border-color:var(--ink);color:#fff;}
.ba__col h3{font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--muted);margin-bottom:24px;}
.ba__col--after h3{color:#8FB0FF;}
.ba__chain{display:flex;flex-direction:column;}
.ba__link{padding:13px 16px;border-radius:var(--r-sm);background:var(--surface);font-size:15px;font-weight:600;}
.ba__col--after .ba__link{background:rgba(255,255,255,.08);}
.ba__col--after .ba__link--you{background:var(--blue);}
.ba__sep{height:16px;display:grid;place-items:center;color:var(--line-2);}
.ba__col--after .ba__sep{color:rgba(255,255,255,.3);}
.ba__punch{margin-top:56px;text-align:center;font-size:clamp(23px,3vw,36px);font-weight:800;
  letter-spacing:-.02em;line-height:1.24;text-wrap:balance;}
.ba__punch span{color:var(--blue);}

/* --- 17. Для кого -------------------------------------------------------- */
.who{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;}
.who__i{padding:28px 26px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--white);
  display:flex;flex-direction:column;gap:10px;}
.who__i h3{font-family:var(--mono);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--blue);line-height:1.4;}
.who__i p{font-size:15px;color:var(--muted);}

/* --- 18. FAQ ------------------------------------------------------------- */
.faq{max-width:840px;margin:0 auto;border-top:1px solid var(--line);}
.faq details{border-bottom:1px solid var(--line);}
.faq summary{display:flex;align-items:center;gap:18px;padding:24px 4px;cursor:pointer;
  font-size:clamp(17px,1.7vw,19px);font-weight:700;list-style:none;min-height:64px;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:'';margin-left:auto;flex:none;width:12px;height:12px;
  border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);
  transform:rotate(45deg) translate(-3px,-3px);transition:transform .22s ease;}
.faq details[open] summary::after{transform:rotate(-135deg) translate(-2px,-2px);border-color:var(--blue);}
.faq__a{padding:0 4px 26px;color:var(--muted);font-size:16px;max-width:70ch;}

/* --- 19. Финальный CTA + форма ------------------------------------------- */
.final{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,450px);gap:56px;align-items:start;}
.final h2{font-size:clamp(29px,3.9vw,48px);}
.form{background:var(--white);border:1px solid var(--line);border-radius:var(--r-xl);padding:32px;
  box-shadow:var(--shadow-lg);}
.form__row{display:flex;flex-direction:column;gap:7px;margin-bottom:16px;}
.form__row label{font-size:14px;font-weight:700;}
.form__row input,.form__row textarea{
  width:100%;min-height:52px;padding:14px 16px;border-radius:var(--r-sm);
  border:1px solid var(--line-2);background:var(--bg);font-size:16px;font-weight:500;
  transition:border-color .18s ease,background .18s ease;
}
.form__row textarea{min-height:96px;resize:vertical;line-height:1.5;}
.form__row input:focus,.form__row textarea:focus{border-color:var(--blue);background:#fff;outline:none;}
.form__row input::placeholder,.form__row textarea::placeholder{color:var(--muted-2);font-weight:500;}
.form__hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;}
.form__err{font-size:14px;color:#C02A2A;margin-top:12px;display:none;}
.form__err.is-on{display:block;}
.form__note{margin-top:14px;text-align:center;}
.form__ok{display:none;flex-direction:column;align-items:center;text-align:center;gap:12px;padding:26px 6px;}
.form.is-ok .form__ok{display:flex;}
.form.is-ok .form__body{display:none;}
.form__ok svg{color:var(--green);}
.form__ok h3{font-size:21px;}
.form__ok p{color:var(--muted);max-width:34ch;}

.final__vis{display:flex;flex-direction:column;gap:14px;margin-top:34px;max-width:420px;}
.final__card{display:flex;align-items:center;gap:12px;background:var(--white);border:1px solid var(--line);
  border-radius:var(--r);padding:14px 18px;box-shadow:var(--shadow-sm);font-size:14.5px;font-weight:600;}
.final__card .tag{margin-left:auto;}

/* --- 20. Подвал ---------------------------------------------------------- */
.ftr{border-top:1px solid var(--line);padding:40px 0;background:var(--surface);}
.ftr__in{display:flex;align-items:center;gap:24px;flex-wrap:wrap;}
.ftr__in .note{margin-right:auto;max-width:52ch;}
.ftr a{font-size:15px;font-weight:600;color:var(--muted);}
.ftr a:hover{color:var(--blue);}

/* --- 21. Появление при скролле ------------------------------------------- */
.rv{opacity:0;transform:translateY(18px);
  transition:opacity .6s cubic-bezier(.2,.6,.2,1),transform .6s cubic-bezier(.2,.6,.2,1);}
.rv.is-in{opacity:1;transform:none;}
.rv-d1{transition-delay:.07s;}.rv-d2{transition-delay:.14s;}.rv-d3{transition-delay:.21s;}.rv-d4{transition-delay:.28s;}

.msg-anim{opacity:0;transform:translateY(10px) scale(.98);
  transition:opacity .42s ease,transform .42s cubic-bezier(.2,.7,.3,1);}
.msg-anim.is-in{opacity:1;transform:none;}

/* --- 22. Адаптив --------------------------------------------------------- */
@media (max-width:1200px){
  .hero__in{gap:44px;}
  .modes,.kb,.train{gap:38px;}
  .sec{padding:92px 0;}
}
@media (max-width:1024px){
  :root{--pad:22px;}
  .sec{padding:80px 0;}
  .hero{padding:52px 0 72px;}
  .hero__in,.modes,.kb,.train,.final,.econ{grid-template-columns:minmax(0,1fr);}
  .hero__in{gap:42px;}
  .hero .lead{max-width:52ch;}
  .assist,.train__aside{position:static;}
  .train{gap:40px;}
  .econ{padding:36px;gap:32px;}
  .adv{grid-template-columns:repeat(2,minmax(0,1fr));}
  .who{grid-template-columns:repeat(2,minmax(0,1fr));}
  .steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:34px 24px;}
  .steps::before{display:none;}
  .step{padding:0;}
  .nav{display:none;}
  .burger{display:flex;}
  .hdr .btn{display:none;}
  .final{gap:44px;}
}
@media (max-width:760px){
  body{font-size:16px;}
  :root{--pad:18px;}
  .sec{padding:60px 0;}
  .sec--tight{padding:50px 0;}
  .sec-head{margin-bottom:34px;}
  .hero{padding:36px 0 56px;}
  .hero h1{font-size:clamp(30px,8vw,40px);margin:16px 0;}
  .hero__cta{gap:10px;}
  .hero__cta .btn{width:100%;}
  .hero__signals{gap:8px 14px;margin-top:26px;}
  .knows{grid-template-columns:minmax(0,1fr);border-radius:var(--r);}
  .knows__item{padding:26px 22px;}
  .pipe{grid-template-columns:repeat(2,minmax(0,1fr));padding:16px;gap:10px;}
  .pipe__node{padding:16px 10px;}
  .pipe__node::after{display:none;}
  .adv,.who,.beta,.ba,.steps{grid-template-columns:minmax(0,1fr);}
  .adv{border-radius:var(--r);}
  .adv__i{padding:24px 22px;}
  .beta__col,.ba__col,.who__i{padding:24px 22px;border-radius:var(--r);}
  .econ{padding:26px 22px;border-radius:var(--r-lg);}
  .econ__fig{font-size:clamp(50px,16vw,64px);}
  .form{padding:24px 20px;border-radius:var(--r-lg);}
  .chat__body{padding:16px 14px 18px;}
  .msg{max-width:93%;font-size:14.5px;}
  .train__step{grid-template-columns:38px minmax(0,1fr);gap:14px;padding-bottom:26px;}
  .train__num{width:38px;height:38px;border-radius:12px;}
  .train__step::before{left:18px;top:38px;}
  .train__cta{padding-left:0;margin-top:8px;}
  .train__cta .btn{width:100%;}
  .steps{gap:26px;}
  .step__n{width:44px;height:44px;margin-bottom:14px;}
  .ba__punch{margin-top:34px;}
  .faq summary{padding:20px 2px;gap:14px;}
  .kb__item{padding:13px 16px;}
  .ftr__in{gap:14px;}
  .ftr__in .note{width:100%;}
}
@media (max-width:400px){
  :root{--pad:16px;}
  .brand__sub{display:none;}
  .chat__src{font-size:10px;}
  .chat__status{font-size:10px;}
}

/* --- 23. Мобильное меню -------------------------------------------------- */
.mnav{
  position:fixed;inset:70px 0 auto;z-index:55;background:var(--white);
  border-bottom:1px solid var(--line);box-shadow:var(--shadow);
  padding:18px var(--pad) 24px;display:none;flex-direction:column;gap:4px;
}
.mnav.is-open{display:flex;}
.mnav a{padding:14px 4px;font-size:17px;font-weight:700;border-bottom:1px solid var(--line);}
.mnav .btn{margin-top:14px;border-bottom:none;}

/* --- 24. Уважение к prefers-reduced-motion ------------------------------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{
    animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important;scroll-behavior:auto!important;
  }
  .rv{opacity:1;transform:none;}
  .msg-anim{opacity:1;transform:none;}
}

/* --- 25. Печать ---------------------------------------------------------- */
@media print{.hdr,.mnav,.btn{display:none!important;}body{background:#fff;}}
