/* PREP-9.1c-C: лицо главной как эскиз v4 / телефон.
   Сетка и цвет — с step9-home.css. Не kolesa-9-1b, не kolesa-step9-draft.
   Подключается только на /local/prep-91c/, последним. Живой корень не красим.
   marker: kolesa-prep-92-type-1 kolesa-face-hit-1 kolesa-face-type-1 kolesa-face-type-2 kolesa-face-open-1 kolesa-face-pcd-1 kolesa-face-pcd-2 */

:root {
  --canvas: #f2efe8;
  --card: #ffffff;
  --ink: #1c1a17;
  --muted: #6b6560;
  --line: #e6e1d8;
  --orange: #fd700b;
  --orange-hover: #e8650a;
  --green: #7a9e22;
  --radius: 16px;
  --shadow: 0 8px 28px rgba(40, 32, 24, 0.06);
  /* Окна фильтра: марка по самой широкой в пикселях (RENAULT SAMSUNG), не по числу букв. Модель 280. */
  --fld-num: 108px;
  --fld-season: 210px;
  --fld-pcd: 108px; /* STEP9-FACE-PCD-1: как ширина/диаметр, не 148 */
  --fld-brand: 160px;
  --fld-auto-mark: 224px;
  --fld-auto-model: 280px;
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
}

body {
  font-family: Montserrat, Arial, sans-serif;
  background: var(--canvas);
  color: var(--ink);
  line-height: 1.45;
  min-height: 100vh;
  padding-bottom: 0;
}

[hidden] { display: none !important; }

/* SK-QA-MODAL-LOCK: за окном страницу не крутить */
html.is-dlg-open,
body.is-dlg-open {
  overflow: hidden;
}

a {
  color: inherit;
  text-decoration: none;
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}

.sketch-banner {
  background: #fff6eb;
  border-bottom: 1px solid #f0d9c0;
  color: #7a4a18;
  text-align: center;
  font-size: 13px;
  padding: 8px 16px;
}

.sketch-banner a {
  color: inherit;
  font-weight: 800;
  text-decoration: underline;
}

.sketch-banner a.is-on {
  text-decoration: none;
  box-shadow: inset 0 -2px 0 currentColor;
}

/* Главная v4: синяя полоска «это эскиз», не кремовая как на каталоге */
.sketch-banner.sketch-home {
  background: #e8eef8;
  color: #3a4a63;
  border-bottom-color: #c5d0e4;
}

/* Одна коробка для всех рабочих эскизов, включая комплекты 2+2 (SK-QA-WRAP-SCALE). */
.wrap {
  width: min(1280px, calc(100% - 32px));
  margin: 0 auto;
}

/* Шапка: две полосы */

.header {
  background: var(--card);
  border-bottom: 1px solid var(--line);
}

.header-top {
  border-bottom: 1px solid var(--line);
  font-size: 13px;
}

.header-top-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 40px;
  gap: 16px;
}

.top-nav,
.top-contacts {
  display: flex;
  align-items: center;
  gap: 16px;
}

.top-nav a,
.callback {
  color: var(--muted);
}

.callback:hover,
.top-nav a:hover {
  color: var(--ink);
}

.phone {
  font-weight: 700;
  white-space: nowrap;
}

.buyers,
.cabinet {
  position: relative;
}

.buyers summary,
.cabinet summary {
  list-style: none;
  cursor: pointer;
  color: var(--muted);
  font-weight: 600;
}

.buyers summary::-webkit-details-marker,
.cabinet summary::-webkit-details-marker { display: none; }

.buyers summary::after,
.cabinet summary::after {
  content: " ▾";
  font-size: 10px;
}

.buyers-menu {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  z-index: 20;
  margin: 0;
  padding: 8px 0;
  list-style: none;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 12px;
  box-shadow: var(--shadow);
  min-width: 220px;
}

.buyers-menu a {
  display: block;
  padding: 8px 16px;
  color: var(--ink);
}

.buyers-menu a:hover {
  background: var(--canvas);
}

.header-main-inner {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 12px 16px;
  min-height: 64px;
}

.logo {
  display: flex;
  align-items: baseline;
  gap: 8px;
  white-space: nowrap;
  font-weight: 800;
  letter-spacing: 0.04em;
  font-size: 15px;
}

.logo-a { color: var(--ink); }
.logo-b { color: var(--orange); }

.logo-line {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: baseline;
  gap: 0.35em;
  font-size: 24px;
  letter-spacing: 0.04em;
  line-height: 1;
  white-space: nowrap;
}

.logo-line .logo-b { font-size: 1em; }

.nav {
  display: flex;
  gap: 18px;
  font-size: 15px;
  font-weight: 700;
}

.search {
  display: flex;
  align-items: center;
  background: var(--canvas);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 8px 14px;
  flex: 1 1 160px;
  min-width: 0;
}

form.search {
  margin-top: 0;
  margin-bottom: 0;
  width: auto;
  max-width: none;
}

.search input {
  border: 0;
  background: transparent;
  outline: none;
  width: 100%;
  font: inherit;
  color: var(--ink);
  cursor: text;
}

.search input::placeholder { color: #9a948c; }

/* Избранное и корзина — одна группа справа, поиск не выталкивает их за край */
.header-shop {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
  margin-left: auto;
}

/* Телефон: кружки поиск/звонок как на m-home. На ПК поле поиска уже в шапке. */
.m-head-icos { display: none; }

.cart,
.fav {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: var(--canvas);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 8px 12px;
  font-weight: 700;
  font-size: 14px;
  flex-shrink: 0;
}

.cart b,
.fav b { color: var(--orange); }

/* Фильтр */

.hero { padding: 28px 0 8px; }

.filter-card {
  background: var(--card);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 28px 28px 22px;
}

.filter-card h1 {
  margin: 0 0 16px;
  font-size: 24px;
  font-weight: 700;
  letter-spacing: -0.03em;
}

/* ПК: Шины/Диски слева, По размеру/По авто справа */
.filter-switch {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 12px 20px;
  margin-bottom: 14px;
}

.filter-switch .tabs,
.filter-switch .modes { margin-bottom: 0; }

.lead {
  margin: 0 0 18px;
  color: var(--muted);
  font-size: 15px;
}

.tabs,
.modes {
  display: flex;
  gap: 8px;
  margin-bottom: 14px;
}

.tab,
.mode {
  border: 1px solid var(--line);
  background: var(--card);
  border-radius: 999px;
  padding: 8px 16px;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
  color: var(--ink);
}

.tab.is-on {
  background: var(--ink);
  color: #fff;
  border-color: var(--ink);
}

.mode.is-on {
  background: #fff4e8;
  border-color: var(--orange);
  color: var(--orange);
}

/* PREP-9.2-HOME-KIND-1: «Легковые / Грузовые» оранжевые, как «По размеру». «Шины / Диски» чёрные. */
.filter-switch {
  flex-wrap: wrap;
}

.filter-kind {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  flex: 1 0 100%;
  order: 3;
}

.filter-kind[hidden],
.filter-switch .modes[hidden] {
  display: none !important;
}

.kind {
  border: 1px solid var(--line);
  background: var(--card);
  border-radius: 999px;
  padding: 8px 16px;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
  color: var(--ink);
}

.kind.is-on {
  background: #fff4e8;
  border-color: var(--orange);
  color: var(--orange);
}

main.main-home.k9c-is-truck .fld-season,
main.main-home.k9c-is-truck #k9c-chips,
main.main-home.k9c-is-truck form.podborFromAuto {
  display: none !important;
}

a.tab,
a.mode {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
}

.fields {
  display: grid;
  grid-template-columns: var(--fld-num) var(--fld-num) var(--fld-num) var(--fld-season) auto;
  justify-content: start;
  gap: 12px;
  align-items: stretch;
  overflow: visible;
}

/* Главная: грузовые — три окна и «Показать», без сезона */
.fields-truck {
  grid-template-columns: var(--fld-num) var(--fld-num) var(--fld-num) auto;
}

/* Каталог шин: те же цифры + производитель + «Показать» в том же ряду */
.fields-tires {
  grid-template-columns: var(--fld-num) var(--fld-num) var(--fld-num) var(--fld-season) var(--fld-brand) auto;
}

.fields-tires.is-truck {
  grid-template-columns: var(--fld-num) var(--fld-num) var(--fld-num) var(--fld-brand) auto;
}

.fields-disks {
  grid-template-columns: var(--fld-num) var(--fld-num) var(--fld-pcd) var(--fld-num) var(--fld-num) auto;
}

.fields-auto {
  grid-template-columns: var(--fld-auto-mark) var(--fld-auto-model) var(--fld-num) var(--fld-season) auto;
}

/* Диски по авто: сезона нет, ряд короче */
.fields-auto.is-disks {
  grid-template-columns: var(--fld-auto-mark) var(--fld-auto-model) var(--fld-num) auto;
}

/* kolesa-prep-92-auto-empty-1: пустое «По авто» той же высоты, что с именем */
body.kolesa-prep-91c .fields-auto .field .field-val {
  min-height: 1.2em;
}

/* Вариант В: название мелким внутри окна. Не настоящий <select> — иначе цифра наезжает на подпись. */
.field {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 2px;
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  min-height: 56px;
  padding: 7px 32px 7px 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background-color: var(--card);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%236b6560' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  cursor: pointer;
  outline: none;
  -webkit-tap-highlight-color: transparent;
}

/* PREP-9.2-AUTO-BAR-1: Bootstrap .form-group даёт 16px снизу, сетка уже с gap.
   Иначе на телефоне «По авто» (три ряда окон) уезжает под нижнее меню. */
body.kolesa-prep-91c main.main-home .form-group.field {
  margin-bottom: 0;
}

.field label,
.field .field-name {
  position: static;
  display: block;
  margin: 0;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.2;
  color: var(--muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* STEP9-FACE-PCD-2: окно 108, слово «Сверловка» целиком — 4 px из запаса стрелки */
@media (min-width: 801px) {
  body.kolesa-prep-91c .form-group.field.fld-pcd,
  body.kolesa-prep-91c .fld-pcd.field {
    padding-right: 28px;
  }
}

.field select,
.field .field-val,
.field-typein {
  display: block;
  width: 100%;
  height: auto;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  font: inherit;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.2;
  color: var(--ink);
  appearance: none;
  -webkit-appearance: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.field-typein:focus {
  outline: none;
}

.field select:disabled {
  opacity: 1;
  color: var(--ink);
  -webkit-text-fill-color: var(--ink);
}

/* SK-FILTER-OPEN: выпавший список. Не настоящий <select> — подпись внутри окна. */
.field[data-open] {
  cursor: pointer;
}

.field[data-open]:focus {
  outline: 2px solid var(--orange);
  outline-offset: 2px;
}

.field.is-open {
  z-index: 40;
  border-color: var(--orange);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23fd700b' d='M1 7l5-5 5 5'/%3E%3C/svg%3E");
}

/* STEP9-FACE-OPEN-1: Bootstrap вешает .show на окошко — не брать ширину кнопки «Показать» */
body.kolesa-prep-91c .form-group.field.show,
body.kolesa-prep-91c .form-group.field.is-open,
body.kolesa-prep-91c main.main-home .form-group.field.show,
body.kolesa-prep-91c main.main-home .form-group.field.is-open {
  width: 100%;
  max-width: 100%;
  justify-self: stretch;
}

.field-pop {
  position: absolute;
  left: 0;
  top: calc(100% + 6px);
  z-index: 50;
  min-width: 100%;
  padding: 6px 0;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--card);
  box-shadow: 0 12px 32px rgba(40, 32, 24, 0.14);
}

.field-pop.is-search {
  min-width: 220px;
  padding-top: 8px;
}

.field-pop-q {
  display: block;
  box-sizing: border-box;
  width: calc(100% - 16px);
  margin: 0 8px 6px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  font: inherit;
  font-size: 14px;
  font-weight: 600;
  color: var(--ink);
}

.field-pop-q:focus {
  outline: 2px solid var(--orange);
  outline-offset: 0;
  border-color: var(--orange);
}

.field-pop-list {
  max-height: 240px;
  overflow: auto;
}

.field-pop-list button {
  display: block;
  width: 100%;
  min-height: 40px;
  margin: 0;
  padding: 8px 14px;
  border: 0;
  background: none;
  font: inherit;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.2;
  color: var(--ink);
  text-align: left;
  cursor: pointer;
}

.field-pop-list button:hover,
.field-pop-list button.is-on {
  background: #fff4e8;
  color: var(--orange);
}

.field-pop-empty {
  margin: 0;
  padding: 10px 14px 12px;
  font-size: 13px;
  font-weight: 600;
  color: var(--muted);
}

.filter-card,
.catalog-filter {
  position: relative;
  z-index: 5;
  overflow: visible;
}

/* И кнопка, и ссылка «Показать». Не голое .show — иначе Bootstrap .modal.show становится оранжевой полоской. */
a.show,
button.show {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: start;
  box-sizing: border-box;
  height: 56px;
  margin: 0;
  padding: 0 16px;
  border: 0;
  border-radius: 12px;
  background: var(--orange);
  color: #fff;
  font: inherit;
  font-weight: 800;
  line-height: 1;
  cursor: pointer;
  white-space: nowrap;
  text-decoration: none;
  gap: 0;
  -webkit-appearance: none;
  appearance: none;
}

a.show:hover,
button.show:hover { background: var(--orange-hover); }

a.show .show-txt,
button.show .show-txt {
  display: inline;
  white-space: nowrap;
}

/* Разноширокие: второй ряд после клика, обычный поиск не трогаем */
.axle-name {
  margin: 0 0 6px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--muted);
}

.axle-rear {
  margin-top: 8px;
  padding-top: 0;
  border: 0;
}

/* Задняя ось в обычном режиме — те же столбцы, что спереди */
.fields-rear {
  display: grid;
  grid-template-columns: var(--fld-num) var(--fld-num) var(--fld-num) var(--fld-season) auto;
  justify-content: start;
  gap: 12px;
  align-items: stretch;
}

/* Разноширокие: общее поле в своём столбце между осями, кнопка справа по центру */
.is-stagger .axle-rear,
.is-stagger .fields-rear {
  display: contents;
}

.is-stagger .axle-front-label {
  grid-area: flabel;
  margin: 0;
  align-self: end;
  font-size: 10px;
  line-height: 1.1;
  letter-spacing: 0.04em;
}

.is-stagger .axle-rear-label {
  grid-area: rlabel;
  margin: 0;
  align-self: end;
  font-size: 10px;
  line-height: 1.1;
  letter-spacing: 0.04em;
}

.is-stagger .fld-fw { grid-area: fw; }
.is-stagger .fld-fh { grid-area: fh; }
.is-stagger .fld-fr { grid-area: fr; }
.is-stagger .fld-rw { grid-area: rw; }
.is-stagger .fld-rh { grid-area: rh; }
.is-stagger .fld-rr { grid-area: rr; }
.is-stagger .fld-fd { grid-area: fd; }
.is-stagger .fld-rd { grid-area: rd; }
.is-stagger .fld-fe { grid-area: fe; }
.is-stagger .fld-re { grid-area: re; }
.is-stagger .fld-pcd { grid-area: pcd; }
.is-stagger .fld-hub { grid-area: hubf; }
.is-stagger .fld-rhub { grid-area: hubr; }
.is-stagger .fld-season { grid-area: season; }
.is-stagger .fld-brand { grid-area: brand; }
.is-stagger > .fields > .show:not(.field),
.is-stagger .fields-tires > .show:not(.field),
.is-stagger .fields-disks > .show:not(.field),
.is-stagger .fields-tires > .filter-go,
.is-stagger .fields-disks > .filter-go {
  grid-area: show;
}

.is-stagger .fld-season,
.is-stagger .fld-brand,
.is-stagger .fld-pcd {
  align-self: center;
}

.is-stagger > .fields > .show:not(.field),
.is-stagger .fields-tires > .show:not(.field),
.is-stagger .fields-disks > .show:not(.field) {
  align-self: center;
  height: 56px;
}

.is-stagger .fields-tires > .filter-go,
.is-stagger .fields-disks > .filter-go {
  align-self: stretch;
  height: auto;
}

form#filter-tires.is-stagger > .fields {
  grid-template-columns: var(--fld-num) var(--fld-num) var(--fld-num) var(--fld-season) auto;
  grid-template-areas:
    "flabel flabel flabel .      ."
    "fw     fh     fr     season show"
    "rlabel rlabel rlabel season show"
    "rw     rh     rr     season show";
  row-gap: 4px;
  align-items: center;
}

#filter-tires.is-stagger > .fields-tires {
  grid-template-columns: var(--fld-num) var(--fld-num) var(--fld-num) var(--fld-season) var(--fld-brand) auto;
  grid-template-areas:
    "flabel flabel flabel .      .     ."
    "fw     fh     fr     season brand show"
    "rlabel rlabel rlabel season brand show"
    "rw     rh     rr     season brand show";
  row-gap: 4px;
  align-items: center;
}

form#filter-disks.is-stagger > .fields-disks,
div#filter-disks.is-stagger > .fields-disks {
  grid-template-columns: var(--fld-num) var(--fld-num) var(--fld-pcd) var(--fld-num) var(--fld-num) auto;
  grid-template-areas:
    "flabel flabel flabel flabel flabel ."
    "fw     fd     pcd    fe     hubf  show"
    "rlabel rlabel pcd    .      .     show"
    "rw     rd     pcd    re     hubr  show";
  row-gap: 4px;
  align-items: center;
}

.axle-hint {
  margin: 6px 0 0;
  font-size: 12px;
  color: var(--muted);
}

.stagger-line {
  margin: 10px 0 0;
}

.stagger-toggle {
  display: inline;
  padding: 0;
  border: 0;
  background: none;
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  color: var(--orange);
  text-decoration: underline;
  text-underline-offset: 2px;
  cursor: pointer;
}

.pill-pair {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 2px;
  min-height: 52px;
  padding: 8px 14px;
  line-height: 1.25;
  border-radius: 16px;
}

button.pill {
  font: inherit;
  cursor: pointer;
  text-align: left;
}

.pill-pair small {
  font-size: 11px;
  font-weight: 600;
  color: var(--muted);
}

.pill-pair.is-on small {
  color: var(--orange);
}

.axle-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 12px 0 0;
}

.axle-tabs button {
  min-height: 40px;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--card);
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  color: var(--ink);
  cursor: pointer;
}

.axle-tabs button.is-on {
  background: var(--ink);
  border-color: var(--ink);
  color: #fff;
}

/* Сезон — здесь адреса, без отдельного блока складов */

.promo {
  margin: 22px 0;
  background: #fff8f1;
  border: 1px solid #f3e0cc;
  border-radius: var(--radius);
  padding: 22px 26px;
}

.promo-tag {
  display: inline-block;
  margin: 0 0 8px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--orange);
}

.promo h2 {
  margin: 0 0 8px;
  font-size: 20px;
}

.promo p {
  margin: 0 0 14px;
  color: var(--muted);
  max-width: 62ch;
}

/* SK-QA-PROMO-SIZES: размеры не зажимать «~62 буквы» и не держать в одну линию —
   иначе на окне ~900 обрезаются. Текст сезона (.promo p) как был. */
.promo p.promo-sizes {
  max-width: none;
  white-space: normal;
}

.promo-btn {
  display: inline-block;
  background: var(--orange);
  color: #fff;
  font-weight: 800;
  border-radius: 12px;
  padding: 10px 18px;
}

/* Узкая полоса сезона на главной (не плакат) */
.promo-slim {
  display: block;
  margin: 16px 0 12px;
  padding: 14px 18px 12px;
  border-left: 3px solid var(--orange);
}
.promo-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 6px;
}
.promo-slim h2 {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: -0.02em;
}
.promo-slim .promo-lead {
  margin: 0 0 8px;
  max-width: none;
  font-size: 14px;
  line-height: 1.5;
  color: var(--muted);
}
.promo-slim .promo-btn {
  flex-shrink: 0;
  padding: 8px 14px;
  font-size: 13px;
  font-weight: 700;
  border-radius: 10px;
}
.promo-links {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
  margin: 0 0 6px;
  font-size: 13px;
  font-weight: 600;
}
.promo-links a {
  color: var(--ink);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.promo-sizes {
  margin: 0;
  max-width: none;
  font-size: 12px;
  color: var(--muted);
  white-space: normal;
}
.promo-sizes b {
  display: block;
  margin-bottom: 4px;
  font-weight: 700;
}
.promo-sizes-list {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 20px;
}
.promo-sizes-list a {
  color: var(--orange);
  font-weight: 700;
  white-space: nowrap;
}

.trust {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  padding: 4px 0 4px;
  align-items: start;
}

.trust strong {
  display: block;
  font-size: 22px;
  letter-spacing: -0.03em;
  margin-bottom: 4px;
}

.trust p {
  margin: 0;
  color: var(--muted);
  font-size: 14px;
}

/* Подсказка «Цены»: «Подробнее» сразу после «лучше.», не с новой строки. Плашка шагов — блоком ниже. */
.trust-price p.trust-lead {
  display: inline;
  margin: 0;
}
.trust-how {
  display: inline;
  margin: 0;
}
.trust-how summary {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-left: 0.35em;
  cursor: pointer;
  font-size: 13px;
  font-weight: 700;
  color: #fd700b;
  text-decoration: underline;
  text-underline-offset: 2px;
  list-style: none;
}
.trust-how summary::-webkit-details-marker { display: none; }
.trust-how summary::after {
  content: "▾";
  font-size: 11px;
  text-decoration: none;
  line-height: 1;
}
.trust-how[open] summary::after { content: "▴"; }
.trust-how-box {
  display: block;
  margin-top: 10px;
  padding: 10px 12px 12px;
  background: #fff;
  border: 1px solid #e6e1d8;
  border-left: 3px solid #fd700b;
  border-radius: 10px;
}
.trust-how-box ol {
  margin: 0;
  padding-left: 1.2em;
  font-size: 13px;
  line-height: 1.45;
  color: #1c1a17;
}
.trust-how-box li { margin: 0 0 6px; }
.trust-how-box li:last-of-type { margin-bottom: 0; }

/* Отзывы на главной — SK-HOME-REVIEWS. Карточки как на эскизе /reviews/, не старый серый блок. */
.home-reviews {
  padding: 0 0 20px;
}

.home-rev-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  margin: 0 0 12px;
}

.home-rev-head h2 {
  margin: 0;
  font-size: 24px;
  font-weight: 700;
  letter-spacing: -0.03em;
}

.home-rev-head a {
  font-size: 14px;
  font-weight: 700;
  text-decoration: underline;
  text-decoration-style: dashed;
  text-underline-offset: 3px;
}

.home-rev-head a:hover { color: var(--orange); }

.home-rev-grid {
  display: grid;
  grid-template-columns: minmax(200px, 0.85fr) repeat(3, minmax(0, 1fr));
  gap: 16px;
  align-items: start;
}

.home-rev-ask,
.home-rev-card {
  background: var(--card);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 16px 18px;
  display: flex;
  flex-direction: column;
}

.home-rev-ask {
  gap: 12px;
}

.home-rev-ask h3 {
  margin: 0;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.25;
}

.home-rev-write {
  display: block;
  width: 100%;
  box-sizing: border-box;
  background: var(--orange);
  color: #fff;
  font-weight: 800;
  font-size: 14px;
  text-align: center;
  border-radius: 12px;
  padding: 12px 14px;
}

.home-rev-write:hover { background: var(--orange-hover); color: #fff; }

.home-rev-card-top {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}

.home-rev-name {
  margin: 0 0 4px;
  font-weight: 700;
}

.home-rev-stars {
  margin: 0;
  color: #d8d0c8;
  letter-spacing: 1px;
  font-size: 16px;
  line-height: 1;
}

.home-rev-stars .is-on { color: var(--orange); }

.home-rev-meta {
  text-align: right;
  font-size: 12px;
  color: var(--muted);
  white-space: nowrap;
}

.home-rev-src {
  display: inline-block;
  margin-left: 8px;
  padding: 2px 8px;
  background: var(--canvas);
  border-radius: 999px;
  font-weight: 600;
  color: inherit;
  text-decoration: none;
}

a.home-rev-src {
  text-decoration: underline;
  text-underline-offset: 2px;
}

a.home-rev-src:hover { color: var(--orange); }

.home-rev-text {
  margin: 0;
  font-size: 14px;
  line-height: 1.5;
  color: var(--ink);
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 6;
  line-clamp: 6;
  overflow: hidden;
}

/* Подвал */

.footer {
  border-top: 1px solid var(--line);
  padding: 28px 0 40px;
  color: var(--muted);
  font-size: 14px;
  background: var(--card);
}

.footer-grid {
  display: grid;
  grid-template-columns: 1.2fr 0.8fr 1fr 1.1fr;
  gap: 24px;
}

.footer h3 {
  margin: 0 0 10px;
  font-size: 13px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--ink);
}

.footer ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.footer li { margin: 0 0 6px; }

.footer-brand {
  margin: 0 0 8px;
  font-weight: 800;
  color: var(--ink);
}

.footer-legal {
  margin: 10px 0 0;
  font-size: 13px;
}

.footer-legal a {
  color: var(--muted);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.footer-legal a:hover { color: var(--orange); }

/* Нижняя полоска как на живом телефоне — не ломаем состав */

.mobile-bar {
  display: none;
  position: fixed;
  left: 8px;
  right: 8px;
  bottom: 8px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 16px;
  box-shadow: var(--shadow);
  padding: 8px 6px;
  justify-content: space-around;
  font-size: 11px;
  font-weight: 700;
  z-index: 30;
}

.mobile-bar .is-on { color: var(--orange); }

/* PREP-9.2-CART-M1 kolesa-prep-92-cart-m1: цифра корзины — кружок рядом со словом, не «Корзина8» */
.mobile-bar a {
  flex: 1;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-height: 44px;
  color: var(--muted);
  position: relative;
}

.mobile-bar .n,
.mobile-bar .mobile-menu__cart-count {
  position: static;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  border-radius: 8px;
  background: var(--orange);
  color: #fff;
  font-size: 10px;
  font-weight: 800;
  line-height: 1;
  flex-shrink: 0;
}

.mobile-bar .mobile-menu__cart-count[hidden] {
  display: none !important;
}

/* SK-QA-FILTER-WRAP: на окне ~900–1024 поля в один ряд вылезают (особенно «по авто»).
   Перенос с 1200, не с 800. overflow-x не прячем — иначе обрежется выпавший список. */
@media (max-width: 1200px) {
  .fields,
  .fields-truck,
  .fields-auto,
  .fields-auto.is-disks,
  .fields-rear,
  .fields-tires,
  .fields-tires.is-truck,
  .fields-disks,
  form#filter-tires.is-stagger > .fields,
  #filter-tires.is-stagger > .fields-tires,
  form#filter-disks.is-stagger > .fields-disks,
  div#filter-disks.is-stagger > .fields-disks,
  #filter-tires .fields-tires ~ .axle-rear .fields-rear,
  #disk-rear .fields-rear {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    grid-template-areas: none;
    justify-content: stretch;
  }

  #disk-rear .fields-rear .field:nth-child(3) {
    grid-column: auto;
  }

  .fields .filter-go > .show {
    width: 100%;
  }

  /* class="field fld-fw", не [class^="fld-"] — иначе именованные ячейки остаются и окна наезжают */
  .is-stagger .axle-front-label,
  .is-stagger .axle-rear-label,
  .is-stagger .field,
  .is-stagger > .fields > .show:not(.field),
  .is-stagger .fields-tires > .show:not(.field),
  .is-stagger .fields-disks > .show:not(.field),
  .is-stagger .fields-tires > .filter-go,
  .is-stagger .fields-disks > .filter-go {
    grid-area: auto;
    grid-column: auto;
    grid-row: auto;
    align-self: stretch;
  }

  .is-stagger .axle-front-label,
  .is-stagger .axle-rear-label,
  .fields > .show:not(.field),
  .fields > .filter-go,
  .fields-truck > #modef > .show,
  .is-stagger .fields-tires > .filter-go,
  .is-stagger .fields-disks > .filter-go,
  .is-stagger > .fields > .show:not(.field) {
    grid-column: 1 / -1;
    width: 100%;
  }
}

/* PREP-9.2-HOME-FACE-1: на ПК лицо как эскиз v4 — узкие окошки 108px в одном ряду,
   поиск рядом с Шины/Диски. Правило 1200 растягивало окна на полкарточки
   и скидывало поиск вниз: так выглядит Firefox, если окно чуть уже 1280. */
@media (min-width: 801px) {
  .header-main-inner {
    flex-wrap: nowrap;
  }

  header.header form.search,
  form.search {
    order: 0;
    flex: 1 1 140px;
    min-width: 0;
    width: auto;
    max-width: none;
  }

  .header-shop {
    order: 0;
    flex: 0 0 auto;
  }

  /* PREP-9.2-TRUCK-SHOW-1: грузовые — три окна + узкое «Показать», не колонка сезона 210 px */
  body.kolesa-prep-91c main.main-home .fields:not(.fields-auto):not(.fields-tires):not(.fields-truck):not(.fields-disks) {
    grid-template-columns: var(--fld-num) var(--fld-num) var(--fld-num) var(--fld-season) auto;
    justify-content: start;
  }

  body.kolesa-prep-91c main.main-home .fields-truck,
  body.kolesa-prep-91c main.main-home.k9c-is-truck .fields:not(.fields-auto):not(.fields-tires):not(.fields-disks) {
    grid-template-columns: var(--fld-num) var(--fld-num) var(--fld-num) auto;
    justify-content: start;
  }

  body.kolesa-prep-91c main.main-home .fields-disks:not(.fields-auto) {
    grid-template-columns: var(--fld-num) var(--fld-num) var(--fld-pcd) var(--fld-num) var(--fld-num) auto;
    justify-content: start;
  }

  /* PREP-9.2-AUTO-FACE-1: «По авто» — марка 224 / модель 280 / год 108 / сезон 210 / узкое «Показать» */
  body.kolesa-prep-91c main.main-home .fields-auto:not(.is-disks) {
    grid-template-columns: var(--fld-auto-mark) var(--fld-auto-model) var(--fld-num) var(--fld-season) auto;
    justify-content: start;
  }

  body.kolesa-prep-91c main.main-home .fields-auto.is-disks {
    grid-template-columns: var(--fld-auto-mark) var(--fld-auto-model) var(--fld-num) auto;
    justify-content: start;
  }

  body.kolesa-prep-91c main.main-home .fields:not(.fields-auto) > #modef > .show,
  body.kolesa-prep-91c main.main-home .fields:not(.fields-auto) > .show:not(.field),
  body.kolesa-prep-91c main.main-home .fields:not(.fields-auto) > .filter-go,
  body.kolesa-prep-91c main.main-home .fields-truck > #modef > .show,
  body.kolesa-prep-91c main.main-home .fields-disks:not(.fields-auto) > #modef > .show,
  body.kolesa-prep-91c main.main-home .fields-auto > .show:not(.field) {
    grid-column: auto;
    width: auto;
    justify-self: start;
  }

  body.kolesa-prep-91c main.main-home .form-group.field {
    width: auto;
    max-width: 100%;
  }

  .logo,
  .nav,
  .header-shop {
    flex-shrink: 0;
  }
}

@media (max-width: 800px) {
  .header-top-inner,
  .header-main-inner {
    flex-wrap: wrap;
    min-height: 0;
    padding: 8px 0;
    gap: 10px;
  }

  .search {
    order: 5;
    flex: 1 1 100%;
    margin-left: 0;
    min-width: 0;
  }

  .nav { gap: 14px; }

  .trust,
  .home-rev-grid,
  .footer-grid {
    grid-template-columns: 1fr;
  }

  .home-rev-ask,
  .home-rev-card { min-height: 0; }

  .logo-line { font-size: 18px; }
  .filter-card h1 { font-size: 20px; }
  .promo-top { flex-wrap: wrap; }
  .promo-slim .promo-btn { width: 100%; text-align: center; }
  .promo-sizes { white-space: normal; }

  .mobile-bar { display: flex; }

  /* SK-QA-BODY-PAD: запас под нижнее меню телефона */
  body { padding-bottom: 72px; }
}

/* --- PREP-9.1c-C: мотор + склейка с Битрикс, не красим живой корень --- */

body.kolesa-prep-91c {
  background: var(--canvas);
  padding-bottom: 0;
}

body.kolesa-prep-91c .wrapper,
body.kolesa-prep-91c .content-wrapper,
body.kolesa-prep-91c .kolesa-prep-91c-wrap {
  margin: 0;
  padding: 0;
  max-width: none;
  background: var(--canvas);
  min-height: 0;
}

body.kolesa-prep-91c .sketch-banner.sketch-prep {
  background: #e7f0e4;
  color: #2f4a28;
  border-bottom: 1px solid #b7c9b0;
}

form.form-filter {
  display: none;
  margin: 0;
}

form.form-filter.shown {
  display: block;
}

.kolesa-prep-91c-motor {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}

.form-group.field > .form-group__title {
  display: none;
}

.form-group.field > .field-name,
.field > .field-name {
  pointer-events: none;
  position: relative;
  z-index: 1;
}

/* STEP9-FACE-HIT-1: кнопка на всё окошко — щёлкнули в рамку, подпись или стрелку */
.form-group.field > .dropdown-toggle,
.form-group.field > button.dropdown-toggle,
.form-group.field > .field-val {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 2;
  display: block;
  box-sizing: border-box;
  width: auto !important;
  max-width: none;
  height: auto !important;
  min-height: 0;
  margin: 0;
  padding: 22px 32px 7px 12px;
  border: 0;
  background: transparent;
  box-shadow: none;
  outline: none;
  -webkit-tap-highlight-color: transparent;
  text-align: left;
  font: inherit;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.2;
  color: var(--ink);
  cursor: pointer;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* STEP9-FACE-TYPE-1: печатаете в том же месте, где было «Все» */
.form-group.field > input.field-typein {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 3;
  box-sizing: border-box;
  width: auto;
  max-width: none;
  height: auto;
  min-height: 0;
  margin: 0;
  padding: 22px 32px 7px 12px;
  border: 0;
  background: transparent;
  box-shadow: none;
  outline: none;
  color-scheme: light;
  caret-color: var(--ink);
  text-align: left;
  font: inherit;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.2;
  color: var(--ink);
  -webkit-text-fill-color: var(--ink);
  cursor: text;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.form-group.field.is-typein > .dropdown-toggle,
.form-group.field.is-typein > button.dropdown-toggle,
.form-group.field.is-typein > .field-val {
  color: transparent;
  -webkit-text-fill-color: transparent;
  pointer-events: none;
}

.field > .dropdown-menu li.hidden {
  display: none !important;
}

.k9c-pick-typein,
.k9c-home-pick .k9c-pick-typein,
#k9c-sheet-pick .k9c-pick-typein {
  position: static;
  display: block;
  z-index: auto;
  box-sizing: border-box;
  width: 100%;
  min-height: 44px;
  margin: 0 0 10px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--canvas);
  font: inherit;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.2;
  color: var(--ink);
  -webkit-text-fill-color: var(--ink);
  flex-shrink: 0;
}

.k9c-pick-typein:focus,
.form-group.field > input.field-typein:focus,
.form-group.field > input.field-typein:focus-visible,
.form-group.field > .dropdown-toggle:focus,
.form-group.field > .dropdown-toggle:focus-visible {
  outline: none;
  box-shadow: none;
}

.form-group.field > input.field-typein::selection,
.k9c-pick-typein::selection {
  background: #fff4e8;
  color: var(--ink);
}

.form-group.field > .dropdown-toggle::after {
  display: none;
}

.fields > #modef {
  display: contents;
}

a.show.btn-filter-result,
button.show {
  text-decoration: none;
}

a.show.btn-filter-result:hover,
button.show:hover {
  color: #fff;
  background: var(--orange-hover);
}

/* Список из окошка вниз, как на эскизе. Не Bootstrap dropup и не сдвиг Popper на заголовок. */
.field > .dropdown-menu,
.field > .dropdown-menu.show,
.field > .field-pop {
  position: absolute !important;
  left: 0 !important;
  right: auto !important;
  top: calc(100% + 6px) !important;
  bottom: auto !important;
  z-index: 50;
  float: none !important;
  min-width: 100%;
  margin: 0 !important;
  padding: 6px 0;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--card);
  box-shadow: 0 12px 32px rgba(40, 32, 24, 0.14);
  transform: none !important;
  -webkit-transform: none !important;
  will-change: auto;
  width: 100% !important;
  min-width: 100% !important;
  max-width: none;
}

.field > .dropdown-menu .search,
.field > .dropdown-menu .btn-confirm,
.field > .dropdown-menu .btn-reset,
.field > .dropdown-menu .checkbox-custom {
  display: none !important;
}

.field-pop-list,
.field > .dropdown-menu .list-checkbox {
  max-height: 240px;
  overflow: auto;
  margin: 0;
  padding: 0;
  list-style: none;
}

.field > .dropdown-menu .select-filter {
  display: block;
  width: 100%;
  min-height: 40px;
  margin: 0;
  padding: 8px 14px;
  cursor: pointer;
  font-size: 14px;
  font-weight: 600;
}

.field > .dropdown-menu .select-filter:hover,
.field > .dropdown-menu .select-filter.selected {
  background: #fff4e8;
}

.header-shop {
  display: flex;
  align-items: center;
  gap: 16px;
  font-size: 14px;
  font-weight: 700;
}

.header-shop .fav b,
.header-shop .cart b {
  font-weight: 800;
  color: var(--orange);
}

.search input {
  width: 100%;
  border: 0;
  background: none;
  font: inherit;
  font-size: 16px;
  outline: none;
}

.buyers {
  position: relative;
}

.buyers summary {
  cursor: pointer;
  list-style: none;
  color: var(--muted);
}

.buyers summary::-webkit-details-marker { display: none; }

.buyers-menu {
  position: absolute;
  z-index: 40;
  left: 0;
  top: calc(100% + 8px);
  min-width: 220px;
  margin: 0;
  padding: 8px 0;
  list-style: none;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 12px;
  box-shadow: 0 12px 32px rgba(40, 32, 24, 0.14);
}

.buyers-menu a {
  display: block;
  padding: 8px 14px;
  min-height: 40px;
}

.kolesa-season-promo .container {
  width: 100%;
  max-width: none;
  padding: 0;
  margin: 0;
}

.kolesa-season-promo {
  margin: 16px 0 12px;
  padding: 14px 18px 12px;
  background: #fff8f1;
  border: 1px solid #f3e0cc;
  border-left: 3px solid var(--orange);
  border-radius: var(--radius);
}

.kolesa-season-promo__badge { display: none; }

.kolesa-season-promo__inner {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.kolesa-season-promo__title {
  margin: 0 0 6px;
  font-size: 18px;
  font-weight: 700;
}

.kolesa-season-promo__lead {
  margin: 0 0 8px;
  font-size: 14px;
  color: var(--muted);
}

/* Как на живой витрине: ПК — полный текст, телефон — короткий */
.kolesa-season-copy--short {
  display: none !important;
}
.kolesa-season-copy--full {
  display: block;
}

.kolesa-season-promo__links {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
  font-size: 13px;
  font-weight: 600;
}

.kolesa-season-promo__links a { text-decoration: underline; text-underline-offset: 2px; }

.kolesa-season-promo__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 8px 14px;
  border-radius: 10px;
  background: var(--orange);
  color: #fff !important;
  font-weight: 700;
  white-space: nowrap;
}

.kolesa-size-nav__label {
  display: block;
  margin: 8px 0 4px;
  font-size: 12px;
  font-weight: 800;
}

.kolesa-size-nav__list {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 20px;
  font-size: 12px;
  font-weight: 700;
}

.kolesa-size-nav__link {
  color: var(--orange);
  font-weight: 700;
  white-space: nowrap;
  text-decoration: none;
}

.kolesa-size-nav__sep { display: none; }

#k9c-hint-line {
  display: none;
  margin: 10px 0 0;
}

#k9c-hint-line button {
  padding: 0;
  border: 0;
  background: none;
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  color: var(--orange);
  text-decoration: underline;
  cursor: pointer;
  min-height: 44px;
}

.m-seasons {
  display: none;
  gap: 6px;
  margin-bottom: 10px;
}

.m-chip {
  flex: 1;
  min-height: 44px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--card);
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}

.m-chip.is-on {
  background: #fff4e8;
  border-color: var(--orange);
  color: var(--orange);
}

body.kolesa-prep-91c .modal {
  position: fixed;
  inset: 0;
  z-index: 1080;
  background: transparent;
}
body.kolesa-prep-91c .modal.show {
  display: flex !important;
  align-items: center;
  justify-content: center;
  padding: 24px 16px;
  height: auto;
  background: transparent;
}
body.kolesa-prep-91c .modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1070;
  background: rgba(28, 26, 23, 0.45);
}
body.kolesa-prep-91c .modal-dialog {
  margin: 0;
  max-width: 440px;
  width: 100%;
  max-height: calc(100vh - 48px);
}
body.kolesa-prep-91c .modal-content {
  background: var(--card);
  color: var(--ink);
  border-radius: 16px;
  border: 1px solid var(--line);
  box-shadow: 0 16px 48px rgba(40, 32, 24, 0.18);
  overflow: auto;
}
body.kolesa-prep-91c .modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 20px 24px 8px;
  border: 0;
}
body.kolesa-prep-91c .modal-header h2 {
  margin: 0;
  font-size: 22px;
}
body.kolesa-prep-91c .modal-header .close {
  width: 40px;
  height: 40px;
  padding: 0;
  border: 0;
  background: none;
  opacity: 1;
}
body.kolesa-prep-91c .modal-body {
  padding: 8px 24px 24px;
}
body.kolesa-prep-91c .modal-body label {
  display: block;
  margin: 0 0 12px;
}
body.kolesa-prep-91c .modal-body .input-title {
  display: block;
  margin-bottom: 4px;
  font-size: 13px;
  font-weight: 600;
  color: var(--muted);
}
body.kolesa-prep-91c .modal-body .btn,
body.kolesa-prep-91c .modal-body .btn-accent {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 48px;
  margin-top: 8px;
  border: 0;
  border-radius: 12px;
  background: var(--orange);
  color: #fff;
  font: inherit;
  font-size: 16px;
  font-weight: 800;
}
body.kolesa-prep-91c .modal .svg-icon {
  width: 14px;
  height: 14px;
  display: inline-block;
  fill: currentColor;
}
body.kolesa-prep-91c .modal .necessarily-icon,
body.kolesa-prep-91c .modal .necessarily {
  display: none;
}

body.kolesa-prep-91c .modal-body input[type="text"],
body.kolesa-prep-91c .modal-body input[type="tel"],
body.kolesa-prep-91c .modal-body input[type="email"],
body.kolesa-prep-91c .modal-body input[type="password"] {
  min-height: 44px;
  font-size: 16px;
}

@media (min-width: 801px) {
  #k9c-chips,
  #k9c-hint-line { display: none !important; }
}

@media (max-width: 800px) {
  .header-top { display: none; }
  .nav,
  .header-shop { display: none !important; }
  .search { display: none !important; }
  .header.is-m-search .search {
    display: flex !important;
    flex: 1 1 100%;
    order: 10;
    margin-left: 0;
  }
  .m-head-icos {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
    flex: 0 0 auto;
  }
  .m-ico {
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    border-radius: 12px;
    background: var(--canvas);
    color: var(--ink);
    flex-shrink: 0;
  }
  .m-ico svg { width: 20px; height: 20px; }
  .m-ico.is-call {
    background: var(--orange);
    color: #fff;
  }
  .m-ico.is-on {
    background: var(--ink);
    color: #fff;
  }
  .header-main-inner {
    justify-content: flex-start;
    flex-wrap: wrap;
    min-height: 52px;
    padding: 8px 0;
    gap: 8px;
  }
  .logo-line {
    font-size: 16px;
    margin-right: 0;
  }
  body.kolesa-prep-91c .wrap {
    width: calc(100% - 24px);
  }
  body.kolesa-prep-91c .hero {
    padding: 12px 0 0;
  }
  body.kolesa-prep-91c .filter-card {
    padding: 14px 14px 12px;
  }
  body.kolesa-prep-91c .fields,
  body.kolesa-prep-91c .fields-disks {
    gap: 8px;
  }
  body.kolesa-prep-91c .field {
    min-height: 52px;
    padding: 6px 22px 6px 10px;
    background-position: right 8px center;
  }
  body.kolesa-prep-91c .form-group.field > .dropdown-toggle,
  body.kolesa-prep-91c .form-group.field > button.dropdown-toggle,
  body.kolesa-prep-91c .form-group.field > .field-val {
    padding: 18px 22px 6px 10px;
  }
  body.kolesa-prep-91c .form-group.field > input.field-typein {
    padding: 18px 22px 6px 10px;
  }
  body.kolesa-prep-91c .field .field-name,
  body.kolesa-prep-91c .field label {
    font-size: 10px;
    overflow: visible;
    text-overflow: clip;
  }
  /* kolesa-prep-91c-mphone */
  /* PREP-9.2-HOME-KIND-1: Шины/Диски → Легковые/Грузовые → По размеру/По авто */
  .filter-switch {
    flex-direction: column;
    align-items: stretch;
  }
  .filter-switch .tabs { order: 1; }
  .filter-kind { order: 2; width: 100%; flex: none; }
  .filter-switch .modes { order: 3; }
  .tabs,
  .modes,
  .filter-kind {
    width: 100%;
  }
  .tab,
  .mode,
  .kind {
    flex: 1;
    min-height: 44px;
    font-size: 13px;
    padding: 8px 12px;
  } /* kolesa-prep-92-type-1: как m-home 13, рамка 44 */

  /* Только телефон: «Показать» 48 как m-home. ПК главная остаётся 56. */
  a.show,
  button.show,
  a.show.btn-filter-result {
    height: 48px;
  }
  main.main-home:not(.k9c-is-auto):not(.k9c-is-disks):not(.k9c-is-truck) .fld-season {
    display: none;
  }
  main.main-home.k9c-is-truck .fld-season,
  main.main-home.k9c-is-truck #k9c-chips,
  main.main-home.k9c-is-truck form.podborFromAuto {
    display: none !important;
  }
  #k9c-chips:not([hidden]) { display: flex; }
  #k9c-hint-line { display: block; }
  .fields,
  .fields-disks {
    grid-template-columns: 1fr 1fr 1fr;
    justify-content: stretch;
  }
  .fields-auto,
  .fields-auto.is-disks {
    grid-template-columns: 1fr 1fr;
  }
  .fields-auto > .field:first-child,
  .fields-auto > .field:nth-child(2) {
    grid-column: 1 / -1;
  }
  /* PREP-9.2-DISK-AUTO-1: диски + «По авто» — без сезона шин, год на всю ширину как m-home */
  main.main-home.k9c-is-disks #k9c-chips,
  main.main-home.k9c-is-disks #fld-auto-season,
  main.main-home.k9c-is-disks .fields-auto .fld-season {
    display: none !important;
  }
  main.main-home.k9c-is-auto.k9c-is-disks .fields-auto,
  main.main-home.k9c-is-auto.k9c-is-disks .fields-auto.is-disks {
    grid-template-columns: 1fr;
  }
  main.main-home.k9c-is-auto.k9c-is-disks .fields-auto > .field {
    grid-column: 1 / -1;
  }
  /* PREP-9.2-PICK-1: «Показать» на ширину; открытое окошко не раздувать — список в шторке */
  .fields .show:not(.field),
  .fields-disks .show:not(.field),
  .fields-auto .show:not(.field),
  .fields > #modef > .show {
    grid-column: 1 / -1;
    width: 100%;
  }
  .footer { display: none; }
  .kolesa-season-promo__inner { flex-direction: column; }
  .kolesa-season-promo__btn { width: 100%; }
  .kolesa-season-copy--full { display: none !important; }
  .kolesa-season-copy--short { display: block !important; }
  .mobile-bar {
    height: 64px;
    padding: 0;
  }
  /* Служебная полоска короче: на эскизе её нет, иначе размеры уезжают под меню */
  .sketch-banner.sketch-prep {
    font-size: 12px;
    line-height: 1.25;
    padding: 6px 12px;
  }
  body.kolesa-prep-91c .filter-card h1 { margin-bottom: 8px; }
  body.kolesa-prep-91c .filter-switch {
    margin-bottom: 8px;
    gap: 8px;
  }
  body.kolesa-prep-91c .kolesa-season-promo {
    padding: 12px 14px;
  }
  body.kolesa-prep-91c .kolesa-season-promo__title {
    font-size: 16px;
    margin-bottom: 4px;
  }
  /* Как на m-home: запас под полосу 64px, чтобы «Популярные размеры» не прятались */
  body.kolesa-prep-91c { padding-bottom: calc(64px + 80px); }
  /* PREP-9.2-AUTO-BAR-1: вкладка «По авто» — кнопка 48px как m-show, ссылка размера без лишней высоты 44px.
     Плюс чуть короче карточка и зимний блок, чтобы «Смотреть каталог» не пряталась под полосой (~64px + тень). */
  main.main-home.k9c-is-auto .fields-auto .show,
  main.main-home.k9c-is-auto button.show {
    height: 48px;
  }
  main.main-home.k9c-is-auto #k9c-hint-line {
    margin-top: 8px;
  }
  main.main-home.k9c-is-auto #k9c-hint-line button {
    min-height: 0;
  }
  body.kolesa-prep-91c main.main-home.k9c-is-auto .filter-card {
    padding: 10px 14px 8px;
  }
  body.kolesa-prep-91c main.main-home.k9c-is-auto .filter-card h1 {
    margin-bottom: 4px;
  }
  main.main-home.k9c-is-auto .fields-auto .field {
    min-height: 48px;
  }
  main.main-home.k9c-is-auto .kolesa-season-promo {
    margin-top: 8px;
    padding: 10px 14px 8px;
  }
  main.main-home.k9c-is-auto .kolesa-season-promo__lead {
    margin-bottom: 4px;
  }
}

@media (max-width: 400px) {
  /* Шины + «По авто»: ссылку прячем, чтобы «Смотреть каталог» осталась выше полосы (AUTO-BAR-1). */
  body.kolesa-prep-91c main.main-home.k9c-is-auto:not(.k9c-is-disks) #k9c-hint-line {
    display: none !important;
  }
  /* PREP-9.2-HINT-DISK-AUTO-1: диски + «По авто» — сезона нет, ссылка как на «По размеру» */
  body.kolesa-prep-91c main.main-home.k9c-is-auto.k9c-is-disks #k9c-hint-line {
    display: block !important;
  }
}

@media (max-width: 370px) {
  /* Узкий телефон: ссылка текстом, зимний блок чуть короче — «Смотреть каталог» выше полосы */
  body.kolesa-prep-91c main.main-home.k9c-is-auto.k9c-is-disks #k9c-hint-line {
    margin-top: 4px;
  }
  body.kolesa-prep-91c main.main-home.k9c-is-auto.k9c-is-disks .filter-card {
    padding-bottom: 4px;
  }
  body.kolesa-prep-91c main.main-home.k9c-is-auto.k9c-is-disks .kolesa-season-promo {
    margin-top: 4px;
    padding: 8px 14px 4px;
  }
}

/* Без старого main.css окно «товар добавлен» и прелоадер торчат внизу (огромные иконки из спрайта). */
body.kolesa-prep-91c:not(.kolesa-prep-92) .tooltip-box {
  display: none !important;
}
body.kolesa-prep-91c #preloader:not(.preloader-animated):not(.preloader-animated-filter) {
  display: none !important;
}

/* PREP-9.2-HINT-1 kolesa-prep-92-hint-1: окно «Как узнать размер» — как эскиз step9-filter-hint / m-filter-hint */
body.kolesa-prep-91c .k9c-hint-dlg {
  position: fixed;
  inset: 0;
  z-index: 1090;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px 16px;
}
body.kolesa-prep-91c .k9c-hint-dlg[hidden] {
  display: none !important;
}
body.kolesa-prep-91c .k9c-hint-back {
  position: absolute;
  inset: 0;
  background: rgba(28, 26, 23, 0.45);
}
body.kolesa-prep-91c .k9c-hint-card {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 760px;
  max-height: calc(100vh - 48px);
  overflow: auto;
  background: var(--card);
  border-radius: var(--radius);
  box-shadow: 0 16px 48px rgba(40, 32, 24, 0.18);
  padding: 28px 24px 22px;
}
body.kolesa-prep-91c .k9c-hint-x {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 40px;
  height: 40px;
  border: 0;
  background: none;
  font-size: 26px;
  line-height: 1;
  color: var(--muted);
  cursor: pointer;
}
body.kolesa-prep-91c .k9c-hint-card h2 {
  margin: 0 28px 8px 0;
  font-size: 22px;
  letter-spacing: -0.03em;
}
body.kolesa-prep-91c .k9c-hint-tabs {
  display: flex;
  gap: 8px;
  margin: 0 28px 16px 0;
}
body.kolesa-prep-91c .k9c-hint-tabs button {
  flex: 1;
  height: 40px;
  min-height: 44px;
  border: 1px solid var(--line);
  background: var(--card);
  border-radius: 999px;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
  color: var(--ink);
}
body.kolesa-prep-91c .k9c-hint-tabs button.is-on {
  background: var(--ink);
  color: #fff;
  border-color: var(--ink);
}
body.kolesa-prep-91c .k9c-hint-figure {
  margin: 0 0 10px;
}
body.kolesa-prep-91c .k9c-hint-figure img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 12px;
  background: #f2efe8;
}
body.kolesa-prep-91c .k9c-hint-caption {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin: 8px 0 4px;
  font-size: 12px;
  line-height: 1.4;
  color: var(--muted);
}
body.kolesa-prep-91c .k9c-hint-size {
  margin: 0 0 12px;
  font-size: 22px;
  font-weight: 800;
  letter-spacing: -0.03em;
}
body.kolesa-prep-91c .k9c-hint-list {
  margin: 0;
  padding: 0;
  list-style: none;
}
body.kolesa-prep-91c .k9c-hint-list li {
  display: grid;
  grid-template-columns: 7.5rem 1fr;
  gap: 10px;
  padding: 8px 0;
  border-top: 1px solid var(--line);
  font-size: 14px;
  line-height: 1.4;
}
body.kolesa-prep-91c .k9c-hint-list b {
  font-size: 15px;
}
body.kolesa-prep-91c .k9c-hint-where {
  margin: 12px 0 0;
  font-size: 13px;
  line-height: 1.45;
  color: var(--muted);
}
body.kolesa-prep-91c .k9c-hint-where a {
  color: var(--orange);
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 2px;
}
body.kolesa-prep-91c .k9c-hint-ok {
  width: 100%;
  height: 48px;
  min-height: 44px;
  margin-top: 14px;
  border: 0;
  border-radius: 12px;
  background: var(--orange);
  color: #fff;
  font: inherit;
  font-size: 16px;
  font-weight: 800;
  cursor: pointer;
}

@media (max-width: 800px) {
  body.kolesa-prep-91c .k9c-hint-dlg {
    align-items: flex-end;
    padding: 0;
  }
  body.kolesa-prep-91c .k9c-hint-card {
    max-width: none;
    max-height: 100%;
    border-radius: 20px 20px 0 0;
    padding: 18px 16px calc(16px + env(safe-area-inset-bottom, 0px));
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
  }
  body.kolesa-prep-91c .k9c-hint-x {
    top: 6px;
    right: 6px;
    width: 44px;
    height: 44px;
  }
  body.kolesa-prep-91c .k9c-hint-card h2 {
    font-size: 20px;
  }
  body.kolesa-prep-91c .k9c-hint-tabs {
    margin: 0 0 14px;
  }
  body.kolesa-prep-91c .k9c-hint-size {
    font-size: 18px;
  }
  body.kolesa-prep-91c .k9c-hint-caption {
    grid-template-columns: 1fr;
    gap: 6px;
  }
  body.kolesa-prep-91c .k9c-hint-list li {
    grid-template-columns: 7rem minmax(0, 1fr);
    font-size: 13px;
  }
}

/* PREP-9.2-G1: телефон — «Смотреть каталог» сразу под текстом про склад, размеры круглыми таблетками как m-home.
   ПК (~1280) не трогаем: кнопка справа от заголовка, размеры строкой. Живой корень этот файл не грузит. */
@media (max-width: 800px) {
  body.kolesa-prep-91c .kolesa-season-promo .container,
  body.kolesa-prep-91c .kolesa-season-promo__inner,
  body.kolesa-prep-91c .kolesa-season-promo__text,
  body.kolesa-prep-91c .kolesa-season-promo__actions {
    display: contents;
  }
  body.kolesa-prep-91c .kolesa-season-promo {
    display: flex;
    flex-direction: column;
    align-items: stretch;
  }
  body.kolesa-prep-91c .kolesa-season-promo__title { order: 1; }
  body.kolesa-prep-91c .kolesa-season-promo__lead { order: 2; }
  body.kolesa-prep-91c .kolesa-season-promo__btn {
    order: 3;
    width: 100%;
    min-height: 44px;
    margin: 0 0 8px;
    font-size: 13px;
    font-weight: 800;
    text-align: center;
  }
  body.kolesa-prep-91c .kolesa-season-promo__links { order: 4; }
  body.kolesa-prep-91c .kolesa-season-promo .kolesa-size-nav {
    order: 5;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 6px;
    max-width: 100%;
    margin: 10px 0 0;
  }
  body.kolesa-prep-91c .kolesa-season-promo .kolesa-size-nav__label {
    display: block;
    margin: 0;
    font-size: 12px;
    font-weight: 800;
    color: var(--ink);
  }
  body.kolesa-prep-91c .kolesa-season-promo .kolesa-size-nav__list {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
  }
  body.kolesa-prep-91c .kolesa-season-promo .kolesa-size-nav__link {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    padding: 6px 10px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: var(--card);
    color: var(--orange);
    font-size: 12px;
    font-weight: 700;
    text-decoration: none !important;
    white-space: nowrap;
  }
  body.kolesa-prep-91c .kolesa-season-promo .kolesa-size-nav__sep {
    display: none !important;
  }

  /* PREP-9.2-PICK-1: список ширины/марки — шторка на всю ширину, как m-home */
  /* STEP9-FACE-TYPE-2: в шторке только список, поле набора прячем — иначе вылезает клавиатура */
  body.kolesa-prep-91c .k9c-pick-typein,
  body.kolesa-prep-91c .k9c-home-pick .k9c-pick-typein,
  body.kolesa-prep-91c #k9c-sheet-pick .k9c-pick-typein {
    display: none !important;
  }

  body.kolesa-prep-91c.is-k9c-pick {
    overflow: hidden;
  }

  body.kolesa-prep-91c.is-k9c-pick .mobile-bar {
    visibility: hidden;
    pointer-events: none;
  }

  body.kolesa-prep-91c .k9c-home-pick-bg {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 69;
    background: rgba(28, 26, 23, 0.45);
  }

  body.kolesa-prep-91c .k9c-home-pick {
    display: none;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 70;
    max-height: 86%;
    flex-direction: column;
    overflow: hidden;
    background: var(--card);
    border-radius: 20px 20px 0 0;
    padding: 8px 14px 16px;
    box-shadow: var(--shadow);
  }

  body.kolesa-prep-91c.is-k9c-pick .k9c-home-pick-bg,
  body.kolesa-prep-91c.is-k9c-pick .k9c-home-pick {
    display: flex;
  }

  body.kolesa-prep-91c.is-k9c-pick .k9c-home-pick-bg {
    display: block;
  }

  body.kolesa-prep-91c .k9c-home-pick .m-sheet-handle {
    display: block;
    width: 36px;
    height: 4px;
    margin: 6px auto 10px;
    border-radius: 2px;
    background: var(--line);
    flex-shrink: 0;
  }

  body.kolesa-prep-91c .k9c-home-pick .m-pick-back {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    margin: 0 0 8px;
    padding: 0;
    border: 0;
    background: none;
    font: inherit;
    font-size: 14px;
    font-weight: 800;
    color: var(--orange);
    cursor: pointer;
    flex-shrink: 0;
  }

  body.kolesa-prep-91c .k9c-home-pick h2 {
    margin: 0 0 12px;
    font-size: 18px;
    font-weight: 800;
    flex-shrink: 0;
  }

  body.kolesa-prep-91c .k9c-home-pick .m-pick-item[hidden] {
    display: none !important;
  }

  body.kolesa-prep-91c .k9c-home-pick .m-pick-list {
    flex: 1;
    overflow: auto;
    min-height: 0;
    -webkit-overflow-scrolling: touch;
  }

  body.kolesa-prep-91c .k9c-home-pick .m-pick-item {
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 44px;
    padding: 0 12px;
    border: 0;
    border-bottom: 1px solid var(--line);
    background: none;
    text-align: left;
    font: inherit;
    font-size: 16px;
    font-weight: 700;
    color: var(--ink);
    cursor: pointer;
  }

  body.kolesa-prep-91c .k9c-home-pick .m-pick-item.is-on {
    color: var(--orange);
  }

  body.kolesa-prep-91c.is-k9c-pick .field > .dropdown-menu {
    display: none !important;
  }
}

/* PREP-9.2-PICK-1: шторка главной не торчит на компьютере */
body.kolesa-prep-91c .k9c-home-pick-bg,
body.kolesa-prep-91c .k9c-home-pick {
  display: none;
}