/* ВИСТЛАН · vl-boost — оформление общего набора для брендовых поддоменов.
   Версия 20260831a. Собран агентом CB 31.08.2026.
   Опирается на переменные из assets/styles.css (--blue, --line, --ink, --bg2),
   но у каждой есть запасное значение: файл не сломается, если переменной нет.
   Откат: убрать строку подключения из index.html. */

.vl-boost { box-sizing: border-box; }
.vl-boost *, .vl-boost *::before, .vl-boost *::after { box-sizing: inherit; }

/* ── блок доверия ─────────────────────────────────────────────────────── */
.vl-trust { padding: 26px 0; background: var(--bg2, #F4F7FC); }
.vl-trust__g {
  max-width: 1180px; margin: 0 auto; padding: 0 20px;
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px;
}
.vl-trust__i {
  background: #fff; border: 1px solid var(--line, #E2E8F5); border-radius: 14px;
  padding: 16px 18px; display: flex; flex-direction: column; gap: 3px; min-width: 0;
}
.vl-trust__k { font-size: 12.5px; font-weight: 700; letter-spacing: .02em;
  text-transform: uppercase; color: #7C8AA6; }
.vl-trust__v { font-size: 20px; line-height: 1.2; font-weight: 800;
  color: var(--blue, #2D2767); overflow-wrap: anywhere; }
.vl-trust__d { font-size: 13px; line-height: 1.4; color: #56637C; }

@media (max-width: 900px) { .vl-trust__g { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px) { .vl-trust__g { grid-template-columns: 1fr; } }

/* ── полоса «ваш расчёт» ──────────────────────────────────────────────── */
.vl-recall {
  max-width: 1180px; margin: 22px auto; padding: 18px 20px;
  background: #fff; border: 1.5px solid var(--blue, #2D2767); border-radius: 16px;
}
.vl-recall__t { font-size: 15px; color: var(--ink, #0F1A33); margin-bottom: 4px; }
.vl-recall__s { font-size: 15px; line-height: 1.5; color: #56637C;
  margin-bottom: 12px; overflow-wrap: anywhere; }
.vl-recall__a { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }

.vl-btn {
  font: inherit; font-weight: 700; font-size: 15px; line-height: 1.2;
  border-radius: 12px; padding: 12px 18px; cursor: pointer;
  border: 1.5px solid transparent; min-height: 44px;
}
.vl-btn--pr { background: #23B9D6; color: #06243a; }
.vl-btn--pr:hover { filter: brightness(1.05); }
.vl-btn--gh { background: transparent; color: var(--blue, #2D2767);
  border-color: var(--line, #C9D4E8); }
.vl-btn--gh:hover { background: #F2F6FD; }
.vl-btn:disabled { opacity: .6; cursor: default; filter: none; }

/* ── форма «прислать расчёт на почту» ─────────────────────────────────── */
.vl-mail { display: flex; flex-wrap: wrap; gap: 10px; align-items: center;
  width: 100%; margin-top: 10px; }
.vl-mail__in {
  font: inherit; font-size: 15px; flex: 1 1 240px; min-width: 0; min-height: 44px;
  padding: 11px 14px; border: 1.5px solid var(--line, #C9D4E8); border-radius: 12px;
  color: var(--ink, #0F1A33); background: #fff;
}
.vl-mail__in:focus { outline: 2px solid #23B9D6; outline-offset: 1px; }
.vl-mail__c { flex: 1 1 100%; display: flex; gap: 9px; align-items: flex-start;
  font-size: 13px; line-height: 1.4; color: #56637C; cursor: pointer; }
.vl-mail__c input { margin-top: 2px; width: 17px; height: 17px; flex: 0 0 auto; }
.vl-mail__c a { color: var(--blue, #2D2767); font-weight: 600; }
.vl-mail__m { flex: 1 1 100%; font-size: 13.5px; line-height: 1.45; color: #B4232B; }
.vl-mail__ok { font-size: 15px; line-height: 1.5; color: #15803D; font-weight: 600; }
/* honeypot: видим для бота, невидим и недостижим для человека и скринридера */
.vl-hp { position: absolute !important; left: -9999px !important;
  width: 1px !important; height: 1px !important; opacity: 0 !important; }

/* ── слои внизу экрана ────────────────────────────────────────────────
   Плашка согласия на cookie (#vl-cookie, её рисует assets/app.js) шла с
   z-index 9999, чат-виджет — с 99000. Без этой строки чат оказывается НАД
   плашкой согласия, а согласие обязано быть верхним слоем.
   Значение то же, что у плашки основного сайта (#vl-cookie-bar).           */
#vl-cookie { z-index: 2147483000 !important; }

/* Чат не должен налезать на липкую панель .sticky-cta (на узких экранах она
   видима, высота ~62 px). Высоту публикует vl-boost.js переменной --vl-sticky-h.

   ПОЧЕМУ СЕЛЕКТОР ТАКОЙ ДЛИННЫЙ. В vl-chat.css уже есть своё правило
   «@media (max-width:768px){ .vlc-root{bottom:…!important} }», и подключается
   этот файл ПОЗЖЕ нашего. При равной силе побеждает последний — измерено
   31.08.2026: чат остался на bottom:20px и накрыл кнопку «Подобрать…».
   Поэтому здесь выше специфичность, а vl-boost.js вдобавок публикует
   --vl-nav-h-always, которую читает правило самого чата. */
html body .vlc-root {
  bottom: calc(var(--vl-sticky-h, 0px) + var(--vl-ck-res, 0px) + 20px) !important;
}

/* ── плашка согласия на cookie против модалки подбора ───────────────────
   #vl-cookie висит внизу экрана с z-index 2147483000, модалка подбора —
   inset:0 с z-index 200 и вертикальным центрированием. На 375px плашка
   занимает снизу ~202px и накрывает кнопку «Далее»: настоящий клик по ней
   истекает по таймауту. Замерено на всех 50 (агент C7, 31.08.2026);
   без vl-boost.css то же самое (9999 против 200) — поломка не наша.

   Поднять модалку НАД плашкой нельзя: её оверлей inset:0 закрыл бы кнопку
   согласия, а она обязана оставаться нажимаемой. Поэтому слои разводятся
   МЕСТОМ: модалка, всплывашка ухода и липкая панель резервируют снизу
   полосу --vl-ck-res, которую публикует vl-boost.js. Плашки нет —
   переменная 0px, и все три правила дают ровно прежние значения. */
html body .modal,
html body .exit-pop { padding-bottom: calc(20px + var(--vl-ck-res, 0px)); }

/* высоту окна тоже надо урезать: без этого max-height:92vh снова заводит
   низ окна под плашку, и «Далее» опять оказывается закрыт */
html body .modal > .modal__box,
html body .exit-pop > .modal__box {
  max-height: min(92vh, calc(100vh - 40px - var(--vl-ck-res, 0px)));
}

/* липкая панель внизу — её кнопка открывает тот же подбор, плашка накрывала
   и её (замер: y=787, сверху DIV#vl-cookie) */
html body .sticky-cta { bottom: var(--vl-ck-res, 0px); }

/* ── модалка выше чата ─────────────────────────────────────────────────
   Чат (.vlc-root) стоит с z-index 99000, модалка подбора — с 200.
   Замерено 31.08.2026 на fplus.vistlan.ru при ширине 375: elementFromPoint
   в центре кнопки «Далее» вернул DIV.vlc-root, настоящий клик истёк по
   таймауту — кнопку запуска чата вынесло ровно на неё.
   Разводим порядком: модалка и всплывашка ухода выше чата, но НИЖЕ плашки
   согласия (2147483000) — та обязана оставаться нажимаемой, и от неё
   модалка отделена не порядком, а местом (--vl-ck-res выше).
   Прежнее соотношение модалки и всплывашки сохранено: 200 < 210. */
html body .modal { z-index: 99500; }
html body .exit-pop { z-index: 99600; }

/* ── плашка согласия компактнее на узком экране ────────────────────────
   Ни одна буква не убирается: уменьшены только внутренние отступы и кегль.
   На 375px плашка занимала 202px из 812 — четверть экрана, — и ровно на
   столько же сжималось окно подбора. */
@media (max-width: 560px) {
  #vl-cookie { padding: 12px 14px !important; font-size: 13px !important;
    gap: 8px !important; border-radius: 12px !important; }
  #vl-cookie button { padding: 8px 13px !important; }
}

@media (prefers-reduced-motion: reduce) {
  .vl-boost * { animation: none !important; transition: none !important; }
}