/* ZMA-Авто — дизайн-система посадочных страниц U4
   Версия 1.0 · снято с эталона «Главная - эталон.dc.html»
   Подключать первым файлом, до остальных стилей страницы. */

:root{
  /* Фоны */
  --bg:#16151B;              /* фон страницы, шапки, героя */
  --bg-deep:#0B0908;         /* чередующиеся секции, полоса фактов, подвал */
  --surface-1:#0C0B0D;       /* карточка, панель */
  --surface-2:#1B1A20;       /* выделенная строка, выбранный чип */
  --surface-grad:linear-gradient(180deg,#111014 0%,#0C0B0D 100%);

  /* Линии */
  --line-soft:#24222A;       /* внешние: границы секций, шапки, подвала */
  --line:#2A2830;            /* внутренние: карточки, чипы, аккордеон */
  --line-inner:#1F1D24;      /* разделители строк внутри карточки */
  --line-strong:#4A4650;     /* рамка второй кнопки, hover карточки */
  --line-input:#3A373F;      /* рамка поля ввода */

  /* Текст */
  --text:#E8E8EB;            /* заголовки, значения */
  --text-2:#A1A1A3;          /* лид, подписи полей, чипы */
  --text-body:#8B8A8F;       /* абзацы, ответы FAQ */
  --text-3:#6E6D72;          /* eyebrow, ключи строк, мелкое */

  /* Акцент — один на всю систему */
  --accent:#C9B39A;
  --on-accent:#1B1309;
  --accent-fill:linear-gradient(180deg,#EBDAC6 0%,#CEB192 45%,#B59273 100%);
  --glow-hero:radial-gradient(60% 80% at 74% 46%,rgba(201,179,154,.16) 0%,rgba(22,21,27,0) 64%);
  --glow-form:radial-gradient(80% 110% at 50% 100%,rgba(201,179,154,.11) 0%,rgba(22,21,27,0) 60%);

  /* Геометрия */
  --container:1320px;
  --pad-x:40px;              /* 28px ≤1080 · 20px ≤760 */
  --sec-y:120px;             /* 80px ≤980 · 64px ≤760 */
  --r-card:16px;
  --r-hero-card:18px;
  --r-input:12px;
  --r-pill:9999px;
  --h-btn:62px;
  --h-btn-2:58px;
  --h-input:56px;
  --h-touch:44px;
  --header-h:76px;

  /* Шрифты */
  --font-display:Rubik,Arial,sans-serif;   /* 800 */
  --font-body:Inter,'Segoe UI',Arial,sans-serif; /* 400/500/600 */

  --t:.18s ease;
}

/* ── Шрифты — самохост, пути корне-абсолютные ─────────── */
@font-face{font-family:Rubik;font-weight:800;font-style:normal;font-display:swap;src:url(/assets/Rubik-800-cyrillic.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Rubik;font-weight:800;font-style:normal;font-display:swap;src:url(/assets/Rubik-800-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+2000-206F,U+2192,U+2212,U+2215}
@font-face{font-family:Inter;font-weight:400;font-style:normal;font-display:swap;src:url(/assets/Inter-400-cyrillic.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Inter;font-weight:400;font-style:normal;font-display:swap;src:url(/assets/Inter-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+2192,U+2212}
@font-face{font-family:Inter;font-weight:500;font-style:normal;font-display:swap;src:url(/assets/Inter-500-cyrillic.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Inter;font-weight:500;font-style:normal;font-display:swap;src:url(/assets/Inter-500-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+2192,U+2212}
@font-face{font-family:Inter;font-weight:600;font-style:normal;font-display:swap;src:url(/assets/Inter-600-cyrillic.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Inter;font-weight:600;font-style:normal;font-display:swap;src:url(/assets/Inter-600-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+2192,U+2212}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--bg);color:var(--text);
  font:400 17px/1.6 var(--font-body);
  overflow-x:hidden;
}
a{color:var(--text-2);text-decoration:none;transition:color var(--t)}
a:hover{color:var(--accent)}
::placeholder{color:#57565B}
img{display:block;max-width:100%}
h1,h2,h3{margin:0}
p{margin:0}
button{font:inherit;color:inherit}
input,textarea{font:inherit}
/* Кольцо фокуса одно на всё приложение (§8 DESIGN-SYSTEM). */
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* ── Каркас ───────────────────────────────────────────── */
.wrap{max-width:var(--container);margin:0 auto;padding:0 var(--pad-x);width:100%}
.sec{padding:var(--sec-y) 0;border-top:1px solid var(--line-soft)}
.sec--deep{background:var(--bg-deep)}   /* фон обязан чередоваться */
.split{display:grid;grid-template-columns:minmax(300px,.85fr) 1.15fr;gap:80px;align-items:start}
.split--faq{grid-template-columns:minmax(280px,.7fr) 1.3fr}
.g2{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.g3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.g4{display:grid;grid-template-columns:repeat(4,1fr)}
.headrow{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:32px}
.stack-52{margin-top:52px}

/* ── Типографика ──────────────────────────────────────── */
.eyebrow{margin:0 0 clamp(14px,2.2vh,22px);font:600 11px/1.4 var(--font-body);letter-spacing:.24em;text-transform:uppercase;color:var(--text-3)}
.eyebrow--accent{color:var(--accent)}
.h1{margin:0;font-family:var(--font-display);font-weight:800;font-size:clamp(38px,5.2vw,68px);line-height:1.03;text-transform:uppercase;letter-spacing:-.005em;max-width:13ch}
.h2{margin:0;font-family:var(--font-display);font-weight:800;font-size:clamp(28px,3.2vw,44px);line-height:1.1;text-transform:uppercase;letter-spacing:-.005em;max-width:22ch}
.h3{margin:0;font-family:var(--font-display);font-weight:800;font-size:18px;line-height:1.3;letter-spacing:.05em;text-transform:uppercase}
.accent{color:var(--accent)}          /* один акцентный кусок на заголовок */
.lead{margin:clamp(20px,2.8vh,30px) 0 0;color:var(--text-2);font-size:17px;line-height:1.65;max-width:46ch;text-wrap:pretty}
.body{margin:14px 0 0;color:var(--text-body);font-size:16px;line-height:1.6;max-width:36ch}
.caption{margin:0;font-size:14px;line-height:1.6;color:var(--text-3);max-width:26ch}
.micro{margin:18px 0 0;font-size:14px;line-height:1.55;color:var(--text-body);max-width:46ch}
.numeral{font-family:var(--font-display);font-weight:800;font-size:40px;line-height:1;color:var(--accent);letter-spacing:.02em}
.statement{margin:44px 0 0;font-family:var(--font-display);font-weight:800;font-size:clamp(20px,2vw,26px);line-height:1.35;max-width:26ch;text-wrap:pretty}

/* ── Шапка ────────────────────────────────────────────── */
.hdr{height:var(--header-h);display:flex;align-items:center;position:sticky;top:0;z-index:10;
  background:rgba(22,21,27,.9);backdrop-filter:blur(14px);border-bottom:1px solid var(--line-soft)}
.hdr__in{display:flex;align-items:center;gap:16px}
.logo{font-family:var(--font-display);font-weight:800;font-size:17px;letter-spacing:.18em;text-transform:uppercase;color:var(--text);
  display:inline-flex;align-items:center;min-height:var(--h-touch)}
.logo b{color:var(--accent);font-weight:800}
.hdr__div{width:1px;height:16px;background:var(--line)}
.hdr__city{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--text-3)}
.hdr__tel{margin-left:auto;font:600 16px/1 var(--font-body);color:var(--text);white-space:nowrap;
  display:inline-flex;align-items:center;min-height:var(--h-touch)}

/* ── Герой ────────────────────────────────────────────── */
.hero{position:relative;overflow:hidden;min-height:clamp(560px,74vh,760px);
  display:flex;align-items:center;border-bottom:1px solid var(--line-soft)}
.hero__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero__veil{position:absolute;inset:0;background:rgba(15,14,19,.42)}
.hero__scrim-x{position:absolute;inset:0;background:linear-gradient(90deg,#16151B 0%,#16151B 30%,rgba(22,21,27,.92) 48%,rgba(22,21,27,.55) 70%,rgba(22,21,27,.35) 88%,rgba(22,21,27,.6) 100%)}
.hero__scrim-y{position:absolute;inset:0;background:linear-gradient(180deg,rgba(22,21,27,.9) 0%,rgba(22,21,27,.25) 34%,rgba(22,21,27,.55) 76%,#16151B 100%)}
.hero__glow{position:absolute;inset:0;background:var(--glow-hero);pointer-events:none}
.hero__grid{position:relative;z-index:2;display:grid;grid-template-columns:minmax(380px,1fr) minmax(320px,.92fr);gap:56px;align-items:center}
/* Поля героя 88px — как в системе, но на низком экране (ноутбук 1440×900)
   при длинном H1 кнопка уезжала под сгиб на 6–34px. Верх clamp оставлен 88px,
   на невысоких экранах поля поджимаются. Замер: fold.py, было 3 страницы из 12. */
.hero__text{padding:clamp(56px,7vh,88px) 0;max-width:640px}
.hero__card{border:1px solid var(--line);border-radius:var(--r-hero-card);overflow:hidden;background:var(--surface-1)}
.hero__card img{width:100%;aspect-ratio:3/2;object-fit:cover}
.hero__card-cap{padding:16px 20px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:16px;align-items:baseline}

/* ── Полоса фактов / рынков ───────────────────────────── */
.strip{background:var(--bg-deep)}
.strip__cell{padding:30px 28px 32px;border-left:1px solid var(--line-soft)}
.strip__cell:first-child{border-left:0;padding-left:0}
.strip__num{font-family:var(--font-display);font-weight:800;font-size:12px;letter-spacing:.12em;color:var(--accent)}
.strip__label{margin-top:12px;font-family:var(--font-display);font-weight:800;font-size:17px;letter-spacing:.06em;text-transform:uppercase}

/* ── Кнопки ───────────────────────────────────────────── */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:var(--h-btn);padding:0 38px;
  border:0;border-radius:var(--r-pill);background:var(--accent-fill);color:var(--on-accent);
  font:600 16px/1.25 var(--font-body);letter-spacing:.01em;cursor:pointer;transition:filter var(--t)}
.btn:hover{filter:brightness(1.07)}
.btn--block{width:100%;padding:0 32px}
.btn-2{display:inline-flex;align-items:center;justify-content:center;min-height:var(--h-btn-2);padding:0 34px;
  border:1px solid var(--line-strong);border-radius:var(--r-pill);background:none;color:var(--text);
  font:600 16px/1.25 var(--font-body);cursor:pointer;transition:border-color var(--t),color var(--t)}
.btn-2:hover{border-color:var(--accent);color:var(--accent)}

/* ── Чипы ─────────────────────────────────────────────── */
.chips{display:flex;flex-wrap:wrap;gap:10px}
.chip{min-height:var(--h-touch);padding:0 18px;display:inline-flex;align-items:center;gap:8px;
  border:1px solid var(--line);border-radius:var(--r-pill);background:var(--surface-1);
  color:var(--text-2);font-size:15px;cursor:pointer;transition:border-color var(--t),color var(--t)}
.chip:hover{border-color:var(--line-strong)}
.chip[aria-pressed="true"]{background:var(--surface-2);border-color:var(--accent);color:var(--accent);font-weight:500}

/* ── Карточка-сводка запроса ──────────────────────────── */
.summary{border:1px solid var(--line);border-radius:var(--r-card);background:var(--surface-grad);overflow:hidden}
.summary__head{padding:18px 26px;border-bottom:1px solid var(--line);
  font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--text-3)}
.summary__row{display:flex;gap:24px;padding:17px 26px;border-bottom:1px solid var(--line-inner);align-items:baseline}
.summary__row:last-child{border-bottom:0}
.summary__key{flex:0 0 34%;font-size:14px;color:var(--text-3)}
.summary__val{flex:1;font-size:17px;font-weight:500}
.summary__row--fixed{padding-left:23px;border-left:3px solid var(--accent);background:var(--surface-2)}
.summary__row--fixed .summary__val{color:var(--accent)}

/* ── Карточка авто (фото + цена) ──────────────────────── */
.car{display:flex;flex-direction:column;overflow:hidden;
  border:1px solid var(--line);border-radius:var(--r-card);background:var(--surface-1);transition:border-color var(--t)}
.car:hover{border-color:var(--line-strong)}
.car__ph{aspect-ratio:16/10;overflow:hidden;background:#141218;border-bottom:1px solid var(--line)}
.car__ph img{width:100%;height:100%;object-fit:cover}
.car__body{padding:22px 24px 24px;display:flex;flex-direction:column;flex:1}
.car__model{font-size:13px;color:var(--text-3)}
.car__ver{margin-top:8px;font-family:var(--font-display);font-weight:800;font-size:19px;line-height:1.25}
.car__facts{margin-top:auto;padding-top:18px;border-top:1px solid var(--line-inner);display:flex;gap:28px;align-items:flex-end}
.car__lbl{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-3);padding-top:16px}
.car__num{margin-top:6px;font-family:var(--font-display);font-weight:800;font-size:21px}
.car__num--soft{color:var(--text-2)}
.car__status{margin-top:16px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}
/* Цена ставится ТОЛЬКО рядом с фото и ТОЛЬКО фактическая.
   Перечёркнутые «старые» цены и выдуманные скидки запрещены. */

/* ── Карточка-шаг ─────────────────────────────────────── */
.step{border-top:1px solid var(--line);padding-top:30px}
.step .h3{margin-top:24px}

/* ── Сравнение ────────────────────────────────────────── */
.cmp{border:1px solid var(--line);border-left:3px solid var(--line);border-radius:var(--r-card);
  background:var(--surface-1);padding:32px;color:var(--text-body)}
.cmp--ours{border-left-color:var(--accent);background:var(--surface-grad);color:var(--text)}
.cmp__lbl{display:block;margin-bottom:22px;font-family:var(--font-display);font-weight:800;
  font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--text-3)}
.cmp--ours .cmp__lbl{color:var(--accent)}

/* ── FAQ ──────────────────────────────────────────────── */
.faq{border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;padding:24px 0;min-height:var(--h-touch);
  display:flex;align-items:center;justify-content:space-between;gap:24px;font-size:17px;font-weight:500}
.faq summary::-webkit-details-marker{display:none}
.faq .plus{flex:0 0 auto;color:var(--accent);font-size:22px;line-height:1;transition:transform .2s ease}
.faq details[open] .plus{transform:rotate(45deg)}
.faq p{margin:0;padding:0 0 26px;color:var(--text-body);line-height:1.65;max-width:64ch}

/* ── Форма ────────────────────────────────────────────── */
.formcard{border:1px solid var(--line);border-radius:var(--r-card);background:var(--surface-grad);padding:40px}
.label{display:block;font-size:14px;color:var(--text-2);margin-bottom:10px}
.input,.textarea{width:100%;padding:16px;background:var(--bg);border:1px solid var(--line-input);
  border-radius:var(--r-input);color:var(--text);font:400 16px/1.5 var(--font-body);transition:border-color var(--t)}
.input{min-height:var(--h-input)}
.textarea{min-height:116px;resize:vertical}
.input:focus,.textarea:focus{border-color:var(--accent);outline:none}
.consent{display:flex;gap:12px;align-items:flex-start;margin-top:22px;min-height:var(--h-touch);
  font-size:14px;line-height:1.5;color:var(--text-3);cursor:pointer}
.consent input{width:22px;height:22px;flex:0 0 22px;margin-top:2px;accent-color:#CEB192}
.err{margin:14px 0 0;font-size:15px;line-height:1.55;color:#E7A6A6}
.ok{margin:14px 0 0;font-size:15px;line-height:1.55;color:var(--accent)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden} /* honeypot name="website" */

/* ── Подвал ───────────────────────────────────────────── */
.ftr{background:var(--bg-deep);border-top:1px solid var(--line-soft);padding:64px 0 72px;
  color:var(--text-3);font-size:14px;line-height:1.7}
.ftr__grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:40px}
/* Ссылки подвала — самостоятельные тач-цели, не строчные вставки в абзац. */
.ftr a{display:inline-flex;align-items:center;min-height:var(--h-touch)}

/* ══════════════════════════════════════════════════════
   Ниже — блоки, которые есть в эталонах, но которых не было
   в пакетном tokens.css. Новых ЗНАЧЕНИЙ не заведено: всё
   собрано из переменных §1. Добавлено при переносе в прод.
   ══════════════════════════════════════════════════════ */

/* ── Карточка героя с подписью ПОВЕРХ фото ────────────── */
/* Вариант эталона: фото на всю высоту карточки, подпись — плашкой снизу. */
.hero__card--fill{position:relative;height:min(52vh,440px);min-height:320px}
.hero__card--fill img{width:100%;height:100%;aspect-ratio:auto;object-fit:cover}
.hero__cap{position:absolute;left:0;right:0;bottom:0;padding:16px 20px;
  background:rgba(11,9,8,.82);backdrop-filter:blur(10px);border-top:1px solid var(--line);
  display:flex;flex-wrap:wrap;gap:16px;align-items:flex-end;justify-content:space-between}
.hero__cap-k{font-size:12px;color:var(--text-3)}
.hero__cap-v{margin-top:5px;font-family:var(--font-display);font-weight:800;font-size:17px;line-height:1.2}
.hero__cap-r{text-align:right}
.hero__cap-lbl{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--text-3)}
.hero__cap-price{margin-top:5px;font-family:var(--font-display);font-weight:800;font-size:20px;line-height:1.2;color:var(--accent)}

/* ── Полоса фактов: вариант без номеров ───────────────── */
.strip__title{font-family:var(--font-display);font-weight:800;font-size:17px;
  letter-spacing:.06em;text-transform:uppercase;color:var(--accent)}
.strip__desc{margin-top:10px;font-size:14px;line-height:1.55;color:var(--text-body)}

/* ── Строка «вывод + кнопка» под сеткой ───────────────── */
.ctarow{margin-top:44px;display:flex;flex-wrap:wrap;align-items:center;gap:28px}
.ctarow p{margin:0}
.g3--nav{gap:40px}
.g3--steps{gap:28px}

/* ── Крошка над героем ────────────────────────────────── */
.crumbs{position:relative;z-index:2;padding-top:26px;font-size:14px;color:var(--text-body)}
/* Крошка — самостоятельная ссылка навигации, а не строчная вставка в абзац:
   тач-цель обязана быть 44px, иначе на телефоне в неё не попасть. */
.crumbs a{color:var(--text-body);display:inline-flex;align-items:center;min-height:var(--h-touch)}
.crumbs span{color:var(--text-3);margin:0 8px}

/* ── Лента карточек с ценой (скролл внутри секции) ────── */
.rail{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:18px;
  scrollbar-width:thin;scrollbar-color:var(--line-strong) transparent}
.rail::-webkit-scrollbar{height:6px}
.rail::-webkit-scrollbar-thumb{background:var(--line-strong);border-radius:var(--r-pill)}
.rail::-webkit-scrollbar-track{background:transparent}
.railcard{flex:0 0 300px;scroll-snap-align:start;overflow:hidden;
  border:1px solid var(--line);border-radius:var(--r-card);background:var(--surface-1);
  transition:border-color var(--t)}
.railcard:hover{border-color:var(--line-strong)}
.railcard__ph{aspect-ratio:3/2;overflow:hidden;background:#141218;border-bottom:1px solid var(--line)}
.railcard__ph img{width:100%;height:100%;object-fit:cover}
.railcard__body{padding:20px 22px 22px}
.railcard__name{font-family:var(--font-display);font-weight:800;font-size:18px;line-height:1.25}
.railcard__spec{margin-top:6px;font-size:14px;color:var(--text-body)}
.railcard__price{margin-top:16px;font-family:var(--font-display);font-weight:800;font-size:22px;color:var(--accent)}
/* База расчёта обязательна рядом с каждой ценой (правило проекта:
   город чужого региона не выносится в заголовок, только подписью). */
.railcard__base{margin-top:4px;font-size:12px;color:var(--text-3)}

/* ── Плитка кадров с площадки ─────────────────────────── */
.tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.tile{overflow:hidden;border:1px solid var(--line);border-radius:var(--r-card);background:var(--surface-1)}
.tile--43{aspect-ratio:4/3}
.tile--169{aspect-ratio:16/9}
.tile img{width:100%;height:100%;object-fit:cover}

/* ── Скриншот отзыва ──────────────────────────────────── */
/* Белый фон — это сам кадр Яндекс.Карт, а не поверхность системы. */
.shot{border:1px solid var(--line);border-radius:var(--r-card);overflow:hidden;background:#fff;max-width:760px}
.shot img{width:100%;height:auto}

/* ── Колонка ссылок «другие страницы» ─────────────────── */
.navcol__head{padding-bottom:16px;border-bottom:1px solid var(--line);
  font:600 11px/1.4 var(--font-body);letter-spacing:.24em;text-transform:uppercase;color:var(--accent)}
.navlink{display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:18px 0;border-bottom:1px solid var(--line);min-height:var(--h-touch);
  font-size:17px;color:var(--text)}
.navlink:hover{color:var(--accent)}
.navlink i{font-style:normal;color:var(--accent)}

/* ── Таблица ──────────────────────────────────────────── */
/* Широкая таблица скроллится ВНУТРИ обёртки, страница — никогда. */
.tblwrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.tbl{border-collapse:collapse;width:100%;min-width:640px;font-size:15px}
.tbl th{text-align:left;padding:16px 20px;border-bottom:1px solid var(--line);
  font:600 11px/1.4 var(--font-body);letter-spacing:.14em;text-transform:uppercase;color:var(--text-3)}
.tbl td{padding:15px 20px;border-bottom:1px solid var(--line-inner);color:var(--text-2)}
.tbl td:first-child{color:var(--text);font-weight:500}
.tbl .num{font-variant-numeric:tabular-nums;white-space:nowrap}
.tbl .dash{color:var(--text-3)}

/* ── Квиз: строка сводки с полем и подвал карточки ────── */
.summary__inp{flex:1;min-height:var(--h-touch);padding:10px 14px;background:var(--bg);
  border:1px solid var(--line-input);border-radius:10px;color:var(--text);
  font:500 16px/1.4 var(--font-body);transition:border-color var(--t)}
.summary__inp:focus{border-color:var(--accent);outline:none}
.summary__row--fixed .summary__inp{color:var(--accent)}
.summary__note{margin-left:auto;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}
.summary__empty{padding:17px 26px;border-bottom:1px solid var(--line-inner);font-size:15px;color:var(--text-3)}
.summary__send{padding:20px;display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.summary__consent{padding:0 20px 18px}
.summary__consent .consent{margin-top:0}
.summary__msg{padding:0 20px 18px}
.summary__send .input{flex:1 1 200px}
.summary__foot{padding:14px 26px;border-top:1px solid var(--line-inner);
  font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--text-3)}
.summary__foot b{color:var(--accent);font-weight:600}

/* ── Секция заявки: свечение под формой ───────────────── */
.sec--form{position:relative}
.sec--form::after{content:"";position:absolute;inset:0;background:var(--glow-form);pointer-events:none;z-index:0}
.sec--form>*{position:relative;z-index:1}

/* ── Брейкпоинты: 1080 / 980 / 760. Других нет. ───────── */
@media (max-width:1080px){
  :root{--pad-x:28px}
  .split{gap:44px}
}
@media (max-width:980px){
  :root{--sec-y:80px}
  /* Везде minmax(0,…) вместо голого 1fr: колонка с голым 1fr не сжимается
     ниже min-content своего содержимого и распирает страницу на 2–3px. */
  .split{grid-template-columns:minmax(0,1fr);gap:32px}
  .g3{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .hero__grid{grid-template-columns:minmax(0,1fr);gap:0}
  .hero{min-height:0}
  .hero__text{padding:64px 0 36px}
  .hero__card{margin-bottom:64px}
  .tiles{grid-template-columns:1fr 1fr}
}
@media (max-width:760px){
  :root{--pad-x:20px;--sec-y:64px}
  .g2,.g3,.ftr__grid{grid-template-columns:minmax(0,1fr)}
  /* Подпись на карточке героя — двухколоночный flex. Его колонки тоже обязаны
     уметь сжиматься, иначе длинное «Audi A3 Sportback · 2022» распирает экран. */
  .hero__card-cap,.hero__cap{flex-wrap:wrap;row-gap:10px}
  .hero__card-cap>*,.hero__cap>*{min-width:0}
  .hero__cap-r{text-align:left}
  /* minmax(0,…) обязателен: без него колонка не сжимается ниже min-content,
     и «Дистанционно» в 17px распирало полосу на +3px за экран 360. */
  .g4{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .g4 .strip__cell{border-left:0;padding:24px 14px 26px 0}
  .g4 .strip__cell:nth-child(2n){border-left:1px solid var(--line-soft);padding-left:14px}
  .g4 .strip__cell:nth-child(n+3){border-top:1px solid var(--line-soft)}
  /* Оба варианта полосы фактов — и с номерами (.strip__label), и без
     (.strip__title) — на 360 распирают 2×2 сетку словами вроде «ДИСТАНЦИОННО». */
  .strip__title,.strip__label{font-size:14px}
  /* Длинное русское слово капсом не влезает в 320px при кегле 38:
     «КОМПЛЕКТАЦИЮ» — 351px, и страница уезжает вбок. Нижняя граница clamp
     опускается до 32px (значение из шкалы §3), верхняя остаётся прежней. */
  .h1{font-size:clamp(32px,8.5vw,38px)}
  .h2{font-size:clamp(24px,6.5vw,28px)}
  .btn{width:100%}
  .formcard{padding:22px}
  /* Шапка на 360 не влезала: логотип + город + телефон в одну строку давали
     +27px горизонтальной прокрутки. Сжимаем трекинг и кегль, состав сохраняем. */
  .hdr__in{gap:10px}
  .logo{font-size:15px;letter-spacing:.10em}
  .hdr__city{font-size:10px;letter-spacing:.14em}
  .hdr__tel{font-size:15px}
  .headrow{flex-direction:column;align-items:flex-start;gap:16px}
  /* Лента остаётся лентой: горизонтальная прокрутка ВНУТРИ секции — приём системы,
     прокрутка страницы — брак. Карточка сужается, чтобы был виден край следующей. */
  .railcard{flex:0 0 82%}
  .summary__row{flex-wrap:wrap;gap:10px}
  .summary__key{flex:0 0 100%}
  .summary__inp{flex:1 1 100%}
  .summary__send{padding:18px 20px 20px}
  .summary__send .input,.summary__send .btn{flex:1 1 100%}
  .summary__head,.summary__foot,.summary__empty,.summary__row{padding-left:20px;padding-right:20px}
  .summary__row--fixed{padding-left:17px}
}
@media (prefers-reduced-motion:reduce){
  *{transition:none!important;animation:none!important}
}