/* EvalCar — новые блоки главной (ДОВЕРИЕ-ЛЕНДИНГ-1, ветка design-doverie).
   Приёмы эталона (СберАвто), контент EvalCar. Макеты —
   ~/Desktop/ДОВЕРИЕ-1/*.dc.html (компьютер 1280, телефон 390).
   Цвета — только --ec-* из landing.css (тени — color-mix от них же),
   шрифт — Golos Text из fonts.css. Mobile-first: база — телефон (< 768),
   с 768 — компьютерная раскладка с полями 40, с 1025 — поля 80.
   ДОВЕРИЕ-ЛЕНДИНГ-2 (09.10.2026): в конце файла — старые секции главной
   и подвал на том же языке (сетка, заголовки, кегли, карточки, фон). */

/* ── Общее ────────────────────────────────────────────────────────── */

.dv {
  position: relative;
  overflow: hidden;              /* пятна не дают горизонтальной прокрутки */
  background: var(--ec-bg);
  padding: 40px 0 36px;
}

/* Мягкие пятна green-050 по углам. Слой гасит их к верхнему и нижнему
   краю секции: в макете пятно обрезает край холста, а на странице
   такой обрез — видимый шов со смежной секцией того же фона. Маска
   берёт только альфу — цвет в ней любой непрозрачный токен. */
.dv-blobs {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  -webkit-mask-image: linear-gradient(to bottom, transparent, var(--ec-text) 96px, var(--ec-text) calc(100% - 96px), transparent);
          mask-image: linear-gradient(to bottom, transparent, var(--ec-text) 96px, var(--ec-text) calc(100% - 96px), transparent);
}

.dv-blob {
  position: absolute;
  border-radius: 50%;
  background: var(--ec-green-050);
  filter: blur(50px);
  pointer-events: none;
}

.dv-inner {
  position: relative;
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 20px;
  display: flex;
  flex-direction: column;
  gap: 28px;
}

.dv-title {
  font-family: 'Golos Text', sans-serif;
  font-size: 30px;
  line-height: 1.15;
  font-weight: 600;
  letter-spacing: -0.01em;
  color: var(--ec-text);
}

@media (min-width: 768px) {
  .dv { padding: 64px 0 56px; }
  .dv-blob { filter: blur(60px); }
  .dv-inner { padding: 0 40px; gap: 40px; }
  .dv-title { font-size: 40px; }
}

@media (min-width: 1025px) {
  .dv-inner { padding: 0 80px; }
}

/* ── Блок «Путь» (Main.dc.html / MainPhone.dc.html) ───────────────── */

.dv-path__blob1 { width: 360px; height: 360px; right: -160px; top: -180px; }
.dv-path__blob2 { display: none; }

.dv-path__steps {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
}

/* Телефон: кружок и вертикальная линия слева, текст справа */
.dv-path__step {
  display: flex;
  gap: 18px;
}

.dv-path__mark {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex-shrink: 0;
}
.dv-path__mark::after {
  content: '';
  width: 2px;
  flex-grow: 1;
  min-height: 28px;
  background: var(--ec-border);
}
.dv-path__step:last-child .dv-path__mark::after { display: none; }

.dv-path__num {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: var(--ec-surface);
  border: 2px solid var(--ec-green-400);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  font-weight: 600;
  color: var(--ec-green-600);
  flex-shrink: 0;
}
.dv-path__step:last-child .dv-path__num {
  background: var(--ec-green-900);
  border-color: var(--ec-green-900);
  color: var(--ec-surface);
}

.dv-path__body {
  padding: 10px 0 26px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.dv-path__step:last-child .dv-path__body { padding-bottom: 0; }

.dv-path__text {
  margin: 0;
  font-size: 20px;
  line-height: 1.3;
  color: var(--ec-text);
}
.dv-path__text b { font-weight: 600; }

.dv-path__time {
  margin: 0;
  font-size: 17px;
  line-height: 1.4;
  color: var(--ec-text-3);
}

/* Компьютер и планшет: четыре колонки, горизонтальная линия */
@media (min-width: 768px) {
  .dv-path__blob1 { width: 720px; height: 720px; right: -220px; top: -380px; opacity: .9; }
  .dv-path__blob2 {
    display: block;
    width: 420px; height: 420px; left: -160px; bottom: -260px;
    filter: blur(50px); opacity: .9;
  }

  .dv-path__steps {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .dv-path__step {
    flex-direction: column;
    gap: 20px;
    padding-right: 24px;
  }
  .dv-path__step:last-child { padding-right: 0; }

  .dv-path__mark { flex-direction: row; }
  .dv-path__mark::after {
    width: auto;
    height: 2px;
    min-height: 0;
    margin-right: -24px;       /* линия доходит до следующего кружка */
  }

  .dv-path__num { width: 64px; height: 64px; font-size: 26px; }

  .dv-path__body { padding: 0; gap: 6px; }
  .dv-path__text { font-size: 22px; }
  .dv-path__time { font-size: 18px; }
}

/* ── Блок «Ситуации» (Situations.dc.html / SituationsPhone.dc.html) ─ */

.dv-sit .dv-inner { gap: 24px; }

.dv-sit__carousel { position: relative; }

/* Телефон: прокрутка со scroll-snap. Лента выходит в правое поле до края
   экрана (справа выглядывает следующая карточка), слева начинается от
   поля — предыдущая карточка не выглядывает. */
.dv-sit__viewport {
  /* запас под тень карточек: прокрутка обрезала бы её по краю ленты */
  padding: 18px 0 30px;
  margin: -18px -20px -30px 0;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.dv-sit__viewport::-webkit-scrollbar { display: none; }

.dv-sit__track {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  gap: 16px;
}

.dv-sit__card {
  flex: 0 0 302px;
  scroll-snap-align: start;
  min-height: 460px;
  padding: 30px 24px;
  border-radius: 28px;
  background: var(--ec-surface);
  box-shadow: 0 6px 24px color-mix(in srgb, var(--ec-green-900) 6%, transparent);
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.dv-sit__card--tail { scroll-snap-align: none; }

.dv-sit__icon {
  width: 72px;
  height: 72px;
  flex-shrink: 0;
  border-radius: 50%;
  background: var(--ec-green-050);
  color: var(--ec-green-600);
  display: flex;
  align-items: center;
  justify-content: center;
}
.dv-sit__icon svg { width: 34px; height: 34px; }

.dv-sit__title {
  margin: 0;
  font-family: 'Golos Text', sans-serif;
  font-size: 27px;
  line-height: 1.15;
  font-weight: 600;
  color: var(--ec-text);
}

.dv-sit__text {
  margin: 0;
  font-size: 19px;
  line-height: 1.45;
  color: var(--ec-text-2);
}

/* Стрелки — только на компьютере и только при живом JS */
.dv-sit__arrow { display: none; }

.dv-sit__dots {
  display: flex;
  gap: 8px;
  justify-content: center;
}
.dv-sit__dot {
  width: 8px;
  height: 8px;
  border-radius: 4px;
  background: var(--ec-border);
  transition: width .3s;
}
.dv-sit__dot--on { width: 24px; background: var(--ec-green-900); }

/* Компьютер и планшет: пара карточек, листание по одной паре стрелками */
@media (min-width: 768px) {
  .dv-sit .dv-inner { gap: 36px; }

  .dv-sit__viewport {
    padding: 0;
    margin: 0;
    overflow: hidden;
    scroll-snap-type: none;
    border-radius: 32px;        /* без JS — без выемок; с JS контур — clip-path */
  }

  .dv-sit__track {
    gap: 32px;
    transition: transform .4s cubic-bezier(.4, 0, .2, 1);
  }

  .dv-sit__card {
    flex: 0 0 calc((100% - 32px) / 2);
    min-height: 560px;
    padding: 32px;
    border-radius: 32px;
    gap: 24px;
  }
  .dv-sit__card--clone { display: none; }

  .dv-sit__icon { width: 88px; height: 88px; }
  .dv-sit__icon svg { width: 40px; height: 40px; }
  .dv-sit__title { font-size: 28px; }
  .dv-sit__text { font-size: 20px; }

  .dv-sit__carousel--live .dv-sit__arrow {
    position: absolute;
    top: calc(50% - 25px);
    width: 50px;
    height: 50px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: var(--ec-surface);
    color: var(--ec-green-900);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: transform .25s, background .25s;
  }
  .dv-sit__arrow--prev { left: -29px; }   /* центр — 4 px снаружи края ленты */
  .dv-sit__arrow--next { right: -29px; }
  .dv-sit__arrow svg { width: 18px; height: 18px; }
  .dv-sit__arrow:disabled { cursor: default; }
  .dv-sit__arrow:disabled svg { opacity: .3; }

  .dv-sit__dot--extra { display: none; }   /* пар на одну меньше, чем карточек */
}

@media (min-width: 768px) and (hover: hover) {
  .dv-sit__arrow--prev:not(:disabled):hover { transform: translateX(-6px); background: var(--ec-green-050); }
  .dv-sit__arrow--next:not(:disabled):hover { transform: translateX(6px); background: var(--ec-green-050); }
}

@media (min-width: 1025px) {
  .dv-sit__card { padding: 48px; }
  .dv-sit__title { font-size: 34px; }
  .dv-sit__text { font-size: 24px; }
}

/* ── Блок «Три способа» (Compare.dc.html / ComparePhone.dc.html) ──── */

.dv-cmp .dv-inner { gap: 24px; }

.dv-cmp__blob1 { width: 360px; height: 360px; right: -160px; top: -160px; }
.dv-cmp__blob2 { display: none; }

.dv-cmp__cards {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.dv-cmp__card {
  border-radius: 28px;
  background: var(--ec-surface);
  box-shadow: 0 6px 24px color-mix(in srgb, var(--ec-green-900) 6%, transparent);
  padding: 28px 24px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.dv-cmp__card--ours { background: var(--ec-green-050); }

.dv-cmp__title {
  margin: 0;
  font-family: 'Golos Text', sans-serif;
  font-size: 24px;
  line-height: 1.2;
  font-weight: 600;
  color: var(--ec-text);
}

.dv-cmp__rows {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
}

.dv-cmp__row {
  padding: 13px 0;
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 18px;
  line-height: 1.4;
  color: var(--ec-text-2);
  border-bottom: 1px solid var(--ec-border);
}
.dv-cmp__row:last-child { border-bottom: 0; }
.dv-cmp__row--yes { color: var(--ec-text); }

.dv-cmp__mark { width: 24px; height: 24px; flex-shrink: 0; }
.dv-cmp__mark--yes { color: var(--ec-green-400); }
.dv-cmp__mark--no { color: var(--ec-text-3); }

/* Кнопка «Трёх способов»: во всю ширину, не сжимается; green-600 и
   наведение — как у всех кнопок лендинга (ДОВЕРИЕ-ЛЕНДИНГ-3: цвет несёт
   слой заливки ::after, свой фон прозрачный) */
.dv-cta {
  flex: 0 0 56px;
  height: 56px;
  border-radius: 28px;
  background: transparent;
  color: var(--ec-surface);
  font-family: 'Golos Text', sans-serif;
  font-size: 17px;
  font-weight: 500;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  box-shadow: 0 6px 18px color-mix(in srgb, var(--ec-green-600) 18%, transparent);
  transition: box-shadow .3s ease;
}
.dv-cta:hover {
  color: var(--ec-surface);
  text-decoration: none;
}

/* Компьютерные кегли; до порога колонок — столбиком, до 640 по центру */
@media (min-width: 768px) {
  .dv-cmp .dv-inner { gap: 36px; }

  .dv-cmp__blob1 { width: 700px; height: 700px; right: -260px; top: -320px; }
  .dv-cmp__blob2 { display: block; width: 460px; height: 460px; left: -200px; bottom: -200px; }

  .dv-cmp__cards {
    gap: 32px;
    width: 100%;
    max-width: 640px;
    margin: 0 auto;
  }

  .dv-cmp__card {
    border-radius: 32px;
    padding: 36px 32px;
    gap: 20px;
  }

  .dv-cmp__title { font-size: 28px; }
  /* «Другие онлайн-сервисы» — 24, в одну строку */
  .dv-cmp__title--long {
    font-size: 24px;
    white-space: nowrap;
    letter-spacing: -0.01em;
    padding: 3px 0;
  }

  .dv-cmp__row {
    padding: 12px 0;
    min-height: 64px;
    gap: 14px;
    font-size: 19px;
  }
  .dv-cmp__mark { width: 26px; height: 26px; }
}

/* Три колонки — с ширины, где «Другие онлайн-сервисы» 24 px (284,7 px
   в Golos Text 600) помещается в карточку: (1272 − 160 − 64) / 3 − 64
   = 285,3 px. Карточки одной высоты — по самой высокой, строки делят
   высоту поровну, кнопка внизу. */
@media (min-width: 1272px) {
  .dv-cmp__cards {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: stretch;
    max-width: none;
  }
  .dv-cmp__card { min-height: 620px; }
  .dv-cmp__rows { flex-grow: 1; }
  .dv-cmp__row { flex: 1 0 auto; }
}

/* ── Старые секции главной (ДОВЕРИЕ-ЛЕНДИНГ-2, решения PO 09.10.2026) ─
   Их разметка и базовые стили — в landing.css, который подключают ещё
   9 страниц; поэтому здесь только переопределения, привязанные к <main>
   главной и к подвалу. Фон всех секций — bg страницы (подложек нет),
   карточки — surface. Сетка, отступы и заголовки — как у .dv / .dv-inner
   / .dv-title; основной текст ≥ 19, подписи ≥ 17. */

main .section { padding: 40px 0 36px; }

main .section > .container,
.footer > .container {
  max-width: 1280px;
  padding: 0 20px;
}

main .section h2 {
  font-family: 'Golos Text', sans-serif;
  font-size: 30px;
  line-height: 1.15;
  font-weight: 600;
  letter-spacing: -0.01em;
}

/* Отступ «заголовок → содержимое» — как gap в .dv-inner: 28 / 40. */
main .section h2 + .legal-text > p:first-child,
main .faq-list,
main .geo-map { margin-top: 28px; }

main .legal-text p {
  font-size: 19px;
  line-height: 1.55;
}

/* #geo — подзаголовок и поле карты; geo.css не трогается */
main .geo-lead {
  font-family: 'Golos Text', sans-serif;
  font-size: 24px;
  line-height: 1.2;
  font-weight: 600;
}
main .geo-sub { font-size: 17px; }
main .geo-stage {
  border-radius: 28px;
  box-shadow: 0 6px 24px color-mix(in srgb, var(--ec-green-900) 6%, transparent);
}

/* #faq */
main .faq-item summary > span:first-child { font-size: 19px; line-height: 1.4; }
main .faq-item p {
  font-size: 19px;
  line-height: 1.55;
  animation-name: dvFaqIn;
}
/* ответ в 19 px выше 320 px: потолок раскрытия — с запасом */
@keyframes dvFaqIn {
  from { opacity: 0; max-height: 0; }
  to   { opacity: 1; max-height: 900px; }
}

/* Абзац для роботов и нейросетей (#theory) — без заголовка */
main #theory .legal-text > p:first-child { margin-top: 0; }

/* Подвал — green-050, сетка и отступы страницы, без PT Serif */
.footer { padding: 40px 0 36px; }
.footer-logo {
  font-family: 'Golos Text', sans-serif;
  font-size: 22px;
  font-weight: 600;
}
.footer-req,
.footer-links a,
.footer-bottom { font-size: 17px; }

@media (min-width: 768px) {
  main .section { padding: 64px 0 56px; }
  main .section > .container,
  .footer > .container { padding: 0 40px; }
  main .section h2 { font-size: 40px; }

  main .section h2 + .legal-text > p:first-child,
  main .faq-list,
  main .geo-map { margin-top: 40px; }

  main .legal-text p { font-size: 20px; line-height: 1.6; }

  main .geo-stage { border-radius: 32px; }

  main .geo-lead { font-size: 28px; }
  main .geo-sub { font-size: 18px; }

  main .faq-item summary > span:first-child { font-size: 20px; }
  main .faq-item p { font-size: 19px; }

  .footer { padding: 64px 0 56px; }
}

@media (min-width: 1025px) {
  main .section > .container,
  .footer > .container { padding: 0 80px; }
}


/* ── ДОВЕРИЕ-ЛЕНДИНГ-3 (решения PO 09.10.2026, приёмка — там же) ─────
   Кнопки лендинга — green-600; полоса и нижний призыв — один элемент.
   Макеты — ~/Desktop/ДОВЕРИЕ-3/ (Sticky, StickyPhone, Cta, CtaPhone). */

/* Наведение на ВСЕ кнопки лендинга (hero, «Три способа», полоса,
   «Продолжить») — «запотевание» (решение PO по эталону СберАвто, макет
   HoverVariants.dc.html, вариант «край 3 px»): кнопка не меняет цвет и не
   приподнимается, размывается её собственный край, за ней — свечение
   того же цвета, текст резкий. Три слоя: ::before — свечение (копия
   формы под кнопкой: в покое opacity 0, при наведении .9 и blur 14),
   ::after — заливка (при наведении blur 3 и на полтона светлее: green-600
   + 12 % белого; литерал #19806A страж палитры не пропускает), текст —
   сама кнопка поверх. Слои — с отрицательным z-index внутри
   isolation: isolate; собственный фон кнопки прозрачный. Переходы —
   300 мс; transform и box-shadow при наведении не меняются, тень покоя
   прежняя. Белая кнопка полосы — те же слои белые, заливка при
   наведении остаётся белой. Кнопка первого экрана — в файле стилей
   своего экрана. Правила первого экрана A сняты вместе с ним
   в ДОВЕРИЕ-ЛЕНДИНГ-6. */
.dv-cta,
.dv-bar__btn,
.resume-banner-btn {
  position: relative;
  isolation: isolate;
}

.dv-cta::before, .dv-cta::after,
.dv-bar__btn::before, .dv-bar__btn::after,
.resume-banner-btn::before, .resume-banner-btn::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: var(--ec-green-600);
  pointer-events: none;
  transition: opacity .3s ease, filter .3s ease, background-color .3s ease;
}
.dv-cta::before,
.dv-bar__btn::before,
.resume-banner-btn::before { z-index: -2; opacity: 0; }
.dv-cta::after,
.dv-bar__btn::after,
.resume-banner-btn::after { z-index: -1; }

.dv-bar__btn::before,
.dv-bar__btn::after { background: var(--ec-surface); }

/* Эффект — только там, где есть настоящее наведение мышью (PO): на
   телефонах и планшетах кнопка без эффекта, просто нажимается */
@media (hover: hover) and (pointer: fine) {
  .dv-cta:hover::before,
  .dv-bar__btn:hover::before,
  .resume-banner-btn:hover::before {
    opacity: .9;
    filter: blur(14px);
  }
  .dv-cta:hover::after,
  .resume-banner-btn:hover::after {
    filter: blur(3px);
    background: color-mix(in srgb, var(--ec-green-600), var(--ec-surface) 12%);
  }
  .dv-bar__btn:hover::after { filter: blur(3px); }

  /* тень покоя (сдвинутая вниз) на время наведения гаснет — остаётся
     только симметричное свечение-копия (PO) */
  .dv-cta:hover,
  .dv-bar__btn:hover,
  .resume-banner-btn:hover { box-shadow: none; }
}

/* Баннер «Есть незавершённый заказ» — кнопка тоже кнопка лендинга;
   подъём при наведении из landing.css снят */
.resume-banner-btn,
.resume-banner-btn:hover {
  background: transparent;
  transform: none;
}
.resume-banner-btn { transition: background 200ms ease, box-shadow .3s ease; }

/* ── Строка «цена · срок» и белая кнопка полосы ───────────────────── */

.dv-bar__info {
  display: none;               /* телефон: подписи нет */
  margin: 0;
  align-items: center;
  gap: 18px;
  font-size: 20px;
  line-height: 1.3;
  color: var(--ec-surface);
}
.dv-bar__info b,
.dv-dock__short b { font-weight: 600; }

.dv-bar__check {
  width: 44px;
  height: 44px;
  flex-shrink: 0;
  border-radius: 50%;
  background: color-mix(in srgb, var(--ec-surface) 16%, transparent);
  display: flex;
  align-items: center;
  justify-content: center;
}

.dv-bar__sep { opacity: .6; padding: 0 10px; }

.dv-bar__btn {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 56px;
  padding: 0 36px;
  border-radius: 28px;
  background: transparent;      /* белый — слой заливки ::after */
  color: var(--ec-green-600);
  font-family: 'Golos Text', sans-serif;
  font-size: 17px;
  font-weight: 600;
  white-space: nowrap;
  text-decoration: none;
  /* тень белой кнопки в покое — из макета (чёрная 14 %; палитра — --ec-text) */
  box-shadow: 0 6px 18px color-mix(in srgb, var(--ec-text) 14%, transparent);
  transition: box-shadow .3s ease;
}
.dv-bar__btn:hover {
  color: var(--ec-green-600);
  text-decoration: none;
}

/* ── Полоса = нижний призыв: один элемент (приёмка PO 09.10.2026) ────
   .dv-dock стоит в потоке последним в <main> (после #theory), сразу за
   ним — сентинел .dv-dock__end, он же отступ до подвала. С живым JS
   (класс --live) — position: sticky; bottom: 0: держится у низа окна,
   пока страница не доедет до его места. Высота .dv-dock постоянна —
   это высота севшей формы; сама полоса .dv-dock__bar прижата к его низу
   и меняет форму: прилипшая (без --landed) — во всю ширину, скруглены
   верхние углы, тень вверх; севшая (--landed) — в сетке страницы, все
   углы, на телефоне — карточка. Высота в потоке не меняется — посадка
   не сдвигает подвал и сентинел (иначе состояние качалось бы).
   Без JS — только севшая форма в потоке. Скрытая прилипшая (без --on) —
   прозрачность и сдвиг вниз, visibility: hidden; всё — 300 мс. */

.dv-dock {
  position: relative;
  z-index: 25;                  /* ниже баннера незавершённого заказа (30) */
  height: 150px;                /* телефон: 24 + 28 + 18 + 56 + 24 */
  pointer-events: none;         /* пустой верх прилипшего блока не ловит клики */
}
.dv-dock--live {
  position: sticky;
  bottom: 0;
}
/* Включение --live — без переходов: начальное состояние ставится сразу,
   полоса не «уходит» из севшей формы на глазах (ПОЛОСА-МИГАНИЕ) */
.dv-dock--init,
.dv-dock--init *,
.dv-dock--init *::before,
.dv-dock--init *::after { transition: none !important; }

.dv-dock__end { height: 36px; }

.dv-dock__bar {
  position: absolute;
  left: 20px;
  right: 20px;
  bottom: 0;
  height: 150px;
  border-radius: 32px;
  background: var(--ec-green-600);
  box-shadow: 0 14px 40px color-mix(in srgb, var(--ec-green-600) 26%, transparent);
  color: var(--ec-surface);
  pointer-events: auto;
  transition-property: left, right, height, padding, border-radius, box-shadow, opacity, transform, visibility;
  transition-duration: .3s, .3s, .3s, .3s, .3s, .3s, .3s, .3s, 0s;
  transition-timing-function: ease;
}

/* Телефон, севшая: «790 ₽ · 2 минуты» по центру, под ней белая кнопка */
.dv-dock__short {
  position: absolute;
  top: 24px;
  left: 0;
  right: 0;
  margin: 0;
  text-align: center;
  font-size: 22px;
  line-height: 28px;
  transition: opacity .3s ease;
}
.dv-dock__short .dv-bar__sep { padding: 0 8px; }

.dv-dock .dv-bar__btn {
  position: absolute;
  left: 20px;
  right: 20px;
  bottom: 24px;
  height: 56px;
  padding: 0 20px;
  transition-property: left, right, bottom, height, border-radius, color, box-shadow;
  transition-duration: .3s;
  transition-timing-function: ease;
}

/* Телефон, прилипшая: 64, вся полоса — одна кнопка */
.dv-dock--live:not(.dv-dock--landed) .dv-dock__bar {
  left: 0;
  right: 0;
  height: 64px;
  border-radius: 24px 24px 0 0;
  box-shadow: 0 -10px 32px color-mix(in srgb, var(--ec-green-600) 22%, transparent);
}
.dv-dock--live:not(.dv-dock--landed) .dv-dock__short { opacity: 0; }
.dv-dock--live:not(.dv-dock--landed) .dv-bar__btn,
.dv-dock--live:not(.dv-dock--landed) .dv-bar__btn:hover {
  left: 0;
  right: 0;
  bottom: 0;
  height: 64px;
  border-radius: 24px 24px 0 0;
  color: var(--ec-surface);
  box-shadow: none;
}
/* белой заливки и свечения у кнопки-полосы нет */
.dv-dock--live:not(.dv-dock--landed) .dv-bar__btn::before,
.dv-dock--live:not(.dv-dock--landed) .dv-bar__btn::after { opacity: 0; }

/* Прилипшая и спрятанная: сдвиг вниз и прозрачность; visibility гаснет
   в конце перехода, а не в начале */
.dv-dock--live:not(.dv-dock--landed):not(.dv-dock--on) .dv-dock__bar {
  opacity: 0;
  visibility: hidden;
  transform: translateY(24px);
  transition-delay: 0s, 0s, 0s, 0s, 0s, 0s, 0s, 0s, .3s;
}

@media (min-width: 768px) {
  .dv-dock { height: 96px; }
  .dv-dock__end { height: 56px; }

  /* Севшая: полоса 96 в сетке, все углы 48 (Cta.dc.html) */
  .dv-dock__bar {
    left: 40px;
    right: 40px;
    height: 96px;
    padding: 0 28px;              /* кнопка от правого края — как кружок от левого (ДЛ-5) */
    border-radius: 48px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
  }
  .dv-dock__short { display: none; }
  .dv-dock .dv-bar__info { display: flex; }
  .dv-dock .dv-bar__btn,
  .dv-dock--live:not(.dv-dock--landed) .dv-bar__btn,
  .dv-dock--live:not(.dv-dock--landed) .dv-bar__btn:hover {
    position: relative;
    height: 56px;
    padding: 0 28px;
    border-radius: 28px;
    color: var(--ec-green-600);
    box-shadow: 0 6px 18px color-mix(in srgb, var(--ec-text) 14%, transparent);
  }
  /* Севшая: кнопка в потоке flex-строки, по центру высоты полосы.
     Телефонные left/right/bottom (кнопка там — absolute внизу карточки)
     у position: relative сдвигали её на 24 px вверх и 20 px вправо —
     хвост ДЛ-3, закрыт в ДЛ-5 (решение PO 11.10.2026) */
  .dv-dock .dv-bar__btn { left: auto; right: auto; bottom: auto; }
  /* прилипшая на компьютере — та же белая кнопка с теми же слоями */
  .dv-dock--live:not(.dv-dock--landed) .dv-bar__btn::after { opacity: 1; }

  /* Прилипшая: во всю ширину, 96, верхние углы 40, содержимое по сетке
     (Sticky.dc.html) */
  .dv-dock--live:not(.dv-dock--landed) .dv-dock__bar {
    left: 0;
    right: 0;
    height: 96px;
    padding: 0 40px;
    border-radius: 40px 40px 0 0;
    box-shadow: 0 -10px 40px color-mix(in srgb, var(--ec-green-600) 22%, transparent);
  }

  /* 768–1024: строка 18 px, переносится в две строки (решение «б») */
  .dv-bar__info { font-size: 18px; }
}

@media (min-width: 768px) and (hover: hover) and (pointer: fine) {
  .dv-dock--live:not(.dv-dock--landed) .dv-bar__btn:hover::before { opacity: .9; }
  /* тень покоя гаснет и у кнопки полосы (её тень задана в блоке 768) */
  .dv-dock .dv-bar__btn:hover,
  .dv-dock--live:not(.dv-dock--landed) .dv-bar__btn:hover { box-shadow: none; }
}

@media (min-width: 1025px) {
  .dv-dock__bar {
    left: max(80px, calc(50% - 560px));
    right: max(80px, calc(50% - 560px));
    gap: 32px;
  }
  .dv-dock--live:not(.dv-dock--landed) .dv-dock__bar {
    padding: 0 max(80px, calc(50% - 560px));
  }
  .dv-bar__info { font-size: 20px; }
  .dv-dock .dv-bar__btn,
  .dv-dock--live:not(.dv-dock--landed) .dv-bar__btn { padding: 0 36px; }
}


/* ── ДОВЕРИЕ-ЛЕНДИНГ-4: блок 9 «Отзывы» (решения PO 09.10.2026) ─────
   Макеты — ~/Desktop/ДОВЕРИЕ-4/ (Reviews, ReviewsPhone). Компьютер —
   шапка (заголовок, подзаголовок) и справа контурная кнопка, под ними
   две колонки карточек: 1, 3 | 2, 4, каждая по верху, без выравнивания
   строк. Телефон — карусель «Ситуаций» (scroll-snap, по кругу, точки),
   карточки 1, 2, 3, 4 одной высоты по самой длинной, кнопка под точками
   во всю ширину. Колонки — обёртки в разметке; на телефоне они
   display: contents, а порядок ленты задаёт order по data-dv-pos. */

.dv-rev .dv-inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-areas: "head" "cards" "dots" "all";
  gap: 24px;
}

.dv-rev__head {
  grid-area: head;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.dv-rev__sub {
  margin: 0;
  font-size: 19px;
  line-height: 1.4;
  color: var(--ec-text-2);
}
.dv-rev__sub-more { display: none; }   /* телефон: вторая фраза не нужна */

/* Звёзды — жёлтые #F5B301 (решение PO: единственный литерал вне
   палитры, исключение в страже test_landing_doverie.py) */
.dv-rev__stars {
  display: block;
  flex-shrink: 0;
  color: #F5B301;
}

/* Контурная кнопка «Все отзывы на Яндексе»: прозрачный фон, обводка и
   текст green-600; при наведении — заливка green-050, без «запотевания»
   (трёхслойный эффект — только у заливных кнопок) */
.dv-rev__all {
  grid-area: all;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 56px;
  padding: 0 32px;
  border: 2px solid var(--ec-green-600);
  border-radius: 28px;
  background: transparent;
  color: var(--ec-green-600);
  font-family: 'Golos Text', sans-serif;
  font-size: 17px;
  font-weight: 600;
  white-space: nowrap;
  text-decoration: none;
  transition: background-color .3s ease;
}
.dv-rev__all:hover {
  color: var(--ec-green-600);
  text-decoration: none;
}

.dv-rev__out { flex-shrink: 0; }

.dv-rev__carousel { grid-area: cards; min-width: 0; }

/* Телефон: лента как у «Ситуаций» — выходит в правое поле до края
   экрана, слева начинается от поля; запас под тень карточек */
.dv-rev__viewport {
  padding: 18px 0 30px;
  margin: -18px -20px -30px 0;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.dv-rev__viewport::-webkit-scrollbar { display: none; }

.dv-rev__track {
  display: flex;
  gap: 16px;
}
.dv-rev__col { display: contents; }

/* высота — по самой длинной: карточки растягиваются flex-строкой ленты */
.dv-rev__card {
  flex: 0 0 302px;
  scroll-snap-align: start;
  margin: 0;
  padding: 24px 22px 20px;
  border-radius: 28px;
  background: var(--ec-surface);
  box-shadow: 0 6px 24px color-mix(in srgb, var(--ec-green-900) 6%, transparent);
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.dv-rev__card[data-dv-pos="1"] { order: 1; }
.dv-rev__card[data-dv-pos="2"] { order: 2; }
.dv-rev__card[data-dv-pos="3"] { order: 3; }
.dv-rev__card[data-dv-pos="4"] { order: 4; }
.dv-rev__card--clone { order: 5; }
.dv-rev__card--tail { order: 6; scroll-snap-align: none; }

.dv-rev__top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}

.dv-rev__date {
  font-size: 17px;
  line-height: 1.3;
  color: var(--ec-text-3);
}

.dv-rev__text { margin: 0; }
.dv-rev__text p {
  margin: 0;
  font-size: 19px;
  line-height: 1.45;
  color: var(--ec-text);
}

/* Телефон и планшет: имя и ссылка — в две строки у всех карточек
   (решение PO: «Мария Зайцева» и «Отзыв на Яндексе» в одну строку не
   помещаются) */
.dv-rev__foot {
  margin-top: auto;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}

.dv-rev__name {
  font-size: 19px;
  line-height: 1.3;
  font-weight: 600;
  color: var(--ec-text);
}

.dv-rev__link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 17px;
  line-height: 1.3;
  white-space: nowrap;
}
.dv-rev__link:hover { text-decoration: none; }   /* цвет — green-900, как у ссылок */

.dv-rev__dots {
  grid-area: dots;
  display: flex;
  gap: 8px;
  justify-content: center;
}
.dv-rev__dot {
  width: 8px;
  height: 8px;
  border-radius: 4px;
  background: var(--ec-border);
  transition: width .3s;
}
.dv-rev__dot--on { width: 24px; background: var(--ec-green-600); }

@media (hover: hover) and (pointer: fine) {
  .dv-rev__all:hover { background: var(--ec-green-050); }
}

/* Компьютер и планшет: две колонки по верху; на 768–1024 кнопка — под
   шапкой слева (рядом с заголовком не помещается), имя и ссылка — в две
   строки, как на телефоне; с 1025 — кнопка справа, подпись в строку */
@media (min-width: 768px) {
  .dv-rev .dv-inner {
    grid-template-areas: "head" "all" "cards";
    justify-items: start;
    row-gap: 24px;
  }
  .dv-rev__carousel { justify-self: stretch; margin-top: 16px; }

  .dv-rev__head { gap: 12px; }
  .dv-rev__sub { font-size: 20px; }
  .dv-rev__sub-more { display: inline; }

  .dv-rev__viewport {
    padding: 0;
    margin: 0;
    overflow: visible;
    scroll-snap-type: none;
  }
  .dv-rev__track {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 24px;
    align-items: start;
  }
  .dv-rev__col {
    display: flex;
    flex-direction: column;
    gap: 24px;
  }

  .dv-rev__card {
    flex: none;                 /* в колонке flex-basis ленты стал бы высотой */
    padding: 32px 32px 28px;
    border-radius: 32px;
    box-shadow: 0 8px 28px color-mix(in srgb, var(--ec-green-900) 7%, transparent);
  }
  .dv-rev__card--clone { display: none; }

  .dv-rev__text p { font-size: 20px; }

  .dv-rev__dots { display: none; }
}

@media (min-width: 1025px) {
  .dv-rev .dv-inner {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: "head all" "cards cards";
    align-items: end;
    column-gap: 40px;
    row-gap: 40px;
  }
  .dv-rev__carousel { margin-top: 0; }

  /* имя и ссылка в одну строку — с 1025: «Мария Зайцева» и «Отзыв на
     Яндексе» занимают 329 px, на 768 в карточке 268, на 1025 — 356 */
  .dv-rev__foot {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
  }
}

/* ── ДОВЕРИЕ-ЛЕНДИНГ-5 (решения PO 11.10.2026) ───────────────────────
   Порядок главной: hero → Ситуации → «Что такое EvalCar» (#about) → Путь
   → юрсила (#legal) → Три способа → карта → отзывы → FAQ → #theory.
   #speed, #how и #notary убраны из разметки; их правила вычищены
   в ДОВЕРИЕ-ЛЕНДИНГ-6. */

/* Ссылка новых блоков — один приём на всю страницу: строка ссылки 19 px
   с ↗ (как у отзывов), под ней подпись 17 px text-3 — внутри <a>, чтобы
   экранный чтец прочёл и её. Последнее слово и ↗ — неразрывный хвост. */
.dv-link {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  align-self: flex-start;
  gap: 2px;
}
.dv-link:hover { text-decoration: none; }   /* цвет — green-900, как у ссылок */
.dv-link__main {
  font-size: 19px;
  line-height: 1.35;
  font-weight: 500;
}
.dv-link__tail { white-space: nowrap; }
.dv-link__out {
  display: inline-block;
  margin-left: 6px;
  vertical-align: -1px;
}
.dv-link__note {
  font-size: 17px;
  line-height: 1.35;
  color: var(--ec-text-3);
}

/* Блок 3 · «Что такое EvalCar» — текст без карточек и пятен, фон bg */
.dv-about__text {
  max-width: 820px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.dv-about__text p {
  margin: 0;
  font-size: 19px;
  line-height: 1.55;
  color: var(--ec-text);
}

/* Блок 5 · юрсила */
.dv-law__head {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.dv-law__sub {
  margin: 0;
  font-size: 19px;
  line-height: 1.4;
  color: var(--ec-text-2);
}

.dv-law__checks {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
}
.dv-law__check,
.dv-law__who {
  border-radius: 28px;
  background: var(--ec-surface);
  box-shadow: 0 6px 24px color-mix(in srgb, var(--ec-green-900) 6%, transparent);
}
.dv-law__check {
  padding: 28px 24px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.dv-law__title {
  margin: 0;
  font-family: 'Golos Text', sans-serif;
  font-size: 22px;
  line-height: 1.2;
  font-weight: 600;
  color: var(--ec-text);
}
.dv-law__text {
  margin: 0;
  font-size: 19px;
  line-height: 1.45;
  color: var(--ec-text-2);
}
.dv-law__check .dv-link { margin-top: auto; padding-top: 4px; }   /* ссылки строки — по низу */

.dv-law__who {
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.dv-law__photo {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 20px;
}
.dv-law__bio {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.dv-law__bio p {
  margin: 0;
  font-size: 19px;
  line-height: 1.5;
  color: var(--ec-text-2);
}
.dv-law__bio strong { font-weight: 600; color: var(--ec-text); }

.dv-law__report {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 28px;
}
.dv-law__cover {
  display: block;
  width: 240px;
  height: auto;
}   /* фон, листы и тень — уже в самой картинке */
.dv-law__includes { align-self: stretch; }
.dv-law__inc-title {
  margin: 0 0 8px;
  font-family: 'Golos Text', sans-serif;
  font-size: 24px;
  line-height: 1.2;
  font-weight: 600;
  color: var(--ec-text);
}
.dv-law__rows {
  list-style: none;
  margin: 0;
  padding: 0;
}
/* строки — как в «Трёх способах»: галочка green-400, разделители */
.dv-law__row {
  padding: 13px 0;
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 19px;
  line-height: 1.4;
  color: var(--ec-text);
  border-bottom: 1px solid var(--ec-border);
}
.dv-law__row:last-child { border-bottom: 0; }
.dv-law__mark { width: 24px; height: 24px; flex-shrink: 0; color: var(--ec-green-400); }

/* Три способа: рамка карточки EvalCar — край не растворяется в пятне */
.dv-cmp__card--ours { border: 1px solid var(--ec-border); }

@media (min-width: 768px) {
  .dv-about__text { gap: 20px; }
  .dv-about__text p { font-size: 20px; line-height: 1.6; }

  .dv-law__head { gap: 12px; }
  .dv-law__sub { font-size: 20px; }

  /* 768–1279 — 2×2, с 1280 — в ряд (решения PO 11.10.2026, по снимкам) */
  .dv-law__checks { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
  .dv-law__check,
  .dv-law__who { border-radius: 32px; }
  .dv-law__check { padding: 32px 28px; gap: 14px; }

  .dv-law__who {
    padding: 32px;
    display: grid;
    grid-template-columns: 280px minmax(0, 1fr);
    align-items: center;
    gap: 32px;
  }
  .dv-law__bio p { font-size: 20px; }

  /* список «Что входит» слева, титул справа, список — по центру высоты */
  .dv-law__report {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 300px;
    align-items: center;
    gap: 48px;
  }
  .dv-law__cover { width: 100%; }
  /* середина списка с заголовком — на середине картинки: телефонное
     align-self: stretch растягивало блок, и список вставал к верху */
  .dv-law__includes { align-self: center; }
  .dv-law__inc-title { font-size: 28px; margin-bottom: 12px; }
  .dv-law__row { padding: 12px 0; min-height: 64px; gap: 14px; font-size: 20px; }
  .dv-law__mark { width: 26px; height: 26px; }
}

/* FAQ: линии — во всю сетку (правый край — как у карточек отзывов),
   колонка вопросов и ответов — прежние 772 px текста, слева; «+/×» —
   у правого края линии. До 960 список и так во всю ширину. */
@media (min-width: 960px) {
  main .faq-list { max-width: none; }
  main .faq-item summary > span:first-child { max-width: 772px; }
  main .faq-item p { max-width: 820px; }   /* 820 − отступ 48 справа = 772 */
}

@media (min-width: 1025px) {
  .dv-law__who { grid-template-columns: 360px minmax(0, 1fr); gap: 48px; padding: 40px; }
  .dv-law__report { grid-template-columns: minmax(0, 1fr) 340px; gap: 80px; }
}

/* Четыре проверки в ряд — с 1280: уже колонка текста карточки меньше
   слов «квалификационный», «квалифицированной» и имени «Юлии Муковниной»
   (на 1025 — 150 px при нужных ~190) */
@media (min-width: 1280px) {
  .dv-law__checks { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .dv-law__check { padding: 32px 24px; }
}