/* Общие решения редизайна страниц услуг AVAT (поверх /shared-assets/avat-service.css эталона ИИ-агентов).
   Подключать на каждой странице услуги в новом дизайне после avat-service.css, до файла самой страницы.
   Здесь то, что согласовано на странице «Сайты и лендинги» и повторяется на остальных услугах:
   колонки «Сейчас / С нами», калькулятор, полоса цифр по центру, тарифы с подсветкой, панель
   «Как выбрать подрядчика», кнопка под командой, точки окон как в macOS, компактные призыв и подвал. */

/* ── Потери: три колонки «Сейчас / С нами» на тонкой линии ── */
.gaps-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 clamp(24px, 3vw, 56px); margin-top: var(--space-head-text); }
.gap { min-width: 0; padding-top: 24px; border-top: 1px solid var(--line); }
.gap h3 { margin: 0 0 var(--space-sub-text); font: 400 clamp(22px, 1.7vw, 26px)/1.2 var(--head); font-variation-settings: var(--heading-variation); letter-spacing: -.025em; color: var(--ink); text-wrap: balance; }
.gap p { margin: 0; font-size: 16px; line-height: 1.6; }
.gap p + p { margin-top: var(--space-list); }
.gap-no { color: var(--muted); }
.gap-yes { color: var(--ink); }
.gap b { font-weight: 600; }
@media (max-width: 900px) { .gaps-row { grid-template-columns: minmax(0, 1fr); gap: 32px; } }

/* ── Калькулятор: белая панель-форма под колонками, ползунки слева, итог справа ── */
.sv-calc { margin-top: var(--space-head-content); padding: clamp(24px, 3vw, 48px); background: var(--white); border: 1px solid var(--line); border-radius: var(--radius-panel); }
.sv-calc-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 8px 32px; }
.sv-calc-head h3 { margin: 0; font: 400 clamp(26px, 2.2vw, 34px)/1.15 var(--head); font-variation-settings: var(--heading-variation); letter-spacing: -.03em; color: var(--ink); text-wrap: balance; }
.sv-calc-head p { margin: 0; color: var(--muted); font-size: 16px; }
.sv-calc-body { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: clamp(28px, 4vw, 72px); margin-top: 40px; align-items: start; }
.sv-calc-inputs { display: grid; gap: 28px; }
.sv-calc-field { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px 16px; align-items: baseline; }
.sv-calc-field label { font-size: 16px; color: var(--ink); }
.sv-calc-field output { font: 400 22px/1.2 var(--head); font-variation-settings: var(--heading-variation); font-variant-numeric: tabular-nums; color: var(--ink); }
.sv-calc-field input[type="range"] { grid-column: 1 / -1; width: 100%; height: 44px; margin: 0; accent-color: var(--ink); cursor: pointer; }
.sv-calc-field input[type="range"]:focus-visible { outline: 2px solid var(--link); outline-offset: 2px; }
.sv-calc-hint { grid-column: 1 / -1; margin: -4px 0 0; color: var(--muted); font-size: 14px; line-height: 1.5; }
.sv-calc-result { padding-left: clamp(24px, 3vw, 48px); border-left: 1px solid var(--line); }
.sv-calc-res-label { margin: 0; color: var(--muted); font-size: 15px; }
.sv-calc-res-num { margin: 4px 0 8px; font: 400 clamp(72px, 7vw, 120px)/.9 var(--head); font-variation-settings: var(--heading-variation); letter-spacing: -.05em; font-variant-numeric: tabular-nums; color: var(--ink); }
.sv-calc-res-sub { margin: 0 0 28px; font-size: 17px; color: var(--ink); }
.sv-calc-res-sub b { font-weight: 600; }
.sv-calc-btn { display: inline-flex; align-items: center; gap: 12px; min-height: 48px; padding: 0 22px; border-radius: var(--radius-button); background: var(--depth); color: var(--depth-text); font: 500 16px/1 var(--body); text-decoration: none; }
.sv-calc-btn:hover { background: var(--ink); }
.sv-calc-btn:focus-visible { outline: 2px solid var(--link); outline-offset: 3px; }
.sv-calc-note { margin: 32px 0 0; color: var(--muted); font-size: 15px; line-height: 1.6; }
@media (max-width: 900px) {
  .sv-calc-body { grid-template-columns: minmax(0, 1fr); }
  .sv-calc-result { padding: 28px 0 0; border-left: 0; border-top: 1px solid var(--line); }
  .sv-calc-btn { width: 100%; justify-content: center; }
}

/* ── Полоса цифр: равные колонки, каждая цифра по центру своей колонки ── */
.agents-hero .hero-proof-band .hero-proof { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.agents-hero .hero-proof-band .proof-item,
.agents-hero .hero-proof-band .proof-item:first-child { align-items: center; justify-content: flex-start; text-align: center; padding-inline: clamp(12px, 1.6vw, 32px); }
.agents-hero .hero-proof-band .proof-num,
.agents-hero .hero-proof-band .proof-item:first-child .proof-num { font-size: clamp(48px, 4vw, 76px); }
.agents-hero .hero-proof-band .proof-label { margin-inline: auto; }
/* без латунных чёрточек над цифрами; цифра и подпись стоят по центру колонки и по высоте */
.agents-hero .hero-proof-band .proof-item::after,
.agents-hero .hero-proof-band .proof-item:first-child::after { display: none; }
.agents-hero .hero-proof-band .proof-item,
.agents-hero .hero-proof-band .proof-item:first-child { justify-content: center; min-height: 0; }
.agents-hero .hero-proof-band .hero-proof { align-items: stretch; padding-block: clamp(48px, 4.4vw, 72px); }
@media (max-width: 1100px) { .agents-hero .hero-proof-band .proof-num, .agents-hero .hero-proof-band .proof-item:first-child .proof-num { font-size: clamp(36px, 4.6vw, 56px); } }
@media (max-width: 760px) {
  .agents-hero .hero-proof-band .hero-proof { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .agents-hero .hero-proof-band .proof-item, .agents-hero .hero-proof-band .proof-item:first-child { border-left: 0; padding-inline: 8px; }
  .agents-hero .hero-proof-band .proof-num, .agents-hero .hero-proof-band .proof-item:first-child .proof-num { font-size: clamp(30px, 8vw, 40px); }
}

/* ── Схема avat-flow: при наведении на канал подсвечиваются его линия и события (скрипт в avat-service-v2.js) ── */
.av-flow__wire.is-lit { stroke: var(--link); stroke-width: 2; stroke-opacity: 1; }
.av-flow__node.is-lit { border-color: var(--link); box-shadow: 0 0 0 4px rgba(65, 93, 106, .14); }
.av-flow__feed li.is-lit { box-shadow: inset 2px 0 0 var(--link); background: var(--white); }
.av-flow__node, .av-flow__feed li { transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease; }
.av-flow__wire { transition: stroke .2s ease, stroke-width .2s ease; }
@media (hover: hover) { .av-flow__node { cursor: default; } }

/* ── Команда: под стеной лиц одна кнопка по центру, чуть крупнее обычной ── */
.sv-team-cta { justify-content: center; }
.sv-team-cta .team-cta-btn { min-height: 60px; padding: 0 34px; font-size: 17px; }

/* ── Логотипы клиентов с нашим кейсом: ссылка на кейс, вид как у остальных логотипов ── */
.client-logo--link { color: inherit; text-decoration: none; cursor: pointer; }
.client-logo--link:focus-visible { outline: 2px solid var(--link); outline-offset: 2px; }

/* ── Процесс: две строки вводного абзаца ── */
.sv-line { display: block; }

/* ── Цены ── */
/* кнопка квиза стоит на одной линии с текстом под заголовком */
.sv-price-sub { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; }
.sv-price-sub .tq-toggle { margin: 0; }
/* название пакета не мельче цены и жирнее её (Geologica 500 для имён и итогов) */
main > .pricing .price-name { font-size: clamp(32px, 2.6vw, 44px); font-weight: 500; letter-spacing: -.035em; }
main > .pricing .price-num { font-size: clamp(32px, 2.6vw, 44px); }
/* колонка тарифа подсвечивается при наведении: светлая подложка и рамка */
main > .pricing .price-card,
main > .pricing .price-card:first-child,
main > .pricing .price-card:last-child { padding: 28px clamp(20px, 2.4vw, 40px) 28px; border-radius: var(--radius-panel); transition: background-color .2s ease, box-shadow .2s ease; }
@media (hover: hover) {
  main > .pricing .price-card:hover { background: var(--white); box-shadow: inset 0 0 0 1px var(--line); }
  main > .pricing .price-card:hover .btn-ghost { background: var(--ink); color: var(--paper); border-color: var(--ink); }
}
@media (max-width: 1000px) { main > .pricing .price-card, main > .pricing .price-card:first-child, main > .pricing .price-card:last-child { padding: 24px 16px 28px; } }
@media (prefers-reduced-motion: reduce) { main > .pricing .price-card { transition: none; } }
/* одна строка фактов на всю ширину */
.sv-price-facts { grid-template-columns: minmax(0, 1fr); }

/* ── «Как выбрать подрядчика»: отдельная белая панель, заголовок по центру вопросов ── */
.sv-grt-check { padding: clamp(24px, 3vw, 48px); background: var(--white); border: 1px solid var(--line); border-radius: var(--radius-panel); align-items: center; }
.sv-grt-check .grt-qa li { padding: 16px 14px; margin: 0 -14px; cursor: help; transition: background-color .2s ease, box-shadow .2s ease; }
@media (hover: hover) { .sv-grt-check .grt-qa li:hover { background: var(--paper); box-shadow: inset 2px 0 0 var(--oxide); } }
@media (max-width: 1000px) { .sv-grt-check { align-items: start; } }
@media (prefers-reduced-motion: reduce) { .sv-grt-check .grt-qa li { transition: none; } }

/* ── Финальный призыв без картинки: высота по содержимому, подвал сразу под кнопками ── */
.cta-final.sv-cta { min-height: 0; }

/* ── Окна-браузеры на странице: точки как в macOS (красная, жёлтая, зелёная) ── */
.avat-demo .avat-demo__window-dots i { width: 10px; height: 10px; background: #ff5f57; box-shadow: none; }
.avat-demo .avat-demo__window-dots i:nth-child(2) { background: #febc2e; }
.avat-demo .avat-demo__window-dots i:nth-child(3) { background: #28c840; }
#cases .mockup-header > span:not(.mockup-url) { width: 10px; height: 10px; opacity: 1; background: #ff5f57; }
#cases .mockup-header > span:nth-child(2) { background: #febc2e; }
#cases .mockup-header > span:nth-child(3) { background: #28c840; }

/* ── Финальный призыв и подвал компактнее: на ноутбуке 15″ помещаются в экран.
   «body» усиливает правила: общий site-footer.css подключается позже этого файла ── */
.cta-final.sv-cta { padding: clamp(56px, 5vw, 80px) 0 clamp(72px, 6vw, 96px); }
body footer.footer.avat-footer { padding-top: 40px; }
body footer.avat-footer .footer-grid { gap: 28px 40px; }
body footer.avat-footer .footer-label { margin-bottom: 14px; }
body footer.avat-footer .footer-col > a { margin-bottom: 6px; }
body footer.avat-footer .footer-decode { margin: 14px 0; }
body footer.avat-footer .footer-seo { margin-top: 28px; padding-top: 20px; }
body footer.avat-footer .footer-legal { margin: 16px 0; }
@media (max-width: 760px) { body footer.avat-footer .footer-col > a { margin: 0; } }
.sv-dots { display: flex; gap: 6px; }
.sv-dots i { width: 10px; height: 10px; border-radius: 50%; background: #ff5f57; }
.sv-dots i:nth-child(2) { background: #febc2e; }
.sv-dots i:nth-child(3) { background: #28c840; }

/* ── Тёмная глава «из чего собирается»: схема продукта в окне, части-шаги рядом. Нажатие на шаг
   или на часть схемы подсвечивает её (скрипт в avat-service-v2.js, разметка [data-anat]) ── */
.sv-anat { align-items: start; }
.sv-anat-win { border-radius: 24px; overflow: hidden; background: var(--white); box-shadow: 0 20px 56px rgba(0, 0, 0, .28); outline: 1px solid rgba(238, 242, 243, .08); }
.sv-anat-bar { display: flex; align-items: center; gap: 14px; height: 48px; padding: 0 20px; border-bottom: 1px solid var(--line); background: var(--white); color: var(--muted); font: 500 12px/1 var(--body); }
.sv-anat-page { display: grid; gap: 10px; padding: 18px; }
.sv-z { position: relative; padding: 16px 18px; border: 1px solid var(--line); border-radius: 10px; background: var(--paper); color: var(--ink); transition: background-color .2s ease, border-color .2s ease, box-shadow .2s ease; }
.sv-anat.is-ready .sv-z { cursor: pointer; }
.sv-anat.is-ready .sv-z:not(.is-on):hover { background: var(--white); border-color: var(--muted); }
/* выбранная часть: светлый Ice из палитры брендбука и тёмная рамка */
.sv-z.is-on { background: var(--ice); border-color: var(--ink); box-shadow: 0 0 0 1px var(--ink); }
.sv-z-h { display: block; max-width: 22ch; font: 400 clamp(18px, 1.6vw, 24px)/1.15 var(--head); font-variation-settings: var(--heading-variation); letter-spacing: -.02em; }
.sv-z-t { display: block; margin: 6px 0 12px; color: var(--muted); font-size: 13px; }
.sv-z-btn { display: inline-flex; align-items: center; min-height: 32px; padding: 0 14px; border-radius: 2px; background: var(--depth); color: var(--depth-text); font: 500 12px/1 var(--body); }
.sv-z-btn--ghost { background: none; color: var(--ink); border: 1px solid var(--ink); }
.sv-z--offer { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.sv-z-n { color: var(--muted); font-size: 12px; }
.sv-z-n b { display: block; color: var(--ink); font: 400 18px/1.2 var(--head); font-variation-settings: var(--heading-variation); }
.sv-z--trust { display: grid; gap: 10px; }
.sv-z-logos { display: flex; gap: 10px; }
.sv-z-logos i { width: 48px; height: 14px; border-radius: 2px; background: var(--line); }
.sv-z-q { font-size: 13px; line-height: 1.45; }
.sv-z--form { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.sv-z-field { flex: 1 1 120px; min-height: 32px; display: flex; align-items: center; padding: 0 10px; border: 1px solid var(--line); border-radius: 2px; color: var(--muted); font-size: 12px; }
.sv-z--faq { display: grid; gap: 6px; }
.sv-z-row { display: flex; justify-content: space-between; padding: 6px 0; border-bottom: 1px solid var(--line); font-size: 13px; }
.sv-z-row i { font-style: normal; color: var(--muted); }
.sv-z--faq .sv-z-btn { justify-self: start; margin-top: 6px; }
/* шаги: кнопка как у списка шагов ролика, описание открытого шага под ней */
.sv-anat-steps li p { margin: 0 0 6px; padding: 0 0 10px 62px; color: var(--depth-muted); font-size: 15px; line-height: 1.6; }
.sv-anat.is-ready .sv-anat-steps li:not(.is-on) p { display: none; }
@media (max-width: 760px) {
  /* на телефоне сначала шаги, под ними схема: нажатая часть подсвечивается ниже, в зоне видимости */
  .sv-anat .film-side { order: -1; }
  .sv-anat-steps li p { padding-left: 48px; }
  .sv-z--offer { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr); gap: 8px; }
}
@media (prefers-reduced-motion: reduce) { .sv-z { transition: none; } }

/* ── Кнопки «Все кейсы» и «Вся команда»: по центру строки вводного абзаца, а не по его нижнему краю ── */
@media (min-width: 901px) {
  .cases .section-intro, .team .section-intro { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 40px; align-items: center; }
  .cases .section-intro > .section-title, .team .section-intro > .section-title { grid-column: 1 / -1; }
  .cases .section-intro .section-subtitle, .team .section-intro .section-subtitle { grid-column: 1; padding-right: 0; }
  .cases .section-intro .cases-all, .team .section-intro .cases-all { position: static; grid-column: 2; align-self: center; margin: 0; }
}

/* ── Команда: после кнопки под стеной лиц сразу следующий раздел, без двойного отступа ── */
main > .team { padding-bottom: 24px; }

/* ── Процесс без вводного абзаца: схема ближе к заголовку ── */
.sv-process-tight .section-intro { margin-bottom: var(--space-head-text); }

/* ── Ссылка внутри описания тарифа ── */
.price-desc a { color: var(--ink); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }

/* ── Подвал ещё ближе к кнопкам финального призыва ── */
.cta-final.sv-cta { padding-bottom: clamp(40px, 3.6vw, 56px); }
body footer.footer.avat-footer { padding-top: 32px; }

/* ── «Что такое …»: заголовок по центру высоты текстового блока справа ── */
@media (min-width: 1001px) { .what-grid > .section-title { align-self: center; } .what-grid > .what-text { padding-top: 0; } }

/* ── Заголовок раздела и кнопка в одну строку (кнопка справа, по центру строки заголовка) ── */
.section-intro.sv-intro-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 16px 40px; }
.section-intro.sv-intro-row > .section-title { grid-column: 1; margin: 0; }
.section-intro.sv-intro-row > .cases-all, .section-intro.sv-intro-row > .tq-toggle { grid-column: 2; position: static; margin: 0; align-self: center; }
@media (max-width: 900px) {
  .section-intro.sv-intro-row { grid-template-columns: minmax(0, 1fr); }
  .section-intro.sv-intro-row > .cases-all, .section-intro.sv-intro-row > .tq-toggle { grid-column: 1; justify-self: start; }
}

/* ── Ползунки калькулятора цветом Steel из палитры брендбука (ссылки и активное), не серым ── */
.sv-calc-field input[type="range"] { accent-color: var(--link); }

/* ── Колонки причин ближе к заголовку раздела (вводного абзаца у них нет) ── */
.gaps .section-intro { margin-bottom: 0; }

/* ── Кнопка у заголовка: по центру строки букв, а не всей высоты строки. У строчных букв визуальная
   середина ниже середины строки на несколько пикселей, без сдвига кнопка кажется выше заголовка ── */
.section-intro.sv-intro-row > .cases-all, .section-intro.sv-intro-row > .tq-toggle { transform: translateY(4px); }
@media (max-width: 900px) { .section-intro.sv-intro-row > .cases-all, .section-intro.sv-intro-row > .tq-toggle { transform: none; } }

/* ── Схема «Один день …»: без подписи, кнопка «Запустить заново» по центру строки заголовка ── */
.av-live-cap { align-items: center; }
.av-live-cap .av-live-replay { transform: translateY(3px); }

/* ── После блока «Что такое …» следующий раздел ближе: без двойного отступа между разделами ── */
main > .what { padding-bottom: 32px; }

/* ── Полоса цифр: цифра уменьшается под ширину своей колонки и не наезжает на соседнюю ── */
.agents-hero .hero-proof-band .proof-item { container-type: inline-size; min-width: 0; }
.agents-hero .hero-proof-band .proof-num,
.agents-hero .hero-proof-band .proof-item:first-child .proof-num { font-size: min(clamp(48px, 4vw, 76px), 19cqw); }
@media (max-width: 1100px) { .agents-hero .hero-proof-band .proof-num, .agents-hero .hero-proof-band .proof-item:first-child .proof-num { font-size: min(clamp(36px, 4.6vw, 56px), 19cqw); } }
@media (max-width: 760px) { .agents-hero .hero-proof-band .proof-num, .agents-hero .hero-proof-band .proof-item:first-child .proof-num { font-size: min(clamp(30px, 8vw, 40px), 19cqw); } }

/* ── Блок «Что спрашивают» (правка 27.10): заголовок и подзаголовок на всю ширину, под ними вопросы в две
   независимые колонки. Раскрытый вопрос слева не двигает правую колонку. На узком экране одна колонка. ── */
main .faq .faq-grid.sv-faq { display: block; }
main .faq .faq-grid.sv-faq > .section-intro { position: static; max-width: none; margin-bottom: var(--space-head-content); }
main .faq .faq-grid.sv-faq > .section-intro .section-title,
main .faq .faq-grid.sv-faq > .section-intro .section-subtitle { max-width: none; }
main .faq .sv-faq-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 clamp(40px, 5vw, 96px); align-items: start; margin: 0; }
main .faq .sv-faq-col { min-width: 0; }
main .faq .faq-grid.sv-faq > .page-meta { margin-top: 40px; }
@media (max-width: 900px) { main .faq .sv-faq-cols { grid-template-columns: minmax(0, 1fr); } }

/* ── Текст по ширине (правка 27.10): абзацы и пункты списков выравниваются по обоим краям, с переносами слов,
   чтобы не было больших пробелов. Окна-макеты, цифры, подписи, кнопки и строки по центру не трогаем. ── */
main :is(p, li) { text-align: justify; -webkit-hyphens: auto; hyphens: auto; }
main :is(.avat-demo, .sv-anat-win, .pa-win, .av-flow, .hero-proof, .hero-actions, .case-stats, .case-meta, .case-stack, .mockup-header,
  .price-features, .tq, .review-who, .svc-related, .page-meta, figcaption, .process-visual, .marquee, .sv-calc, .cta-buttons,
  .team-grid, .team-wall, .sv-team-cta, .grt-us, .tq-res) :is(p, li) { text-align: inherit; -webkit-hyphens: manual; hyphens: manual; }

/* ── Окно-макет первого экрана (правка 27.10), как окно на главной: при загрузке выезжает снизу и раскрывается,
   стоит чуть выше и с лёгким поворотом; при прокрутке опускается на место и выпрямляется (--sv-lift от 1 до 0
   ставит avat-service-v2.js). Наведение или нажатие внутри окна сразу выпрямляет его. На узком экране и при
   «меньше движения» окно стоит ровно. ── */
.agents-hero .agents-hero-demo { perspective: 1800px; animation: sv-demo-in 1s cubic-bezier(.2, .75, .2, 1) .15s both; }
@keyframes sv-demo-in { from { opacity: 0; transform: translateY(64px) scale(.94); } to { opacity: 1; transform: none; } }
@media (min-width: 951px) {
  .agents-hero .agents-hero-demo > .avat-demo { transform-origin: 50% 80%; will-change: transform;
    transform: translate3d(0, calc(var(--sv-lift, 0) * -32px), 0) rotateY(calc(var(--sv-lift, 0) * 5deg)) rotateZ(calc(var(--sv-lift, 0) * -2.4deg));
    transition: transform .55s cubic-bezier(.2, .75, .2, 1); }
  .agents-hero .agents-hero-demo > .avat-demo:is(:hover, :focus-within) { transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  .agents-hero .agents-hero-demo { animation: none; }
  .agents-hero .agents-hero-demo > .avat-demo { transform: none; transition: none; }
}

/* ── Рейтинг «4,9 на Яндекс.Картах» под ценами (решение Михаила 27.10: рейтинг везде, где он был на эталоне) ── */
main .pricing .sv-price-rating { margin: 32px 0 0; text-align: start; }

/* ── Правки 27.10, все страницы услуг ──
   1. «Белое полотно» после первого экрана (что это за услуга → схема «Один день» → список → причины) разбито:
      список под схемой лежит на голубой плашке, блок причин на сером фоне с белыми карточками. */
main .what-grid > .what-list { margin-top: 32px; padding: clamp(24px, 2.6vw, 40px); border-radius: var(--radius-panel, 4px); background: var(--mist); }
main .what-grid > .what-list li { border-top-color: rgba(17, 28, 35, .14); }
main .what-grid > .what-list p { color: var(--ink); opacity: .78; }
main > .gaps { background: var(--mist); }
main > .gaps .gaps-row { gap: 20px; }
main > .gaps .gap { padding: clamp(22px, 2.2vw, 32px); border-top: 0; border-radius: var(--radius-panel, 4px); background: var(--white); }
@media (max-width: 900px) { main > .gaps .gaps-row { gap: 16px; } }

/* 2. Кнопка «Подобрать формат за 4 вопроса» всегда тёмная и заметная, при наведении становится белой. */
.tq-toggle { background: var(--depth); border-color: var(--depth); color: var(--depth-text); }
.tq-toggle:hover { background: var(--white); border-color: var(--ink); color: var(--ink); }

/* 3. Цифры в карточках кейсов не переносятся: «8 недель», «20-40 сек» в одну строку. Обе цифры кейса одного
      размера, размер подстраивается под ширину строки цифр. */
.cases-grid.is-showcase .case-stats { container-type: inline-size; }
.cases-grid.is-showcase .case-stat { flex: 1 1 0; min-width: 0; }
.cases-grid.is-showcase .stat-num { white-space: nowrap; font-size: min(clamp(44px, 4.4vw, 72px), 10cqw); }
@media (max-width: 760px) { .cases-grid.is-showcase .stat-num { font-size: min(40px, 9.6cqw); } }

/* 4. Заголовок первого экрана одной фразой одного размера: без мелкой второй строки и без висячей запятой. */
.agents-hero .sv-h1 .hero-main { font-size: clamp(40px, 4vw, 68px); line-height: 1.05; }
@media (max-width: 760px) { .agents-hero .sv-h1 .hero-main { font-size: clamp(34px, 9.4vw, 46px); } }
/* длинный заголовок (больше 50 знаков) чуть мельче, чтобы не растягивался на пять строк */
.agents-hero .sv-h1.sv-h1--long .hero-main { font-size: clamp(38px, 3.4vw, 56px); }
@media (max-width: 760px) { .agents-hero .sv-h1.sv-h1--long .hero-main { font-size: clamp(30px, 8.4vw, 40px); } }
/* заголовки внутри пунктов списка не растягиваем */
main li :is(h2, h3, h4) { text-align: start; }

/* Крупная цифра срока в блоке процесса: мельче, чем по брендбуку, чтобы не спорила со словом рядом (решение Полины 29.10) */
main .process .process-visual-number { gap: 14px; font-size: clamp(64px, 5.4vw, 96px); letter-spacing: -.06em; }
main .process .process-visual-number span { font-size: clamp(24px, 1.8vw, 32px); }
@media (max-width: 520px) { main .process .process-visual-number { font-size: 60px; gap: 10px; } main .process .process-visual-number span { font-size: 22px; } }

/* Блок «Чем мы отличаемся» из трёх пунктов: три колонки без пустой четвёртой */
@media (min-width: 1101px) { .grt-rules:has(> .grt-rule:nth-child(3):last-child) { grid-template-columns: repeat(3, minmax(0, 1fr)); } }



/* Подложки на странице только из брендбука: Ice (#D5E7EE) по брендбуку это блик внутри тёмной сцены, поэтому панели и карточки на Mist (решение Полины 30.10) */

/* Логотипы клиентов: при наведении цвет получает только логотип, белый прямоугольник под ним не появляется (как на главной) */
main .marquee .client-logo::before { display: none; }

/* Кнопка «Запустить заново» у живых схем: тёмная, как кнопка квиза, при наведении белая */
main .av-live-replay { background: var(--depth); border-color: var(--depth); color: var(--depth-text); transition: background .2s, color .2s; }
main .av-live-replay:hover { background: var(--white); color: var(--ink); border-color: var(--ink); }

/* Цены из двух тарифов: две колонки без пустой третьей */
@media (min-width: 901px) { .pricing-grid:has(> .price-card:nth-child(2):last-child) { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Правило Полины 30.10 для всех страниц: абзацы по ширине на всех устройствах, дыры лечим переносами, а не левым краем */
/* Строки абзацев распределяются ровнее, последнее слово не остаётся одно (вместо склейки неразрывным пробелом, которая давала дыры) */
main :is(p, li) { text-wrap: pretty; }

/* Переписки в телефонах-макетах («Без агента / С агентом») это макет, а не текст страницы: по ширине не растягиваем */
main :is(.lp-phone, .lp-screen) :is(p, li) { text-align: inherit; -webkit-hyphens: manual; hyphens: manual; }
/* Слово через дефис не разрываем по строкам (обычный дефис остаётся для поиска) */
.sv-nowrap { white-space: nowrap; }

/* Плашка списка на Mist и серая секция «потери» ниже не должны сливаться: светлый отступ между ними как между разделами */
main section.what:has(+ section.gaps) { padding-bottom: clamp(64px, 7vw, 104px); }
/* ИИ-агенты: блок «Где бизнес теряет клиентов» сразу после плашки списка, без лишней пустоты (правка Полины 30.10) */
main section.what + section.loss { padding-top: clamp(40px, 4vw, 64px); }

/* Живая схема «заявка → CRM → менеджер»: подпись статуса уходит на вторую строку, если не помещается, и не растягивает страницу вбок */
main .av-flow__node { flex-wrap: wrap; row-gap: 4px; }
main .av-flow__node > :first-child { min-width: 0; }