/* ============================================================================
   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);}
.eyebrow{
  font-family:var(--sans);font-size:13px;font-weight:700;
  letter-spacing:.01em;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(32px,4.4vw,58px);letter-spacing:-0.025em;}
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(--sans);font-size:12px;font-weight:700;letter-spacing:0;
  padding:5px 11px;border-radius:99px;
  background:var(--surface-2);color:var(--muted);display:inline-block;white-space:nowrap;
}.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:34px;height:34px;border-radius:50%;flex:none;display:block;object-fit:cover;}.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(40px,5.4vw,74px);letter-spacing:-0.03em;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(--sans);font-size:13px;font-weight:700;letter-spacing:0;
  color:var(--ink);display:inline-flex;align-items:center;gap:8px;}
.chat__src img{width:18px;height:18px;border-radius:50%;flex:none;display:block;}
.chat__status{margin-left:auto;display:inline-flex;align-items:center;gap:7px;
  font-family:var(--sans);font-size:12.5px;font-weight:700;color:var(--green);}
.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);}
.chat--demo .msg{opacity:0;transform:translateY(8px);
  transition:opacity .32s ease,transform .32s ease;}
.chat--demo .msg.is-in{opacity:1;transform:none;}

.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--demo .chat__body{min-height:300px;max-height:340px;overflow-y:auto;scroll-behavior:smooth;}
.chat__asks{display:flex;flex-wrap:wrap;gap:8px;padding:14px 16px 16px;
  border-top:1px solid var(--line);background:var(--white);}
.ask{
  border:1px solid var(--line-2);background:var(--white);color:var(--ink);
  border-radius:99px;padding:9px 15px;font-size:14px;font-weight:600;cursor:pointer;
  transition:border-color .16s ease,color .16s ease,background .16s ease,transform .16s ease;
}
.ask:hover:not(:disabled){border-color:var(--blue);color:var(--blue);background:var(--blue-soft);}
.ask:active:not(:disabled){transform:scale(.97);}
.ask:disabled{opacity:.4;cursor:default;}
/* Три точки, пока агент «думает». Секунда ожидания продаёт лучше мгновенного
   ответа: видно, что отвечает не заготовка */
.msg--typing{display:inline-flex;align-items:center;gap:4px;padding:14px 16px;}
.msg--typing i{width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.45;
  animation:think 1.1s ease-in-out infinite;}
.msg--typing i:nth-child(2){animation-delay:.15s;}
.msg--typing i:nth-child(3){animation-delay:.3s;}
@keyframes think{0%,60%,100%{transform:translateY(0);opacity:.35;}30%{transform:translateY(-4px);opacity:.9;}}.chat__foot .note{margin-right:auto;}.minichat .msg{font-size:13.5px;padding:9px 12px;max-width:92%;}/* За последним шагом идёт кнопка, поэтому :last-child здесь не сработал бы */
.train__step[data-train="3"]{padding-bottom:22px;}.train__step.is-active .train__num{background:var(--blue);border-color:var(--blue);color:#fff;}.voice.is-playing .voice__wave i{background:var(--blue);}.kbuild.is-done .kbuild__bar i{width:100%;}.flow__step.is-on{opacity:1;}.flow__step.is-on .flow__bullet{background:var(--blue);border-color:var(--blue);color:#fff;}.pipe__node.is-on{background:rgba(27,92,255,.22);border-color:#4B7CFF;transform:translateY(-2px);}.draft.is-edit{border-color:var(--blue);background:var(--blue-soft);}@keyframes blink{50%{opacity:0;}}.draft.is-edit .draft__tag{opacity:1;}.assist.is-sent .assist__sent{opacity:1;transform:none;}.kb__item.is-hit{background:var(--blue-soft);}
/* --- 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__top{display:flex;align-items:center;gap:11px;}
.adv__i h3{font-size:17px;color:var(--blue);}
.adv__i p{font-size:15px;color:var(--muted);}
.adv__i svg{color:var(--blue);flex:none;}

.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(66px,9.5vw,124px);font-weight:800;letter-spacing:-.05em;
  line-height:.95;color:var(--blue);}
.econ__label{font-size:20px;font-weight:700;color:var(--ink);margin-top:16px;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(--sans);font-size:13.5px;font-weight:700;
  letter-spacing:0;}
.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(--sans);font-size:13px;color:var(--green);font-weight:700;}/* Направляющая обрывается на центре последнего кружка, а не у края секции */
.steps::before{content:'';position:absolute;left:0;right:calc(20% - 26px);top:26px;height:1px;
  background:var(--line);}
/* --- 16. До / После ------------------------------------------------------ */
.ba__col--after h3{color:#8FB0FF;}
.ba__col--after .ba__link{background:rgba(255,255,255,.08);}
.ba__col--after .ba__link--you{background:var(--blue);}.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-size:18px;font-weight:800;color:var(--ink);line-height:1.3;}
.who__i p{font-size:15px;color:var(--muted);}

/* --- 14a. Срок оплаты ------------------------------------------------------ */
.term{display:flex;justify-content:center;gap:4px;margin:0 auto 34px;padding:4px;
  width:max-content;max-width:100%;border:1px solid var(--line);border-radius:999px;
  background:var(--white);box-shadow:var(--shadow-sm);}
.term__btn{display:inline-flex;align-items:center;gap:8px;padding:11px 22px;border:0;
  border-radius:999px;background:transparent;font:inherit;font-size:15px;font-weight:700;
  color:var(--muted);cursor:pointer;transition:background .18s ease,color .18s ease;}
.term__btn:hover{color:var(--ink);}
.term__btn.is-on{background:var(--blue);color:#fff;}
.term__save{font-size:12.5px;font-weight:800;padding:3px 8px;border-radius:999px;
  background:rgba(37,99,235,.12);color:var(--blue);}
.term__btn.is-on .term__save{background:rgba(255,255,255,.22);color:#fff;}
/* Годовая сумма целиком – мелко под ценой, чтобы не спорила с ней за внимание */
.plan__year{font-size:13.5px;color:var(--muted);margin-top:8px;line-height:1.45;}

/* --- 15a. Цифры работы ---------------------------------------------------- */
/* Крупные числа в ряд – тот же приём, что и у «≈ 1 ₽»: цифра читается
   раньше подписи и запоминается вместо неё */
.figs{text-align:center;}
.figs__since{font-size:14px;font-weight:700;color:var(--blue);margin-bottom:26px;}
.figs__row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;}
.fig__v{font-size:clamp(34px,4.6vw,58px);font-weight:800;letter-spacing:-.04em;
  line-height:1;color:var(--ink);}
.fig__l{font-size:14.5px;color:var(--muted);margin-top:10px;}
.figs__note{margin-top:26px;max-width:60ch;margin-inline:auto;}

/* --- 15b. Отзывы ---------------------------------------------------------- */
.revs{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;}
.rev{padding:28px 26px;border:1px solid var(--line);border-radius:var(--r-lg);
  background:var(--white);box-shadow:var(--shadow-sm);display:flex;flex-direction:column;}
.rev__text{font-size:16px;line-height:1.6;}
.rev__who{margin-top:auto;padding-top:18px;}
.rev__who b{display:block;font-size:15px;}
.rev__who span{display:block;font-size:13.5px;color:var(--muted);margin-top:2px;}

/* --- 16a. Настройка голосом ---------------------------------------------- */
.setup{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,440px);gap:48px;align-items:start;}
/* Записи ещё нет: проигрыватель остаётся на месте, но приглушён
   и не нажимается – видно, что здесь будет, и не выглядит поломанным */
.vmsg--soon .vmsg__player{opacity:.55;}
.vmsg--soon .vmsg__play{cursor:default;background:var(--muted-2);}
.vmsg--soon .vmsg__time{font-family:var(--sans);font-weight:700;}
.setup__steps{display:flex;flex-direction:column;gap:26px;}
.setup__step{display:flex;gap:18px;align-items:flex-start;}
.setup__num{
  flex:none;width:36px;height:36px;border-radius:50%;
  background:var(--blue);color:#fff;display:grid;place-items:center;
  font-size:16px;font-weight:800;
}
.setup__step h3{margin-bottom:6px;}
.setup__step p{color:var(--muted);font-size:15.5px;}

/* Голосовое Александра. Не украшение: главная мысль страницы – настроить
   агента можно голосом, – и услышать это голосом убедительнее, чем прочитать */
.vmsg{margin:0;padding:24px;border:1px solid var(--line);border-radius:var(--r-lg);
  background:var(--white);box-shadow:var(--shadow);}
.vmsg__head{display:flex;align-items:center;gap:13px;margin-bottom:18px;}
.vmsg__ava{width:44px;height:44px;border-radius:50%;flex:none;object-fit:cover;}
.vmsg__head b{display:block;font-size:15.5px;}
.vmsg__head small{display:block;font-size:13px;color:var(--muted);}
.vmsg__player{display:flex;align-items:center;gap:14px;background:var(--blue-soft);
  border:1px solid var(--blue-line);border-radius:99px;padding:10px 16px 10px 10px;}
.vmsg__play{
  flex:none;width:40px;height:40px;border-radius:50%;border:0;cursor:pointer;
  background:var(--blue);color:#fff;display:grid;place-items:center;
  transition:transform .16s ease,background .16s ease;
}
/* Треугольник в круге зрительно тянет влево: сдвигаем его вправо на пиксель,
   иначе кнопка кажется набок. Плюс сама волна выравнивается по центру круга */
.vmsg__play svg{margin-left:2px;}
.vmsg__player{align-items:center;}
.vmsg__wave{align-self:center;}
.vmsg__play:hover{background:var(--blue-deep);}
.vmsg__play:active{transform:scale(.94);}
/* Дорожка звука рисуется полосками, а не картинкой: одна строка стилей
   вместо файла, и цвет меняется вместе с темой */
.vmsg__wave{flex:1;height:26px;background:
  repeating-linear-gradient(90deg,var(--blue) 0 2px,transparent 2px 6px);
  -webkit-mask:repeating-linear-gradient(90deg,#000 0 2px,transparent 2px 6px);
  opacity:.5;border-radius:2px;
  clip-path:polygon(0 42%,3% 30%,6% 55%,9% 18%,12% 62%,15% 35%,18% 8%,21% 48%,24% 25%,
    27% 60%,30% 15%,33% 52%,36% 30%,39% 68%,42% 22%,45% 45%,48% 12%,51% 58%,54% 33%,
    57% 70%,60% 25%,63% 50%,66% 18%,69% 62%,72% 38%,75% 28%,78% 55%,81% 20%,84% 48%,
    87% 32%,90% 60%,93% 25%,96% 44%,100% 36%,100% 100%,0 100%);}
.vmsg.is-playing .vmsg__wave{opacity:1;}
.vmsg__time{font-family:var(--mono);font-size:13px;font-weight:600;color:var(--blue-deep);
  flex:none;min-width:38px;text-align:right;}
.vmsg__note{margin-top:16px;font-size:14px;color:var(--muted);line-height:1.5;}

/* --- 16b. Управление агентом --------------------------------------------- */
/* Между карточками стоит «или»: без него три варианта читались как три
   шага, идущие один за другим */
.rules{display:flex;align-items:stretch;gap:0;}
.rules__or{
  flex:none;align-self:center;padding:0 16px;
  font-size:14px;font-weight:700;color:var(--muted-2);
}
.rule{flex:1;min-width:0;padding:30px 26px;border:1px solid var(--line);
  border-radius:var(--r-lg);background:var(--white);box-shadow:var(--shadow-sm);}
.rule__top{display:flex;align-items:center;gap:13px;margin-bottom:12px;}
.rule__i{
  display:grid;place-items:center;width:42px;height:42px;border-radius:13px;flex:none;
  background:var(--blue-soft);color:var(--blue);
}
.rule h3{margin:0;}
.rule h3{font-size:19px;margin-bottom:10px;}
.rule p{color:var(--muted);font-size:15.5px;}

/* --- 16c. Панель: текст слева, экран справа ------------------------------ */
.screens{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,560px);
  gap:56px;align-items:center;}
.screens__text .lead{margin-top:16px;}
.screens__switch{display:inline-flex;gap:6px;background:var(--surface-2);
  border-radius:99px;padding:5px;margin-top:30px;}
.screens__tab{
  display:inline-flex;align-items:center;gap:8px;border:0;cursor:pointer;
  background:transparent;color:var(--muted);border-radius:99px;
  padding:11px 20px;font-size:15px;font-weight:700;
  transition:background .18s ease,color .18s ease,box-shadow .18s ease;
}
.screens__tab:hover{color:var(--ink);}
.screens__tab.is-on{background:var(--white);color:var(--ink);box-shadow:var(--shadow-sm);}
.screens__note{margin-top:22px;max-width:44ch;font-size:15.5px;color:var(--muted);line-height:1.6;}
.screens__stage{display:flex;justify-content:center;}
.screen{margin:0;animation:screenIn .28s ease-out;}
/* display у figure сильнее атрибута hidden, и оба экрана показывались разом */
.screen[hidden]{display:none;}
@keyframes screenIn{from{opacity:0;transform:translateY(10px) scale(.985);}}
/* Рамка снимка: тень и скругление – чтобы читалось как экран, а не картинка */
.screen__frame{border:1px solid var(--line);border-radius:var(--r);overflow:hidden;
  background:var(--surface);box-shadow:var(--shadow-lg);}
.screen__frame img{width:100%;height:auto;display:block;}
.screen__frame--phone{max-width:310px;margin:0 auto;border-radius:var(--r-lg);}

/* --- 16d. Две дорожки на одной оси времени -------------------------------- */
/* Смысл блока – показать, что теряется, пока продавец занят. Поэтому дорожки
   горизонтальные и идут слева направо: это время, а не список дел */
.track{display:flex;flex-direction:column;gap:22px;}
.track__row{display:flex;align-items:center;gap:22px;padding:24px 26px;
  border:1px solid var(--line);border-radius:var(--r-lg);background:var(--white);}
.track__row--bad{background:var(--white);}
.track__row--good{border-color:var(--blue-line);background:var(--blue-soft);}
.track__side{flex:none;width:118px;font-size:15px;font-weight:800;color:var(--muted);}
.track__row--good .track__side{color:var(--blue-deep);}
.track__line{display:flex;flex:1;min-width:0;gap:0;counter-reset:none;}
/* Ось идёт над подписями, а не сквозь них: линия по центру текста
   перечёркивала первую строку */
.track__line li{position:relative;flex:1;min-width:0;padding:26px 14px 0 0;}
.track__line li::before{content:'';position:absolute;left:0;top:0;width:12px;height:12px;
  border-radius:50%;background:var(--line-2);border:2px solid var(--white);z-index:1;}
.track__line li::after{content:'';position:absolute;left:6px;top:5px;right:0;height:2px;
  background:var(--line);}
.track__line li:last-child::after{display:none;}
.track__row--good .track__line li::before{background:var(--blue);}
.track__row--good .track__line li::after{background:var(--blue-line);}
.track__line b{display:block;font-size:15px;font-weight:700;line-height:1.3;}
.track__line span{display:block;font-size:13.5px;color:var(--muted);margin-top:3px;}
.track__row--good .track__line span{color:var(--blue-deep);opacity:.85;}
.track__row--bad .track__end::before{background:var(--muted-2);}

/* --- Проигрывание дорожек ------------------------------------------------
   Скрытое состояние живёт ТОЛЬКО под .is-live, а этот класс ставит скрипт
   прямо перед показом. Если скрипта нет, наблюдатель не сработал или что-то
   упало – дорожки просто видны целиком. Прятать текст по умолчанию и ждать
   милости от JavaScript на продающей странице нельзя */
.track.is-live .track__line li::after{transform:scaleX(0);transform-origin:left center;
  transition:transform .55s ease,background .3s ease;}
.track.is-live .track__line li.is-on::after{transform:scaleX(1);}
.track.is-live .track__line li::before{transform:scale(.55);opacity:.5;
  transition:transform .3s cubic-bezier(.3,1.5,.5,1),opacity .3s ease,background .3s ease;}
.track.is-live .track__line li.is-on::before{transform:scale(1);opacity:1;}
/* Подписи не прячутся никогда. Анимируются только линия, точка и галочка –
   то, что несёт смысл движения. Прятать текст ради красивого появления
   значит поставить содержание страницы в зависимость от таймеров */

/* Срыв: последний шаг верхней дорожки краснеет, и линия к нему рвётся */
.track__row--bad .track__end.is-on::before{background:var(--stop);}
.track__row--bad .track__end.is-on b{color:var(--stop);}
.track__row--bad li:nth-last-child(2).is-on::after{
  background:repeating-linear-gradient(90deg,var(--stop) 0 5px,transparent 5px 10px);}

/* Галочка у каждого выполненного шага нижней дорожки */
.track__row--good .track__tick{
  position:absolute;left:-1px;top:-1px;width:14px;height:14px;border-radius:50%;
  background:var(--blue) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='9' viewBox='0 0 11 11'%3E%3Cpath d='M1.5 5.6l2.6 2.6L9.5 2.8' stroke='white' stroke-width='2' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/9px no-repeat;
  z-index:2;}
.track.is-live .track__row--good .track__tick{opacity:0;transform:scale(.4);}
.track.is-live .track__row--good .is-on .track__tick{
  opacity:1;transform:scale(1);
  transition:opacity .3s ease .35s,transform .3s cubic-bezier(.3,1.6,.5,1) .35s;}

/* --- 17a. Тарифы --------------------------------------------------------- */
/* Три карточки в ряд, средняя приподнята: выбор из трёх с явным средним –
   самая читаемая форма прайса, глаз идёт к выделенному и сравнивает
   с соседями. На узком экране порядок ставит выделенный первым */
/* stretch, а не start: при разной длине списков кнопки «выбрать» вставали
   на трёх разных высотах, и блок выглядел незаверстанным. Теперь карточки
   одной высоты, а выделенный тариф выступает за счёт своих отступов */
.plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;align-items:stretch;}
.plan{
  position:relative;display:flex;flex-direction:column;
  padding:32px 28px;border:1px solid var(--line);border-radius:var(--r-lg);
  background:var(--white);box-shadow:var(--shadow-sm);
}
/* Выделенный тариф крупнее не размером шрифта, а воздухом и тенью:
   поднимать кегль пришлось бы во всех трёх, иначе колонки разъезжаются */
.plan--pop{
  border-color:var(--blue-line);box-shadow:var(--shadow-lg);
  padding-top:38px;padding-bottom:38px;margin-top:-10px;
}
.plan__badge{
  position:absolute;top:-13px;left:28px;
  font-family:var(--sans);font-size:12.5px;font-weight:700;letter-spacing:0;
  padding:6px 13px;border-radius:99px;
  background:var(--blue);color:#fff;box-shadow:0 8px 20px -10px rgba(27,92,255,.8);
}
.plan__name{font-size:22px;font-weight:800;letter-spacing:-.02em;}
.plan__for{font-size:14px;color:var(--muted);margin-top:8px;min-height:42px;}
.plan__price{display:flex;align-items:baseline;gap:8px;margin-top:22px;}
.plan__sum{font-size:clamp(30px,3vw,38px);font-weight:800;letter-spacing:-.035em;line-height:1;}
/* «По согласованию» вместо цифры: тем же кеглем оно ломало строку, а рядом
   с двумя суммами выглядело ценой */
.plan__sum--talk{font-size:24px;letter-spacing:-.02em;}
.plan__per{font-size:14px;color:var(--muted);font-weight:600;}
.plan__answers{
  margin-top:14px;display:inline-flex;align-items:center;align-self:flex-start;gap:8px;
  font-family:var(--sans);font-size:13px;font-weight:700;letter-spacing:0;
  background:var(--blue-soft);color:var(--blue-deep);
  border:1px solid var(--blue-line);border-radius:99px;padding:7px 13px;
}
.plan__list{margin:24px 0 26px;display:flex;flex-direction:column;gap:11px;}
.plan__list li{position:relative;padding-left:27px;font-size:15px;line-height:1.45;}
/* Галочка нарисована фоном, а не символом: символ переносится вместе
   с текстом и уезжает от строки при переносе на вторую */
.plan__list li::before{
  content:'';position:absolute;left:0;top:3px;width:17px;height:17px;border-radius:50%;
  background:var(--green-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='11' viewBox='0 0 11 11'%3E%3Cpath d='M1.5 5.6l2.6 2.6L9.5 2.8' stroke='%2312A05B' stroke-width='1.8' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/11px no-repeat;
}
.plan .btn{margin-top:auto;}
.plans__foot{
  margin-top:34px;display:flex;flex-wrap:wrap;gap:10px 26px;align-items:center;
  justify-content:center;text-align:center;
}
.plans__foot .note{max-width:none;}

/* --- 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 + форма ------------------------------------------- */
/* Карточка с живым фоном. Холст лежит нижним слоем, вуаль поверх него
   держит контраст текста, содержимое – ещё выше */
.shine{
  position:relative;overflow:hidden;isolation:isolate;
  border-radius:var(--r-xl);color:#fff;
  padding:56px 52px 60px;
  background:linear-gradient(135deg,#0F3FCC 0%,#1B5CFF 45%,#4A7AFF 100%);
}
.shine__canvas{position:absolute;inset:0;z-index:0;width:100%;height:100%;display:block;
  opacity:0;transition:opacity .9s ease;}
.shine__canvas.on{opacity:1;}
.shine.no-gl .shine__canvas{display:none;}
.shine__veil{position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(to bottom,rgba(4,10,60,.20) 0%,rgba(4,10,60,.10) 40%,rgba(3,6,44,.50) 100%);}
.shine > .final{position:relative;z-index:2;}
.shine .eyebrow{color:#BFD0FF;}
.shine h2{color:#fff;}
.shine .lead{color:rgba(255,255,255,.86);}
/* Плашки внутри карточки: стекло вместо белого, иначе они спорят с фоном */
.shine .final__card{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.22);
  color:#fff;backdrop-filter:blur(10px);}
.shine .final__card .tag{background:rgba(255,255,255,.16);color:#fff;}
.shine .final__card .tag--live{background:rgba(255,255,255,.9);color:var(--green);}

.final{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,450px);gap:56px;align-items:start;}
.final h2{font-size:clamp(32px,4.4vw,56px);margin:16px 0 18px;}
.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;color:var(--ink);}
.form__row input,.form__row textarea,.form__row select{
  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;
  color:var(--ink);font-family:inherit;
  transition:border-color .18s ease,background .18s ease;
}
.form__row textarea{min-height:96px;resize:vertical;line-height:1.5;}
/* Свою стрелку рисуем сами: системный вид списка выбивается из остальных полей */
.form__row select{
  appearance:none;-webkit-appearance:none;cursor:pointer;padding-right:44px;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9' fill='none'%3E%3Cpath d='M1 1l6 6 6-6' stroke='%236B7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 16px center;
}
.form__row input:focus,.form__row textarea:focus,.form__row select:focus{
  border-color:var(--blue);background-color:#fff;outline:none;}
.form__row input::placeholder,.form__row textarea::placeholder{color:var(--muted-2);font-weight:500;}
/* Пока ничего не выбрано, список выглядит как подсказка, а не как ответ.
   :invalid тут не подошёл бы – поле не обязательное и невалидным не бывает */
.form__row select:has(option[value=""]:checked){color:var(--muted-2);}
.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;color:var(--ink);}
.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;}  .sec{padding:92px 0;}
}
@media (max-width:1024px){
  .shine{padding:40px 28px 44px;border-radius:var(--r-lg);}
  .final{grid-template-columns:minmax(0,1fr);gap:34px;}
  .figs__row{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 20px;}
  .setup{grid-template-columns:minmax(0,1fr);gap:34px;}
  /* На узком экране «или» встаёт отдельной строкой между карточками */
  .rules{flex-direction:column;}
  .rules__or{padding:12px 0;}
  .screens{grid-template-columns:minmax(0,1fr);gap:34px;}
  .screen__frame--phone{max-width:280px;}
  .screens__tab{padding:10px 16px;font-size:14px;}
  .plans{grid-template-columns:minmax(0,1fr);gap:18px;max-width:520px;margin:0 auto;}
  /* Выделенный первым: на узком экране до него иначе надо прокручивать */
  .plan--pop{order:-1;margin-top:0;}
  .plan__for{min-height:0;}
  :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;}  .econ{padding:36px;gap:32px;}
  .adv{grid-template-columns:repeat(2,minmax(0,1fr));}
  .who{grid-template-columns:repeat(2,minmax(0,1fr));}  .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;}  .adv,.who{grid-template-columns:minmax(0,1fr);}
  /* На телефоне ось разворачивается в столбец: горизонтальная в 375 точек
     превращается в четыре нечитаемых столбика */
  .track__row{flex-direction:column;align-items:flex-start;gap:14px;}
  .track__side{width:auto;}
  .track__line{flex-direction:column;gap:14px;}
  .track__line li{padding:0 0 0 26px;}
  .track__line li::before{top:3px;}
  .track__line li::after{left:5px;top:15px;right:auto;bottom:-14px;width:2px;height:auto;}
  .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__cta .btn{width:100%;}  .ba__punch{margin-top:34px;}
  .faq summary{padding:20px 2px;gap:14px;}  .ftr__in{gap:14px;}
  .ftr__in .note{width:100%;}
}
@media (max-width:400px){
  :root{--pad:16px;}  .chat__src{font-size:12px;}
  .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;}}

/* --- 20. Страница «Типы бизнеса» ------------------------------------------ */
.kinds{display:grid;grid-template-columns:repeat(auto-fit,minmax(272px,1fr));gap:18px;}
.kind{padding:26px 24px;border:1px solid var(--line);border-radius:var(--r-lg);
  background:var(--white);box-shadow:var(--shadow-sm);}
.kind h3{font-size:17.5px;margin-bottom:12px;}
/* Настоящий вопрос клиента – главное на карточке: по нему человек узнаёт себя */
.kind__q{font-size:15.5px;font-weight:700;color:var(--blue);margin-bottom:10px;}
.kind p:last-child{font-size:15px;color:var(--muted);line-height:1.55;}

/* --- 21. Счёт стоимости переписки ------------------------------------------ */
.calc{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.86fr);gap:22px;align-items:start;}
.calc__in{padding:30px 28px;border:1px solid var(--line);border-radius:var(--r-lg);
  background:var(--white);box-shadow:var(--shadow-sm);}
.calc__row{display:grid;grid-template-columns:1fr auto;align-items:baseline;
  column-gap:14px;margin-bottom:26px;}
.calc__row:last-child{margin-bottom:0;}
.calc__row span{font-size:15px;font-weight:700;}
.calc__row b{font-size:19px;font-weight:800;color:var(--blue);}
.calc__row input{grid-column:1 / -1;width:100%;margin-top:12px;accent-color:var(--blue);
  height:6px;cursor:pointer;}
.calc__out{padding:30px 28px;border-radius:var(--r-lg);color:#fff;
  background:linear-gradient(150deg,#1E3FBF 0%,var(--blue) 62%,#3B6BF0 100%);
  box-shadow:var(--shadow-lg);}
.calc__lbl{font-size:14px;font-weight:700;opacity:.78;}
.calc__lbl--2{margin-top:22px;}
.calc__big{font-size:clamp(38px,5vw,58px);font-weight:800;letter-spacing:-.04em;line-height:1.05;}
.calc__big--money{font-size:clamp(30px,4vw,44px);}
.calc__sub{font-size:14.5px;opacity:.78;margin-top:2px;}
.calc__note{font-size:14.5px;line-height:1.55;opacity:.9;margin:22px 0 20px;
  padding-top:20px;border-top:1px solid rgba(255,255,255,.22);}
.calc__out .btn--primary{background:#fff;color:var(--blue);}
.calc__out .btn--primary:hover{background:#F1F5FF;}

/* --- 22. Подвал ------------------------------------------------------------ */
.ftr__grid{display:grid;grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr));
  gap:34px;padding-bottom:34px;}
.ftr__about .brand{margin-bottom:14px;}
.ftr__about .note{max-width:34ch;}
.ftr__col{display:flex;flex-direction:column;gap:11px;}
.ftr__col h3{font-size:14px;font-weight:800;margin-bottom:3px;}
.ftr__col a{font-size:14.5px;color:var(--muted);}
.ftr__col a:hover{color:var(--blue);}
.ftr__end{display:flex;flex-wrap:wrap;gap:8px 26px;justify-content:space-between;
  padding-top:24px;border-top:1px solid var(--line);}

@media (max-width:860px){
  .calc{grid-template-columns:minmax(0,1fr);}
  .ftr__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;}
  .ftr__about{grid-column:1 / -1;}
}

/* --- 23. Автор ------------------------------------------------------------- */
.author{display:grid;grid-template-columns:minmax(0,.62fr) minmax(0,1fr);gap:40px;align-items:center;}
.author__text p:not(.eyebrow):not(.lead):not(.author__links){font-size:16px;line-height:1.65;
  color:var(--muted);margin-top:16px;max-width:56ch;}
.author__links{display:flex;flex-wrap:wrap;gap:22px;margin-top:22px;}
.author__links a{font-size:15px;font-weight:700;color:var(--blue);}
.author__ph{aspect-ratio:4 / 5;}

/* Заглушка под фотографию: видно, что место оставлено намеренно */
.ph{display:flex;align-items:center;justify-content:center;border-radius:var(--r-lg);
  border:1px dashed var(--line-2);background:linear-gradient(160deg,#F3F6FC,#E8EEFB);}
.ph__mark{font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--muted-2);}

.who__more{margin-top:30px;text-align:center;}
.who__more a{font-size:16px;font-weight:700;color:var(--blue);}

@media (max-width:860px){
  .author{grid-template-columns:minmax(0,1fr);gap:26px;}
  .author__ph{max-width:280px;}
}

/* ===================== ПРАВОВЫЕ ДОКУМЕНТЫ =====================
   Политика, согласия, оферта, cookie. Один стиль на все страницы: копия
   в каждом файле разъезжается при первой же правке, а документы обязаны
   выглядеть одинаково – по ним судят о том, всерьёз ли всё остальное */
.doc{max-width:760px;margin:0 auto;padding:56px 24px 90px}
.doc h1{font-size:clamp(28px,4vw,40px);margin-bottom:10px}
.doc h2{font-size:20px;margin:38px 0 12px}
.doc h3{font-size:17px;margin:24px 0 8px}
.doc p,.doc li{color:var(--ink-2);font-size:16px;line-height:1.65}
.doc ul{margin:10px 0 0;padding-left:0}
.doc li{position:relative;padding-left:20px;margin-bottom:8px}
.doc li::before{content:'';position:absolute;left:2px;top:10px;width:5px;height:5px;
  border-radius:50%;background:var(--blue)}
.doc .upd{color:var(--muted);font-size:14px;margin-bottom:8px}
.doc a{color:var(--blue);text-decoration:underline}
.doc .back{display:inline-flex;margin-bottom:28px;font-weight:700;color:var(--blue)}
.doc table{width:100%;border-collapse:collapse;margin-top:14px;font-size:15px}
.doc th,.doc td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);
  color:var(--ink-2);vertical-align:top}
.doc th{color:var(--ink);font-weight:700;font-size:14px}
/* На телефоне три колонки русского текста задыхаются: отступы съедают
   половину ширины, и каждое слово переносится по слогам */
@media (max-width:560px){
  .doc{padding:44px 16px 70px}
  .doc table{font-size:14px}
  .doc th,.doc td{padding:9px 7px}
  .doc th:first-child,.doc td:first-child{padding-left:0}
  .doc th:last-child,.doc td:last-child{padding-right:0}
}
/* Врезка для главного: то, ради чего документ читают */
.doc .key{margin:22px 0;padding:18px 20px;border-radius:14px;background:var(--blue-soft);
  border-left:4px solid var(--blue)}
.doc .key p{margin:0;color:var(--ink)}
.doc .key p + p{margin-top:10px}
/* Незаполненные реквизиты видно сразу, а не после жалобы */
.doc .todo{margin:22px 0;padding:16px 18px;border-radius:14px;
  background:var(--amber-soft);border-left:4px solid var(--amber);
  color:var(--amber);font-size:15px}
.doc__nav{display:flex;flex-wrap:wrap;gap:10px;margin:28px 0 0}
.doc__nav a{display:inline-flex;padding:9px 14px;border-radius:100px;
  background:var(--blue-soft);color:var(--blue);font-size:14px;font-weight:600;
  text-decoration:none}

/* Согласия под формой. Галочка, а не строчка «нажимая кнопку»: согласие
   должно быть действием, и это же действие потом придётся показывать */
.agree{display:flex;gap:11px;align-items:flex-start;margin:18px 0 0;cursor:pointer}
.agree input{flex:0 0 auto;width:20px;height:20px;margin:1px 0 0;accent-color:var(--blue);
  cursor:pointer}
.agree span{font-size:13.5px;line-height:1.5;color:var(--muted)}
.agree a{color:var(--blue);font-weight:700;text-decoration:underline}
.agree--soft span{color:var(--muted-2)}
/* Кнопка не должна наезжать на вторую строку согласия */
.agree + .btn{margin-top:22px}
.agree.is-missed span{color:var(--red,#D33)}
.agree.is-missed input{outline:2px solid var(--red,#D33);outline-offset:2px}

/* Подтверждение заявки: перечень того, что принято */
.receipt{width:100%;max-width:100%;min-width:0;margin:18px 0 0;text-align:left;border-top:1px solid var(--line)}
.receipt__row{display:flex;justify-content:space-between;gap:16px;min-width:0;
  padding:9px 0;border-bottom:1px solid var(--line);font-size:14px}
.receipt__row span{color:var(--muted);flex-shrink:0}
.receipt__row b{color:var(--ink);text-align:right;font-weight:700;min-width:0;overflow-wrap:anywhere}
@media(max-width:540px){.receipt__row{flex-direction:column;gap:4px}.receipt__row b{text-align:left}}
.receipt__note{margin-top:14px;text-align:left}
.receipt__note a{color:var(--blue);font-weight:700}

/* Баннер cookie. Внизу и узкий: он спрашивает, а не перекрывает страницу –
   модальное окно на входе люди закрывают не читая, лишь бы убрать */
.ckb{position:fixed;left:16px;right:16px;bottom:16px;z-index:60;
  display:flex;gap:18px;align-items:center;flex-wrap:wrap;
  max-width:840px;margin:0 auto;padding:16px 20px;border-radius:16px;
  background:var(--white);border:1px solid var(--line);
  box-shadow:0 18px 50px rgba(16,28,56,.16);
  opacity:0;transform:translateY(12px);transition:opacity .3s ease,transform .3s ease}
.ckb.is-in{opacity:1;transform:none}
.ckb__text{flex:1 1 320px;font-size:13.5px;line-height:1.5;color:var(--muted)}
.ckb__text a{color:var(--blue);font-weight:700}
.ckb__acts{display:flex;gap:10px;align-items:center;flex:0 0 auto}
.ckb__yes{padding:11px 22px;font-size:14px}
.ckb__no{border:0;background:none;font:inherit;font-size:14px;color:var(--muted);
  cursor:pointer;padding:11px 6px;text-decoration:underline}
.ckb__no:hover{color:var(--ink)}
@media (max-width:600px){.ckb{left:10px;right:10px;bottom:10px;padding:14px 16px}
  .ckb__acts{width:100%}.ckb__yes{flex:1}}
@media (prefers-reduced-motion:reduce){.ckb{transition:none}}

/* ===================== ВАШИ ДАННЫЕ =====================
   Возражение «уведёте клиентов» снимается цифрой и сроком, а не обещанием.
   Поэтому карточка начинается с числа, а не с заголовка */
/* Пять карточек в ряд: пятая, упавшая на вторую строку в одиночестве,
   читается как «забыли убрать», а не как довод */
.safe{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(205px,1fr));
  margin-top:34px}
.safe__i{padding:22px 20px;border-radius:18px;background:var(--white);
  border:1px solid var(--line)}
.safe__n{display:inline-block;padding:5px 12px;border-radius:100px;
  background:var(--blue-soft);color:var(--blue);
  font-size:13px;font-weight:800;letter-spacing:.01em;margin-bottom:14px}
.safe__i h3{font-size:16px;font-weight:700;letter-spacing:-.01em;margin:0 0 8px}
.safe__i p{font-size:14px;line-height:1.6;color:var(--muted);margin:0}
.safe__note{margin-top:26px;padding:22px 24px;border-radius:18px;
  background:var(--surface);border-left:4px solid var(--blue)}
.safe__note p{font-size:15px;line-height:1.65;color:var(--ink-2);margin:0}
.safe__note p + p{margin-top:12px}
.safe__note a{color:var(--blue);font-weight:700}

/* Landing refinement: scoped to preserve the cabinet and document pages. */
.landing-page{--muted-2:#657187;}
.landing-page .rv{opacity:1;transform:none;}
.landing-page .hero{padding:64px 0 72px;}
.landing-page .hero h1{font-size:clamp(40px,4.6vw,66px);line-height:1.08;}
.landing-page .hero__accent{color:var(--blue);}
.landing-page .hero .lead{max-width:42ch;}
.landing-page .hero__cta{gap:10px;margin-top:28px;}
.landing-page .hero__signals{margin-top:22px;}
.landing-page .chat--demo .chat__body{min-height:270px;height:300px;max-height:300px;scroll-behavior:auto;}
.landing-page .chat__caption{padding:12px 18px 0;font-size:12px;line-height:1.5;color:var(--muted);}
.landing-page .chat__asks{grid-template-columns:repeat(2,minmax(0,1fr));}
.landing-page .ask{min-height:44px;white-space:normal;}
.landing-page .rules{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;}
.landing-page .setup__example{border-left:2px solid var(--blue);padding:4px 0 4px 28px;}
.landing-page .setup__example h3{font-size:23px;line-height:1.3;margin:10px 0 24px;}
.landing-page .setup__example dl{margin:0;}
.landing-page .setup__example dl div{padding:16px 0;border-top:1px solid var(--line);}
.landing-page .setup__example dt{font-weight:750;}
.landing-page .setup__example dd{margin:5px 0 0;color:var(--muted);font-size:15px;}
.landing-page .setup__example .note{margin-top:12px;}
.landing-page .safe{grid-template-columns:repeat(3,minmax(0,1fr));}
.landing-page .author{grid-template-columns:240px minmax(0,1fr);gap:52px;}
.landing-page .author__monogram{aspect-ratio:1;border-radius:32px;background:var(--blue);color:white;padding:28px;display:flex;flex-direction:column;justify-content:space-between;}
.landing-page .author__monogram>span{font-size:76px;font-weight:800;letter-spacing:-.05em;line-height:1;}
.landing-page .author__monogram small{font-size:14px;line-height:1.5;}
.landing-page .form__optional{margin:4px 0 22px;border-block:1px solid var(--line);padding:16px 0;}
.landing-page .form__optional summary{cursor:pointer;font-size:14px;font-weight:700;color:var(--ink);}
.landing-page .form__optional summary span{font-weight:500;color:var(--muted);margin-left:6px;}
.landing-page .form__optional[open] summary{margin-bottom:20px;}
.landing-page .form__selection{background:var(--blue-soft);border-radius:12px;padding:12px 14px;color:var(--blue-deep);font-size:14px;font-weight:700;margin-bottom:20px;}
.landing-page [aria-invalid="true"]{border-color:#C02A2A;}
.landing-page .form__body[aria-busy="true"] #f-submit::before{content:'';width:16px;height:16px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:landing-send .8s linear infinite;}
@keyframes landing-send{to{transform:rotate(360deg);}}
@media(max-width:1024px){.landing-page .rules{grid-template-columns:1fr;}.landing-page .safe{grid-template-columns:1fr;}}
@media(max-width:860px){.landing-page .hero{padding:40px 0 56px;}.landing-page .hero__in{gap:32px;}.landing-page .author{grid-template-columns:1fr;gap:28px;}.landing-page .author__monogram{width:200px;}.landing-page .screens__stage{min-width:0;}}
@media(max-width:540px){.landing-page .hero h1{font-size:clamp(36px,10vw,46px);}.landing-page .hero .lead{font-size:17px;}.landing-page .hero__cta{margin-top:22px;}.landing-page .hero__cta .btn--ghost{background:transparent;border-color:transparent;}.landing-page .chat--demo .chat__body{height:290px;max-height:290px;min-height:0;}.landing-page .form{padding:24px 18px;}.landing-page .final{padding:28px 16px;}.landing-page .setup__example{padding-left:20px;}}
@media(prefers-reduced-motion:reduce){.landing-page .form__body[aria-busy="true"] #f-submit::before{animation:none;}}
.landing-page .rules{display:grid;}
.landing-page .screens__stage{flex-direction:column;align-items:center;}
.landing-page .screens__stage>.note{text-align:center;}

.landing-page .shine{background:#164ADB;}
.landing-page .chat__asks{display:grid;}
@media(max-width:540px){.landing-page .shine{padding:30px 18px;}.landing-page .final{padding:0;}.landing-page .final__vis{display:none;}.landing-page .hero__signals .signal{font-size:12px;}.landing-page .hero__signals{gap:8px;}.landing-page .chat__asks{gap:8px;}.landing-page .ask{font-size:12px;padding:10px;}}

/* Home page composition. Shared legal and business pages keep their own layout. */
.landing-home{--max:1320px;--bg:#fbfcfe;--muted-2:#657187}
.landing-home .hdr{background:var(--white);backdrop-filter:none;border-color:var(--line)}
.landing-home .hdr__in{height:84px;gap:24px}
.landing-home .brand__mark{width:40px;height:40px}
.landing-home .brand{font-size:19px}
.landing-home .nav{gap:24px}
.landing-home .btn{min-height:54px;padding-inline:28px;box-shadow:none}
.landing-home .btn--sm{min-height:44px;padding-inline:22px}
.landing-home .hero{padding:76px 0 64px}
.landing-home .hero::before{background:var(--bg)}
.landing-home .hero__in{grid-template-columns:minmax(0,1.12fr) minmax(0,1fr);gap:48px;align-items:center}
.landing-home .hero h1{font-size:clamp(48px,5.6vw,80px);line-height:1.06;letter-spacing:-.04em;margin:26px 0}
.landing-home .hero .lead{max-width:43ch;font-size:18px;line-height:1.7}
.landing-home .hero__copy>.eyebrow{font-size:13px;border:1px solid var(--blue-line);padding:7px 12px;border-radius:100px;background:var(--white)}
.landing-home .hero__cta{margin-top:30px;gap:12px}
.landing-home .hero__signals{margin-top:24px;gap:12px;font-size:13px}
.landing-home .signal{border:0;padding:0;background:none;box-shadow:none;font-size:13px}
.landing-home .signal--muted{border-left:1px solid var(--line-2);border-radius:0;padding-left:12px}
.landing-home .dot--pulse{animation:none;box-shadow:none}
.landing-home .hero__demo-stage{background:var(--blue-soft);border-radius:34px;padding:26px;position:relative}
.landing-home .demo-label{display:flex;align-items:center;gap:10px;color:var(--blue-deep);font-weight:750;font-size:13px;margin-bottom:20px}
.landing-home .demo-label__mark{display:grid;place-items:center;width:30px;height:30px;background:var(--white);border-radius:50%;font-size:20px}
.landing-home .chat{border-color:var(--blue-line);border-radius:22px;box-shadow:0 18px 32px -24px #133ba866}
.landing-home .chat__bar{padding:16px 18px;background:var(--white)}
.landing-home .chat--demo .chat__body{height:290px;min-height:290px;max-height:290px;padding:20px 18px;background:var(--white)}
.landing-home .chat__who--ai{align-self:flex-end;text-align:right}
.landing-home .chat__caption{font-size:11px;padding:0 18px 14px;max-width:46ch}
.landing-home .chat__asks{background:var(--white);padding:14px;gap:8px}
.landing-home .ask{font-size:12px;padding:9px 12px;min-height:44px;border-color:var(--line)}
.landing-home .msg{font-size:14px;padding:12px 14px;max-width:91%;box-shadow:none}
.landing-home .demo-control{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:20px;font-size:11px;font-weight:650;color:var(--blue-deep)}
.landing-home .demo-control span+span::before{content:'→';margin-right:10px;color:var(--blue)}
.landing-home #numbers{padding:0 0 56px}
.landing-home .figs{background:none;border:0;border-radius:0;padding:24px 0 0;border-top:1px solid var(--line);box-shadow:none}
.landing-home .figs__since{margin-bottom:24px;text-align:left;color:var(--muted);font-size:13px}
.landing-home .figs__row{gap:24px}
.landing-home .fig{padding:0 24px 0 0;border-right:1px solid var(--line)}
.landing-home .fig:last-child{border:0}
.landing-home .fig__v{font-size:40px;line-height:1.1;letter-spacing:-.035em;color:var(--ink)}
.landing-home .fig__l{font-size:14px;margin-top:10px}
.landing-home .figs__note{margin-top:24px;text-align:left;font-size:12px}
.landing-home .sec{padding:96px 0}
.landing-home .sec-head{margin-bottom:44px;max-width:850px}
.landing-home .sec-head .eyebrow{margin-bottom:16px}
.landing-home .h2{font-size:clamp(32px,4.1vw,56px);line-height:1.12;letter-spacing:-.035em}
.landing-home #where{padding:64px 0 88px;background:var(--surface);border-block:1px solid var(--line)}
.landing-home .screens{display:block}
.landing-home .screens__text{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:0 64px;align-items:start}
.landing-home .screens__text>.eyebrow,.landing-home .screens__text>.h2,.landing-home .screens__text>.lead{grid-column:1}
.landing-home .screens__text>.eyebrow{margin-bottom:16px}
.landing-home .screens__text>.h2{max-width:13ch}
.landing-home .screens__switch{grid-column:2;grid-row:2;margin:0;justify-self:start;align-self:start;background:var(--white);border:1px solid var(--line)}
.landing-home .screens__tab{min-height:44px;color:var(--muted)}
.landing-home .screens__tab.is-on{background:var(--blue);color:var(--white);box-shadow:none}
.landing-home .screens__note{grid-column:2;grid-row:3;margin-top:16px;font-size:15px;max-width:38ch}
.landing-home .screens__stage{background:var(--blue-soft);border:1px solid var(--blue-line);border-radius:28px;margin-top:40px;padding:28px 40px 36px;min-height:640px;justify-content:flex-start}
.landing-home .screens__stage>.note{font-size:12px;margin-bottom:22px!important}
.landing-home .screen{width:100%;max-width:1056px;animation:none}
.landing-home .screen__frame{border-radius:16px;background:white;box-shadow:0 24px 38px -30px #14315f55}
.landing-home #screen-desk .screen__frame{max-width:900px;margin:auto}
.landing-home .screen__frame--phone{max-width:260px}
.landing-home .setup{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:80px;align-items:start}
.landing-home .setup__steps{gap:0;counter-reset:none}
.landing-home .setup__step{padding:24px 0;border-top:1px solid var(--line);gap:20px}
.landing-home .setup__num{width:40px;height:40px;background:var(--blue-soft);color:var(--blue);font-size:16px}
.landing-home .setup__step h3{font-size:20px;line-height:1.3;margin:5px 0 10px}
.landing-home .setup__step p{font-size:15px;line-height:1.75;max-width:52ch}
.landing-home .setup__example{border:1px solid var(--blue-line);border-radius:26px;padding:32px;background:var(--blue-soft)}
.landing-home .setup__example h3{font-size:28px;max-width:16ch;margin:14px 0 24px;letter-spacing:-.025em}
.landing-home .setup__example dl div{padding:18px 0;border-color:var(--blue-line)}
.landing-home .setup__example dt{font-size:14px}.landing-home .setup__example dd{font-size:14px;line-height:1.65}
.landing-home #modes{background:var(--white)}
.landing-home .rules{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:0 48px}
.landing-home .rule{border:0;border-radius:0;background:none;box-shadow:none;padding:26px 0}
.landing-home .rule:first-child{grid-row:span 2;background:var(--blue-soft);border-radius:26px;padding:36px}
.landing-home .rule:nth-child(2){border-bottom:1px solid var(--line);padding-top:6px}
.landing-home .rule__top{align-items:flex-start;gap:16px;margin:0 0 16px}
.landing-home .rule__i{background:none;width:24px;height:24px;border-radius:0}
.landing-home .rule h3{font-size:22px;line-height:1.25;letter-spacing:-.025em;margin:0}
.landing-home .rule:first-child .rule__top{display:block}
.landing-home .rule:first-child .rule__i{margin-bottom:28px;width:48px;height:48px;background:var(--white);border-radius:14px}
.landing-home .rule:first-child h3{font-size:32px;max-width:16ch;margin-bottom:20px}
.landing-home .rule p{font-size:16px;line-height:1.7}
.landing-home #value{background:var(--surface);border-top:1px solid var(--line)}
.landing-home .adv{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 64px;background:none;border:0;padding:0}
.landing-home .adv__i{border:0;border-top:1px solid var(--line-2);border-radius:0;padding:28px 0;background:none}
.landing-home .adv__top{gap:14px}.landing-home .adv__i p{font-size:15px;max-width:48ch;line-height:1.7}
.landing-home .econ{margin-top:44px;background:var(--white);border:1px solid var(--line);border-radius:26px;box-shadow:none;padding:40px;gap:64px}
.landing-home .econ__fig{color:var(--blue);font-size:64px;letter-spacing:-.04em}
.landing-home .econ__row{animation:none}.landing-home .econ__foot{color:var(--muted);max-width:50ch}
.landing-home #safety{background:var(--white)}
.landing-home .safe{gap:32px;margin-top:0}
.landing-home .safe__i{border:0;border-top:1px solid var(--line);border-radius:0;padding:24px 0;background:none}
.landing-home .safe__n{padding:0;background:none;font-size:13px;margin-bottom:20px}
.landing-home .safe__i h3{font-size:20px;line-height:1.3;margin-bottom:12px}
.landing-home .safe__note{border:0;padding:24px 28px;margin-top:24px}
.landing-home #pricing{background:var(--blue-soft)}
.landing-home #pricing .sec-head{max-width:840px!important}
.landing-home .term{margin-bottom:42px}
.landing-home .plans{gap:20px;align-items:stretch}
.landing-home .plan{padding:32px 28px;border-radius:24px;box-shadow:none}
.landing-home .plan--pop{margin:0;border:2px solid var(--blue);padding:31px 27px;background:var(--white);box-shadow:0 18px 36px -28px #1b5cff66}
.landing-home .plan__badge{top:-16px;left:24px;font-size:12px;padding:7px 14px;box-shadow:none}
.landing-home .plan__name{font-size:26px}.landing-home .plan__for{min-height:46px;line-height:1.6}
.landing-home .plan__sum{font-size:44px;letter-spacing:-.035em}.landing-home .plan__sum--talk{font-size:29px;line-height:1.2}
.landing-home .plan__price{flex-wrap:wrap;gap:6px 10px;min-height:54px;align-items:baseline}
.landing-home .plan__list{border-top:1px solid var(--line);padding-top:24px;margin-top:24px}
.landing-home .plan__list li{font-size:14px;line-height:1.65;margin-bottom:12px}
.landing-home .plans__foot{display:grid;grid-template-columns:1fr 1fr;gap:8px 32px;text-align:left;margin-top:26px}
.landing-home #compare{background:var(--white)}
.landing-home .track__row{box-shadow:none;border-radius:20px}
.landing-home .ba__punch{font-size:clamp(26px,3vw,40px);line-height:1.35;letter-spacing:-.025em;max-width:800px;margin:48px auto 0}
.landing-home #author{background:var(--surface);border:0}
.landing-home .author{grid-template-columns:260px minmax(0,1fr);gap:72px;max-width:1040px;margin:auto}
.landing-home .author__monogram{border-radius:26px;aspect-ratio:1;box-shadow:none}
.landing-home .author__text>p:not(.eyebrow){max-width:65ch;line-height:1.75}
.landing-home #faq{background:var(--white);border:0}
.landing-home #faq>.wrap{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1fr);gap:80px}
.landing-home #faq .sec-head{margin:0;max-width:330px;text-align:left}
.landing-home .faq{max-width:none;width:100%;margin:0}
.landing-home .faq summary{font-size:17px;padding:24px 0;line-height:1.5;gap:20px}
.landing-home .faq__a{font-size:15px;line-height:1.75}
.landing-home #start{padding:24px 0 80px}
.landing-home .shine{border-radius:32px;background:var(--blue);padding:56px}
.landing-home .final{grid-template-columns:minmax(0,1fr) minmax(0,440px);gap:56px}
.landing-home .final h2{font-size:clamp(34px,3.8vw,52px);line-height:1.15;letter-spacing:-.035em}
.landing-home .final__card{backdrop-filter:none;background:#ffffff14;box-shadow:none;transform:none!important}
.landing-home .form{border-radius:22px;box-shadow:none;padding:28px;color:var(--ink)}
.landing-home .form__optional summary{min-height:44px;display:flex;flex-wrap:wrap;align-items:center;gap:4px}
.landing-home .agree span{font-size:12px;line-height:1.7}.landing-home .form__note{font-size:12px;line-height:1.6}
.landing-home .form__optional{padding-block:4px}
.landing-home .form__err{overflow-wrap:anywhere}
.landing-home .screen,.landing-home .track *, .landing-home .econ *{animation:none}
@media(max-width:1120px){
 .landing-home .hero__in{gap:32px;grid-template-columns:1fr 1fr}.landing-home .hero h1{font-size:60px}.landing-home .hero__demo-stage{padding:20px}.landing-home .hero__cta .btn{font-size:14px;padding-inline:22px}
 .landing-home .nav{gap:16px}.landing-home .nav a{font-size:13px}.landing-home .hdr__in{gap:18px}.landing-home .brand{font-size:17px}
 .landing-home .screens__text{gap:0 40px;grid-template-columns:1fr 340px}.landing-home .screens__stage{min-height:0}
 .landing-home .setup{gap:44px}.landing-home .rules{gap:0 32px}.landing-home .rule:first-child{padding:28px}.landing-home .rule:first-child h3{font-size:28px}
 .landing-home .safe{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.landing-home .plans{gap:14px}.landing-home .plan{padding:28px 22px}.landing-home .plan--pop{padding:27px 21px}.landing-home .plan__sum{font-size:36px}.landing-home .plan__sum--talk{font-size:25px}
 .landing-home .final{gap:32px;grid-template-columns:1fr 1fr}.landing-home .shine{padding:40px}.landing-home #faq>.wrap{gap:48px}
}
@media(max-width:860px){
 .landing-home .hdr__in{height:72px}.landing-home .hero{padding:40px 0 48px}.landing-home .hero__in{grid-template-columns:1fr;gap:36px}.landing-home .hero h1{font-size:64px}.landing-home .hero__copy{max-width:620px}.landing-home .hero .lead{max-width:48ch}.landing-home .hero__demo-stage{max-width:600px;width:100%;justify-self:center;padding:24px}.landing-home .chat--demo .chat__body{height:270px;min-height:270px;max-height:270px}
 .landing-home .sec{padding:72px 0}.landing-home #numbers{padding:0 0 40px}.landing-home .fig__v{font-size:34px}.landing-home .figs__row{gap:18px}.landing-home .fig{padding-right:12px}
 .landing-home #where{padding:56px 0}.landing-home .screens__text{grid-template-columns:1fr;gap:0}.landing-home .screens__text>.h2{max-width:16ch}.landing-home .screens__switch,.landing-home .screens__note{grid-column:1;grid-row:auto;margin-top:24px}.landing-home .screens__stage{padding:24px;min-height:0;margin-top:28px}.landing-home .screen__frame--phone{max-width:280px}
 .landing-home .setup{grid-template-columns:1fr;gap:28px}.landing-home .setup__example{padding:28px}.landing-home .setup__example h3{max-width:none}.landing-home .rules{grid-template-columns:1fr;gap:24px}.landing-home .rule:first-child{grid-row:auto;padding:32px}.landing-home .rule:first-child h3{max-width:24ch}.landing-home .rule:nth-child(2){padding-top:12px}.landing-home .rule:last-child{padding-block:0}
 .landing-home .adv{gap:0 32px}.landing-home .safe{grid-template-columns:1fr;gap:0}.landing-home .safe__i{padding:24px 0}.landing-home .safe__n{margin-bottom:12px}.landing-home .safe__note{margin-top:12px}
 .landing-home .plans{grid-template-columns:1fr;gap:28px}.landing-home .plan{padding:28px;order:initial}.landing-home .plan--pop{padding:27px;order:initial}.landing-home .plan__price{min-height:0}.landing-home .plan__for{min-height:0}.landing-home .plans__foot{grid-template-columns:1fr}
 .landing-home .author{grid-template-columns:180px 1fr;gap:32px}.landing-home .author__monogram{width:180px;padding:24px}.landing-home .author__monogram>span{font-size:60px}
 .landing-home #faq>.wrap{grid-template-columns:1fr;gap:28px}.landing-home #faq .sec-head{max-width:none}
 .landing-home .final{grid-template-columns:1fr;gap:32px}.landing-home .final__vis{display:none}.landing-home .shine{padding:36px}.landing-home .form{max-width:600px;width:100%}.landing-home #start{padding:0 0 56px}
}
@media(max-width:540px){
 .landing-home{--pad:20px}.landing-home .hdr__in{height:68px;gap:12px}.landing-home .brand{font-size:16px;gap:9px}.landing-home .brand__mark{width:34px;height:34px}
 .landing-home .hero{padding:30px 0 40px}.landing-home .hero h1{font-size:clamp(38px,10.7vw,56px);line-height:1.08;margin:22px 0}.landing-home .hero__copy>.eyebrow{font-size:10px;padding:6px 10px}.landing-home .hero .lead{font-size:16px;line-height:1.7}.landing-home .hero__cta{gap:8px;margin-top:24px}.landing-home .hero__cta .btn{font-size:14px;width:auto;min-height:48px;padding-inline:18px}.landing-home .hero__cta .btn--ghost{border-color:var(--line-2);background:var(--white)}
 .landing-home .hero__signals{gap:10px;line-height:1.5}.landing-home .hero__signals .signal{font-size:11px}.landing-home .hero__in{gap:28px}.landing-home .hero__demo-stage{padding:16px;border-radius:24px}.landing-home .demo-label{font-size:11px;margin-bottom:14px;gap:8px}.landing-home .demo-label__mark{width:26px;height:26px;font-size:18px}.landing-home .chat{border-radius:16px}.landing-home .chat__bar{padding:14px 12px}.landing-home .chat__src{font-size:11px}.landing-home .chat__status{font-size:10px}.landing-home .chat--demo .chat__body{height:285px;min-height:285px;max-height:285px;padding:16px 12px}.landing-home .msg{font-size:13px;padding:10px 12px;max-width:94%}.landing-home .chat__who{font-size:10px}.landing-home .chat__caption{font-size:10px;padding:0 12px 12px}.landing-home .chat__asks{padding:12px;gap:6px}.landing-home .ask{font-size:11px;padding:8px;line-height:1.45}.landing-home .demo-control{font-size:9px;gap:4px;margin-top:14px}.landing-home .demo-control span+span::before{margin-right:4px}
 .landing-home .sec{padding:56px 0}.landing-home .sec-head{margin-bottom:30px}.landing-home .h2{font-size:34px;line-height:1.14}.landing-home .sec-head .lead{font-size:16px;margin-top:16px}.landing-home .sec-head .eyebrow{margin-bottom:12px}
 .landing-home .figs__row{grid-template-columns:1fr 1fr;gap:24px 18px}.landing-home .fig{border:0;padding:0}.landing-home .fig__v{font-size:34px}.landing-home .fig__l{font-size:12px}.landing-home .figs__since,.landing-home .figs__note{font-size:11px}.landing-home #where{padding:48px 0}.landing-home .screens__stage{padding:16px;border-radius:22px}.landing-home .screens__stage>.note{font-size:10px}.landing-home .screen__frame{border-radius:10px}.landing-home .screens__tab{font-size:13px;padding:10px 16px}.landing-home .screens__note{font-size:14px;line-height:1.7}.landing-home .screens__text .lead{font-size:16px}
 .landing-home .setup__step{gap:14px;padding:20px 0}.landing-home .setup__num{width:32px;height:32px;font-size:14px}.landing-home .setup__step h3{font-size:18px}.landing-home .setup__step p{font-size:14px}.landing-home .setup__example{padding:24px;border-radius:22px}.landing-home .setup__example h3{font-size:25px}.landing-home .rule:first-child{padding:26px;border-radius:22px}.landing-home .rule:first-child h3{font-size:27px}.landing-home .rule h3{font-size:21px}.landing-home .rule p{font-size:14px}
 .landing-home .adv{grid-template-columns:1fr}.landing-home .adv__i{padding:24px 0}.landing-home .adv__top h3{font-size:19px}.landing-home .adv__i p{font-size:14px}.landing-home .econ{padding:26px 22px;gap:24px;grid-template-columns:1fr;margin-top:24px}.landing-home .econ__fig{font-size:54px}.landing-home .econ__vis{width:100%;max-width:100%}.landing-home .econ__online{flex-wrap:wrap;gap:6px}.landing-home .safe__note{padding:20px}.landing-home .safe__note p{font-size:14px}
 .landing-home .plan{padding:28px 24px}.landing-home .plan--pop{padding:27px 23px}.landing-home .plan__sum{font-size:40px}.landing-home .plan__sum--talk{font-size:27px}.landing-home .plan__price{gap:8px}.landing-home .plan__for{font-size:13px}.landing-home .plans__foot .note{font-size:12px}
 .landing-home .author{grid-template-columns:1fr;gap:28px}.landing-home .author__monogram{width:160px;padding:20px;border-radius:22px}.landing-home .author__monogram small{font-size:12px}.landing-home .author__text>p:not(.eyebrow){font-size:15px}.landing-home .faq summary{font-size:16px;padding:22px 0}.landing-home .faq__a{font-size:14px}
 .landing-home .shine{padding:28px 18px;border-radius:24px}.landing-home .final{padding:0;gap:28px}.landing-home .final h2{font-size:34px;margin-top:14px}.landing-home .final .lead{font-size:16px}.landing-home .form{padding:22px 18px;border-radius:18px}.landing-home .form__row input,.landing-home .form__row select{padding:12px}.landing-home .form__optional summary{font-size:13px}.landing-home .form__optional summary span{margin:0}.landing-home .agree span{font-size:11px}.landing-home .form .btn{font-size:14px;padding-inline:16px}.landing-home .form__note{font-size:11px}
}
@media(max-width:360px){.landing-home{--pad:16px}.landing-home .hero__cta{flex-direction:column}.landing-home .hero__cta .btn{width:100%}.landing-home .hero__signals{gap:8px}.landing-home .signal--muted{border:0;padding-left:0}.landing-home .hero__demo-stage{padding:12px}.landing-home .demo-control{font-size:8px}.landing-home .screens__tab{padding-inline:13px}.landing-home .h2{font-size:30px}.landing-home .shine{padding:24px 14px}.landing-home .final h2{font-size:30px}.landing-home .form{padding:20px 14px}}
@media(prefers-reduced-motion:reduce){.landing-home *{scroll-behavior:auto!important}.landing-home .msg,.landing-home .btn,.landing-home .screen{transition:none;animation:none}}
.landing-home{--green:#087c3e}
.landing-home .figs__note{margin-left:0;margin-right:0}
.landing-home .econ__online{background:var(--blue-soft);color:var(--blue-deep);border:1px solid var(--blue-line)}
.landing-home .econ__online span:last-child{color:var(--blue-deep)}