

/* Start:/local/components/vh/partners/templates/.default/partner.css?178878246968871*/
/* Раздел «Партнёрская программа» — стили, перенесённые из согласованного макета
   (превью VP-XFRV-CWQC, `leads/vita-house-partner/v6/`).

   ФАЙЛ СОБИРАЕТСЯ СКРИПТОМ, руками не правится:
       AI/Work/Vita-House-Partner/tools/build_css.py
   Правка идёт в template.html макета, потом пересборка — иначе макет и
   сайт разъедутся, и следующий перенос будет не с чего делать.

   Всё завёрнуто в `.vh-partner`: имена макета (.btn, .icon, .card, .i)
   на этом сайте заняты, и без обёртки правила столкнутся.
*/

/* ------------------------------------------------------------------------
   КОНТР-СБРОС. Стоит ПЕРЕД правилами макета, поэтому любое правило ниже
   его перебивает.

   Зачем он. У макета свой сброс, у сайта свой, и обнуляют они разное:
   там, где макет жил на значении браузера, сайт ставит своё. На витрине
   «Статей» отсюда пришло 13 расхождений из 14. Здесь тем же путём
   приехали `white-space:nowrap` и `letter-spacing:-.02em` из .btn сайта:
   кнопка «Выбрать и оставить заявку» переставала переноситься, строка
   услуги становилась на 22 px ниже, и весь список ехал вверх.

   Почему класс удвоен (.vh-partner.vh-partner). Правила сайта живут в
   template_*.css, а наши — в page_*.css, и БАНДЛ САЙТА ПОДКЛЮЧАЕТСЯ
   ПОЗЖЕ НАШЕГО. Значит при равной специфичности выигрывает сайт.
   `.vh-partner *` — это (0,1,0), ровно как `.btn` у сайта, то есть ничья
   не в нашу пользу. Удвоение класса даёт (0,2,0) и снимает вопрос, а
   правилам самого макета (тоже (0,2,0), но ниже по файлу) не мешает.

   Проверяется не глазами, а сверкой getComputedStyle узел за узлом
   (tests/audit_price_styles.mjs). Добавляя сюда строку, добавляй и узел
   в список проверки.
   ------------------------------------------------------------------------ */

/* 1. Повторяем сброс САМОГО МАКЕТА — на нём держится вся вёрстка.

   Сброс этого макета КОРОЧЕ, чем у «Цен», и списывать его оттуда нельзя.
   Здесь он весь: box-sizing, img и цвет ссылки. Ни `button{font:inherit}`,
   ни `a{color:inherit}` в макете НЕТ — и дописывать их сюда — значит менять
   дизайн (см. пункт про кнопки ниже). */
.vh-partner.vh-partner *, .vh-partner.vh-partner *::before, .vh-partner.vh-partner *::after{box-sizing:border-box;}
.vh-partner.vh-partner img{max-width:100%;display:block;}

/* 2. Снимаем ДОБАВКИ САЙТА, которых у макета не было.
      letter-spacing и white-space наследуются от обёртки, поэтому
      правила макета с явным значением их перебивают, а правила сайта
      на общих именах классов (.btn, .icon, .card) до элементов внутри
      раздела больше не достают. */
.vh-partner.vh-partner *{letter-spacing:inherit;white-space:revert;}
.vh-partner.vh-partner{letter-spacing:normal;}
/* Ссылке макет не задаёт ничего, кроме цвета, — значит она наследует шрифт
   страницы целиком. Сайт же пишет любому <a> свой font-weight, а `.btn`
   ещё и line-height:normal, из-за чего ссылка-кнопка («Стать партнёром»
   в первом экране) вставала на 2 px ниже макета. `font:inherit` возвращает
   наследование; размер и насыщенность дальше задаёт сам макет. */
.vh-partner.vh-partner a{font:inherit;text-decoration:revert;}
/* Заливка значков. У макета svg не красится ничем — значит `fill` там
   начальный, чёрный, и знак компании в лентах «Как это работает» и
   «Гарантии» рисуется чёрным на 9–16 % прозрачности. Сайт же красит svg
   своим цветом (#363636, а в шапке белым), и водяной знак менял вид.
   `initial` возвращает ровно макетное значение; правила самого макета
   (.i{fill:currentColor}, .geo__msk, .form__mark path) весомее и работают. */
.vh-partner.vh-partner svg{display:inline;vertical-align:baseline;fill:initial;}
.vh-partner.vh-partner img{vertical-align:revert;border-radius:0;}
.vh-partner.vh-partner h1, .vh-partner.vh-partner h2, .vh-partner.vh-partner h3,
.vh-partner.vh-partner h4, .vh-partner.vh-partner h5, .vh-partner.vh-partner h6,
.vh-partner.vh-partner section, .vh-partner.vh-partner p,
.vh-partner.vh-partner ul, .vh-partner.vh-partner ol,
.vh-partner.vh-partner li, .vh-partner.vh-partner figure, .vh-partner.vh-partner blockquote,
.vh-partner.vh-partner dl, .vh-partner.vh-partner dd{margin:revert;padding:revert;}
.vh-partner.vh-partner ul, .vh-partner.vh-partner ol{list-style:revert;}
.vh-partner.vh-partner b, .vh-partner.vh-partner strong, .vh-partner.vh-partner i,
.vh-partner.vh-partner em, .vh-partner.vh-partner small, .vh-partner.vh-partner code{
  font-size:revert;line-height:revert;display:revert;}
/* Ссылка-кнопка. Высота у <button> сброшена ниже, а `.btn` на этом сайте
   бывает и ссылкой — у неё сброса не было. Сайт задаёт `.btn--sm` жёсткую
   высоту (24/28/32 px по ширине экрана), у макета высоты нет вовсе, и на
   двухстрочной подписи «Выбрать и оставить заявку» текст вылезал за
   пределы плашки: кнопка выглядела узкой полосой с текстом поверх.
   Тот же вес (0,3,0), что и у правил макета, — макет по-прежнему главнее. */
.vh-partner.vh-partner .btn{height:revert;min-height:revert;}
.vh-partner.vh-partner input, .vh-partner.vh-partner textarea, .vh-partner.vh-partner select{
  padding:revert;margin:revert;line-height:revert;text-transform:none;
  border-radius:revert;box-shadow:none;min-height:revert;height:revert;}
/* КНОПКИ. Здесь важное отличие от «Цен», и оно меняет вид страницы.
   В том макете был общий сброс `button{font:inherit}`, поэтому кнопки
   набирались шрифтом страницы. В ЭТОМ макете такого правила нет вовсе:
   ни `button{...}`, ни `font-family` у `.btn` и `.chip`. Значит в макете,
   который согласовал клиент, подписи кнопок и плиток набраны БРАУЗЕРНЫМ
   шрифтом (Arial), а не Mont, и высота у них браузерная.

   Сайт же пишет кнопкам свой `font-family: Mont` и свой line-height. Если
   это оставить, плитки калькулятора и кнопка формы поедут на 6–7 px выше
   макета, а начертание сменится — это уже другой дизайн, а не перенос.
   Поэтому шрифт кнопкам возвращаем БРАУЗЕРНЫЙ (`revert`), а размер и
   насыщенность потом задают правила самого макета (.btn, .chip: 0,3,0).

   Если однажды решим набирать кнопки раздела шрифтом сайта — это правка
   МАКЕТА, а не этого файла: поменять там, пересобрать здесь. */
.vh-partner.vh-partner button{
  font:revert;color:revert;letter-spacing:revert;
  padding:revert;margin:revert;text-transform:none;border-radius:revert;
  box-shadow:none;min-width:revert;min-height:revert;height:revert;
  -webkit-appearance:revert;appearance:revert;}

/* ================= ТОКЕНЫ =================
   Источник цвета — фирменный стиль клиента: `leads/vita-house/brand/`,
   палитра из colors.pdf. Токены те же, что в макетах «Цены» и «Статьи»:
   разделы сайта должны выглядеть одним сайтом, а не тремя разными работами.

   Фирменные серые в тексте не используем: Main Grey 60% #8E8E8E даёт
   на белом 3.3:1, Main Blue 60% #00A3FF — 2.7:1. Это провал AA.
   Они работают рамками, разделителями и заливками значков. */
.vh-partner.vh-partner{--blue:#0023F5;    /* Main Blue 100%, 8.2:1 на белом */
  --blue-d:#001DC8;  /* Main Blue 110% */
  --blue-l:#1032FF;  /* Main Blue 90%, светлее основного на один шаг */
  --sky:#00A3FF;     /* Main Blue 60%, только заливки */
  --sky-l:#9EDCFF;   /* Main Blue 30%, подложки и геометрия */
  --navy:#0B1030;    /* тёмная полоса; тот же цвет, что в макете «Цены» */
  --ink:#363636;     /* Main Black */
  --ink-2:#4b5059;   /* вторичный текст: 7.4:1 на белом */
  --muted:#686D77;   /* 5.2:1; фирменный #8E8E8E сюда нельзя */
  --bg:#F7F7F7;      /* Main Grey 10% */
  --white:#fff;
  --line:#E4E5EA;
  --line-2:#CACACA;  /* Main Grey 30% */
  --grey-d:#3F3F3F;  /* Main Grey 90% */
  --tint:#EAEEFF;    /* синий 8% на белом */
  /* Дополнительная палитра брендбука (Secondary 01–06). Лежала без дела:
     вся страница держалась на одном синем. Цвета приглушённые, поэтому
     идут заливками значков и подложками, а не текстом. */
  --s1:#677898; --s2:#50809B; --s3:#5C8590;
  --s4:#579575; --s5:#6F845B; --s6:#9B886C;
  /* Те же шесть, затемнённые до 4,8:1 — только для мелкого текста.
     Сами Secondary дают на белом 3,4–4,45:1 и в AA не проходят,
     но заливкам, полосам и фигурам это не мешает. */
  --s1-t:#637392; --s2-t:#4B7892; --s3-t:#537882;
  --s4-t:#497D62; --s5-t:#657853; --s6-t:#7F7059;
  --ok:#0f8a4d;
  --warn:#8a5a0f;
  --r-lg:28px;
  --r-md:14px;
  --r-sm:10px;
  --wrap:1360px;}
.vh-partner.vh-partner *, .vh-partner.vh-partner *::before, .vh-partner.vh-partner *::after{box-sizing:border-box;}
.vh-partner.vh-partner{margin:0;background:#FAFBFE;color:var(--ink);
  font:400 15px/1.6 Mont,Arial,Helvetica,sans-serif;
  -webkit-font-smoothing:antialiased;}
/* Подложка страницы: три мягких пятна из палитры. Слой закреплён и лежит
   ниже всего содержимого — он фон, а не элемент. */
.vh-partner.vh-partner::before{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;
  background:
    radial-gradient(58% 42% at 82% 4%,rgba(158,220,255,.30) 0%,rgba(158,220,255,0) 62%),
    radial-gradient(46% 38% at 2% 34%,rgba(92,133,144,.13) 0%,rgba(92,133,144,0) 60%),
    radial-gradient(52% 40% at 96% 76%,rgba(87,149,117,.12) 0%,rgba(87,149,117,0) 58%);}
.vh-partner.vh-partner img{max-width:100%;display:block;}
.vh-partner.vh-partner a{color:var(--blue);}
.vh-partner.vh-partner [hidden]{display:none!important;}
.vh-partner.vh-partner h1, .vh-partner.vh-partner h2, .vh-partner.vh-partner h3, .vh-partner.vh-partner h4{margin:0;font-weight:700;line-height:1.18;letter-spacing:-.01em;}
.vh-partner.vh-partner p{margin:0;}
.vh-partner.vh-partner ul{margin:0;padding:0;list-style:none;}
.vh-partner.vh-partner .wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px;}
.vh-partner.vh-partner .i{width:1em;height:1em;fill:currentColor;flex:none;}
.vh-partner.vh-partner :focus-visible{outline:2px solid var(--blue);outline-offset:2px;}
/* ================= ШАПКА САЙТА =================
   Повторяет боевую шапку vita-house.ru: логотип берём из собственного
   спрайта клиента (#image-logo), поэтому он совпадает с сайтом точно.
   Все переходы в макете отключены — это превью одного раздела. */
.vh-partner.vh-partner .hd{position:sticky;top:0;z-index:30;
  background:rgba(255,255,255,.72);
  -webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);
  border-bottom:1px solid rgba(228,229,234,.9);}
/* Если стекло не поддерживается — обычный белый фон, без полупрозрачности. */
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.vh-partner.vh-partner .hd{background:var(--white);}}
.vh-partner.vh-partner .hd__in{display:flex;align-items:center;gap:22px;height:76px;}
.vh-partner.vh-partner .hd__logo svg{width:150px;height:38px;color:var(--blue);}
.vh-partner.vh-partner .hd__nav{display:flex;gap:20px;font-size:14px;font-weight:600;white-space:nowrap;}
.vh-partner.vh-partner .hd__nav a{text-decoration:none;color:var(--ink-2);padding:6px 0;border-bottom:2px solid transparent;}
.vh-partner.vh-partner .hd__nav a:hover{color:var(--blue);}
.vh-partner.vh-partner .hd__nav a[aria-current]{color:var(--ink);border-bottom-color:var(--blue);}
.vh-partner.vh-partner .hd__sp{flex:1;}
.vh-partner.vh-partner .hd__tel{display:flex;align-items:center;gap:8px;text-decoration:none;color:var(--ink);
  font-weight:700;font-size:15px;white-space:nowrap;}
.vh-partner.vh-partner .hd__tel .i{font-size:16px;color:var(--blue);}
.vh-partner.vh-partner .hd__burger{display:none;background:none;border:0;padding:8px;cursor:pointer;}
.vh-partner.vh-partner .hd__burger svg{width:22px;height:22px;fill:var(--ink);}
.vh-partner.vh-partner .btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;
  border:0;border-radius:4px;padding:14px 22px;font-weight:700;font-size:15px;
  text-decoration:none;cursor:pointer;transition:background .15s,border-color .15s;}
.vh-partner.vh-partner .btn .i{font-size:15px;}
.vh-partner.vh-partner .btn{transition:transform .2s cubic-bezier(.2,.9,.25,1),background .18s,box-shadow .2s;}
.vh-partner.vh-partner .btn:active{transform:scale(.97);}
.vh-partner.vh-partner .btn--blue{background:var(--blue);color:#fff;
  box-shadow:0 1px 2px rgba(0,35,245,.24),0 10px 24px -12px rgba(0,35,245,.5);}
.vh-partner.vh-partner .btn--blue:hover{background:var(--blue-d);}
.vh-partner.vh-partner .btn--gh{background:transparent;color:var(--blue);box-shadow:inset 0 0 0 1.5px var(--blue);}
.vh-partner.vh-partner .btn--gh:hover{background:var(--tint);}
.vh-partner.vh-partner .btn--wh{background:#fff;color:var(--blue);}
.vh-partner.vh-partner .btn--wh:hover{background:var(--tint);}
.vh-partner.vh-partner .btn--sm{padding:10px 16px;font-size:14px;}
.vh-partner.vh-partner .btn--lg{padding:17px 30px;font-size:16px;}
/* ================= ПОЛОСА СОГЛАСОВАНИЯ =================
   Слой «Пояснения»: врезки видны только когда согласующий их включил,
   иначе макет читается как готовая страница. Охристая врезка — вопрос
   к клиенту, синяя — объяснение решения. */
.vh-partner.vh-partner .cmp{background:#101119;color:#fff;font-size:13px;}
.vh-partner.vh-partner .cmp__in{display:flex;align-items:center;gap:14px;min-height:46px;flex-wrap:wrap;}
.vh-partner.vh-partner .cmp__label{opacity:.82;}
.vh-partner.vh-partner .cmp__short{display:none;opacity:.82;}
.vh-partner.vh-partner .cmp__sp{flex:1;}
.vh-partner.vh-partner .xbtn{background:transparent;border:1.5px solid rgba(255,255,255,.42);color:#fff;
  border-radius:4px;padding:6px 13px;font-size:13px;font-weight:600;cursor:pointer;}
.vh-partner.vh-partner .xbtn[aria-pressed="true"]{background:#fff;color:#101119;border-color:#fff;}
.vh-partner.vh-partner .x{display:none;margin:16px 0 0;padding:14px 16px;border-left:3px solid var(--sky);
  background:#F2F7FF;border-radius:0 var(--r-sm) var(--r-sm) 0;
  font-size:14px;line-height:1.55;color:var(--ink-2);}
.vh-partner.vh-partner.xon .x{display:block;}
.vh-partner.vh-partner .x b{color:var(--ink);}
.vh-partner.vh-partner .x--ask{border-left-color:var(--warn);background:#FFF8EC;}
.vh-partner.vh-partner .band--dark .x{background:rgba(255,255,255,.08);color:#E6E8F2;border-left-color:var(--sky);}
.vh-partner.vh-partner .band--dark .x b{color:#fff;}
.vh-partner.vh-partner .band--dark .x--ask{background:rgba(255,214,150,.14);border-left-color:#F0B95B;}
.vh-partner.vh-partner .bc{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:13px;
  color:var(--muted);padding:18px 0 22px;}
.vh-partner.vh-partner .bc a{text-decoration:none;}
.vh-partner.vh-partner .bc a:hover{color:var(--blue);}
/* ================= ПОЛОСЫ =================
   Страница собрана лентами во всю ширину, как в присланном рендере:
   светлая обложка, тёмный шаг «как это работает», светлые выгоды.
   Ленты дают ритм и делят короткую страницу на понятные шаги. */
.vh-partner.vh-partner .band{padding:clamp(62px,6.4vw,104px) 0;position:relative;}
/* Якоря не должны уезжать под закреплённую шапку. */
.vh-partner.vh-partner .band, .vh-partner.vh-partner [id]{scroll-margin-top:92px;}
.vh-partner.vh-partner .band--soft{background:var(--bg);}
.vh-partner.vh-partner .band--dark{background:var(--navy);color:#fff;position:relative;overflow:hidden;}
.vh-partner.vh-partner .band--dark h2{color:#fff;}
/* Заголовок крупнее и с плотным трекингом: чем крупнее кегль, тем теснее
   должны стоять буквы, иначе строка рассыпается. Перенос по смыслу, чтобы
   в последней строке не оставалось одного слова. */
.vh-partner.vh-partner .band h2{font-size:clamp(29px,3.1vw,46px);letter-spacing:-.032em;text-wrap:balance;}
.vh-partner.vh-partner .band__sub{color:var(--muted);font-size:16.5px;line-height:1.55;max-width:720px;
  margin-top:12px;text-wrap:pretty;}
.vh-partner.vh-partner .band--dark .band__sub{color:rgba(255,255,255,.72);}
.vh-partner.vh-partner .band__hd{margin-bottom:34px;position:relative;z-index:1;}
/* Надзаголовок секции: точка своего цвета и короткое слово. Даёт странице
   ритм оглавления — читатель понимает, где он, не дочитывая заголовок.
   Цвет берём из дополнительной палитры, у каждой секции свой. */
.vh-partner.vh-partner .eyebrow{display:inline-flex;align-items:center;gap:9px;margin-bottom:14px;
  font-size:12px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;
  color:var(--muted);}
.vh-partner.vh-partner .eyebrow::before{content:"";width:9px;height:9px;border-radius:3px;
  background:var(--c,var(--blue));transform:rotate(45deg);}
.vh-partner.vh-partner .band--dark .eyebrow{color:rgba(255,255,255,.62);}
/* ================= ГЕОМЕТРИЯ =================
   Словарь форм взят у знака компании: скруглённые бруски под 60°, кольца
   и сам знак. Правило одно — фигура всегда целиком внутри своей ленты,
   обрезанная форма читается как ошибка вёрстки, а не как приём. */
.vh-partner.vh-partner .deco{position:absolute;inset:0;z-index:0;pointer-events:none;user-select:none;}
.vh-partner.vh-partner .deco > *, .vh-partner.vh-partner .cluster > *{position:absolute;}
.vh-partner.vh-partner .ring{border-radius:50%;border:1.5px solid var(--c);}
.vh-partner.vh-partner .ring--fat{border-width:38px;}
.vh-partner.vh-partner .sq{border-radius:26%;border:1.5px solid var(--c);transform:rotate(18deg);}
.vh-partner.vh-partner .sq--fill{border:0;background:var(--c);}
.vh-partner.vh-partner .bars{display:block;}
/* Знак компании водяным знаком: три фирменных синих, поэтому не красим
   текстом — пусть работает своей палитрой на малой непрозрачности. */
.vh-partner.vh-partner .mark{display:block;aspect-ratio:352.6/317.1;}
/* Группа фигур: скруглённый квадрат, кольцо и брусок — три элемента знака,
   разнесённые по сетке 210×210. Живёт в правой части строки заголовка:
   это единственное место, пустое во всех лентах и на всех ширинах.
   Ниже 1180 px группы прячем — там колонка сужается и они лезут в текст. */
.vh-partner.vh-partner .cluster{width:210px;height:210px;}
.vh-partner.vh-partner .cluster .sq{width:130px;height:130px;right:0;top:0;}
.vh-partner.vh-partner .cluster .ring{width:88px;height:88px;left:4px;bottom:24px;}
.vh-partner.vh-partner .cluster .bit{width:28px;height:28px;border-radius:9px;left:112px;bottom:2px;
  transform:rotate(18deg);background:var(--c2);}
@media (max-width:1180px){.vh-partner.vh-partner .deco{display:none;}}
/* Слой фигур на обложке выравниваем по контейнеру, а не по окну: иначе при
   сужении экрана проценты уезжают влево и контуры наползают на текст. */
.vh-partner.vh-partner .hero .deco{left:50%;right:auto;width:min(100%,var(--wrap));transform:translateX(-50%);}
@media (max-width:1300px){.vh-partner.vh-partner .hero .deco{display:none;}}
/* Появление блоков при прокрутке: заголовок, следом содержимое. Класс
   вешает наблюдатель; без скрипта и при «уменьшить движение» всё видно
   сразу — анимация не должна быть условием чтения. */
.vh-partner.vh-partner .rise{opacity:0;transform:translateY(18px);}
.vh-partner.vh-partner .rise.is-in{opacity:1;transform:none;
  transition:opacity .55s cubic-bezier(.2,.9,.25,1),transform .55s cubic-bezier(.2,.9,.25,1);}
.vh-partner.vh-partner .rise.is-in.rise--2{transition-delay:.09s;}
@media (prefers-reduced-motion:reduce){.vh-partner.vh-partner .rise, .vh-partner.vh-partner .rise.is-in{opacity:1;transform:none;transition:none;}
.vh-partner.vh-partner .btn:active{transform:none;}}
/* ================= ОБЛОЖКА ================= */
/* Геометрия обложки. Скруглённые квадраты и круг повторяют построение
   знака компании; контуры, а не заливки, — иначе фон начинает спорить
   с текстом. Всё в основном синем, разной прозрачности. */
.vh-partner.vh-partner .hero{position:relative;overflow:hidden;
  padding:0 0 62px;background:linear-gradient(180deg,rgba(255,255,255,.86) 0%,rgba(243,246,255,.9) 100%);}
.vh-partner.vh-partner .hero .wrap{position:relative;z-index:1;}
/* Светлые полосы — полупрозрачные, чтобы подложка страницы была видна. */
.vh-partner.vh-partner .band--soft{background:rgba(247,247,247,.66);}
.vh-partner.vh-partner .band:not(.band--soft):not(.band--dark){background:transparent;}
/* Водяной знак был обрезан краем ленты — теперь стоит целиком, с отступом
   от края, и это знак компании, а не случайная звезда из спрайта. */
.vh-partner.vh-partner #give .wrap{position:relative;z-index:1;}
.vh-partner.vh-partner .hero__grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
  gap:56px;align-items:center;}
.vh-partner.vh-partner .badge{display:inline-block;font-size:12px;font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;color:var(--blue);background:var(--tint);
  border-radius:4px;padding:7px 12px;margin-bottom:22px;}
.vh-partner.vh-partner .hero h2{font-size:clamp(27px,3vw,40px);line-height:1.08;margin-top:14px;text-wrap:balance;}
/* Переносы в заголовке расставлены руками и держатся до 390 px. Ниже строка
   «который пришёл от вас» перестаёт помещаться и роняет вниз одно слово —
   там жёсткие переносы снимаем и даём браузеру разложить строки самому. */
.vh-partner.vh-partner .hero__lead{font-size:clamp(16px,1.4vw,19px);line-height:1.55;color:var(--ink-2);
  max-width:520px;margin-top:20px;}
.vh-partner.vh-partner .hero__lead b{color:var(--ink);}
.vh-partner.vh-partner .hero__li{display:grid;gap:12px;margin-top:26px;}
.vh-partner.vh-partner .hero__li li{display:flex;gap:11px;align-items:center;font-size:15px;color:var(--ink-2);}
.vh-partner.vh-partner .hero__li .i{font-size:19px;color:var(--blue);}
.vh-partner.vh-partner .hero__note{display:flex;gap:8px;align-items:flex-start;margin-top:24px;max-width:520px;
  font-size:13px;line-height:1.5;color:var(--muted);}
.vh-partner.vh-partner .hero__note .i{font-size:15px;margin-top:2px;}
/* Панель со ставкой заменяет фотографию из рендера. Снимка от клиента
   у нас нет, а стоковое лицо на странице про доверие работает против неё. */
.vh-partner.vh-partner .hero__v{position:relative;}
.vh-partner.vh-partner .pct{background:linear-gradient(158deg,var(--blue) 0%,#0016A8 100%);color:#fff;
  border-radius:var(--r-lg);padding:52px 38px 94px;position:relative;overflow:hidden;}
.vh-partner.vh-partner .pct::before{content:"";position:absolute;right:20px;top:22px;width:132px;height:132px;
  border-radius:50%;border:26px solid rgba(255,255,255,.10);}
/* «ВЫПЛАЧИВАЕМ» над числом — по правке: заглавными и жирным. Это не
   украшение, а глагол, без которого «от 10%» ни о чём не говорит. */
.vh-partner.vh-partner .pct__k{font-size:15px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  opacity:.82;margin-bottom:10px;}
.vh-partner.vh-partner .pct__n{font-size:clamp(52px,6vw,84px);font-weight:700;line-height:1;letter-spacing:-.03em;}
.vh-partner.vh-partner .pct__c{font-size:17px;opacity:.9;margin-top:10px;max-width:280px;}
.vh-partner.vh-partner .pct__f{display:flex;gap:9px;align-items:flex-start;margin-top:26px;font-size:13.5px;
  line-height:1.5;opacity:.86;}
.vh-partner.vh-partner .pct__f .i{font-size:16px;margin-top:2px;}
.vh-partner.vh-partner .trust{position:relative;margin:-62px 26px 0;background:#fff;border-radius:var(--r-md);
  padding:20px 24px;box-shadow:0 18px 44px rgba(11,16,48,.14);}
.vh-partner.vh-partner .trust__t{font-size:12.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;
  color:var(--muted);text-align:center;margin-bottom:14px;}
.vh-partner.vh-partner .trust ul{display:flex;flex-wrap:wrap;gap:10px 22px;justify-content:center;}
.vh-partner.vh-partner .trust li{font-size:13.5px;font-weight:600;color:var(--ink-2);display:flex;gap:8px;align-items:center;}
.vh-partner.vh-partner .trust li .i{font-size:15px;color:var(--sky);}
.vh-partner.vh-partner .trust__more{text-align:center;margin-top:12px;font-size:13px;color:var(--muted);}
/* ================= КОМУ ПОДХОДИТ =================
   Блок вернулся из первой версии. Цвет несёт левый край карточки: шесть
   Secondary заливкой неразличимы (02 и 03 отличаются на 18°). */
.vh-partner.vh-partner .who-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;}
.vh-partner.vh-partner .who{background:var(--white);border-radius:24px;padding:26px 26px 26px 27px;
  border:1px solid rgba(228,229,234,.8);border-left:4px solid var(--c);
  box-shadow:0 1px 2px rgba(11,16,48,.04),0 12px 30px -18px rgba(11,16,48,.18);
  transition:transform .3s cubic-bezier(.2,.9,.25,1),box-shadow .3s cubic-bezier(.2,.9,.25,1);}
.vh-partner.vh-partner .who:hover{transform:translateY(-3px);
  box-shadow:0 1px 2px rgba(11,16,48,.05),0 22px 44px -22px rgba(11,16,48,.26);}
/* Метка сегмента красится тем же цветом, что и полоса: одного края мало,
   чтобы шесть карточек читались как шесть разных ситуаций. Все шесть
   Secondary дают на белом больше 4,5:1 — проверяет qa.mjs. */
.vh-partner.vh-partner .who__tag{display:inline-flex;align-items:center;gap:7px;font-size:11.5px;font-weight:700;
  letter-spacing:.07em;text-transform:uppercase;color:var(--ct,var(--muted));margin-bottom:11px;}
.vh-partner.vh-partner .who__tag::before{content:"";width:7px;height:7px;border-radius:2px;
  background:var(--c);transform:rotate(45deg);}
.vh-partner.vh-partner .who h3{font-size:17px;margin-bottom:8px;}
.vh-partner.vh-partner .who p{font-size:14px;color:var(--ink-2);}
.vh-partner.vh-partner .who ul{margin-top:14px;display:grid;gap:7px;}
.vh-partner.vh-partner .who li{font-size:13.5px;color:var(--muted);padding-left:16px;position:relative;}
.vh-partner.vh-partner .who li::before{content:"";position:absolute;left:0;top:8px;width:6px;height:6px;
  border-radius:50%;background:var(--c);}
/* ================= СКОЛЬКО ЗАРАБАТЫВАЕТ ПАРТНЁР ================= */
.vh-partner.vh-partner .earn{background:linear-gradient(158deg,var(--blue) 0%,#0016A8 100%);color:#fff;
  border-radius:var(--r-lg);padding:clamp(36px,5vw,62px) clamp(22px,4vw,56px);
  position:relative;overflow:hidden;text-align:center;}
/* Фигуры стоят в пустых третях карточки — содержимое центрировано и уже
   620 px, по краям места хватает. За край не выходят: обрезанное кольцо
   читается как ошибка, а не как приём. */
.vh-partner.vh-partner .earn::before{content:"";position:absolute;left:6%;top:50%;width:158px;height:158px;
  transform:translateY(-50%);border-radius:50%;border:30px solid rgba(255,255,255,.09);}
.vh-partner.vh-partner .earn::after{content:"";position:absolute;right:6%;top:50%;width:138px;height:138px;
  border-radius:36px;border:1.5px solid rgba(255,255,255,.34);
  transform:translateY(-50%) rotate(18deg);}
.vh-partner.vh-partner .earn__mark{position:absolute;right:calc(6% + 168px);top:calc(50% - 74px);width:62px;opacity:.34;}
.vh-partner.vh-partner .earn__mark path{fill:#fff;}
@media (max-width:1180px){.vh-partner.vh-partner .earn::before, .vh-partner.vh-partner .earn::after, .vh-partner.vh-partner .earn__mark{display:none;}}
.vh-partner.vh-partner .earn__in{position:relative;z-index:1;}
.vh-partner.vh-partner .earn__t{font-size:14px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;opacity:.8;}
.vh-partner.vh-partner .earn__n{font-size:clamp(42px,6.4vw,80px);font-weight:700;line-height:1.02;
  letter-spacing:-.035em;margin:14px 0 10px;}
.vh-partner.vh-partner .earn__c{font-size:16.5px;line-height:1.55;opacity:.9;max-width:620px;margin:0 auto;}
.vh-partner.vh-partner .earn .btn{margin-top:30px;}
/* ================= ГЕОГРАФИЯ =================
   Актуальные контуры OSM: область и Москва с присоединёнными территориями.
   Оба пути построены в одной проекции; муниципальные границы не нужны.

   Первая версия блока ставила карту и три строки текста прямо на ленту,
   и вокруг силуэта оставалась дыра в пол-экрана: карта высокая, текст
   короткий, выровнять их было нечем. Теперь это одна карточка: слева
   тонированная панель, где пустота вокруг контура читается как поле
   карты, справа колонка с текстом и кнопкой, которая эту высоту добирает. */
.vh-partner.vh-partner .geo{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,1fr);
  background:var(--white);border:1px solid rgba(228,229,234,.8);border-radius:32px;
  overflow:hidden;
  box-shadow:0 1px 2px rgba(11,16,48,.04),0 28px 64px -36px rgba(11,16,48,.36);}
.vh-partner.vh-partner .geo__panel{position:relative;display:grid;place-items:center;
  padding:clamp(22px,2.4vw,32px);
  background:linear-gradient(158deg,#F1F8FF 0%,#E8F0FF 62%,#EDF3FF 100%);}
/* Кольцо за контуром: даёт панели центр, к которому силуэт привязан. */
.vh-partner.vh-partner .geo__panel::before{content:"";position:absolute;left:50%;top:48%;
  width:min(92%,480px);aspect-ratio:1;transform:translate(-50%,-50%);
  border-radius:50%;border:1.5px solid rgba(0,35,245,.09);}
.vh-partner.vh-partner .geo__map{position:relative;width:100%;max-width:520px;height:auto;display:block;}
.vh-partner.vh-partner .geo__legend{position:absolute;left:clamp(16px,2vw,26px);bottom:clamp(38px,3.5vw,46px);
  display:flex;flex-wrap:wrap;gap:8px 18px;
  background:rgba(255,255,255,.84);border-radius:14px;padding:11px 15px;
  -webkit-backdrop-filter:saturate(180%) blur(14px);backdrop-filter:saturate(180%) blur(14px);
  font-size:13px;font-weight:600;color:var(--ink-2);
  box-shadow:0 10px 26px -16px rgba(11,16,48,.45);}
.vh-partner.vh-partner .geo__credit{position:absolute;left:26px;bottom:12px;font-size:10px;color:var(--ink-2);}
.vh-partner.vh-partner .geo__credit a{color:inherit;text-decoration:underline;}
.vh-partner.vh-partner .geo__legend span{display:inline-flex;align-items:center;gap:8px;}
.vh-partner.vh-partner .geo__legend i{width:11px;height:11px;border-radius:4px;background:var(--c);}
.vh-partner.vh-partner .geo__txt{padding:clamp(26px,3vw,48px);display:flex;flex-direction:column;
  align-items:flex-start;justify-content:center;}
.vh-partner.vh-partner .geo__txt h2{max-width:15ch;}
.vh-partner.vh-partner .geo__txt .band__sub{margin-top:14px;}
.vh-partner.vh-partner .geo__obl{fill:rgba(158,220,255,.55);stroke:rgba(0,35,245,.34);stroke-width:2.4;
  stroke-linejoin:round;}
.vh-partner.vh-partner .geo__msk{fill:var(--blue);}
.vh-partner.vh-partner .geo__lbl line{stroke:var(--blue);stroke-width:3;}
.vh-partner.vh-partner .geo__lbl rect{fill:#fff;stroke:rgba(0,35,245,.22);stroke-width:2;}
.vh-partner.vh-partner .geo__lbl text{font:700 30px Mont,Arial,Helvetica,sans-serif;fill:var(--blue);}
.vh-partner.vh-partner .geo__li{display:grid;gap:12px;margin-top:26px;margin-bottom:30px;}
.vh-partner.vh-partner .geo__li li{display:flex;gap:12px;align-items:flex-start;font-size:15.5px;color:var(--ink-2);}
.vh-partner.vh-partner .geo__li .i{font-size:19px;color:var(--c,var(--blue));margin-top:2px;}
/* ================= ОТЗЫВЫ ПАРТНЁРОВ =================
   Карточки заполнены примерами: имена, цитаты и цифры придуманы. По правке
   пометки с самой страницы сняты, предупреждение осталось в пояснениях. */
.vh-partner.vh-partner .revs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;}
.vh-partner.vh-partner .rev{background:var(--white);border-radius:24px;padding:26px;
  border:1px solid rgba(228,229,234,.8);
  box-shadow:0 1px 2px rgba(11,16,48,.04),0 12px 30px -18px rgba(11,16,48,.18);
  display:flex;flex-direction:column;gap:15px;}
.vh-partner.vh-partner .rev__hd{display:flex;gap:12px;align-items:center;}
/* Аватар — инициалы, а не фотография. Стоковое лицо под выдуманным именем
   выглядит как настоящий человек, и заглушку перестают читать заглушкой. */
.vh-partner.vh-partner .rev__av{width:44px;height:44px;border-radius:50%;flex:none;display:flex;
  align-items:center;justify-content:center;font-weight:700;font-size:14.5px;
  color:#fff;background:var(--c);letter-spacing:.02em;}
.vh-partner.vh-partner .rev__n{font-size:15px;font-weight:700;}
.vh-partner.vh-partner .rev__r{font-size:13px;color:var(--muted);margin-top:2px;}
.vh-partner.vh-partner .rev p{font-size:14px;color:var(--ink-2);flex:1;}
.vh-partner.vh-partner .rev__ft{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding-top:15px;
  border-top:1px solid var(--line);font-size:12.5px;color:var(--muted);}
.vh-partner.vh-partner .rev__pill{background:rgba(87,149,117,.16);color:#2C6A4E;border-radius:20px;
  padding:4px 11px;font-weight:700;}
/* ================= БАННЕР С РУКОВОДИТЕЛЕМ ================= */
.vh-partner.vh-partner .lead{background:var(--white);border:1px solid rgba(228,229,234,.8);
  border-radius:var(--r-lg);overflow:hidden;
  display:grid;grid-template-columns:minmax(0,1fr) 430px;
  box-shadow:0 1px 2px rgba(11,16,48,.04),0 24px 54px -32px rgba(11,16,48,.32);}
.vh-partner.vh-partner .lead__in{padding:clamp(26px,3.4vw,48px);display:flex;flex-direction:column;
  align-items:flex-start;gap:18px;}
.vh-partner.vh-partner .lead h1{font-size:clamp(28px,3.2vw,46px);line-height:1.12;letter-spacing:-.026em;text-wrap:balance;}
.vh-partner.vh-partner .lead-intro{padding-top:0;}
.vh-partner.vh-partner .lead-intro .badge{margin-bottom:0;}
.vh-partner.vh-partner .lead__actions{display:flex;flex-wrap:wrap;gap:10px;}
.vh-partner.vh-partner .lead__ul{display:flex;flex-wrap:wrap;gap:9px;}
.vh-partner.vh-partner .lead__ul li{display:inline-flex;align-items:center;gap:8px;background:var(--bg);
  border-radius:30px;padding:8px 15px;font-size:14px;font-weight:600;color:var(--ink-2);}
.vh-partner.vh-partner .lead__ul .i{font-size:15px;color:var(--s4);}
.vh-partner.vh-partner .lead__p{font-size:15.5px;color:var(--ink-2);max-width:520px;}
.vh-partner.vh-partner .lead__ph{position:relative;background:#E7EDF1;min-height:100%;}
.vh-partner.vh-partner .lead__ph img{width:100%;height:100%;object-fit:cover;object-position:50% 12%;}
.vh-partner.vh-partner .lead__pct{position:absolute;left:-28px;top:36px;background:var(--blue);color:#fff;
  border-radius:var(--r-md);padding:14px 18px;max-width:186px;
  box-shadow:0 18px 36px -18px rgba(0,35,245,.7);}
.vh-partner.vh-partner .lead__pct b{display:block;font-size:27px;line-height:1;letter-spacing:-.02em;}
.vh-partner.vh-partner .lead__pct span{display:block;font-size:12px;line-height:1.35;opacity:.88;margin-top:6px;}
.vh-partner.vh-partner .lead__cap{position:absolute;left:16px;right:16px;bottom:16px;
  background:rgba(255,255,255,.9);border-radius:var(--r-sm);padding:11px 14px;
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  font-size:12.5px;line-height:1.4;color:var(--ink-2);}
.vh-partner.vh-partner .lead__cap b{display:block;color:var(--ink);font-size:13.5px;margin-bottom:2px;}
/* ================= КАК ЭТО РАБОТАЕТ ================= */
/* Ширина — общая, как у всех блоков. Отдельная широкая полоса выбивалась
   из колонки, и страница переставала читаться как одна страница. */
/* Появление шагов: сначала кружок со значком, следом текст, и одновременно
   прочерчивается пунктир к следующему шагу. */
.vh-partner.vh-partner .steps--anim .step{opacity:0;transform:translateY(14px);}
.vh-partner.vh-partner .steps--anim.is-in .step{opacity:1;transform:none;
  transition:opacity .5s cubic-bezier(.2,.9,.25,1),transform .5s cubic-bezier(.2,.9,.25,1);}
.vh-partner.vh-partner .steps--anim.is-in .step:nth-child(2){transition-delay:.12s;}
.vh-partner.vh-partner .steps--anim.is-in .step:nth-child(3){transition-delay:.24s;}
.vh-partner.vh-partner .steps--anim .step__ic::after{transform:scaleX(0);transform-origin:left center;}
.vh-partner.vh-partner .steps--anim.is-in .step__ic::after{transform:scaleX(1);
  transition:transform .7s cubic-bezier(.2,.9,.25,1) .25s;}
.vh-partner.vh-partner .steps--anim.is-in .step:nth-child(2) .step__ic::after{transition-delay:.45s;}
@media (prefers-reduced-motion:reduce){.vh-partner.vh-partner .steps--anim .step, .vh-partner.vh-partner .steps--anim .step__ic::after{opacity:1;transform:none;transition:none;}}
.vh-partner.vh-partner .steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:34px;
  position:relative;z-index:1;}
.vh-partner.vh-partner .step{position:relative;}
/* Свой цвет каждому шагу — по порядку дополнительной палитры. На тёмной
   полосе цвета берём заливкой кружка: текстом они на #0B1030 не читаются. */
.vh-partner.vh-partner .step__ic{width:56px;height:56px;border-radius:50%;background:rgba(255,255,255,.1);
  display:flex;align-items:center;justify-content:center;margin-bottom:22px;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.16);}
.vh-partner.vh-partner .step__ic .i{font-size:24px;color:#fff;}
.vh-partner.vh-partner .step:nth-child(1) .step__ic{background:var(--s2);box-shadow:0 0 0 8px rgba(80,128,155,.16);}
.vh-partner.vh-partner .step:nth-child(2) .step__ic{background:var(--s3);box-shadow:0 0 0 8px rgba(92,133,144,.16);}
.vh-partner.vh-partner .step:nth-child(3) .step__ic{background:var(--s4);box-shadow:0 0 0 8px rgba(87,149,117,.16);}
/* Пунктирная стрелка между шагами — как в рендере. На планшете и телефоне
   колонки схлопываются, и стрелка становится вертикальной подсказкой. */
.vh-partner.vh-partner .step__ic::after{content:"";position:absolute;left:80px;top:27px;right:-24px;
  border-top:1.5px dashed rgba(255,255,255,.26);}
.vh-partner.vh-partner .step:last-child .step__ic::after{display:none;}
.vh-partner.vh-partner .step__n{font-size:22px;font-weight:700;color:var(--sky);line-height:1;}
/* Номер — в тон своему кружку. На тёмной полосе все три дают больше 4:1
   при пороге 3 для крупного жирного текста. */
.vh-partner.vh-partner .step:nth-child(1) .step__n{color:#7FA3C0;}
.vh-partner.vh-partner .step:nth-child(2) .step__n{color:#7FAFB8;}
.vh-partner.vh-partner .step:nth-child(3) .step__n{color:#7FBB9C;}
.vh-partner.vh-partner .step h3{font-size:19px;margin:12px 0 8px;}
.vh-partner.vh-partner .step p{font-size:14.5px;color:rgba(255,255,255,.74);}
/* ================= ЧТО ВЫ ПОЛУЧАЕТЕ ================= */
.vh-partner.vh-partner .gives{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;}
/* Волосяная рамка и мягкая многослойная тень: карточка отделена от фона,
   но не «висит» над ним. */
.vh-partner.vh-partner .give{background:var(--white);border-radius:24px;padding:28px 26px;
  border:1px solid rgba(228,229,234,.8);
  box-shadow:0 1px 2px rgba(11,16,48,.04),0 12px 30px -18px rgba(11,16,48,.18);
  transition:transform .3s cubic-bezier(.2,.9,.25,1),box-shadow .3s cubic-bezier(.2,.9,.25,1);}
.vh-partner.vh-partner .give:hover{transform:translateY(-3px);
  box-shadow:0 1px 2px rgba(11,16,48,.05),0 22px 44px -22px rgba(11,16,48,.26);}
/* Четыре карточки — четыре цвета палитры. Заливка 12%, знак в полном
   цвете: так карточки различаются, а страница не становится пёстрой. */
.vh-partner.vh-partner .give__ic{width:44px;height:44px;border-radius:var(--r-sm);background:var(--tint);
  display:flex;align-items:center;justify-content:center;margin-bottom:18px;}
.vh-partner.vh-partner .give__ic .i{font-size:21px;color:var(--blue);}
.vh-partner.vh-partner .give:nth-child(1) .give__ic{background:rgba(103,120,152,.14);}
.vh-partner.vh-partner .give:nth-child(1) .give__ic .i{color:var(--s1);}
.vh-partner.vh-partner .give:nth-child(2) .give__ic{background:rgba(92,133,144,.14);}
.vh-partner.vh-partner .give:nth-child(2) .give__ic .i{color:var(--s3);}
.vh-partner.vh-partner .give:nth-child(3) .give__ic{background:rgba(87,149,117,.14);}
.vh-partner.vh-partner .give:nth-child(3) .give__ic .i{color:var(--s4);}
.vh-partner.vh-partner .give:nth-child(4) .give__ic{background:rgba(155,136,108,.14);}
.vh-partner.vh-partner .give:nth-child(4) .give__ic .i{color:var(--s6);}
.vh-partner.vh-partner .give h3{font-size:16.5px;margin-bottom:7px;}
.vh-partner.vh-partner .give p{font-size:14px;color:var(--ink-2);}
/* ================= КАЛЬКУЛЯТОР =================
   Вернулся по созвону 03.09: клиент хочет, чтобы партнёр видел свои деньги
   до заявки, а не считал в уме. Ставка одна — 10%; выбор влияет только
   на цену услуги и число сделок за год. Тиров 10/15% здесь нет: это
   гипотеза, отдельно не утверждённая. */
.vh-partner.vh-partner .calc{background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);
  overflow:hidden;}
.vh-partner.vh-partner .calc__grid{display:grid;grid-template-columns:minmax(0,1fr) 400px;}
.vh-partner.vh-partner .calc__in{padding:28px;display:flex;flex-direction:column;}
.vh-partner.vh-partner .calc__in > .fld:last-child{flex:1;display:flex;flex-direction:column;}
.vh-partner.vh-partner .calc__out{background:var(--navy);color:#fff;padding:28px;
  display:flex;flex-direction:column;gap:18px;}
.vh-partner.vh-partner .fld{margin-bottom:20px;}
.vh-partner.vh-partner .fld__lab{display:block;font-size:12.5px;font-weight:600;color:var(--muted);
  text-transform:uppercase;letter-spacing:.03em;margin-bottom:8px;}
.vh-partner.vh-partner .seg{display:inline-flex;background:var(--bg);border-radius:4px;padding:3px;gap:3px;flex-wrap:wrap;}
.vh-partner.vh-partner .seg button{background:none;border:0;border-radius:3px;padding:9px 17px;font-size:14px;
  font-weight:600;color:var(--ink-2);cursor:pointer;}
.vh-partner.vh-partner .seg button[aria-pressed="true"]{background:var(--blue);color:#fff;}
.vh-partner.vh-partner .chips{display:flex;flex-wrap:wrap;gap:8px;}
.vh-partner.vh-partner .chip{background:var(--bg);border:1.5px solid transparent;border-radius:4px;padding:9px 14px;
  font-size:14px;font-weight:600;color:var(--ink-2);cursor:pointer;
  display:inline-flex;align-items:center;gap:9px;
  transition:transform .2s cubic-bezier(.2,.9,.25,1),border-color .18s,background .18s;}
.vh-partner.vh-partner .chip:hover{transform:translateY(-1px);}
.vh-partner.vh-partner .chip:hover{border-color:var(--line-2);}
.vh-partner.vh-partner .chip[aria-pressed="true"]{background:var(--tint);border-color:var(--blue);color:var(--blue);}
.vh-partner.vh-partner .calc__row{display:flex;justify-content:space-between;gap:14px;font-size:14px;
  padding-bottom:14px;border-bottom:1px solid rgba(255,255,255,.16);}
.vh-partner.vh-partner .calc__row span:first-child{opacity:.78;}
.vh-partner.vh-partner .calc__row b{white-space:nowrap;}
/* По правке 04.09 акценты поменялись местами: сумма с одного договора
   стала мельче, годовая — крупнее. Партнёр принимает решение по году. */
.vh-partner.vh-partner .calc__big{font-size:14px;}
.vh-partner.vh-partner .calc__sum{font-size:clamp(28px,3.2vw,40px);font-weight:700;line-height:1.1;margin-top:6px;letter-spacing:-.02em;}
.vh-partner.vh-partner .calc__year{background:rgba(255,255,255,.09);border-radius:var(--r-md);padding:18px;font-size:13px;}
.vh-partner.vh-partner .calc__year > span{opacity:.78;}
.vh-partner.vh-partner .calc__year b{display:block;font-size:26px;line-height:1.15;margin-top:4px;}
/* «Без учёта НДС» — не мелкий шрифт под столом: это первое, что спросит
   бухгалтерия партнёра. Держим читаемым, не приглушаем до серого. */
.vh-partner.vh-partner .calc__note{font-size:12.5px;opacity:.8;line-height:1.5;}
.vh-partner.vh-partner .calc__hint{margin-top:auto;padding-top:20px;font-size:13px;line-height:1.5;color:var(--muted);}
.vh-partner.vh-partner .calc__note b{color:#fff;}
.vh-partner.vh-partner .calc__out .btn{width:100%;}
/* ================= ФОРМА ================= */
/* Плитка направления со значком — как в первой версии: значок помогает
   найти нужное направление быстрее, чем чтение семи подписей подряд. */
.vh-partner.vh-partner .chip .i{font-size:16px;flex:none;}
/* Количество сделок карточками. В первой версии на их месте стояли
   проценты растущей ставки; ставка одна, поэтому карточка объясняет
   не процент, а частоту — и показывает, что получится за год. */
.vh-partner.vh-partner .tiers{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;}
.vh-partner.vh-partner .tier{background:var(--bg);border:1.5px solid transparent;border-radius:var(--r-sm);
  padding:13px 14px;text-align:left;cursor:pointer;font:inherit;
  transition:transform .2s cubic-bezier(.2,.9,.25,1),border-color .18s,background .18s;}
.vh-partner.vh-partner .tier:hover{border-color:var(--line-2);transform:translateY(-2px);}
.vh-partner.vh-partner .tier[aria-pressed="true"]{background:var(--tint);border-color:var(--blue);}
.vh-partner.vh-partner .tier b{display:block;font-size:20px;color:var(--blue);line-height:1.1;}
.vh-partner.vh-partner .tier span{display:block;margin-top:5px;font-size:12.5px;color:var(--muted);line-height:1.35;}
@media (max-width:900px){.vh-partner.vh-partner .tiers{grid-template-columns:repeat(2,minmax(0,1fr));}}
/* Форма — две колонки, как в первой версии: слева синяя панель с обещанием,
   справа поля. Узкая карточка второй версии выглядела формой обратного
   звонка, а не заявкой на партнёрство. */
.vh-partner.vh-partner .form__grid{display:grid;grid-template-columns:340px minmax(0,1fr);}
.vh-partner.vh-partner .form__side{background:var(--blue);color:#fff;padding:32px;display:flex;flex-direction:column;gap:16px;}
/* Знак в панели формы: середина колонки пустовала, а обещания прижаты
   к низу. Красим в белый — своя синяя палитра знака на синем не видна. */
.vh-partner.vh-partner .form__side{position:relative;}
.vh-partner.vh-partner .form__side > *{position:relative;z-index:1;}
/* Знак — фон панели, а не её содержимое: правило ниже соседнего, иначе
   position:relative от «.form__side > *» выигрывает по порядку и знак
   встаёт в поток, отодвигая заголовок на треть колонки. */
.vh-partner.vh-partner .form__side .form__mark{position:absolute;z-index:0;right:24px;top:44%;width:188px;opacity:.15;}
.vh-partner.vh-partner .form__side .form__mark path{fill:#fff;}
.vh-partner.vh-partner .form__side h2{font-size:26px;color:#fff;}
.vh-partner.vh-partner .form__side p{font-size:15px;opacity:.9;}
.vh-partner.vh-partner .form__side ul{display:grid;gap:10px;margin-top:auto;font-size:14px;}
.vh-partner.vh-partner .form__side li{display:flex;gap:10px;align-items:flex-start;}
.vh-partner.vh-partner .form__side li .i{font-size:16px;margin-top:3px;opacity:.9;flex:none;}
.vh-partner.vh-partner .form__body{padding:32px;display:grid;}
.vh-partner.vh-partner .form__body > form, .vh-partner.vh-partner .form__ok{grid-area:1 / 1;min-width:0;}
.vh-partner.vh-partner .form__row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;}
@media (max-width:900px){.vh-partner.vh-partner .form__grid{grid-template-columns:1fr;}
.vh-partner.vh-partner .form__row{grid-template-columns:1fr;gap:0;}
.vh-partner.vh-partner .form__side{padding:24px;}
.vh-partner.vh-partner .form__body{padding:24px;}}
.vh-partner.vh-partner .join{display:grid;grid-template-columns:minmax(0,1fr) 480px;gap:56px;align-items:center;}
.vh-partner.vh-partner .join h2{margin-bottom:16px;}
.vh-partner.vh-partner .join__lead{font-size:16px;color:var(--ink-2);max-width:440px;}
.vh-partner.vh-partner .join__li{display:grid;gap:13px;margin-top:26px;}
.vh-partner.vh-partner .join__li li{display:flex;gap:11px;align-items:center;font-size:14.5px;color:var(--ink-2);}
.vh-partner.vh-partner .join__li .i{font-size:18px;color:var(--blue);}
/* Поля у карточки нет: синяя панель должна доходить до края и до
   скругления. Внутренние отступы живут у половин — .form__side и .form__body. */
.vh-partner.vh-partner .form{background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;
  box-shadow:0 20px 50px rgba(11,16,48,.07);}
.vh-partner.vh-partner .form h3{font-size:21px;margin-bottom:22px;}
.vh-partner.vh-partner .form__f{margin-bottom:16px;}
.vh-partner.vh-partner .form__f label{display:block;font-size:13px;font-weight:600;color:var(--muted);margin-bottom:7px;}
.vh-partner.vh-partner .form__f label i{font-style:normal;color:#c0392b;}
.vh-partner.vh-partner input, .vh-partner.vh-partner textarea, .vh-partner.vh-partner select{font:inherit;color:var(--ink);background:var(--white);
  border:1.5px solid var(--line-2);border-radius:4px;padding:13px 14px;width:100%;}
.vh-partner.vh-partner input:focus, .vh-partner.vh-partner textarea:focus, .vh-partner.vh-partner select:focus{outline:2px solid var(--blue);outline-offset:1px;border-color:var(--blue);}
.vh-partner.vh-partner .form__f.bad select{border-color:#c0392b;}
.vh-partner.vh-partner .form__err{display:none;font-size:12.5px;color:#c0392b;margin-top:6px;}
.vh-partner.vh-partner .form__f.bad input{border-color:#c0392b;}
.vh-partner.vh-partner .form__f.bad .form__err{display:block;}
.vh-partner.vh-partner .agree{display:flex;gap:11px;align-items:flex-start;font-size:13px;color:var(--muted);line-height:1.45;}
.vh-partner.vh-partner .agree input{width:18px;height:18px;flex:none;margin-top:2px;padding:0;}
.vh-partner.vh-partner .form .btn{width:100%;margin-top:6px;}
.vh-partner.vh-partner .form__safe{display:flex;gap:8px;align-items:center;justify-content:center;
  margin-top:14px;font-size:12.5px;color:var(--muted);}
/* Кому платим — под кнопкой, а не в подвале мелким: самозанятый статус
   партнёр оформляет заранее, и узнать об этом после заявки поздно. */
.vh-partner.vh-partner .form__pay{margin-top:14px;font-size:13px;line-height:1.5;color:var(--ink-2);
  background:var(--tint);border-radius:var(--r-sm);padding:12px 14px;}
.vh-partner.vh-partner .form__pay b{color:var(--ink);}
.vh-partner.vh-partner .form__safe .i{font-size:14px;}
.vh-partner.vh-partner .form__body > form{transition:opacity .22s ease,transform .22s ease,visibility .22s;}
.vh-partner.vh-partner .form__ok{display:block;visibility:hidden;opacity:0;transform:translateY(8px);align-self:start;
  text-align:center;padding:0 10px;
  transition:opacity .28s ease .12s,transform .28s ease .12s,visibility .28s .12s;}
.vh-partner.vh-partner .form__ok .i{font-size:44px;color:var(--ok);}
.vh-partner.vh-partner .form__ok h3{font-size:21px;margin:14px 0 8px;}
.vh-partner.vh-partner .form__ok p{color:var(--ink-2);font-size:15px;}
.vh-partner.vh-partner .form.sent form{display:block;visibility:hidden;opacity:0;transform:translateY(-8px);pointer-events:none;}
.vh-partner.vh-partner .form.sent .form__ok{visibility:visible;opacity:1;transform:none;}
@media(prefers-reduced-motion:reduce){.vh-partner.vh-partner .form__body > form, .vh-partner.vh-partner .form__ok{transition:none;transform:none;}}
/* ================= FAQ ================= */
.vh-partner.vh-partner .faq{background:var(--white);border:1px solid rgba(228,229,234,.8);border-radius:20px;
  box-shadow:0 1px 2px rgba(11,16,48,.04);transition:box-shadow .25s;}
.vh-partner.vh-partner .faq:has(.faq__q[aria-expanded="true"]){box-shadow:0 10px 30px -18px rgba(11,16,48,.3);}
.vh-partner.vh-partner .faq__q[aria-expanded="true"] .i{color:var(--s2);}
.vh-partner.vh-partner .faq+.faq{margin-top:10px;}
.vh-partner.vh-partner .faq__q{display:flex;align-items:center;gap:16px;width:100%;background:none;border:0;
  padding:20px 24px;cursor:pointer;text-align:left;font-size:16px;font-weight:600;color:var(--ink);}
.vh-partner.vh-partner .faq__q span{flex:1;}
.vh-partner.vh-partner .faq__q .i{font-size:16px;color:var(--muted);transition:transform .18s;}
.vh-partner.vh-partner .faq__q[aria-expanded="true"] .i{transform:rotate(180deg);}
.vh-partner.vh-partner .faq__a{display:none;padding:0 24px 22px;font-size:14.5px;color:var(--ink-2);max-width:900px;}
.vh-partner.vh-partner .faq__q[aria-expanded="true"]+.faq__a{display:block;}
/* ================= ПРОМО-БЛОК ДЛЯ ПОСАДОЧНЫХ ================= */
/* Варианты промо-блоков. Каждый показан внутри макета страницы услуги:
   серые полоски — это текст той страницы, а не элемент оформления. */
.vh-partner.vh-partner .vars{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;}
.vh-partner.vh-partner .var{margin:0;background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);
  overflow:hidden;box-shadow:0 18px 44px -22px rgba(11,16,48,.28);}
.vh-partner.vh-partner .var__cap{padding:18px 20px 14px;border-bottom:1px solid var(--line);}
.vh-partner.vh-partner .var__n{display:inline-block;font-size:11.5px;font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;color:var(--blue);background:var(--tint);border-radius:4px;
  padding:5px 9px;margin-bottom:9px;}
.vh-partner.vh-partner .var__cap b{display:block;font-size:16px;}
.vh-partner.vh-partner .var__w{display:block;margin-top:5px;font-size:13px;color:var(--muted);line-height:1.45;}
.vh-partner.vh-partner .var__page{padding:18px;background:#F4F5F8;}
.vh-partner.vh-partner .var__side{display:grid;grid-template-columns:minmax(0,1fr) 190px;gap:16px;align-items:start;}
.vh-partner.vh-partner .var__txt{display:grid;gap:8px;}
.vh-partner.vh-partner .var__txt i{display:block;height:9px;border-radius:5px;background:#E2E4EA;}
.vh-partner.vh-partner .var__txt i:nth-child(2){width:92%}
.vh-partner.vh-partner .var__txt i:nth-child(3){width:97%}
.vh-partner.vh-partner .var__txt i:nth-child(4){width:74%}
.vh-partner.vh-partner .var__h{height:15px;width:56%;border-radius:6px;background:#D5D8E0;}
.vh-partner.vh-partner .var .promo{padding:20px 22px;border-radius:var(--r-md);}
.vh-partner.vh-partner .var .promo h3{font-size:18px;}
.vh-partner.vh-partner .var .promo p{font-size:13.5px;}
.vh-partner.vh-partner .var .promo--card{max-width:none;}
.vh-partner.vh-partner .var .promo--card h3{font-size:16px;}
.vh-partner.vh-partner .var .promo--card p{font-size:13px;}
.vh-partner.vh-partner .var .promo--card .btn{margin-top:12px;padding:10px 14px;font-size:13.5px;}
@media (max-width:900px){.vh-partner.vh-partner .vars{grid-template-columns:1fr;}
.vh-partner.vh-partner .var__side{grid-template-columns:1fr;}}
.vh-partner.vh-partner .demo{background:#EEF0F4;border:1px dashed var(--line-2);border-radius:var(--r-lg);padding:26px;}
.vh-partner.vh-partner .demo__cap{font-size:13px;color:var(--muted);margin-bottom:16px;}
.vh-partner.vh-partner .promo{background:var(--blue);color:#fff;border-radius:var(--r-md);padding:26px 28px;
  display:flex;align-items:center;gap:26px;flex-wrap:wrap;}
.vh-partner.vh-partner .promo__t{flex:1;min-width:260px;}
.vh-partner.vh-partner .promo h3{font-size:22px;margin-bottom:6px;}
.vh-partner.vh-partner .promo p{font-size:14.5px;opacity:.9;}
.vh-partner.vh-partner .promo--card{display:block;max-width:340px;}
.vh-partner.vh-partner .promo--card h3{font-size:19px;}
.vh-partner.vh-partner .promo--card .btn{margin-top:16px;width:100%;}
/* ================= ПОДВАЛ ================= */
.vh-partner.vh-partner .ft{background:#1B1D22;color:#fff;padding:38px 0 26px;}
.vh-partner.vh-partner .ft__grid{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:34px;}
.vh-partner.vh-partner .ft h4{font-size:15px;margin-bottom:14px;}
.vh-partner.vh-partner .ft ul{display:grid;gap:9px;font-size:14px;}
.vh-partner.vh-partner .ft a{text-decoration:none;color:#fff;opacity:.78;}
.vh-partner.vh-partner .ft a:hover{opacity:1;}
/* Решение созвона 27.08: пункт в колонке «Компания» подсвечен осветлённым
   фоном, чтобы партнёрку было заметно среди девяти соседей. */
.vh-partner.vh-partner .ft__hi{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.14);
  border-radius:4px;padding:7px 12px;font-weight:700;opacity:1;}
.vh-partner.vh-partner .ft__hi .i{font-size:14px;}
.vh-partner.vh-partner .ft__c{font-size:14px;display:grid;gap:12px;opacity:.86;}
.vh-partner.vh-partner .ft__c a{opacity:1;}
.vh-partner.vh-partner .ft__legal{margin-top:28px;padding-top:18px;border-top:1px solid rgba(255,255,255,.14);
  font-size:12.5px;opacity:.6;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;}
/* Липкая кнопка на телефоне: 70–75% посещений сайта — мобильные,
   а форма живёт внизу страницы. */
.vh-partner.vh-partner .sticky{display:none;position:fixed;left:0;right:0;bottom:0;z-index:40;
  background:rgba(255,255,255,.96);border-top:1px solid var(--line);padding:10px 16px;
  backdrop-filter:blur(6px);}
.vh-partner.vh-partner .sticky .btn{width:100%;}
/* Кому анимация мешает — тому её нет. */
@media (prefers-reduced-motion:reduce){.vh-partner.vh-partner *, .vh-partner.vh-partner *::before, .vh-partner.vh-partner *::after{transition-duration:.01ms!important;animation-duration:.01ms!important;}}
/* ================= АДАПТИВ ================= */
@media (max-width:1180px){.vh-partner.vh-partner .hd__nav{gap:14px;font-size:13px;}
.vh-partner.vh-partner .join{grid-template-columns:minmax(0,1fr) 400px;gap:36px;}
.vh-partner.vh-partner .gives{grid-template-columns:repeat(2,minmax(0,1fr));}
.vh-partner.vh-partner .who-grid, .vh-partner.vh-partner .revs{grid-template-columns:repeat(2,minmax(0,1fr));}
.vh-partner.vh-partner .lead{grid-template-columns:minmax(0,1fr) 360px;}}
@media (max-width:980px){.vh-partner.vh-partner .hero__grid{grid-template-columns:1fr;gap:36px;}
.vh-partner.vh-partner .hero__v{max-width:520px;}
.vh-partner.vh-partner .join{grid-template-columns:1fr;gap:32px;}
.vh-partner.vh-partner .calc__grid{grid-template-columns:1fr;}
.vh-partner.vh-partner .hd__nav, .vh-partner.vh-partner .hd__tel{display:none;}
.vh-partner.vh-partner .hd__burger{display:block;}
.vh-partner.vh-partner .ft__grid{grid-template-columns:1fr 1fr;}
/* Шаги в колонку: горизонтальная стрелка между ними больше не нужна. */
.vh-partner.vh-partner .steps{grid-template-columns:1fr;gap:24px;}
.vh-partner.vh-partner .step__ic{margin-bottom:14px;}
.vh-partner.vh-partner .step__ic::after{display:none;}
/* Карта уезжает наверх: сначала показываем, потом объясняем. */
.vh-partner.vh-partner .geo{grid-template-columns:1fr;}
.vh-partner.vh-partner .geo__panel{order:-1;}
/* Фотография над текстом: в узкой колонке портрет сбоку не читается.
     Кадр держим от макушки: снимок квадратный, и при низкой полосе
     центрирование оставляет от лица полоску на уровне глаз. */
.vh-partner.vh-partner .lead{grid-template-columns:1fr;}
.vh-partner.vh-partner .lead__ph{display:flex;flex-direction:column;height:auto;}
.vh-partner.vh-partner .lead__ph img{height:min(92vw,400px);object-position:50% 0;}
.vh-partner.vh-partner .lead__pct{position:static;order:-1;max-width:none;border-radius:0;box-shadow:none;
    display:flex;align-items:center;gap:12px;}
.vh-partner.vh-partner .lead__pct span{margin-top:0;}
.vh-partner.vh-partner .lead__pct b{font-size:23px;white-space:nowrap;flex-shrink:0;}}
@media (max-width:560px){.vh-partner.vh-partner .hd .btn--sm{display:none;}
.vh-partner.vh-partner .hd__in{gap:12px;height:64px;}}
@media (max-width:720px){.vh-partner.vh-partner{font-size:14.5px;padding-bottom:74px;}
.vh-partner.vh-partner .wrap{padding:0 14px;}
.vh-partner.vh-partner .band{padding:38px 0;}
.vh-partner.vh-partner .lead-intro{padding-top:0;}
.vh-partner.vh-partner .hero{padding-bottom:42px;}
.vh-partner.vh-partner .pct{padding:34px 24px 78px;border-radius:var(--r-md);}
.vh-partner.vh-partner .trust{margin:-52px 12px 0;padding:16px;}
/* В строку три названия на телефоне не встают: два центруются,
     третье переносится и ломает ряд. Ставим столбиком. */
.vh-partner.vh-partner .trust ul{flex-direction:column;align-items:flex-start;gap:9px;}
.vh-partner.vh-partner .gives, .vh-partner.vh-partner .who-grid, .vh-partner.vh-partner .revs{grid-template-columns:1fr;}
.vh-partner.vh-partner .earn{border-radius:var(--r-md);}
.vh-partner.vh-partner .lead{border-radius:var(--r-md);}
.vh-partner.vh-partner .form{padding:22px 18px;border-radius:var(--r-md);}
.vh-partner.vh-partner .calc__in, .vh-partner.vh-partner .calc__out{padding:20px 18px;}
.vh-partner.vh-partner .calc{border-radius:var(--r-md);}
.vh-partner.vh-partner .demo{padding:18px;}
.vh-partner.vh-partner .cmp__label{display:none;}
.vh-partner.vh-partner .cmp__short{display:inline;}
.vh-partner.vh-partner .faq__q{padding:16px;gap:12px;}
.vh-partner.vh-partner .faq__a{padding:0 16px 18px;}
.vh-partner.vh-partner .ft__grid{grid-template-columns:1fr;gap:26px;}
.vh-partner.vh-partner .sticky{display:block;}
.vh-partner.vh-partner .promo{padding:20px;}}
@media (max-width:380px){.vh-partner.vh-partner .hd__logo svg{width:124px;height:32px;}}

/* End */
/* /local/components/vh/partners/templates/.default/partner.css?178878246968871 */
