/* Главная v2 (pages/page-front-v2.php), 2026-10-10. Оформление — общее для сайта: только переменные темы
   (--color-*, --radius-*, --shadow, --gradient-*, --space-*), карточки как .home-stats__item, кнопки темы.
   Светлая и тёмная ([data-theme=dark]) темы работают без отдельных правил. */

.vh b { color: var(--color-text-heading); font-weight: 700; }
.vh-center { text-align: center; }

/* ---------- Сетки и карточки ---------- */
.vh-grid { display: grid; gap: var(--grid-space); }
.vh-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.vh-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.vh-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.vh-grid--5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.vh-grid--sectors { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 1rem; }

.vh-card { display: flex; flex-direction: column; gap: .75rem; min-width: 0; padding: 1.875rem; background-color: var(--color-bg-2); border-radius: var(--radius-xl); box-shadow: var(--shadow); color: var(--color-text); }
.vh-card__title { margin: 0; font-size: 1.25rem; font-weight: 700; line-height: 1.25; letter-spacing: -0.01em; color: var(--color-text-heading); }
.vh-card__text { margin: 0; line-height: 1.5; color: var(--color-text); }
.vh-icon { flex: none; display: block; }

/* ---------- Первый экран ---------- */
.vh-hero { position: relative; padding: var(--space-layout-md) 0 var(--space-layout-lg); overflow: hidden; }
.vh-hero__container { position: relative; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 3rem; align-items: center; }
.vh-hero__text { display: flex; flex-direction: column; gap: 1.25rem; }
.vh-hero__text .subtitle { margin: 0; }
.vh-hero__heading { margin: 0; }
.vh-hero__lead { margin: 0; max-width: 36rem; font-size: 1.125rem; line-height: 1.5; color: var(--color-text); }
.vh-hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.75rem; margin-top: .75rem; }
.vh-hero__note { max-width: 13rem; font-size: .9375rem; line-height: 1.35; color: var(--color-text-secondary); }

/* Путь одной сделки — карточка темы; цвета «утечка» (оранжевый пунктир) и «система» (синий) из макета */
.vh-path { display: flex; flex-direction: column; gap: 1rem; padding: 1.75rem; background-color: var(--color-bg-2); border-radius: var(--radius-xl); box-shadow: 0 18px 40px -24px rgba(31, 31, 31, .35); }
.vh-path__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem; }
.vh-path__title { font-size: 1.0625rem; font-weight: 700; color: var(--color-text-heading); }
.vh-segs { display: inline-flex; gap: 4px; padding: 4px; border-radius: 999px; background: var(--color-bg-4); }
.vh .seg { margin: 0; padding: .5rem 1rem; border: 0; border-radius: 999px; background: transparent; font: inherit; font-size: .875rem; font-weight: 700; line-height: 1.3; color: var(--color-text); cursor: pointer; }
.vh .seg.is-active { background: var(--color-primary); color: #1B1B1F; }
.vh .seg:focus-visible { outline: 2px solid var(--color-accent); outline-offset: 2px; }
.vh .is-on .seg.is-active { background: #1F5FD0; color: #fff; }
.vh-path__step { display: flex; align-items: center; gap: .875rem; }
.vh-path__name { font-size: 1.0625rem; font-weight: 700; color: var(--color-text-heading); }
.vh-path__gap { display: flex; align-items: stretch; gap: .875rem; min-height: 3.5rem; }
.vh .node { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border-radius: 50%; background: var(--color-primary); color: #1B1B1F; font-size: .9375rem; font-weight: 800; }
.vh .rail { flex: none; width: 2rem; background: repeating-linear-gradient(#E26227 0 6px, transparent 6px 12px) center / 2px 100% no-repeat; }
.vh .chip { align-self: center; margin: .25rem 0; padding: .45rem .85rem; border-radius: var(--radius-base); background: #FFEDE5; color: #8A2E0B; border: 1px dashed #E26227; font-size: .875rem; font-weight: 600; line-height: 1.35; }
.vh .foot { padding: .9rem 1rem; border-radius: var(--radius-base); background: #FFEDE5; color: #8A2E0B; border: 1px dashed #E26227; font-size: .9375rem; font-weight: 700; line-height: 1.35; }
.vh .is-on .node { background: #1F5FD0; color: #fff; }
.vh .is-on .rail { background: linear-gradient(#2D7EFF, #2D7EFF) center / 2px 100% no-repeat; }
.vh .is-on .chip, .vh .is-on .foot { background: #E5EFFF; color: #123E8F; border: 1px solid #2D7EFF; }
.vh-path__note { font-size: .8125rem; color: var(--color-text-secondary); }
@media (prefers-reduced-motion: no-preference) {
  .vh .node, .vh .rail, .vh .chip, .vh .foot, .vh .seg { transition: background-color var(--transition), color var(--transition), border-color var(--transition); }
}

/* ---------- Цифры ---------- */
.vh-stat { gap: .35rem; }
.vh-stat__num { margin: 0; font-size: clamp(28px, 28px + (40 - 28) * (100vw - 360px) / (1200 - 360), 40px); font-weight: 800; line-height: 1.1; color: var(--color-primary); }
.vh-stat__label { margin: 0; font-weight: 500; color: var(--color-text); }
.vh-stat--accent { background: var(--gradient-primary); }
.vh-stat--accent .vh-stat__num, .vh-stat--accent .vh-stat__label { color: var(--color-text-accent-static); }

/* ---------- Как работаем ---------- */
.vh-method { gap: 1rem; }

/* ---------- Отрасли ---------- */
.vh-sector { flex-direction: row; align-items: center; gap: .875rem; padding: 1rem 1.25rem; border-radius: var(--radius-md); }
.vh-sector__name { font-weight: 600; line-height: 1.3; color: var(--color-text-heading); }
.vh-sector--ask { background: var(--gradient-secondary); text-decoration: none; transition: transform var(--transition); }
.vh-sector--ask:hover { transform: translateY(-2px); }
.vh-sector--ask .vh-sector__name { color: var(--color-text-accent-static); }
.vh-sector__q { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 14px; background: var(--color-bg-2-static); color: var(--color-accent); font-size: 1.5rem; font-weight: 800; }

/* ---------- Кейсы ---------- */
.vh-headrow { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1rem 2rem; }
.vh-headrow__link { font-weight: 700; color: var(--color-text-heading); text-decoration: underline; text-underline-offset: 4px; text-decoration-color: var(--color-border-primary); }
.vh-headrow__link:hover { color: var(--color-primary); }
.vh-case__num { margin: 0; font-size: clamp(40px, 40px + (56 - 40) * (100vw - 360px) / (1200 - 360), 56px); font-weight: 800; line-height: 1; color: var(--color-primary); }
.vh-case__title { margin: 0; font-weight: 700; color: var(--color-text-heading); }
.vh-leak { align-self: flex-start; padding: .25em .9em; font-size: .875rem; color: var(--color-text-primary); border: 1px solid var(--color-border-primary); border-radius: var(--radius-base); }
.vh-case .vh-case__more { margin-top: auto; }

/* ---------- Системы ---------- */
.vh-sys { flex-direction: row; align-items: flex-start; gap: 1.25rem; text-decoration: none; transition: transform var(--transition), box-shadow var(--transition); }
.vh-sys:hover { transform: translateY(-3px); box-shadow: 0 18px 40px -24px rgba(31, 31, 31, .35); }
.vh-sys__body { display: flex; flex-direction: column; gap: .4rem; }
.vh-sys:hover .vh-card__title { color: var(--color-accent); }

/* ---------- СуперСила — тёмный блок ---------- */
.vh-dark { padding: 3.125rem; border-radius: var(--radius-xl); background: #1F1F1F; color: #fff; }
.vh-dark .section-heading { margin-bottom: 2rem; }
.vh-dark__kicker { margin: 0 0 .75rem; color: var(--color-primary); }
.vh-dark__desc { color: rgba(255, 255, 255, .8); }
.vh-vs { padding: 1.375rem; border-radius: var(--radius-md); background: #292929; }
.vh-vs__title { margin: 0 0 .35rem; font-weight: 700; color: rgba(255, 255, 255, .6); }
.vh-vs__text { margin: 0; color: rgba(255, 255, 255, .85); }
.vh-power { display: flex; flex-wrap: wrap; align-items: center; gap: 1.5rem 2.5rem; margin-top: 1.5rem; padding: 2rem; border-radius: var(--radius-lg); background: var(--gradient-primary); color: #fff; }
.vh-power__text { flex: 1 1 320px; display: flex; flex-direction: column; gap: .6rem; }
.vh-power__text p { margin: 0; }
.vh-power__title { font-size: 1.5rem; font-weight: 800; line-height: 1.2; }
.vh-power__pills { flex: 2 1 420px; display: flex; flex-wrap: wrap; gap: .5rem; }
.vh-power__pills span { padding: .5rem 1rem; border-radius: 999px; background: rgba(255, 255, 255, .2); font-weight: 600; }

/* ---------- Герои ---------- */
.vh-person { flex-direction: row; align-items: flex-start; gap: 1.25rem; }
.vh-person p { margin: 0; }
.vh-person__ava { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 3.5rem; height: 3.5rem; border-radius: 50%; background: var(--gradient-primary); color: #fff; font-size: 1.125rem; font-weight: 800; }
.vh-person__name { font-size: 1.125rem; font-weight: 700; color: var(--color-text-heading); }
.vh-person .vh-person__role { margin: .15rem 0 .5rem; font-size: .8125rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--color-text-primary); }
.vh-person--accent { background: var(--gradient-secondary); }
.vh-person--accent .vh-person__ava { background: var(--color-bg-2-static); color: var(--color-accent); font-size: 1.5rem; }
.vh-person--accent .vh-person__name, .vh-person--accent .vh-person__role, .vh-person--accent .vh-card__text { color: var(--color-text-accent-static); }
.vh-more { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; margin-top: 2rem; }
.vh-more__label { font-weight: 700; color: var(--color-text-heading); }

/* ---------- С кем работаем ---------- */
.vh-filter { gap: 1.25rem; }
.vh-filter__title { margin: 0; font-size: clamp(20px, 20px + (26 - 20) * (100vw - 360px) / (1200 - 360), 26px); font-weight: 700; line-height: 1.2; color: var(--color-text-heading); }
.vh-tags { display: flex; flex-wrap: wrap; gap: .625rem; }
.vh-no { display: inline-flex; align-items: center; gap: .5rem; padding: .5rem 1rem; border: 1px dashed var(--color-border-secondary); border-radius: 999px; font-weight: 500; color: var(--color-text-secondary); }

/* ---------- Как начать ---------- */
.vh-step__num { display: inline-flex; align-items: center; justify-content: center; width: 3rem; height: 3rem; border-radius: 50%; background: var(--gradient-primary); color: #fff; font-weight: 800; }
.vh-step:last-child .vh-step__num { background: var(--gradient-secondary); }

/* ---------- Контакты ---------- */
.vh-final .cta__desc p { margin: 0; }
.vh-final__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 1rem; }
.vh-final__actions .btn { display: inline-flex; align-items: center; gap: .6rem; }
.vh-final__contacts { margin: 1.5rem 0 0; color: var(--color-text-accent-static); font-weight: 600; text-align: center; }
.vh-final__contacts a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }

/* ---------- Адаптив ---------- */
@media (max-width: 1200px) {
  .vh-grid--5 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 992px) {
  .vh-hero__container, .vh-grid--2, .vh-grid--3 { grid-template-columns: minmax(0, 1fr); }
  .vh-grid--4, .vh-grid--5 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .vh-dark { padding: 2rem 1.5rem; }
}
@media (max-width: 576px) {
  .vh-grid--4, .vh-grid--5 { grid-template-columns: minmax(0, 1fr); }
  .vh-card { padding: 1.375rem; }
  .vh-path { padding: 1.25rem; }
  .vh-hero__actions .btn { width: 100%; justify-content: center; white-space: normal; }
  .vh-power { padding: 1.5rem; }
}

/* Тёмная тема: --color-text-primary (#B32F00) на тёмных карточках не читается — подписи утечек и ролей светлее */
[data-theme=dark] .vh-leak, [data-theme=dark] .vh-person .vh-person__role { color: var(--color-primary); }
[data-theme=dark] .vh-person--accent .vh-person__role { color: var(--color-text-accent-static); }

/* Телефон в финальном блоке — отдельной строкой по центру под мессенджерами */
.vh-final__phone { margin: .75rem 0 0; text-align: center; font-size: 1.375rem; font-weight: 800; }
.vh-final__phone a { color: var(--color-text-accent-static); text-decoration: none; }

/* Блок «Почему уходят клиенты»: 5 причин, затем «Мы закрываем все эти проблемы» и 3 карточки */
.vh-reasons__lead { margin: 0 0 1.25rem; font-size: 1.25rem; font-weight: 700; color: var(--color-text-heading); }
.vh-reasons { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 1rem; margin: 0; padding: 0; list-style: none; }
.vh-reasons__item { display: flex; flex-direction: column; gap: .75rem; padding: 1.25rem; background-color: var(--color-bg-2); border-radius: var(--radius-md); box-shadow: var(--shadow); line-height: 1.4; color: var(--color-text-heading); font-weight: 500; }
.vh-reasons__num { display: inline-flex; align-items: center; justify-content: center; width: 2.25rem; height: 2.25rem; border-radius: 50%; background: #FFEDE5; color: #B32F00; border: 1px dashed #E26227; font-weight: 800; }
.vh-reasons__after { margin: var(--space-layout-md) 0 1.5rem; font-size: clamp(22px, 22px + (30 - 22) * (100vw - 360px) / (1200 - 360), 30px); font-weight: 800; line-height: 1.2; color: var(--color-text-heading); }
@media (max-width: 1200px) { .vh-reasons { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 768px) { .vh-reasons { grid-template-columns: minmax(0, 1fr); } .vh-reasons__item { flex-direction: row; align-items: center; } .vh-reasons__num { flex: none; } }

/* Оранжевая плашка «СуперСилы»: белый на светлом градиенте не читается — тёмный текст и тёмные плашки */
.vh-power { color: #1B1B1F; }
.vh-power__pills span { background: #1B1B1F; color: #fff; }

/* Финальный оранжевый блок: тёмный текст, как у плашки «СуперСилы»; кнопка тёмная — оранжевый на белом плохо читается */
.vh-final .cta__heading, .vh-final .cta__desc, .vh-final .cta__desc p, .vh-final__contacts, .vh-final__phone a { color: #1B1B1F; }
.vh-final .btn--accent { --button-bg: #1B1B1F; --button-bg-hover: #1B1B1F; --button-bg-active: #1B1B1F; --button-text: #fff; }

/* Логотипы «Нам доверяют»: в 2 раза медленнее, чем в теме (40s → 80s), и без остановки при наведении */
.vh .marquee__inner { animation-duration: 210s; } /* 80s на 11 логотипов → та же скорость на 29 */
.vh .marquee__inner:hover { animation-play-state: running; }

/* ==========================================================================
   Пакет А (2026-10-11): автозапуск «Пути сделки», полосы «до / после», видеоотзывы, калькулятор потерь, ролик кабинета.
   Скрипт — assets/js/home-v2.js. Без JS всё видно в конечном состоянии.
   ========================================================================== */

/* Путь сделки: новая подпись въезжает снизу */
@media (prefers-reduced-motion: no-preference) {
  .vh .chip.is-flip { animation: vh-flip .45s ease; }
}
@keyframes vh-flip { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

/* Полосы «до / после» в кейсах: «после» = 100 %, «до» = 100 / (100 + рост) */
.vh-bars { display: grid; gap: .4rem; }
.vh-bars__row { display: grid; grid-template-columns: 3.25rem minmax(0, 1fr); align-items: center; gap: .5rem; font-size: .8125rem; font-weight: 600; color: var(--color-text); }
.vh-bars__track { height: .5rem; border-radius: 999px; background: rgba(127, 127, 127, .15); overflow: hidden; }
.vh-bars__bar { display: block; width: var(--w); height: 100%; border-radius: inherit; background: var(--color-text-secondary-2); }
.vh-bars__row--after .vh-bars__lbl { color: var(--color-text-heading); }
.vh-bars__row--after .vh-bars__bar { background: var(--gradient-primary-strong); }
.vh-bars.is-ready .vh-bars__bar { width: 0; }
.vh-bars.is-shown .vh-bars__bar { width: var(--w); transition: width 1s cubic-bezier(.2, .7, .2, 1); }
.vh-bars.is-shown .vh-bars__row--after .vh-bars__bar { transition-delay: .3s; }

/* Видеоотзывы: вертикальные ролики 9:16 — кадр слева, текст справа */
.vh-review { flex-direction: row; align-items: stretch; gap: 0; padding: 0; overflow: hidden; }
.vh-review__media { position: relative; flex: none; width: 12.5rem; aspect-ratio: 9 / 16; background: #1F1F1F; }
.vh-review__media video { display: block; width: 100%; height: 100%; object-fit: cover; }
.vh-review__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0, 0, 0, 0) 55%, rgba(0, 0, 0, .35)); }
.vh-review__play { position: absolute; left: 50%; top: 50%; z-index: 1; display: flex; align-items: center; justify-content: center; width: 4rem; height: 4rem; margin: -2rem 0 0 -2rem; border-radius: 50%; background: var(--gradient-primary-strong); color: #fff; box-shadow: 0 10px 30px -8px rgba(0, 0, 0, .55); transition: transform var(--transition); }
.vh-review__media:hover .vh-review__play, .vh-review__media:focus-visible .vh-review__play { transform: scale(1.08); }
.vh-review__media:focus-visible { outline: 3px solid var(--color-accent); outline-offset: -3px; }
.vh-review__body { display: flex; flex-direction: column; gap: .5rem; min-width: 0; padding: 1.75rem; }
.vh-review__metric { margin: 0; font-size: clamp(26px, 26px + (34 - 26) * (100vw - 360px) / (1200 - 360), 34px); font-weight: 800; line-height: 1.1; color: var(--color-text-primary); }
.vh-review__who { margin: 0; font-size: 1.0625rem; font-weight: 700; color: var(--color-text-heading); }
.vh-review__len { margin: 0; font-size: .875rem; color: var(--color-text); }
.vh-review .vh-review__more { margin-top: auto; }

/* Калькулятор потерь: слева ползунки, справа результат на яркой оранжевой плашке с тёмным текстом */
.vh-calc { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 2.5rem; padding: 2.5rem; background-color: var(--color-bg-2); border-radius: var(--radius-xl); box-shadow: var(--shadow); }
.vh-calc__form { display: flex; flex-direction: column; gap: 1.5rem; }
.vh-calc__form .section-title { margin: 0; }
.vh-calc__lead { margin: 0; line-height: 1.5; color: var(--color-text); }
.vh-calc__field { display: flex; flex-direction: column; gap: .5rem; }
.vh-calc__row { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; }
.vh-calc__name { font-weight: 600; color: var(--color-text-heading); }
.vh-calc__val { font-size: 1.25rem; font-weight: 800; color: var(--color-text-heading); font-variant-numeric: tabular-nums; }
.vh-calc input[type=range] { --fill: 50%; -webkit-appearance: none; appearance: none; width: 100%; height: 1.75rem; margin: 0; background: transparent; cursor: pointer; }
.vh-calc input[type=range]::-webkit-slider-runnable-track { height: .5rem; border-radius: 999px; background: linear-gradient(to right, var(--color-primary-strong) var(--fill), rgba(127, 127, 127, .25) var(--fill)); }
.vh-calc input[type=range]::-moz-range-track { height: .5rem; border-radius: 999px; background: linear-gradient(to right, var(--color-primary-strong) var(--fill), rgba(127, 127, 127, .25) var(--fill)); }
.vh-calc input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; width: 1.5rem; height: 1.5rem; margin-top: -.5rem; border: 3px solid var(--color-primary-strong); border-radius: 50%; background: #fff; box-shadow: 0 2px 8px rgba(0, 0, 0, .25); }
.vh-calc input[type=range]::-moz-range-thumb { width: 1.5rem; height: 1.5rem; box-sizing: border-box; border: 3px solid var(--color-primary-strong); border-radius: 50%; background: #fff; box-shadow: 0 2px 8px rgba(0, 0, 0, .25); }
.vh-calc input[type=range]:focus-visible { outline: 2px solid var(--color-accent); outline-offset: 4px; border-radius: 999px; }
.vh-calc__result { display: flex; flex-direction: column; gap: .35rem; padding: 2rem; border-radius: var(--radius-lg); background: var(--gradient-primary); color: #1B1B1F; }
.vh-calc__result b { color: inherit; font-weight: 800; }
.vh-calc__now, .vh-calc__year { margin: 0; font-size: 1.0625rem; line-height: 1.4; }
.vh-calc__label { margin: 1rem 0 0; font-size: .8125rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.vh-calc__sum { margin: 0; font-size: clamp(28px, 28px + (42 - 28) * (100vw - 360px) / (1200 - 360), 42px); font-weight: 800; line-height: 1.1; font-variant-numeric: tabular-nums; }
.vh-calc__sum span { white-space: nowrap; }
.vh-calc__year { margin-bottom: 1.25rem; }
.vh .vh-calc__cta { align-self: flex-start; display: inline-flex; align-items: center; gap: .6rem; --button-bg: #1B1B1F; --button-bg-hover: #1B1B1F; --button-bg-active: #1B1B1F; background: #1B1B1F; box-shadow: 0 5px 0 0 #000; }
.vh .vh-calc__cta::before { display: none; }
.vh-calc__note { margin: 1rem 0 0; font-size: .8125rem; line-height: 1.45; }

/* Кабинет аналитики: текст слева, ролик в рамке окна браузера справа */
.vh-cab { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 3rem; align-items: center; }
.vh-cab__text { display: flex; flex-direction: column; gap: 1rem; }
.vh-cab__text .subtitle, .vh-cab__text .section-title { margin: 0; }
.vh-cab__desc { margin: 0; line-height: 1.5; color: var(--color-text); }
.vh-cab__list { display: grid; gap: .5rem; margin: 0; padding: 0; list-style: none; }
.vh-cab__list li { position: relative; padding-left: 1.75rem; font-weight: 600; line-height: 1.4; color: var(--color-text-heading); }
.vh-cab__list li::before { content: ""; position: absolute; left: 0; top: .15em; width: 1.15rem; height: 1.15rem; border-radius: 50%; background: #1F5FD0 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12.5l4 4 8-9' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 70% no-repeat; }
.vh-cab__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.75rem; margin-top: .5rem; }
.vh-cab__actions .btn { display: inline-flex; align-items: center; gap: .6rem; }
.vh-cab__link { font-weight: 700; color: var(--color-text-heading); text-decoration: underline; text-underline-offset: 4px; text-decoration-color: var(--color-border-primary); }
.vh-cab__link:hover { color: var(--color-text-primary); }
.vh-cab__screen { margin: 0; overflow: hidden; border-radius: var(--radius-lg); background: #fff; box-shadow: 0 30px 60px -30px rgba(31, 31, 31, .45), 0 0 0 1px rgba(31, 31, 31, .08); }
.vh-cab__bar { display: flex; gap: 6px; padding: .6rem .8rem; background: #EEF0F3; }
.vh-cab__bar span { width: 10px; height: 10px; border-radius: 50%; background: #FF5F57; }
.vh-cab__bar span:nth-child(2) { background: #FEBC2E; }
.vh-cab__bar span:nth-child(3) { background: #28C840; }
.vh-cab__video { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; background: #F4F6F9; }

@media (max-width: 992px) {
  .vh-calc, .vh-cab { grid-template-columns: minmax(0, 1fr); }
  .vh-calc { gap: 2rem; }
}
@media (max-width: 576px) {
  .vh-calc { padding: 1.5rem 1.25rem; }
  .vh-calc__result { padding: 1.5rem 1.25rem; }
  .vh .vh-calc__cta { width: 100%; justify-content: center; white-space: normal; }
  .vh-review__media { width: 8.5rem; }
  .vh-review__body { padding: 1.25rem; }
  .vh-review__play { width: 3.25rem; height: 3.25rem; margin: -1.625rem 0 0 -1.625rem; }
  .vh-cab__actions .btn { width: 100%; justify-content: center; white-space: normal; }
}
/* Калькулятор: «от …» и «до …» — каждая на своей строке, чтобы перенос не выглядел как минус (2026-10-11) */
.vh-calc__sum > span { display: block; }

/* ==========================================================================
   Две цветовые схемы на главной (2026-10-11), переменные — в конце upstr/assets/css/styles.css:
   светлая тема — синий акцент и белый текст на нём, тёмная — оранжевый и тёмный текст.
   «Путь одной сделки» и метка «Утечка» не перекрашиваются: там оранжевый = потеря, синий = система.
   ========================================================================== */
.vh-stat__num,
.vh-case__num,
.vh-headrow__link:hover,
.vh-sys:hover .vh-card__title,
.vh-sector__q { color: var(--accent); }
.vh-dark__kicker { color: #7EADFF; }
[data-theme=dark] .vh-dark__kicker { color: #FF8559; }

/* Акцентные плашки и кружки */
.vh-stat--accent,
.vh-sector--ask,
.vh-person--accent { --color-text-accent-static: var(--on-accent); }
.vh-person__ava,
.vh-step__num,
.vh-step:last-child .vh-step__num,
.vh-review__play { background: var(--accent-button); color: var(--on-accent); }
.vh-person--accent .vh-person__ava,
.vh-sector__q { background: var(--btn-alt-bg); color: var(--btn-alt-text); }
.vh-power { color: var(--on-accent); }
.vh-power__pills span { background: rgba(255, 255, 255, .18); color: #fff; }
[data-theme=dark] .vh-power__pills span { background: #1B1B1F; color: #fff; }
.vh-final .cta__heading, .vh-final .cta__desc, .vh-final .cta__desc p, .vh-final__contacts, .vh-final__phone a { color: var(--on-accent); }
.vh-final .btn--accent { --button-bg: var(--btn-alt-bg); --button-bg-hover: var(--btn-alt-bg); --button-bg-active: var(--btn-alt-bg); --button-text: var(--btn-alt-text); }
.vh-calc__result { color: var(--on-accent); }
.vh .vh-calc__cta { --button-bg: var(--btn-alt-bg); --button-bg-hover: var(--btn-alt-bg); --button-bg-active: var(--btn-alt-bg); --button-text: var(--btn-alt-text); background: var(--btn-alt-bg); box-shadow: 0 5px 0 0 var(--accent-shadow); }
.vh-cab__list li::before { background-color: var(--accent); }
.vh-reasons__num { background: var(--accent-tint); color: #123E8F; border-color: var(--accent); }
[data-theme=dark] .vh-reasons__num { background: #FFEDE5; color: #B32F00; border-color: #E26227; }

/* Иконки-плитки: светлая тема — синие, тёмная — оранжевые с тёмным рисунком */
.vh-icon > rect:first-child { fill: var(--accent); }
[data-theme=dark] .vh-icon g[stroke="#fff"] { stroke: #1B1B1F; }
[data-theme=dark] .vh-icon [stroke="#FFD0BF"] { stroke: #fff; }
[data-theme=dark] .vh-icon [fill="#FFD0BF"] { fill: #fff; }

/* Герои роста на главной: заголовок и кнопка на страницу команды */
.vh-heroes .vh-heroes__btn { flex: none; display: inline-flex; align-items: center; gap: .6rem; }
@media (max-width: 576px) {
  .vh-heroes .vh-heroes__btn { width: 100%; justify-content: center; white-space: normal; }
}

/* «Путь одной сделки»: оранжевый = состояние «без системы», в обеих темах (тёмный текст, 7:1) */
.vh .seg.is-active, .vh .node { background: #FF8559; color: #1B1B1F; }
.vh .is-on .seg.is-active, .vh .is-on .node { background: #1F5FD0; color: #fff; }
.vh-dark .subtitle.vh-dark__kicker { color: #7EADFF; }
[data-theme=dark] .vh-dark .subtitle.vh-dark__kicker { color: #FF8559; }