/* ==========================================================================
   AROLT v2 · L3 SOLUTIONS · assets/v2/solutions.css
   Владелец: полоса L3 SOLUTIONS (docs/DESIGN-V2.md, раздел 12; кто чем владеет - 9.4).
   Что здесь: решения для ЖК (калькулятор без блока доставки), тендеры и подбор по ТЗ, МВО, подбор для бизнеса, полоса и шторка подборки.
   Правила:
   - каждый селектор начинается с id своего вида: #view-zhk, #view-tenders, #view-mvo, #view-business-selection, #v2 .bp-bar, #v2 .bp-sheet;
   - токены, компоненты и утилиты - из assets/v2/foundation.css (--brand, --r, --shadow,
     .v2-card, .v2-band, .v2-lead-band, .v2-hero, .v2-pagehead, .v2-dot, .v2-pill, .v2-seg …),
     значения не дублировать числами;
   - файл подключён после foundation.css, поэтому при равной силе (1,1,0) побеждает он;
   - !important - только против !important первой версии (раздел 9.2);
   - нужна правка общего или чужого - запрос в …/v2/<полоса>/REQUESTS.md, а не правка здесь.
   ========================================================================== */

/* Разметка страниц решений не меняется (тест site-navigation 310 считает <header class="sol-hero…">),
   поэтому виды .v2-hero, .v2-band, .v2-lead-band, .v2-card повторены здесь селекторами v1 на токенах. */

:is(#view-zhk, #view-tenders, #view-mvo, #view-business-selection) {
  --sol-ic-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232C6033' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E");
  --sol-ic-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='m13 6 6 6-6 6'/%3E%3C/svg%3E");
}

/* Светлые секции (правка 37 от 08.10): класс .v2-alt стоит в разметке - ЖК: подбор и условия; тендеры: подбор
   по ТЗ и товарные группы; МВО: три контейнера, доказательства, расчёт партии. Белая карточка с формой на такой
   секции (и шторка заявки подборки внутри неё): поля снова серые (--field) - фундамент делает поля на .v2-alt
   белыми, а в белой карточке они пропали бы. Подбор для бизнеса - вся секция с карточками объектов. */
:is(#view-zhk, #view-tenders, #view-mvo, #view-business-selection) .v2-alt :is(.sol-picker, .tf__panel, .mvo-form, .trq__form, .bp-sheet__panel)
  :where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]), select, textarea):not(:focus) {
  background-color: var(--field);
}

/* ==========================================================================
   1. Каркас страниц решений: секции без фона, заголовки секций
   ========================================================================== */
:is(#view-zhk, #view-tenders, #view-mvo) .sol-page { padding: 0; color: var(--ink); }
:is(#view-zhk, #view-tenders, #view-mvo) .sol-page > .container:first-child {
  width: min(var(--container), calc(100% - 2 * var(--gutter)));
  margin-inline: auto;
}
:is(#view-zhk, #view-tenders, #view-mvo) .sol-section,
:is(#view-zhk, #view-tenders, #view-mvo) .sol-section--muted,
:is(#view-zhk, #view-tenders, #view-mvo) .sol-section--tight {
  margin-top: var(--block);
  padding: 0;
  background: none;
  scroll-margin-top: calc(var(--hd-h, 80px) + 24px);
}
:is(#view-zhk, #view-tenders, #view-mvo) .sol-page__end { padding-bottom: 0; }
#view-zhk .container.sol-page__end { margin-top: var(--block); }

:is(#view-zhk, #view-tenders, #view-mvo) .sol-heading {
  max-width: none;
  margin: 0 0 var(--head-gap);
}
:is(#view-zhk, #view-tenders, #view-mvo) .sol-heading--row {
  display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between;
  gap: 16px 24px;
}
:is(#view-zhk, #view-tenders, #view-mvo) .sol-heading--row > div { min-width: 0; }
:is(#view-zhk, #view-tenders, #view-mvo, #view-business-selection) .sol-eyebrow {
  display: block;
  margin: 0 0 12px;
  color: var(--brand);
  font-size: 15px; font-weight: 500; line-height: 1.3;
}
:is(#view-zhk, #view-tenders, #view-mvo) :is(.sol-heading h2, .mvo-compat__text h2) {
  margin: 0;
  color: var(--ink);
  font-size: var(--fs-h2); font-weight: 500; line-height: 1.08; letter-spacing: -0.03em;
}
:is(#view-zhk, #view-tenders, #view-mvo) .sol-heading p {
  margin: 16px 0 0;
  color: var(--muted);
  font-size: 17px; line-height: 1.5; font-weight: 400;
}
/* «Вся подборка» у заголовка - вторичная малая кнопка со стрелкой */
:is(#view-zhk, #view-tenders, #view-mvo) .sol-heading--row > .btn {
  flex: none;
  min-height: var(--btn-h-sm); padding: 0 var(--btn-px-sm);
  font-size: 15px; white-space: nowrap;
}
:is(#view-zhk, #view-tenders, #view-mvo) .sol-heading--row > .btn::after {
  content: ""; flex: none; width: 18px; height: 18px;
  background: currentColor;
  -webkit-mask: var(--sol-ic-arrow) center / contain no-repeat;
  mask: var(--sol-ic-arrow) center / contain no-repeat;
  transition: transform var(--speed) var(--ease);
}
:is(#view-zhk, #view-tenders, #view-mvo) .sol-heading--row > .btn:hover::after { transform: translateX(3px); }

/* ==========================================================================
   2. Первый экран ЖК / тендеров / МВО (как .v2-hero): текст слева, фото в карточке справа.
   Обёртки .sol-hero__content (и у МВО .mvo-hero, .mvo-hero__text) раскрыты через display: contents,
   их дети встают в сетку первого экрана; строки 1 и 6 гибкие - текст по центру высоты фото.
   ========================================================================== */
:is(#view-zhk, #view-tenders, #view-mvo) .sol-hero {
  position: relative; isolation: auto;
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  grid-template-rows: 1fr auto auto auto auto 1fr auto;
  column-gap: clamp(32px, 4.4vw, 72px);
  width: auto; max-width: none; min-height: 0;
  margin: 0; padding: 0;
  overflow: visible;
  border: 0; border-radius: 0;
  background: none; box-shadow: none;
  color: var(--ink);
}
:is(#view-zhk, #view-tenders, #view-mvo) .sol-hero::after { content: none; }
:is(#view-zhk, #view-tenders, #view-mvo) .sol-hero__content,
#view-mvo .mvo-hero,
#view-mvo .mvo-hero__text { display: contents; }

:is(#view-zhk, #view-tenders, #view-mvo) .sol-hero__media {
  position: relative; inset: auto; z-index: 0;
  grid-column: 2; grid-row: 1 / 7;
  display: block;
  width: 100%; height: clamp(360px, 38vw, 548px);
  overflow: hidden;
  border-radius: var(--r);
  background: var(--field);
}
:is(#view-zhk, #view-tenders, #view-mvo) .sol-hero__media img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover; object-position: center;
  border-radius: 0;
}

:is(#view-zhk, #view-tenders, #view-mvo) .sol-kicker {
  grid-column: 1; grid-row: 2;
  justify-self: start;
  display: inline-flex; align-items: center; gap: 8px;
  width: auto; min-height: 30px;
  margin: 0 0 clamp(16px, 1.6vw, 22px);
  padding: 0 12px;
  border: 0; border-radius: var(--r-pill);
  background: var(--brand-tint); color: var(--brand-hover);
  font-size: 13px; font-weight: 500; line-height: 1.2;
  white-space: nowrap;
}
:is(#view-zhk, #view-tenders, #view-mvo) .sol-kicker::before {
  content: ""; flex: none; width: 6px; height: 6px; border-radius: 50%; background: var(--brand);
}
:is(#view-zhk, #view-tenders, #view-mvo) .sol-hero h1 {
  grid-column: 1; grid-row: 3;
  margin: 0;
  color: var(--ink);
  font-size: var(--fs-h1); font-weight: 500; line-height: 1.06; letter-spacing: -0.03em;
}
:is(#view-zhk, #view-tenders, #view-mvo) .sol-hero__lead {
  grid-column: 1; grid-row: 4;
  margin: clamp(16px, 1.8vw, 24px) 0 0;
  color: var(--muted);
  font-size: var(--fs-lead); line-height: 1.5; font-weight: 400;
}
:is(#view-zhk, #view-tenders, #view-mvo) .sol-hero__actions {
  grid-column: 1; grid-row: 5;
  display: flex; flex-wrap: wrap; gap: 12px;
  margin-top: clamp(24px, 2.6vw, 36px);
}
:is(#view-zhk, #view-tenders, #view-mvo) .sol-hero__actions .btn { min-height: var(--btn-h); }

/* Факты под первым экраном - как .hd-fact на главной: кружок --field с контурной галочкой, заголовок и строка.
   Кружок не белый: на белой странице он пропадал и галочка висела с отступом от края контента (DESIGN-V2 §0). */
:is(#view-zhk, #view-tenders, #view-mvo) .sol-hero__facts {
  grid-column: 1 / -1; grid-row: 7;
  display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr);
  gap: 16px var(--gap);
  width: auto; max-width: none;
  margin: clamp(28px, 3vw, 40px) 0 0; padding: 0;
}
:is(#view-zhk, #view-tenders, #view-mvo) .sol-hero__fact {
  display: grid; grid-template-columns: 44px minmax(0, 1fr); align-content: center;
  column-gap: 14px;
  min-height: 0; padding: 0;
  border: 0; border-radius: 0;
  background: none; backdrop-filter: none; -webkit-backdrop-filter: none;
}
:is(#view-zhk, #view-tenders, #view-mvo) .sol-hero__fact::before {
  content: ""; grid-column: 1; grid-row: 1 / span 2; align-self: center;
  width: 44px; height: 44px; border-radius: var(--r-pill);
  background: var(--field) var(--sol-ic-check) center / 20px 20px no-repeat;
}
:is(#view-zhk, #view-tenders, #view-mvo) .sol-hero__fact strong {
  grid-column: 2; align-self: end;
  color: var(--ink); font-size: 16px; font-weight: 500; line-height: 1.35;
}
:is(#view-zhk, #view-tenders, #view-mvo) .sol-hero__fact span {
  grid-column: 2; align-self: start;
  margin-top: 2px;
  color: var(--muted); font-size: 14px; line-height: 1.4; font-weight: 400;
}

/* МВО: вертикальное видео - карточка поверх фото в правом нижнем углу, как ценник на фото в ките */
#view-mvo .mvo-hero__video {
  position: relative; z-index: 1;
  grid-column: 2; grid-row: 1 / 7;
  align-self: end; justify-self: end;
  width: clamp(150px, 14.5vw, 212px); height: auto;
  margin: 0 clamp(14px, 1.4vw, 20px) clamp(14px, 1.4vw, 20px) 0;
  aspect-ratio: 9 / 16;
  border: 4px solid var(--surface);
  border-radius: var(--r);
  box-shadow: var(--shadow-pop);
}

/* ==========================================================================
   3. Общие блоки решений: подборки-карточки, условия, тёмная полоса, призыв
   ========================================================================== */
/* Готовые комплектации / товарные группы - карточки как .sf-sol */
:is(#view-zhk, #view-tenders) .sol-products {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gap);
}
/* v1 (assets/solutions/solutions.css, ≤1050px) растягивает третью карточку на всю строку и сужает
   до половины: в трёх колонках при 901-1050 оставалась пустая ячейка и карточка с фото 934×701.
   Здесь она стоит в своей ячейке; во всю ширину, фото слева - только ≤900 (раздел 10) */
:is(#view-zhk, #view-tenders) .sol-products .sol-product:last-child { grid-column: auto; max-width: none; }
:is(#view-zhk, #view-tenders) .sol-product {
  display: flex; flex-direction: column; min-width: 0;
  padding: var(--inset);
  overflow: visible;
  border: 0; border-radius: var(--r);
  background: var(--surface); box-shadow: var(--shadow);
  transform: none;
  transition: none;
}
:is(#view-zhk, #view-tenders) .sol-product:hover { transform: none; box-shadow: var(--shadow); }
:is(#view-zhk, #view-tenders) .sol-product__media {
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border-radius: var(--r-in);
  background: var(--field);
}
/* Обложка категории A5 (тендеры: № 7, 8, 11) - на плитке, целиком (foundation.css, 25);
   сцены карточек ЖК (zhk-card-*.jpg, 23.10.2026) - фото по cover во всё окно */
:is(#view-zhk, #view-tenders) .sol-product__media.a5 { background: var(--a5-tile); background-color: var(--a5-e); }
:is(#view-zhk, #view-tenders) .sol-product__media img {
  border-radius: 0;
  transition: transform .5s var(--ease);
}
:is(#view-zhk, #view-tenders) .sol-product__media:not(.a5) img { width: 100%; height: 100%; object-fit: cover; }
:is(#view-zhk, #view-tenders) .sol-product:hover .sol-product__media img { transform: scale(1.03); }
:is(#view-zhk, #view-tenders) .sol-product__body {
  display: flex; flex: 1; flex-direction: column;
  padding: 20px 12px 12px;
}
:is(#view-zhk, #view-tenders) .sol-product__meta {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start; gap: 8px;
  margin: 0 0 14px;
  color: inherit; font-size: 13px; letter-spacing: inherit;
}
:is(#view-zhk, #view-tenders) .sol-product__meta span {
  display: inline-flex; align-items: center; min-height: 28px; padding: 0 12px;
  border-radius: var(--r-pill);
  background: var(--field); color: var(--ink);
  font-size: 13px; font-weight: 500; line-height: 1.2; white-space: nowrap;
}
:is(#view-zhk, #view-tenders) .sol-product__meta span:first-child { background: var(--brand-tint); color: var(--brand-hover); }
:is(#view-zhk, #view-tenders) .sol-product h3 {
  margin: 0;
  color: var(--ink);
  font-size: 19px; font-weight: 500; line-height: 1.25; letter-spacing: -0.015em;
}
:is(#view-zhk, #view-tenders) .sol-product p {
  margin: 8px 0 20px;
  color: var(--muted);
  font-size: 15px; line-height: 1.5; font-weight: 400;
}
:is(#view-zhk, #view-tenders) .sol-product__footer {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  margin-top: auto; padding-top: 14px;
  border-top: 1px solid var(--hairline); border-radius: 0;
}
:is(#view-zhk, #view-tenders) .sol-product__footer span { color: var(--muted); font-size: 13px; line-height: 1.4; }

/* Кнопка-ссылка «В каталог», «Подробнее»: 15/500 зелёная со стрелкой */
:is(#view-zhk, #view-tenders, #view-mvo) button.sol-link,
#view-mvo a.sol-link {
  display: inline-flex; align-items: center; gap: 8px;
  min-height: 44px; padding: 0;
  border: 0; background: none;
  color: var(--brand);
  font-size: 15px; font-weight: 500; line-height: 1.2; white-space: nowrap;
  cursor: pointer;
}
:is(#view-zhk, #view-tenders, #view-mvo) .sol-link::after {
  content: ""; flex: none; width: 18px; height: 18px;
  background: currentColor;
  -webkit-mask: var(--sol-ic-arrow) center / contain no-repeat;
  mask: var(--sol-ic-arrow) center / contain no-repeat;
  transition: transform var(--speed) var(--ease);
}
:is(#view-zhk, #view-tenders, #view-mvo) .sol-link:hover { color: var(--brand-hover); }
:is(#view-zhk, #view-tenders, #view-mvo) .sol-link:hover::after { transform: translateX(3px); }

/* Условия проекта - белые карточки, номер - бейдж */
:is(#view-zhk, #view-tenders) .sol-conditions {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gap);
}
:is(#view-zhk, #view-tenders) .sol-condition {
  display: flex; flex-direction: column; align-items: flex-start;
  padding: clamp(20px, 2vw, 28px);
  border: 0; border-radius: var(--r);
  background: var(--surface); box-shadow: var(--shadow);
}
:is(#view-zhk, #view-tenders) .sol-condition__number {
  display: inline-flex; align-items: center; min-height: 30px;
  margin: 0 0 clamp(24px, 2.6vw, 36px); padding: 0 12px;
  border-radius: var(--r-pill);
  background: var(--brand-tint); color: var(--brand-hover);
  font-size: 13px; font-weight: 500; line-height: 1.2;
}
:is(#view-zhk, #view-tenders) .sol-condition h3 {
  margin: 0;
  color: var(--ink);
  font-size: 17px; font-weight: 500; line-height: 1.3; letter-spacing: -0.01em;
}
:is(#view-zhk, #view-tenders) .sol-condition p {
  margin: 8px 0 0;
  color: var(--muted);
  font-size: 15px; line-height: 1.5; font-weight: 400;
}

/* Шаги расчёта / проверки ТЗ - тёмная полоса (.v2-band), список справа с линиями */
:is(#view-zhk, #view-tenders) .sol-section--tight {
  width: var(--wrap); margin: var(--block) auto 0;
  padding: var(--band-y) var(--band-pad);
  border-radius: var(--r);
  background: var(--band);
  color: #fff;
}
:is(#view-zhk, #view-tenders) .sol-section--tight > .container {
  width: auto; margin-inline: 0;
}
:is(#view-zhk, #view-tenders) .sol-info {
  display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: 40px clamp(32px, 5vw, 80px);
  padding: 0;
  border-radius: 0;
  background: none;
  color: #fff;
}
:is(#view-zhk, #view-tenders) .sol-info .sol-eyebrow { color: var(--brand-on-dark); }
:is(#view-zhk, #view-tenders) .sol-info h2 {
  margin: 0;
  color: #fff;
  font-size: var(--fs-h2); font-weight: 500; line-height: 1.08; letter-spacing: -0.03em;
}
:is(#view-zhk, #view-tenders) .sol-info__intro p {
  margin: 16px 0 0;
  color: var(--on-band);
  font-size: 17px; line-height: 1.5;
}
:is(#view-zhk, #view-tenders) .sol-info__list { display: grid; gap: 0; align-content: start; }
:is(#view-zhk, #view-tenders) .sol-info__item {
  display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 20px; align-items: start;
  padding: 22px 0;
  border: 0; border-top: 1px solid var(--on-dark-line); border-radius: 0;
}
:is(#view-zhk, #view-tenders) .sol-info__item:first-child { padding-top: 0; border-top: 0; }
:is(#view-zhk, #view-tenders) .sol-info__item:last-child { padding-bottom: 0; }
:is(#view-zhk, #view-tenders) .sol-info__item b {
  padding-top: 2px;
  color: var(--brand-on-dark);
  font-size: 14px; font-weight: 500; line-height: 1.35;
  font-variant-numeric: tabular-nums;
}
:is(#view-zhk, #view-tenders) .sol-info__ic {
  display: grid; place-items: center;
  width: 44px; height: 44px;
  border-radius: var(--r-pill);
  background: var(--band-2);
}
:is(#view-zhk, #view-tenders) .sol-info__ic svg {
  width: 20px; height: 20px;
  fill: none; stroke: var(--brand-on-dark); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round;
}
:is(#view-zhk, #view-tenders) .sol-info__item strong {
  display: block;
  color: #fff;
  font-size: 17px; font-weight: 500; line-height: 1.3; letter-spacing: -0.01em;
}
:is(#view-zhk, #view-tenders) .sol-info__item span:not(.sol-info__ic) {
  display: block;
  margin-top: 6px;
  color: var(--on-band);
  font-size: 15px; line-height: 1.5;
}
:is(#view-zhk, #view-tenders) .sol-info__item:has(.sol-info__ic) strong { padding-top: 0; }
:is(#view-zhk, #view-tenders) .sol-info__item:has(.sol-info__ic) { align-items: center; }

/* Призыв ЖК - лид-полоса (.v2-lead-band): бледно-зелёная, водяной знак AROLT */
#view-zhk .sol-cta {
  position: relative; isolation: isolate; overflow: hidden;
  display: grid; grid-template-columns: minmax(0, 1fr); align-items: center;
  gap: 28px;
  /* текст и кнопки столбцом слева, справа - место под водяной знак (foundation --lead-pad-end) */
  padding: var(--lead-pad-y) var(--lead-pad-end) var(--lead-pad-y) var(--band-pad);
  border: 0; border-radius: var(--r);
  background: var(--brand-tint);
  color: var(--ink);
}
#view-zhk .sol-cta::after {
  /* Геометрия водяного знака - общая для лид-полос (foundation, --mark-*): знак целиком в полосе */
  content: ""; position: absolute; z-index: -1; right: var(--mark-right); top: 50%; bottom: auto;
  width: auto; height: var(--mark-size); aspect-ratio: 1; transform: translateY(-50%);
  background: var(--brand);
  -webkit-mask: url("../logo-mark.svg") center / contain no-repeat;
  mask: url("../logo-mark.svg") center / contain no-repeat;
  opacity: .07; pointer-events: none;
}
#view-zhk .sol-cta h2 {
  margin: 0;
  color: var(--ink);
  font-size: clamp(30px, 3.2vw, 46px); font-weight: 500; line-height: 1.08; letter-spacing: -0.03em;
}
#view-zhk .sol-cta p {
  margin: 16px 0 0;
  color: var(--muted);
  font-size: 17px; line-height: 1.5;
}
#view-zhk .sol-cta__actions { display: flex; flex-wrap: wrap; gap: 12px; }
#view-zhk .sol-cta__actions .btn--ghost { border-color: rgb(44 96 51 / .28); }
#view-zhk .sol-cta__actions .btn--ghost:hover { background: var(--surface); border-color: var(--surface); }

/* ==========================================================================
   4. ЖК: калькулятор
   ========================================================================== */
#view-zhk .calculator-layout {
  display: grid;
  grid-template-columns: minmax(340px, 420px) minmax(0, 1fr);
  gap: var(--gap);
  align-items: start;
  margin-top: 0;
}
#view-zhk .calculator-controls {
  position: sticky; top: calc(var(--hd-h, 80px) + 16px);
  display: grid; gap: 24px;
  padding: clamp(20px, 2vw, 28px);
  border: 0; border-radius: var(--r);
  background: var(--surface); box-shadow: var(--shadow);
}
#view-zhk .calculator-controls__group {
  display: grid; gap: 16px;
  padding-bottom: 24px;
  border-bottom: 1px solid var(--hairline);
}
/* Последняя группа - :last-of-type: за ней в форме ещё короткий итог (.calculator-mini, абзац) */
#view-zhk .calculator-controls__group:last-of-type { padding-bottom: 0; border-bottom: 0; }
#view-zhk .calculator-controls .eyebrow { margin-bottom: 8px; }
#view-zhk .calculator-controls h2 {
  margin: 0;
  font-size: 24px; font-weight: 500; line-height: 1.2; letter-spacing: -0.02em;
}
#view-zhk .calculator-field { display: grid; gap: 8px; min-width: 0; }
#view-zhk .calculator-field__head {
  display: flex; align-items: baseline; justify-content: space-between; gap: 12px;
  padding: 0 4px;
  color: var(--muted);
  font-size: 14px; font-weight: 400; line-height: 1.3;
}
#view-zhk .calculator-field__head strong {
  color: var(--ink);
  font-size: 14px; font-weight: 500;
  white-space: nowrap; font-variant-numeric: tabular-nums;
}
/* Ползунок вывозов: дорожка 4px по центру поля высотой 40px - пальцу есть куда попасть (было 20px) */
#view-zhk .calculator-field input[type="range"] { height: 40px; margin: -4px 0; }
#view-zhk .calculator-field > small,
#view-zhk .calculator-field--delivery > small {
  padding: 0 4px;
  color: var(--muted);
  font-size: 13px; line-height: 1.45;
}
#view-zhk .calculator-norm {
  margin: 0;
  padding: 14px 18px;
  border-radius: var(--r-in);
  background: var(--field);
  color: var(--muted);
  font-size: 14px; line-height: 1.5; font-weight: 400;
}
#view-zhk .calculator-norm strong { color: var(--ink); font-weight: 500; white-space: nowrap; }

/* Опции - карточки выбора: на белой карточке фон --field, отмечено - тинт и кольцо */
#view-zhk .calculator-option-list { display: grid; gap: 8px; }
#view-zhk .calculator-option {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  min-height: 52px; padding: 12px 16px;
  border: 0; border-radius: var(--r-in);
  background: var(--field);
  color: var(--ink);
  font-size: 15px; font-weight: 400; line-height: 1.3;
  cursor: pointer;
  transition: background-color var(--speed) var(--ease), box-shadow var(--speed) var(--ease);
}
#view-zhk .calculator-option:hover { box-shadow: inset 0 0 0 1px var(--line-strong); }
#view-zhk .calculator-option:has(input:checked) {
  background: var(--brand-tint); color: var(--brand-hover);
  box-shadow: inset 0 0 0 1.5px var(--brand);
}
#view-zhk .calculator-option span { display: inline-flex; align-items: center; gap: 12px; }
#view-zhk .calculator-option strong {
  color: var(--ink);
  font-size: 14px; font-weight: 500; white-space: nowrap;
}
#view-zhk .calculator-option:has(input:checked) strong { color: var(--brand-hover); }
/* Опция, которая уже есть у выбранной позиции каталога (крышка), скрыта: вторую за доплату не продаём */
#view-zhk .calculator-option[hidden] { display: none; }

/* Короткий итог в карточке настроек - только когда результат стоит ниже настроек (≤1180): липнет к низу
   окна, пока листают настройки, и меняется сразу при правке жителей, типа или опций */
#view-zhk .calculator-mini { display: none; }
@media (max-width: 1180px) {
  #view-zhk .calculator-mini {
    position: sticky; bottom: max(12px, env(safe-area-inset-bottom)); z-index: 3;
    display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 2px 12px;
    margin: 0;
    padding: 12px 18px;
    border-radius: var(--r-in);
    background: var(--brand); color: #fff;
    box-shadow: var(--shadow-pop);
    font-size: 15px; font-weight: 500; line-height: 1.35;
    font-variant-numeric: tabular-nums;
  }
  #view-zhk .calculator-mini span { color: rgb(255 255 255 / .8); font-weight: 400; }
  /* Телефон: одной строкой («7 шт.» слева, итог справа); уже 361px подпись «Итого с НДС» уходит
     (короткий итог скрыт от экранных дикторов, полный расчёт ниже), иначе строка рвалась на три */
  @media (max-width: 760px) {
    #view-zhk .calculator-mini { padding: 10px 14px; font-size: 14px; }
  }
  @media (max-width: 360px) {
    #view-zhk .calculator-mini span { font-size: 0; }
    #view-zhk .calculator-mini span b { font-size: 14px; }
  }
  #view-zhk .calculator-mini :is(strong, b) { color: #fff; font-weight: 500; white-space: nowrap; }
}

/* Доставка в калькуляторе: сами поле, кнопка, статус и карта - компоненты L5 (.dlv-*). Поля
   «Расстояние, км» нет (правка 28, как в заявке): адрес с подсказками или пин на карте; здесь -
   только высота карты и отступ строки статуса под ней. 280 - как у карты заявки на телефоне: ниже
   подпись адреса над пином наезжает на кнопки «+/-» и «На весь экран» */
#view-zhk .calculator-field--delivery .calculator-dlv-map { min-height: 0; height: 280px; margin-top: 4px; }
#view-zhk .calculator-field--delivery .dlv-status { margin: 0; padding: 0 4px; }
#view-zhk .calculator-controls [data-add-to-cart] { width: 100%; }

/* Правая колонка */
#view-zhk .calculator-result { display: grid; gap: var(--gap); min-width: 0; }
/* С картой доставки настройки выше результата: результат едет рядом, пока листают настройки
   (в одну колонку - ниже 1181px - обычный поток) */
@media (min-width: 1181px) {
  #view-zhk .calculator-result { position: sticky; top: calc(var(--hd-h, 80px) + 16px); }
}
#view-zhk .calculator-summary {
  display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
  gap: clamp(20px, 2.4vw, 36px);
  padding: var(--inset);
  border: 0; border-radius: var(--r);
  background: var(--surface); box-shadow: var(--shadow);
}
#view-zhk .calculator-visual {
  position: relative; overflow: hidden;
  display: grid; place-items: center;
  min-height: 340px;
  border: 0; border-radius: var(--r-in);
  background: var(--field);
}
#view-zhk .calculator-visual::after {
  right: 16px; bottom: 14px; width: 40px;
  filter: none;
}
#view-zhk .calculator-visual .product-media-image { mix-blend-mode: multiply; border-radius: 0; box-shadow: none; }
/* Фото выбранного типа - снимок товара из каталога (правка 34): на белом фоне, поэтому без тени-рамки */
#view-zhk .calculator-visual .calculator-visual__photo {
  width: 80%; height: 80%; max-width: none; max-height: 300px;
  object-fit: contain;
  filter: none;
}
/* Нарисованные контейнеры: колёса и петля в цветах системы */
#view-zhk .calculator-visual .wheel { border-color: var(--ink); }
#view-zhk .calculator-visual .visual-metal .hook { border-color: var(--muted); }
#view-zhk .calculator-visual .visual-bin .handle { border-color: var(--brand-hover); }

#view-zhk .calculator-main-number {
  display: flex; flex-direction: column; align-items: flex-start; gap: 0;
  padding: clamp(16px, 2vw, 28px) clamp(12px, 1.6vw, 24px) clamp(16px, 2vw, 24px) 0;
  min-width: 0;
}
#view-zhk .calculator-main-number .eyebrow { margin-bottom: 14px; }
#view-zhk .calculator-main-number h2 {
  margin: 0;
  color: var(--ink);
  font-size: clamp(40px, 4vw, 56px); font-weight: 500; line-height: 1; letter-spacing: -0.04em;
}
#view-zhk .calculator-main-number h2 span { color: var(--ink); }
#view-zhk .calculator-main-number h2 small {
  display: block;
  margin-top: 14px;
  color: var(--ink);
  font-size: var(--fs-h3); font-weight: 500; line-height: 1.25; letter-spacing: -0.015em;
}
#view-zhk .calculator-main-number p {
  margin: 14px 0 0;
  color: var(--muted);
  font-size: 15px; line-height: 1.55;
}
#view-zhk .calculator-progress {
  align-self: stretch;
  height: 6px; margin-top: auto;
  overflow: hidden;
  border-radius: var(--r-pill);
  background: var(--hairline);
}
#view-zhk .calculator-main-number p + .calculator-progress { margin-top: 24px; }
#view-zhk .calculator-progress span { border-radius: var(--r-pill); background: var(--brand); }
#view-zhk .calculator-main-number > small {
  margin-top: 10px;
  color: var(--muted);
  font-size: 13px; line-height: 1.4;
}
#view-zhk .calculator-main-number > small strong { color: var(--ink); font-weight: 500; }

/* Метрики и расчёт: маленькие белые карточки, итог - акцентная зелёная */
#view-zhk .calculator-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--gap); }
#view-zhk .calculator-breakdown-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--gap); }
#view-zhk :is(.calculator-metric, .calculator-breakdown) {
  display: flex; flex-direction: column; justify-content: space-between; gap: 10px;
  min-width: 0;
  padding: 18px 20px 20px;
  border: 0; border-radius: var(--r);
  background: var(--surface); box-shadow: var(--shadow);
}
#view-zhk :is(.calculator-metric, .calculator-breakdown) span {
  display: block; margin: 0;
  color: var(--muted);
  font-size: 13px; font-weight: 400; line-height: 1.35;
}
#view-zhk :is(.calculator-metric, .calculator-breakdown) strong {
  display: block;
  color: var(--ink);
  font-size: 20px; font-weight: 500; line-height: 1.2; letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
}
#view-zhk .calculator-breakdown--total { background: var(--brand); box-shadow: none; color: #fff; }
#view-zhk .calculator-breakdown--total span { color: rgb(255 255 255 / .8); }
#view-zhk .calculator-breakdown--total strong { color: #fff; }

#view-zhk .calculator-docs {
  display: grid; gap: 16px;
  padding: clamp(20px, 2vw, 28px);
  border: 0; border-radius: var(--r);
  background: var(--surface); box-shadow: var(--shadow);
}
#view-zhk .calculator-docs .eyebrow { margin-bottom: 8px; }
#view-zhk .calculator-docs h2 {
  margin: 0;
  font-size: 24px; font-weight: 500; line-height: 1.2; letter-spacing: -0.02em;
}
#view-zhk .calculator-docs ul { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
#view-zhk .calculator-docs li {
  display: grid; grid-template-columns: 6px minmax(0, 1fr); align-items: baseline; gap: 14px;
  color: var(--ink-2);
  font-size: 15px; line-height: 1.5;
}
#view-zhk .calculator-docs li::before {
  content: ""; width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--brand); box-shadow: none;
  transform: translateY(-2px);
}

/* Стартовая подборка - белая карточка: селекты-капсулы в ряд и основная кнопка */
#view-zhk .sol-picker {
  display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr) minmax(0, 1.2fr) auto;
  align-items: end; gap: 16px;
  padding: clamp(20px, 2vw, 28px);
  border: 0; border-radius: var(--r);
  background: var(--surface); box-shadow: var(--shadow);
}
#view-zhk .sol-field { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
#view-zhk .sol-field label {
  padding-left: 4px;
  color: var(--muted);
  font-size: 14px; font-weight: 400; line-height: 1.3;
}
/* Длинная подпись («Оцинкованные контейнеры») на узком телефоне не режется стрелкой посреди буквы:
   поле справа уже, а то, что не влезло, - многоточием */
#view-zhk .sol-field select {
  padding-right: 40px;
  background-position: right 14px center;
  font-size: 16px;
  text-overflow: ellipsis;
}
#view-zhk .sol-picker .btn { min-height: var(--btn-h); padding-inline: var(--btn-px); white-space: nowrap; }
#view-zhk .sol-picker__note {
  grid-column: 1 / -1;
  margin: 0; padding-left: 4px;
  color: var(--muted);
  font-size: 13px; line-height: 1.45;
}

/* ==========================================================================
   5. Тендеры: подбор по ТЗ (фильтр + список) и заявка на странице
   ========================================================================== */
/* Подбор по ТЗ (правка 32 от 08.10). Фильтр - горизонтальная панель над списком, позиции - строки
   во всю ширину. Характеристики стоят ровными колонками в одном порядке: Объём, Материал, Толщина,
   Габариты, Колёса, Крышка, Захваты, Вес, Артикул - взгляд идёт по одной линии от товара к товару.
   Строка: отметка | фото | название и цена в первом ряду, колонки характеристик вторым рядом.
   От 1200px подписи колонок - одна липкая шапка над списком (в строках они остаются для экранных
   дикторов), уже - подпись над значением в каждой ячейке. Цена - колонка постоянной ширины,
   иначе ряд характеристик у строк с разной ценой был бы разной ширины и колонки разъехались бы. */
#view-tenders .tf {
  /* Колонки таблицы (от 1200px). Доли - по ширине самых длинных значений, нижняя граница - их ширина
     в одну строку: на 1200-1366 узкие колонки рвали значения посреди («Без колё / с», «497-503 к / г»,
     «920 × 920 × / 1150»). Сумма минимумов с зазорами - 906px, ряд характеристик на 1200 - 942px */
  --tf-cols: minmax(52px, .5fr) minmax(100px, 1.4fr) minmax(78px, .75fr) minmax(146px, 1.45fr) minmax(70px, .7fr) minmax(52px, .5fr) minmax(64px, 1.2fr) minmax(90px, .9fr) minmax(158px, 1.55fr);
  --tf-media: 72px;
  --tf-price: 140px;
  --tf-row: 20px var(--tf-media) minmax(0, 1fr) var(--tf-price);
  --tf-gap-x: 20px;
  --tf-col-gap: 16px;
  --tf-px: 20px;
  display: grid; grid-template-columns: minmax(0, 1fr);
  gap: var(--gap); align-items: start;
}

/* Панель фильтра: группы в сетку слева направо, значения - пилюли с отметкой (несколько в группе) */
#view-tenders .tf__panel {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(min(280px, 100%), 1fr));
  gap: 24px clamp(24px, 2.8vw, 44px);
  padding: clamp(20px, 2.2vw, 28px);
  border: 0; border-radius: var(--r);
  background: var(--surface); box-shadow: var(--shadow);
}
#view-tenders .tf__group {
  display: flex; flex-direction: row; flex-wrap: wrap; align-content: flex-start; gap: 8px;
  min-width: 0;
  padding: 0;
  border: 0;
}
#view-tenders .tf__group h3 {
  flex: 0 0 100%;
  margin: 0 0 4px; padding-left: 4px;
  color: var(--muted);
  font-size: 14px; font-weight: 500; line-height: 1.3; letter-spacing: 0; text-transform: none;
}
#view-tenders .tf__check {
  display: inline-flex; align-items: center; gap: 10px;
  min-height: 40px; padding: 0 16px 0 11px;
  border-radius: var(--r-pill);
  background: var(--field);
  color: var(--ink);
  font-size: 15px; font-weight: 400; line-height: 1.2;
  white-space: nowrap;
  cursor: pointer;
  user-select: none; -webkit-user-select: none;
  transition: background-color var(--speed) var(--ease), box-shadow var(--speed) var(--ease), color var(--speed) var(--ease);
}
#view-tenders .tf__check input { width: 18px; height: 18px; border-radius: 5px; }
#view-tenders .tf__check:hover { box-shadow: inset 0 0 0 1px var(--line-strong); }
#view-tenders .tf__check:has(input:checked) {
  background: var(--brand-tint); color: var(--brand-hover);
  box-shadow: inset 0 0 0 1.5px var(--brand);
}
#view-tenders .tf__dims {
  flex: 0 0 100%;
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px;
}
#view-tenders .tf__dims label {
  display: flex; flex-direction: column; gap: 6px;
  padding-left: 4px;
  color: var(--muted);
  font-size: 13px; font-weight: 400;
}
#view-tenders .tf__dims input,
#view-tenders .tf__dims input:hover,
#view-tenders .tf__dims input:focus {
  min-height: 40px; height: 40px;
  margin-left: -4px; width: calc(100% + 4px);
  padding: 0 14px;
  background-color: var(--field);
  font-size: 15px;
  outline: 0;
}
/* Панель - белая карточка на светлой секции: поле серое, в фокусе белое с рамкой --brand (фундамент) */
#view-tenders .tf__dims input:focus { background-color: var(--surface); }
/* Кнопки - в последней колонке последнего ряда при любом числе колонок (2, 3 или 4): при трёх
   они вставали в середину ряда рядом с «Усилением», а правая клетка оставалась пустой */
#view-tenders .tf__actions {
  grid-column: -2 / -1; align-self: end;
  display: flex; flex-direction: column; justify-content: flex-end; gap: 8px;
  min-width: 0;
}
/* Кнопка «Параметры», шапка шторки и затемнение - только телефону (≤760, ниже) */
#view-tenders :is(.tf__toggle, .tf__sheet-head, .tf__overlay) { display: none; }
#view-tenders .tf__actions .btn {
  width: 100%; min-height: var(--btn-h-sm); padding: 0 var(--btn-px-sm);
  font-size: 15px; white-space: nowrap;
}
/* Отметки изменены, но ещё не применены: кнопка показывает, сколько позиций будет */
#view-tenders .tf__actions [data-tf-apply] { font-variant-numeric: tabular-nums; }

/* Итог над списком: найдено, выбрано, «Добавить в заявку» */
#view-tenders .tf__results { display: flex; flex-direction: column; gap: var(--gap); min-width: 0; }
#view-tenders .tf__bar {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px;
  padding: 8px 8px 8px 24px;
  border: 0; border-radius: var(--r);
  background: var(--surface); box-shadow: var(--shadow);
}
#view-tenders .tf__count { color: var(--ink); font-size: 16px; font-weight: 500; }
#view-tenders .tf__count span { color: var(--ink); font-variant-numeric: tabular-nums; }
#view-tenders .tf__selected { margin-right: auto; color: var(--muted); font-size: 14px; font-weight: 400; }
#view-tenders .tf__bar .btn { min-height: var(--btn-h-sm); padding: 0 var(--btn-px-sm); font-size: 15px; }

/* Шапка колонок: та же сетка, что у строки, - подписи стоят ровно над значениями */
#view-tenders .tf__head {
  position: sticky; top: var(--hd-h, 80px); z-index: 2;
  display: grid; grid-template-columns: var(--tf-row); column-gap: var(--tf-gap-x);
  margin-bottom: calc(var(--gap) * -1 + 6px);
  padding: 10px var(--tf-px);
  border-bottom: 1px solid var(--hairline);
  background: var(--tf-head-bg, var(--canvas));
  color: var(--muted);
  font-size: 13px; font-weight: 500; line-height: 1.3;
}
#view-tenders .v2-alt .tf { --tf-head-bg: var(--section); }
#view-tenders .tf__head-cols {
  grid-column: 3 / -1;
  display: grid; grid-template-columns: var(--tf-cols); column-gap: var(--tf-col-gap);
}
#view-tenders .tf__head-cols > span { min-width: 0; }
#view-tenders .tf__results:has(.tf__empty) .tf__head { display: none; }

#view-tenders .tf__list { display: grid; gap: var(--gap); }

/* Строка позиции: белая карточка; выбранная - кольцо --brand. Нажатие на строку ставит отметку */
#view-tenders .tf__item {
  display: grid; grid-template-columns: var(--tf-row); grid-template-rows: auto auto;
  column-gap: var(--tf-gap-x); row-gap: 12px; align-items: start;
  padding: 16px var(--tf-px);
  border: 0; border-radius: var(--r);
  background: var(--surface); box-shadow: var(--shadow);
  cursor: pointer;
  transition: box-shadow var(--speed) var(--ease);
}
#view-tenders .tf__item:hover { border: 0; box-shadow: var(--shadow), inset 0 0 0 1px var(--line-strong); }
#view-tenders .tf__item.is-picked { box-shadow: var(--shadow), inset 0 0 0 1.5px var(--brand); }
#view-tenders .tf__item > input[type="checkbox"] { grid-column: 1; grid-row: 1 / span 2; align-self: center; margin: 0; }
#view-tenders .tf__media {
  grid-column: 2; grid-row: 1 / span 2; align-self: center;
  display: grid; place-items: center;
  width: var(--tf-media); height: var(--tf-media);
  overflow: hidden;
  border: 0; border-radius: var(--r-in);
  background: var(--field);
}
#view-tenders .tf__media img { width: 96%; height: 96%; object-fit: contain; mix-blend-mode: multiply; border-radius: 0; }
#view-tenders .tf__media .product-placeholder { background: var(--field); }
#view-tenders .tf__name {
  grid-column: 3; grid-row: 1; align-self: center;
  margin: 0;
  color: var(--ink);
  font-size: 16px; font-weight: 500; line-height: 1.35; letter-spacing: -0.01em;
}
#view-tenders .tf__price {
  grid-column: 4; grid-row: 1;
  padding-top: 0;
  color: var(--ink);
  font-size: 18px; font-weight: 500; line-height: 1.2; letter-spacing: -0.02em;
  text-align: right; white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
#view-tenders .tf__price small {
  display: block; margin-top: 4px;
  color: var(--muted);
  font-size: 13px; font-weight: 400; letter-spacing: 0;
}

/* Характеристики: колонки на всю ширину под названием и ценой */
#view-tenders .tf__specs {
  grid-column: 3 / -1; grid-row: 2;
  display: grid; grid-template-columns: var(--tf-cols); column-gap: var(--tf-col-gap); row-gap: 12px;
  margin: 0; padding: 12px 0 0;
  border-top: 1px solid var(--hairline);
}
#view-tenders .tf__cell { min-width: 0; margin: 0; }
#view-tenders .tf__k {
  margin: 0 0 3px;
  color: var(--muted);
  font-size: 12px; font-weight: 400; line-height: 1.3;
}
/* Длинное слово переносится по слогам, а не рвётся посреди без дефиса («Оцинкованна / я сталь» в узкой
   ячейке телефона 320-360). По слогам - только слова от 10 букв, чтобы не было «ста-ль» */
#view-tenders .tf__v {
  margin: 0;
  color: var(--ink);
  font-size: 14px; font-weight: 400; line-height: 1.4;
  font-variant-numeric: tabular-nums;
  overflow-wrap: break-word;
  -webkit-hyphens: auto; hyphens: auto; hyphenate-limit-chars: 10 4 4;
}
#view-tenders .tf__v small { display: block; color: var(--muted); font-size: 13px; }
#view-tenders .tf__v--none { color: var(--hint); }
#view-tenders .tf__cell--sku .tf__v { font-family: var(--font-mono); font-size: 13px; letter-spacing: -0.01em; }

#view-tenders .tf__more { display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 16px 0 0; }
#view-tenders .tf__shown { margin: 0; color: var(--muted); font-size: 14px; font-weight: 400; font-variant-numeric: tabular-nums; }
#view-tenders .tf__empty {
  display: grid; justify-items: center; gap: 16px;
  padding: clamp(28px, 4vw, 48px);
  border: 0; border-radius: var(--r);
  background: var(--surface); box-shadow: var(--shadow);
  color: var(--muted);
  font-size: 16px; line-height: 1.55; text-align: center;
}
#view-tenders .tf__empty p { margin: 0; }
#view-tenders .tf__empty .btn { min-height: var(--btn-h-sm); padding: 0 var(--btn-px-sm); font-size: 15px; }

/* Десктоп: подписи - в шапке, в ячейках остаются только для экранных дикторов */
@media (min-width: 1200px) {
  /* Числа, габариты и артикул - всегда одной строкой; материал и захваты переносятся по словам
     только на 1200-1279 */
  #view-tenders .tf { --tf-col-gap: 12px; }
  #view-tenders :is(.tf__cell--volume, .tf__cell--thickness, .tf__cell--dims, .tf__cell--wheels, .tf__cell--weight, .tf__cell--sku) .tf__v {
    white-space: nowrap; overflow-wrap: normal;
  }
  #view-tenders .tf__k {
    position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden;
    clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0;
  }
}
@media (max-width: 1199px) {
  #view-tenders .tf__head { display: none; }
  #view-tenders .tf__specs { grid-template-columns: repeat(auto-fill, minmax(136px, 1fr)); }
  #view-tenders .tf__cell--sku { grid-column: span 2; }
  /* Строка выше: фото и отметка - вровень с названием, а не посередине */
  #view-tenders .tf__media { align-self: start; }
  #view-tenders .tf__item > input[type="checkbox"] { align-self: start; margin-top: calc((var(--tf-media) - 20px) / 2); }
}
@media (max-width: 1040px) {
  #view-tenders .tf { --tf-media: 64px; --tf-gap-x: 16px; --tf-px: 16px; --tf-price: 128px; }
}
/* Телефон: отметка, фото, название и цена в первом ряду; характеристики - сеткой в три колонки */
@media (max-width: 760px) {
  #view-tenders .tf { --tf-media: 56px; --tf-gap-x: 12px; --tf-px: 14px; }
  /* Параметры ТЗ на телефоне - шторка снизу, как фильтр каталога, за кнопкой «Параметры»: раскрытая
     панель из двадцати пилюль и полей занимала 1100-1200px, и первая позиция стояла в полутора экранах
     от заголовка раздела */
  #view-tenders .tf__toggle {
    display: inline-flex; align-items: center; justify-content: center; gap: 10px;
    width: 100%; min-height: var(--btn-h); padding: 0 20px;
    border: 1px solid var(--line-strong); border-radius: var(--r-pill);
    background: var(--surface); color: var(--ink);
    font: 500 16px/1.2 var(--font);
    cursor: pointer;
    transition: border-color var(--speed) var(--ease), background-color var(--speed) var(--ease);
  }
  #view-tenders .tf__toggle:hover { border-color: var(--brand); }
  #view-tenders .tf__toggle svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
  #view-tenders .tf__toggle-count {
    display: inline-grid; place-items: center;
    min-width: 24px; height: 24px; padding: 0 7px;
    border-radius: var(--r-pill);
    background: var(--brand); color: #fff;
    font-size: 13px; font-weight: 500; font-variant-numeric: tabular-nums;
  }
  #view-tenders .tf__toggle-count[hidden] { display: none; }
  #view-tenders .tf__overlay {
    position: fixed; inset: 0; z-index: 998;
    display: block;
    padding: 0; border: 0; border-radius: 0;
    background: rgb(22 30 23 / .45); -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px);
    opacity: 0; pointer-events: none;
    transition: opacity var(--speed) var(--ease);
  }
  #view-tenders .tf.is-panel-open .tf__overlay { opacity: 1; pointer-events: auto; }
  #view-tenders .tf__panel {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 999;
    grid-template-columns: minmax(0, 1fr); gap: 20px;
    max-height: min(88vh, 760px);
    padding: 0 16px;
    border-radius: var(--r) var(--r) 0 0;
    background: var(--canvas); box-shadow: var(--shadow-pop);
    overflow-y: auto; overscroll-behavior: contain;
    /* Закрытая шторка скрыта и от Tab */
    visibility: hidden;
    transform: translateY(calc(100% + 24px));
    transition: transform .3s var(--ease), visibility 0s linear .3s;
  }
  #view-tenders .tf.is-panel-open .tf__panel { visibility: visible; transform: none; transition: transform .3s var(--ease); }
  #view-tenders .tf__sheet-head {
    position: sticky; top: 0; z-index: 2;
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    margin: 0 -16px; padding: 16px 16px 8px;
    background: var(--canvas);
  }
  #view-tenders .tf__sheet-head strong { color: var(--ink); font-size: 20px; font-weight: 500; line-height: 1.2; letter-spacing: -0.02em; }
  #view-tenders .tf__close {
    display: inline-grid; place-items: center; flex: none;
    width: 44px; height: 44px; padding: 0;
    border: 0; border-radius: var(--r-pill);
    background: var(--field); color: var(--ink);
    cursor: pointer;
  }
  #view-tenders .tf__close svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; }
  #view-tenders .tf__check { min-height: 40px; padding: 0 14px 0 10px; font-size: 15px; }
  /* Низ шторки - липкая полоса с «Показать» и «Сбросить» */
  #view-tenders .tf__actions {
    position: sticky; bottom: 0; z-index: 2;
    flex-direction: row; flex-wrap: nowrap;
    margin: 0 -16px; padding: 12px 16px max(16px, env(safe-area-inset-bottom));
    border-top: 1px solid var(--hairline);
    background: var(--surface);
  }
  #view-tenders .tf__actions .btn { flex: 1 1 0; min-width: 0; padding: 0 12px; }
  #view-tenders .tf__bar { padding: 12px 12px 12px 16px; }
  #view-tenders .tf__bar .btn { width: 100%; }
  #view-tenders .tf__item {
    grid-template-columns: 20px var(--tf-media) minmax(0, 1fr);
    grid-template-rows: auto auto auto;
    row-gap: 4px;
    padding: 14px var(--tf-px) 16px;
  }
  #view-tenders .tf__item > input[type="checkbox"] { grid-row: 1 / span 2; }
  #view-tenders .tf__media { grid-row: 1 / span 2; }
  #view-tenders .tf__name { grid-column: 3; grid-row: 1; align-self: end; font-size: 15px; }
  #view-tenders .tf__price {
    grid-column: 3; grid-row: 2; align-self: start;
    display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 8px;
    font-size: 17px; text-align: left; white-space: normal;
  }
  #view-tenders .tf__price small { margin-top: 0; }
  #view-tenders .tf__specs {
    grid-column: 1 / -1; grid-row: 3;
    grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 12px;
    margin-top: 10px;
  }
  /* Артикул и габариты не рвём посреди («MT750-K-W100-» / «U», «920 × 920 ×» / «1150»): артикул -
     строкой во всю ширину, габариты - на две колонки, обе в одну строку */
  #view-tenders .tf__cell--sku { grid-column: 1 / -1; }
  #view-tenders .tf__cell--dims { grid-column: span 2; }
  #view-tenders :is(.tf__cell--sku, .tf__cell--dims) .tf__v { white-space: nowrap; overflow-wrap: normal; }
  #view-tenders .tf__media { align-self: center; }
  #view-tenders .tf__item > input[type="checkbox"] { align-self: center; margin-top: 0; }
}
/* 320-359: «Показать 53 позиции» шире половины полосы - кнопки друг под другом во всю ширину */
@media (max-width: 359px) {
  #view-tenders .tf__actions { flex-wrap: wrap; }
  #view-tenders .tf__actions .btn { flex: 1 1 100%; }
}

/* Заявка по ТЗ - как форма КП кита: одна белая карточка, форма и боковая колонка */
#view-tenders .trq {
  display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  gap: 40px clamp(32px, 5vw, 80px); align-items: start;
  padding: clamp(24px, 3.6vw, 48px);
  border: 0; border-radius: var(--r);
  background: var(--surface); box-shadow: var(--shadow);
}
#view-tenders .trq__form {
  display: grid; gap: 24px; min-width: 0;
  padding: 0;
  border: 0; border-radius: 0;
  background: none; box-shadow: none;
}
#view-tenders .trq__picked {
  display: grid; gap: 12px;
  padding: 16px 20px;
  border: 0; border-radius: var(--r-in);
  background: var(--field);
}
#view-tenders .trq__picked-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
#view-tenders .trq__picked-title { color: var(--ink); font-size: 15px; font-weight: 500; }
#view-tenders .trq__picked-count {
  display: inline-flex; align-items: center; min-height: 28px; padding: 0 12px;
  border: 0; border-radius: var(--r-pill);
  background: var(--surface); color: var(--muted);
  font-size: 13px; font-weight: 500;
}
#view-tenders .trq__picked.is-filled .trq__picked-count { border: 0; background: var(--brand-tint); color: var(--brand-hover); }
#view-tenders .trq__picked-link {
  display: inline-flex; align-items: center; min-height: 44px; margin-block: -8px;
  margin-left: auto;
  border: 0;
  color: var(--brand);
  font-size: 15px; font-weight: 500; text-decoration: none;
}
#view-tenders .trq__picked-link:hover { color: var(--brand-hover); }
#view-tenders .trq__picked-list { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
#view-tenders .trq__picked-item {
  display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: 10px; align-items: baseline;
  padding: 10px 0;
  border: 0; border-top: 1px solid var(--hairline); border-radius: 0;
  background: none;
  color: var(--ink);
  font-size: 14px; font-weight: 400; line-height: 1.45;
}
#view-tenders .trq__picked-item b { color: var(--brand); font-size: 13px; font-weight: 500; font-variant-numeric: tabular-nums; }
#view-tenders .trq__fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
#view-tenders .trq__form .field { display: flex; flex-direction: column; }
#view-tenders .trq__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; }
#view-tenders .trq__actions .btn { min-height: var(--btn-h); }
#view-tenders .trq__legal {
  flex: 1 1 240px; margin: 0;
  color: var(--muted);
  font-size: 13px; line-height: 1.45;
}
#view-tenders .trq__aside { display: grid; gap: 24px; align-content: start; min-width: 0; }
#view-tenders .trq__media {
  margin: 0;
  overflow: visible;
  border: 0; border-radius: 0;
  background: none; box-shadow: none;
}
#view-tenders .trq__media img {
  display: block;
  width: 100%; height: clamp(240px, 22vw, 320px);
  object-fit: cover; object-position: 50% 38%;
  border-radius: var(--r);
}
#view-tenders .trq__media figcaption {
  margin-top: 12px; padding: 0 4px;
  border-radius: 0;
  background: none;
  color: var(--muted);
  font-size: 14px; line-height: 1.5;
}
#view-tenders .trq__facts { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
#view-tenders .trq__fact {
  display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 14px; align-items: start;
  padding: 16px 0;
  border: 0; border-top: 1px solid var(--hairline); border-radius: 0;
  background: none;
}
#view-tenders .trq__fact-ic {
  display: grid; place-items: center;
  width: 44px; height: 44px;
  border-radius: var(--r-pill);
  background: var(--brand-tint); color: var(--brand);
}
#view-tenders .trq__fact-ic svg { width: 20px; height: 20px; stroke-width: 1.6; }
#view-tenders .trq__fact strong { color: var(--ink); font-size: 15px; font-weight: 500; line-height: 1.35; }
#view-tenders .trq__fact span { margin-top: 4px; color: var(--muted); font-size: 14px; line-height: 1.5; }

/* ==========================================================================
   6. МВО
   ========================================================================== */
#view-mvo #mvo-why,
#view-mvo #mvo-pick,
#view-mvo #mvo-compat,
#view-mvo #mvo-proof,
#view-mvo #mvo-terms,
#view-mvo #mvo-request { scroll-margin-top: calc(var(--hd-h, 80px) + 24px); }

/* Почему удобно: четыре белые карточки с кружком-иконкой */
#view-mvo .mvo-why { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--gap); }
#view-mvo .mvo-why__item {
  display: flex; flex-direction: column; gap: 0;
  padding: 24px 24px 28px;
  border: 0; border-radius: var(--r);
  background: var(--surface); box-shadow: var(--shadow);
}
#view-mvo :is(.mvo-why__ic, .mvo-term__ic) {
  display: grid; place-items: center; flex: none;
  width: 44px; height: 44px;
  border-radius: var(--r-pill);
  background: var(--brand-tint); color: var(--brand);
}
#view-mvo :is(.mvo-why__ic, .mvo-term__ic) svg { width: 20px; height: 20px; stroke-width: 1.6; }
#view-mvo .mvo-why__item h3 {
  margin: 32px 0 0;
  color: var(--ink);
  font-size: 17px; font-weight: 500; line-height: 1.3; letter-spacing: -0.01em;
}
#view-mvo .mvo-why__item p { margin: 8px 0 0; color: var(--muted); font-size: 15px; line-height: 1.5; }

/* Три контейнера: белая карточка с отступом 8, фото в окне 12, бейдж на фото */
#view-mvo .mvo-picks { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gap); }
#view-mvo .mvo-pick {
  display: flex; flex-direction: column; min-width: 0;
  padding: var(--inset);
  overflow: visible;
  border: 0; border-radius: var(--r);
  background: var(--surface); box-shadow: var(--shadow);
}
#view-mvo .mvo-pick__media {
  position: relative;
  aspect-ratio: 4 / 3.4;
  overflow: hidden;
  border-radius: var(--r-in);
  background: var(--field);
}
#view-mvo .mvo-pick__media img {
  width: 100%; height: 100%;
  object-fit: cover; object-position: center 42%;
  border-radius: 0;
  filter: saturate(.9);
  transition: transform .5s var(--ease);
}
#view-mvo .mvo-pick:hover .mvo-pick__media img { transform: scale(1.03); }
#view-mvo .mvo-pick__media--contain { background: var(--field); }
#view-mvo .mvo-pick__media--contain img {
  width: 84%; height: 84%; margin: 8%;
  padding: 0;
  object-fit: contain; mix-blend-mode: multiply; filter: brightness(1.04) contrast(1.03);
}
#view-mvo .mvo-pick__badge {
  position: absolute; top: 14px; left: 14px;
  display: inline-flex; align-items: center; min-height: 30px; padding: 0 12px;
  border-radius: var(--r-pill);
  background: var(--brand-tint); color: var(--brand-hover);
  box-shadow: none;
  font-size: 13px; font-weight: 500; line-height: 1.2;
}
/* Фото и название ведут на товар каталога (правка 34): снимок, ссылка, цена и характеристики - из товара */
#view-mvo .mvo-pick__photo { display: block; width: 100%; height: 100%; }
#view-mvo .mvo-pick h3 a { color: inherit; text-decoration: none; transition: color var(--speed) var(--ease); }
#view-mvo .mvo-pick h3 a:hover { color: var(--brand); }
#view-mvo .mvo-pick h3 a:focus-visible { outline: 2px solid var(--brand); outline-offset: 3px; border-radius: 4px; }
#view-mvo .mvo-pick__badge--soft { background: rgb(255 255 255 / .72); color: var(--muted); font-weight: 400; }
#view-mvo .mvo-pick__body {
  display: flex; flex: 1; flex-direction: column; gap: 0;
  padding: 20px 12px 12px;
}
#view-mvo .mvo-pick h3 {
  margin: 0;
  color: var(--ink);
  font-size: 19px; font-weight: 500; line-height: 1.25; letter-spacing: -0.015em;
}
#view-mvo .mvo-pick__lead { margin: 8px 0 0; color: var(--muted); font-size: 15px; line-height: 1.5; }
#view-mvo .mvo-pick__specs { display: grid; gap: 0; margin: 16px 0 0; padding: 0; list-style: none; }
#view-mvo .mvo-pick__specs li {
  display: flex; align-items: baseline; justify-content: space-between; gap: 12px;
  padding: 10px 0;
  border-top: 1px solid var(--hairline);
  font-size: 14px; line-height: 1.4;
}
#view-mvo .mvo-pick__specs li span { color: var(--muted); font-weight: 400; }
#view-mvo .mvo-pick__specs li b { color: var(--ink); font-weight: 500; text-align: right; }
/* Варианты комплектации - сегментированный переключатель */
#view-mvo .mvo-pick__variants {
  display: inline-flex; align-self: flex-start; gap: 0;
  margin-top: 16px; padding: 4px;
  border-radius: var(--r-pill);
  background: var(--field);
}
#view-mvo .mvo-pick__variant {
  min-height: 40px; padding: 0 18px;
  border: 0; border-radius: var(--r-pill);
  background: transparent; color: var(--muted);
  font-size: 15px; font-weight: 400;
  box-shadow: none;
  transition: background-color var(--speed) var(--ease), color var(--speed) var(--ease);
}
#view-mvo .mvo-pick__variant:hover { color: var(--ink); }
#view-mvo .mvo-pick__variant.is-active { background: var(--brand); color: #fff; box-shadow: none; }
#view-mvo .mvo-pick__foot {
  display: grid; gap: 14px;
  margin-top: auto; padding-top: 18px;
  border-top: 0;
}
#view-mvo .mvo-pick__specs + .mvo-pick__foot,
#view-mvo .mvo-pick__variants + .mvo-pick__foot { margin-top: 20px; }
#view-mvo .mvo-pick__body > .mvo-pick__foot { margin-top: auto; }
#view-mvo .mvo-pick__price b {
  display: block;
  color: var(--ink);
  font-size: 24px; font-weight: 500; line-height: 1.15; letter-spacing: -0.02em;
}
#view-mvo .mvo-pick__price span { display: block; margin-top: 4px; color: var(--muted); font-size: 13px; }
#view-mvo .mvo-pick__price .price-old { display: block; margin-bottom: 2px; font-size: 15px; }
#view-mvo .mvo-pick__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 20px; }
#view-mvo .mvo-pick__actions .btn { min-height: var(--btn-h-sm); padding: 0 var(--btn-px-sm); font-size: 15px; }

/* Проверка совместимости - как .sf-about: текст слева, фото-плитки справа */
#view-mvo .mvo-compat {
  display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: 40px clamp(32px, 4.4vw, 72px); align-items: center;
}
#view-mvo .mvo-compat__text > p {
  margin: 20px 0 0;
  color: var(--muted);
  font-size: 17px; line-height: 1.5;
}
#view-mvo .mvo-compat__list { display: grid; gap: 12px; margin: 24px 0 0; padding: 0; list-style: none; }
#view-mvo .mvo-compat__list li {
  display: flex; align-items: flex-start; gap: 12px;
  color: var(--ink);
  font-size: 16px; line-height: 1.45;
}
#view-mvo .mvo-compat__list svg {
  flex: none; width: 20px; height: 20px; margin-top: 1px;
  stroke: var(--brand); stroke-width: 1.6;
}
#view-mvo .mvo-compat__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 20px; margin-top: 32px; }
#view-mvo .mvo-compat__actions .btn { min-height: var(--btn-h); padding-inline: var(--btn-px); }
#view-mvo .mvo-compat__media { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gap); }
#view-mvo .mvo-compat__media > .mvo-shot { aspect-ratio: 2 / 3; }

/* Фото-плитки и видео: радиус 20, подпись белым на градиенте снизу (как .v2-ph) */
#view-mvo .mvo-shot {
  position: relative;
  margin: 0;
  overflow: hidden;
  aspect-ratio: 3 / 4;
  border: 0; border-radius: var(--r);
  background: var(--field);
}
#view-mvo .mvo-shot img,
#view-mvo .mvo-shot video {
  display: block;
  width: 100%; height: 100%;
  object-fit: cover;
  border-radius: 0;
}
#view-mvo .mvo-shot:not(.mvo-video) img { transition: transform .6s var(--ease); }
#view-mvo .mvo-shot:not(.mvo-video):hover img { transform: scale(1.03); }
#view-mvo .mvo-video { background: var(--band); }
#view-mvo :is(.mvo-shot figcaption, .mvo-video__caption) {
  position: absolute; left: 0; right: 0; bottom: 0;
  padding: 56px 16px 14px;
  border-radius: 0;
  background: linear-gradient(180deg, rgb(22 30 23 / 0), rgb(22 30 23 / .62));
  color: #fff;
  font-size: 14px; font-weight: 400; line-height: 1.35;
  pointer-events: none;
}
/* Кнопка запуска - белый круг 56px */
#view-mvo .mvo-video__play {
  width: 56px; height: 56px;
  border: 0; border-radius: var(--r-pill);
  background: var(--surface); color: var(--ink);
  box-shadow: var(--shadow);
}
#view-mvo .mvo-video__play svg { width: 22px; height: 22px; margin-left: 3px; fill: currentColor; stroke: none; }
#view-mvo .mvo-video__play:hover { background: var(--brand); color: #fff; transform: translate(-50%, -50%); }
#view-mvo .mvo-hero__video .mvo-video__caption { padding: 40px 12px 12px; font-size: 13px; }
#view-mvo .mvo-hero__video .mvo-video__play { width: 52px; height: 52px; }

/* Доказательства: карточки цифр (.v2-stats), первая - акцентная */
#view-mvo .mvo-stats {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gap);
  margin: 0 0 var(--gap);
}
#view-mvo .mvo-stat {
  display: flex; flex-direction: column; justify-content: space-between; gap: 24px;
  min-height: clamp(150px, 13vw, 188px);
  padding: clamp(20px, 2vw, 28px);
  border: 0; border-radius: var(--r);
  background: var(--surface); box-shadow: var(--shadow);
}
#view-mvo .mvo-stat b {
  display: block;
  color: var(--ink);
  font-size: clamp(36px, 3.6vw, 52px); font-weight: 500; line-height: 1; letter-spacing: -0.04em;
}
#view-mvo .mvo-stat > span { display: block; margin: 0; color: var(--muted); font-size: 15px; line-height: 1.4; }
#view-mvo .mvo-stat:first-child { background: var(--brand); box-shadow: none; }
#view-mvo .mvo-stat:first-child b { color: #fff; }
#view-mvo .mvo-stat:first-child > span { color: rgb(255 255 255 / .8); }
/* Заглушка данных заказчика - пунктирная плашка (единственный пунктир в блоке) */
#view-mvo .mvo-ph {
  display: inline-block;
  padding: 0 10px;
  border: 1.5px dashed var(--line-strong); border-radius: var(--r-in);
  background: var(--field); color: var(--muted);
  white-space: nowrap;
}
#view-mvo .mvo-stat .mvo-ph { font-size: clamp(28px, 2.6vw, 36px); line-height: 1.25; letter-spacing: -0.02em; }
#view-mvo .mvo-stat:first-child .mvo-ph { border-color: rgb(255 255 255 / .5); background: rgb(255 255 255 / .1); color: #fff; }
#view-mvo :is(.mvo-shot figcaption, .mvo-video__caption) .mvo-ph {
  padding: 0 6px;
  border-color: rgb(255 255 255 / .6); border-radius: var(--r-check);
  background: rgb(255 255 255 / .12); color: #fff;
  font-size: 13px;
}
#view-mvo .mvo-gallery { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--gap); }
#view-mvo .mvo-subhead { margin: clamp(48px, 5vw, 72px) 0 clamp(20px, 2.2vw, 28px); }
#view-mvo .mvo-subhead h3 {
  margin: 0;
  color: var(--ink);
  font-size: clamp(22px, 2vw, 28px); font-weight: 500; line-height: 1.2; letter-spacing: -0.02em;
}
#view-mvo .mvo-subhead p { margin: 10px 0 0; color: var(--muted); font-size: 16px; line-height: 1.5; }

/* Условия: строки-карточки с кружком-иконкой + два фото */
#view-mvo .mvo-terms {
  display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  gap: var(--gap) clamp(24px, 3vw, 48px); align-items: start;
}
#view-mvo :is(.mvo-terms__list, .mvo-request__facts) { display: grid; gap: var(--gap); margin: 0; padding: 0; list-style: none; }
#view-mvo .mvo-term {
  display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 16px; align-items: start;
  padding: 20px 24px;
  border: 0; border-radius: var(--r);
  background: var(--surface); box-shadow: var(--shadow);
}
#view-mvo .mvo-term div strong {
  display: block; padding-top: 1px;
  color: var(--ink);
  font-size: 17px; font-weight: 500; line-height: 1.3; letter-spacing: -0.01em;
}
#view-mvo .mvo-term div span { display: block; margin-top: 6px; color: var(--muted); font-size: 15px; line-height: 1.5; }
#view-mvo .mvo-term .sol-link { display: inline-flex; margin-top: 0; padding: 0; min-height: 44px; white-space: normal; }
#view-mvo .mvo-terms__media {
  position: sticky; top: calc(var(--hd-h, 80px) + 24px);
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--gap);
}

/* Расчёт партии - форма КП кита: одна белая карточка, форма слева, факты справа */
#view-mvo .mvo-request {
  display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  gap: 40px clamp(32px, 5vw, 80px); align-items: start;
  padding: clamp(24px, 3.6vw, 48px);
  border: 0; border-radius: var(--r);
  background: var(--surface); box-shadow: var(--shadow);
}
#view-mvo .mvo-form {
  display: grid; gap: 24px; min-width: 0;
  padding: 0;
  border: 0; border-radius: 0;
  background: none; box-shadow: none;
}
#view-mvo .mvo-form__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
/* Пример модели мусоровоза длинный (~400px с отступами), а половина узкой формы - 290-305px:
   модель и телефон - во всю ширину, количество и город - парой в первой строке */
#view-mvo .mvo-form__grid > .field:has(#mvo-truck, #mvo-phone) { grid-column: 1 / -1; }
#view-mvo .mvo-form .field { display: flex; flex-direction: column; }
#view-mvo .mvo-form__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; }
#view-mvo .mvo-form__actions .btn { min-height: var(--btn-h); }
#view-mvo .mvo-form__legal { flex: 1 1 240px; margin: 0; color: var(--muted); font-size: 13px; line-height: 1.45; }
#view-mvo .mvo-request__aside { display: grid; gap: 20px; align-content: start; min-width: 0; }
#view-mvo .mvo-request__facts { gap: 0; }
#view-mvo .mvo-request .mvo-term {
  padding: 16px 0;
  border-top: 1px solid var(--hairline); border-radius: 0;
  background: none; box-shadow: none;
}
#view-mvo .mvo-request .mvo-term:first-child { padding-top: 0; border-top: 0; }
#view-mvo .mvo-request .mvo-term div strong { font-size: 15px; }
#view-mvo .mvo-request .mvo-term div span { font-size: 14px; }
#view-mvo .mvo-request__aside .btn { width: 100%; min-height: var(--btn-h); }

/* ==========================================================================
   7. Подбор для бизнеса: первый экран, карточки объектов
   ========================================================================== */
#v2 #view-business-selection { padding-bottom: 0; background: none; }
#view-business-selection .bs-page { color: var(--ink); }

/* Первый экран: текст слева, картинка - в карточке справа (20.10.2026 - заглушка для художника:
   foundation.css, 23; docs/IMAGES-TODO.md) */
#view-business-selection .bs-hero {
  position: static; display: block;
  width: auto; min-height: 0;
  margin: 0; padding: 0;
  overflow: visible;
  border: 0; border-radius: 0;
  background: none; box-shadow: none;
  color: var(--ink);
}
#view-business-selection .bs-hero::after { content: none; }
#view-business-selection .bs-hero__inner {
  display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); align-items: center;
  column-gap: clamp(32px, 4.4vw, 72px);
  width: min(var(--container), calc(100% - 2 * var(--gutter)));
  margin-inline: auto;
  padding: 0;
}
#view-business-selection .bs-hero__inner::after {
  content: "";
  grid-column: 2; grid-row: 1;
  height: clamp(300px, 30vw, 440px);
  border-radius: var(--r);
  /* № 29 (23.10.2026, docs/IMAGES-CODEX.md, 10.2): в коде, поля админки нет */
  background: var(--field) url("img/29-business-hero.jpg") center / cover no-repeat;
}
#view-business-selection .bs-hero__copy { grid-column: 1; grid-row: 1; display: flex; flex-direction: column; align-items: flex-start; min-width: 0; }
#view-business-selection .bs-kicker {
  display: inline-flex; align-items: center; gap: 8px;
  min-height: 30px; margin: 0 0 clamp(16px, 1.6vw, 22px); padding: 0 12px;
  border-radius: var(--r-pill);
  background: var(--brand-tint); color: var(--brand-hover);
  font-size: 13px; font-weight: 500; line-height: 1.2;
}
#view-business-selection .bs-kicker::before {
  content: ""; flex: none; width: 6px; height: 6px; border-radius: 50%; background: var(--brand);
}
#view-business-selection .bs-hero h1 {
  margin: 0;
  color: var(--ink);
  font-size: var(--fs-h1); font-weight: 500; line-height: 1.06; letter-spacing: -0.03em;
}
#view-business-selection .bs-hero__lead {
  margin: clamp(16px, 1.8vw, 24px) 0 0;
  color: var(--muted);
  font-size: var(--fs-lead); line-height: 1.5;
}

#view-business-selection .bs-section { margin-top: var(--block); padding: 0; }
#view-business-selection .bs-section__head {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 440px);
  align-items: end; gap: 16px clamp(32px, 5vw, 80px);
  margin: 0 0 var(--head-gap);
}
#view-business-selection .bs-section__head .eyebrow { margin-bottom: 12px; }
#view-business-selection .bs-section__head h2 {
  margin: 0;
  font-size: var(--fs-h2); font-weight: 500; line-height: 1.08; letter-spacing: -0.03em;
}
#view-business-selection .bs-section__head p {
  margin: 0;
  color: var(--muted);
  font-size: 17px; line-height: 1.5;
}

/* Карточки объектов: белые, кружок-иконка, позиции строками с окном 56px, кнопка подборки */
#view-business-selection .bs-use-cases { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--gap); }
#view-business-selection .bs-use-case {
  display: flex; flex-direction: column; min-width: 0;
  padding: clamp(20px, 2vw, 28px);
  border: 0; border-radius: var(--r);
  background: var(--surface); box-shadow: var(--shadow);
  cursor: pointer;
  transition: box-shadow var(--speed) var(--ease);
}
#view-business-selection .bs-use-case:hover { border: 0; }
#view-business-selection .bs-use-case.is-selected { box-shadow: var(--shadow), inset 0 0 0 1.5px var(--brand); }
#view-business-selection .bs-use-case__head {
  display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 16px; align-items: start;
  padding: 0 0 16px;
  border: 0;
}
#view-business-selection .bs-use-case__icon {
  display: grid; place-items: center;
  width: 44px; height: 44px;
  border: 0; border-radius: var(--r-pill);
  background: var(--brand-tint); color: var(--brand);
}
#view-business-selection .bs-use-case__icon svg { width: 20px; height: 20px; stroke-width: 1.6; }
#view-business-selection .bs-use-case__head h3 {
  margin: 2px 0 6px;
  color: var(--ink);
  font-size: 19px; font-weight: 500; line-height: 1.25; letter-spacing: -0.015em;
}
#view-business-selection .bs-use-case__head p { margin: 0; color: var(--muted); font-size: 15px; line-height: 1.5; }
#view-business-selection .bs-product-list {
  display: grid; grid-template-columns: minmax(0, 1fr); grid-auto-flow: row; grid-auto-columns: auto;
  flex: 1; align-content: start;
  overflow: visible; scroll-snap-type: none;
}
#view-business-selection .bs-product {
  display: grid; grid-template-columns: 56px minmax(0, 1fr); align-items: center; gap: 14px;
  min-width: 0;
  padding: 12px 0;
  border: 0; border-top: 1px solid var(--hairline); border-radius: 0;
  background: none;
}
#view-business-selection .bs-product:hover { background: none; }
#view-business-selection .bs-product__media {
  position: relative;
  width: 56px; height: 56px; aspect-ratio: 1;
  overflow: hidden;
  border-radius: var(--r-in);
  background: var(--field);
}
#view-business-selection .bs-product__media img {
  inset: 6px; width: calc(100% - 12px); height: calc(100% - 12px);
  object-fit: contain; mix-blend-mode: multiply;
  border-radius: 0;
}
#view-business-selection .bs-product__body {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: auto auto;
  column-gap: 16px; align-items: center;
  min-width: 0; padding: 0;
}
#view-business-selection .bs-product__body small {
  grid-column: 1; grid-row: 1;
  margin: 0;
  color: var(--muted);
  font-size: 13px; font-weight: 400; line-height: 1.3;
}
#view-business-selection .bs-product__body strong {
  grid-column: 1; grid-row: 2;
  color: var(--ink);
  font-size: 15px; font-weight: 500; line-height: 1.35;
}
#view-business-selection .bs-product__price {
  grid-column: 2; grid-row: 1 / span 2;
  margin: 0; padding: 0;
  color: var(--ink);
  font-size: 15px; font-weight: 500; line-height: 1.3; white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
#view-business-selection .bp-card-foot {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 16px;
  margin-top: 8px; padding: 16px 0 0;
  border: 0; border-top: 1px solid var(--hairline); border-radius: 0;
  background: none;
}
#view-business-selection .bp-card-link {
  display: inline-flex; align-items: center; gap: 10px;
  min-height: var(--btn-h-sm); padding: 0 var(--btn-px-sm);
  border-radius: var(--r-pill);
  background: var(--brand); color: #fff;
  box-shadow: none;
  font-size: 15px; font-weight: 500; text-decoration: none;
  transform: none;
  transition: background-color var(--speed) var(--ease);
}
#view-business-selection .bp-card-link:hover { background: var(--brand-hover); box-shadow: none; transform: none; }
#view-business-selection .bp-card-link svg { width: 18px; height: 18px; stroke-width: 1.6; }

/* ==========================================================================
   8. Сценарий подборки: факты, мини-каталог, пакет и заявка
   ========================================================================== */
#view-business-selection .bp-scenario { margin: 0; }
#view-business-selection .bp-scenario__inner { display: flex; flex-direction: column; gap: var(--gap); }
#view-business-selection .bp-back {
  display: inline-flex; align-items: center; gap: 8px; align-self: flex-start;
  min-height: 44px; margin-bottom: 8px;
  color: var(--brand);
  font-size: 15px; font-weight: 500; text-decoration: none;
}
#view-business-selection .bp-back:hover { color: var(--brand-hover); text-decoration: none; }
#view-business-selection .bp-back svg { width: 18px; height: 18px; stroke-width: 1.6; transition: transform var(--speed) var(--ease); }
#view-business-selection .bp-back:hover svg { transform: translateX(-3px); }
#view-business-selection .bp-eyebrow {
  display: block;
  margin: 0 0 12px;
  color: var(--brand);
  font-size: 15px; font-weight: 500; line-height: 1.3;
}
#view-business-selection .bp-head {
  display: grid; gap: 4px;
  padding: clamp(20px, 2vw, 28px);
  border: 0; border-radius: var(--r);
  background: var(--surface); box-shadow: var(--shadow);
}
#view-business-selection .bp-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gap); margin: 0; padding: 0; list-style: none; }
#view-business-selection .bp-facts li {
  display: flex; flex-direction: column; align-items: flex-start; gap: 16px;
  padding: 16px 18px 18px;
  border: 0; border-radius: var(--r-in);
  background: var(--field);
  color: var(--ink);
  font-size: 15px; line-height: 1.5;
}
#view-business-selection .bp-facts__ic {
  display: grid; place-items: center;
  width: 44px; height: 44px;
  border-radius: var(--r-pill);
  background: var(--surface);
}
#view-business-selection .bp-facts svg { width: 20px; height: 20px; stroke: var(--brand); stroke-width: 1.6; }

#view-business-selection .bp-mini { display: grid; gap: var(--gap); margin-top: clamp(16px, 2vw, 32px); }
#view-business-selection .bp-mini__head { display: flex; justify-content: flex-end; align-items: end; gap: 12px 24px; }
#view-business-selection .bp-sort { display: inline-flex; align-items: center; gap: 12px; }
#view-business-selection .bp-sort > span { color: var(--muted); font-size: 14px; font-weight: 400; }
#view-business-selection .bp-sort select,
#view-business-selection .bp-sort select:hover,
#view-business-selection .bp-sort select:focus {
  min-width: 240px; min-height: var(--ctl-h-sm); height: var(--ctl-h-sm);
  padding: 0 44px 0 20px;
  border-radius: var(--r-pill);
  background-color: var(--surface);
  font-size: 15px;
}
#view-business-selection .bp-sort select:hover { border-color: var(--line-strong); }
#view-business-selection .bp-sort select:focus { border-color: var(--brand); outline: 0; }

#view-business-selection .bp-mini__grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--gap); }
/* Позиция мини-каталога - карточка выбора: окно фото 12, отмечено - тинт, кольцо и зелёная галочка */
#view-business-selection .bp-item {
  position: relative;
  display: flex; flex-direction: column;
  padding: var(--inset) var(--inset) 16px;
  border: 0; border-radius: var(--r);
  background: var(--surface); box-shadow: var(--shadow);
  transform: none;
  cursor: pointer;
  transition: background-color var(--speed) var(--ease), box-shadow var(--speed) var(--ease);
}
#view-business-selection .bp-item:hover { border: 0; transform: none; box-shadow: var(--shadow), inset 0 0 0 1px var(--line-strong); }
#view-business-selection .bp-item.is-picked { background: var(--brand-tint); box-shadow: var(--shadow), inset 0 0 0 1.5px var(--brand); }
/* Кольцо фокуса - только с клавиатуры: после касания отмеченная карточка не получает двойную рамку */
#view-business-selection .bp-item:focus-within { outline: 0; }
#view-business-selection .bp-item:has(.bp-item__input:focus-visible) { outline: 2px solid var(--brand); outline-offset: 2px; }
#view-business-selection .bp-item__media {
  display: grid; place-items: center;
  aspect-ratio: 1;
  overflow: hidden;
  border-radius: var(--r-in);
  background: var(--field);
}
#view-business-selection .bp-item__media img {
  width: 84%; height: 84%;
  object-fit: contain; mix-blend-mode: multiply;
  transition: transform .4s var(--ease);
}
#view-business-selection .bp-item:hover .bp-item__media img { transform: scale(1.04); }
#view-business-selection .bp-item__body { display: grid; gap: 4px; align-content: start; padding: 14px 8px 0; flex: 1; }
#view-business-selection .bp-item__meta { color: var(--muted); font-size: 13px; font-weight: 400; line-height: 1.3; }
/* Длинное слово («четырёхсекционная») переносится, а не выходит за карточку - как у карточки товара */
#view-business-selection .bp-item__title {
  color: var(--ink);
  font-size: 15px; font-weight: 400; line-height: 1.4; letter-spacing: -0.01em;
  overflow-wrap: break-word;
}
#view-business-selection .bp-item__price {
  margin-top: 6px;
  color: var(--ink);
  font-size: 16px; font-weight: 500; letter-spacing: -0.02em;
}
#view-business-selection .bp-item__mark {
  top: 16px; right: 16px;
  width: 32px; height: 32px;
  border: 0; border-radius: var(--r-pill);
  background: var(--surface);
}
#view-business-selection .bp-item__mark svg { width: 16px; height: 16px; stroke: var(--line-strong); stroke-width: 2; }
#view-business-selection .bp-item:hover .bp-item__mark { border: 0; }
#view-business-selection .bp-item:hover .bp-item__mark svg { stroke: var(--brand); }
#view-business-selection .bp-item.is-picked .bp-item__mark { background: var(--brand); }
#view-business-selection .bp-item.is-picked .bp-item__mark svg { stroke: #fff; }
#view-business-selection .bp-item__qty {
  top: 16px; left: 16px;
  padding: 0 10px; min-height: 26px; line-height: 26px;
  border-radius: var(--r-pill);
  background: var(--brand); color: #fff;
  font-size: 13px; font-weight: 500;
}
#view-business-selection .bp-item.is-picked .bp-item__qty { display: inline-block; }
#view-business-selection .bp-item__tip {
  gap: 8px;
  padding: 14px 16px;
  border-radius: var(--r-in);
  background: var(--band); color: var(--on-band);
  box-shadow: var(--shadow-pop);
  font-size: 13px; line-height: 1.5;
}
#view-business-selection .bp-item__tip::after { border-top-color: var(--band); }
#view-business-selection .bp-item__tip-row { border-top-color: var(--on-dark-line); font-size: 13px; }
#view-business-selection .bp-item__tip-row span { color: var(--on-band); }
#view-business-selection .bp-item__tip-row b { color: #fff; font-weight: 500; }
/* Место подсказки считает placeBusinessItemTip: --tip-dx сдвигает её внутрь колонок сетки (стрелка
   остаётся над серединой карточки), .is-tip-below открывает под карточкой, когда сверху шапка */
@media (hover: hover) and (pointer: fine) {
  #view-business-selection .bp-item__tip { transform: translate(calc(-50% + var(--tip-dx, 0px)), 6px); }
  #view-business-selection .bp-item:is(:hover, :focus-within) .bp-item__tip { transform: translate(calc(-50% + var(--tip-dx, 0px)), 0); }
  #view-business-selection .bp-item__tip::after { left: calc(50% - var(--tip-dx, 0px)); }
  #view-business-selection .bp-item.is-tip-below .bp-item__tip { top: calc(100% + 10px); bottom: auto; transform: translate(calc(-50% + var(--tip-dx, 0px)), -6px); }
  #view-business-selection .bp-item.is-tip-below:is(:hover, :focus-within) .bp-item__tip { transform: translate(calc(-50% + var(--tip-dx, 0px)), 0); }
  #view-business-selection .bp-item.is-tip-below .bp-item__tip::after { top: auto; bottom: 100%; border-top-color: transparent; border-bottom-color: var(--band); }
}
/* На тач-экране подсказки при наведении нет: в v1 она вставала строкой под ценой и повторяла название
   («Пластиковый контейнер BASIC 240…» под «Пластиковый контейнер BASIC 240 л») - читалась как сломанный
   дубль. Характеристики позиции видны в карточке товара и в шторке заявки */
@media (hover: none), (pointer: coarse) {
  #view-business-selection .bp-item__tip { display: none; }
}

/* Пакет и заявка - друг под другом во всю ширину (правка 6 от 08.10: у заявки больше нет вводного текста
   и шагов, рядом с высоким пакетом она стояла пустой колонкой). На десктопе пакет - две колонки: слева
   заголовок, описание и кнопки, справа состав и итог; заявка - строкой: заголовок слева, кнопки справа */
#view-business-selection .bp-grid {
  display: grid; grid-template-columns: minmax(0, 1fr);
  gap: var(--gap); align-items: start;
  margin-top: clamp(16px, 2vw, 32px);
}

/* Готовый пакет - тёмная карточка (--band), кнопки как на тёмном */
#view-business-selection .bp-pack {
  padding: clamp(24px, 2.4vw, 32px);
  border: 0; border-radius: var(--r);
  background: var(--band); color: #fff;
}
#view-business-selection .bp-pack__kicker {
  display: block; margin: 0 0 12px;
  color: var(--brand-on-dark);
  font-size: 15px; font-weight: 500; line-height: 1.3;
}
#view-business-selection .bp-pack h3 {
  margin: 0 0 10px;
  color: #fff;
  font-size: var(--fs-h3); font-weight: 500; line-height: 1.25; letter-spacing: -0.015em;
}
#view-business-selection .bp-pack__note { margin: 0 0 20px; color: var(--on-band); font-size: 15px; line-height: 1.5; }
#view-business-selection .bp-pack__list { margin: 0 0 20px; border-top: 1px solid var(--on-dark-line); }
#view-business-selection .bp-pack__row {
  grid-template-columns: 48px minmax(0, 1fr) auto; gap: 2px 14px;
  padding: 12px 0;
  border-bottom: 1px solid var(--on-dark-line);
}
#view-business-selection .bp-pack__media {
  display: grid; place-items: center;
  width: 48px; height: 48px;
  border-radius: var(--r-in);
  background: var(--field);
}
#view-business-selection .bp-pack__media img { width: 84%; height: 84%; object-fit: contain; mix-blend-mode: multiply; }
#view-business-selection .bp-pack__name { color: #fff; font-size: 15px; font-weight: 500; line-height: 1.35; }
#view-business-selection .bp-pack__qty { color: var(--brand-on-dark); font-size: 14px; font-weight: 500; }
#view-business-selection .bp-pack__sum { color: var(--on-band); font-size: 14px; font-weight: 400; }
#view-business-selection .bp-pack__total { gap: 4px 12px; margin-bottom: 20px; }
#view-business-selection .bp-pack__total span { color: var(--on-band); font-size: 14px; }
#view-business-selection .bp-pack__total strong { color: #fff; font-size: 24px; font-weight: 500; letter-spacing: -0.02em; }
#view-business-selection .bp-pack__actions { display: grid; gap: 10px; }

/* Кнопки подборки = .btn (5.1): капсула 52px, основная зелёная, вторичная с рамкой */
#view-business-selection .bp-btn,
#v2 .bp-bar .bp-btn,
#v2 .bp-sheet .bp-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: var(--btn-h); padding: 0 var(--btn-px);
  border: 1px solid transparent; border-radius: var(--r-pill);
  font: 500 16px/1.2 var(--font); text-align: center;
  cursor: pointer;
  transition: background-color var(--speed) var(--ease), border-color var(--speed) var(--ease), color var(--speed) var(--ease);
}
#view-business-selection .bp-btn[hidden], #v2 .bp-bar .bp-btn[hidden] { display: none; }
#view-business-selection .bp-btn--primary { background: var(--brand); border-color: var(--brand); color: #fff; }
#view-business-selection .bp-btn--primary:hover { background: var(--brand-hover); border-color: var(--brand-hover); }
#view-business-selection .bp-btn--ghost { background: transparent; border-color: var(--line-strong); color: var(--ink); }
#view-business-selection .bp-btn--ghost:hover { background: var(--field); border-color: var(--line-strong); color: var(--ink); }
#view-business-selection .bp-pack .bp-btn--primary { background: #fff; border-color: #fff; color: var(--band); }
#view-business-selection .bp-pack .bp-btn--primary:hover { background: var(--brand-tint); border-color: var(--brand-tint); color: var(--band); }
#view-business-selection .bp-pack .bp-btn--ghost { background: transparent; border-color: rgb(255 255 255 / .4); color: #fff; }
#view-business-selection .bp-pack .bp-btn--ghost:hover { background: rgb(255 255 255 / .1); border-color: rgb(255 255 255 / .4); color: #fff; }

/* Заявка из подборки - белая карточка: заголовок, строка состояния, кнопки. Инструкций и шагов больше
   нет (правка 6 от 08.10), поэтому карточка своей высоты, а не до высоты пакета */
#view-business-selection .bp-cta {
  align-self: start;
  display: flex; flex-direction: column; align-items: flex-start; gap: 14px;
  text-align: left;
  padding: clamp(24px, 2.4vw, 32px);
  border: 0; border-radius: var(--r);
  background: var(--surface); box-shadow: var(--shadow);
}
#view-business-selection .bp-cta .bp-eyebrow { margin: 0; }
#view-business-selection .bp-cta h3 {
  margin: 0;
  color: var(--ink);
  font-size: var(--fs-h3); font-weight: 500; line-height: 1.25; letter-spacing: -0.015em;
}
#view-business-selection .bp-cta > p { margin: 0; color: var(--muted); font-size: 15px; line-height: 1.5; }
#view-business-selection .bp-cta__now {
  padding: 12px 16px;
  border-radius: var(--r-in);
  background: var(--field); color: var(--muted);
  font-size: 14px; line-height: 1.45;
}
#view-business-selection .bp-cta__now:empty { display: none; }
#view-business-selection .bp-cta.is-ready { box-shadow: var(--shadow), inset 0 0 0 1.5px var(--brand); }
#view-business-selection .bp-cta.is-ready .bp-cta__now { background: var(--brand-tint); color: var(--brand-hover); }
#view-business-selection .bp-cta__actions { display: flex; flex-wrap: wrap; gap: 10px; padding-top: 6px; }
#view-business-selection .bp-cta .bp-btn--ghost:hover { background: var(--field); border-color: var(--line-strong); }
@media (min-width: 1041px) {
  #view-business-selection .bp-pack {
    display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); grid-template-rows: auto auto auto 1fr auto;
    column-gap: clamp(32px, 4.4vw, 72px);
  }
  #view-business-selection .bp-pack__kicker { grid-column: 1; grid-row: 1; }
  #view-business-selection .bp-pack h3 { grid-column: 1; grid-row: 2; }
  #view-business-selection .bp-pack__note { grid-column: 1; grid-row: 3; }
  #view-business-selection .bp-pack__list { grid-column: 2; grid-row: 1 / 5; margin: 0; }
  #view-business-selection .bp-pack__actions {
    grid-column: 1; grid-row: 5; align-self: end;
    display: flex; flex-wrap: wrap; gap: 10px;
    margin-top: 24px;
  }
  #view-business-selection .bp-pack__actions .bp-btn { flex: 1 1 auto; }
  #view-business-selection .bp-pack__total { grid-column: 2; grid-row: 5; align-self: end; margin: 24px 0 0; }
  #view-business-selection .bp-cta {
    display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: none; align-items: center; justify-items: start;
    gap: 8px clamp(24px, 3vw, 48px);
  }
  #view-business-selection .bp-cta > :not(.bp-cta__actions) { grid-column: 1; }
  #view-business-selection .bp-cta__actions { grid-column: 2; grid-row: 1 / span 3; padding-top: 0; }
}

/* ==========================================================================
   9. Полоса подборки (плавающая белая карточка) и шторка заявки
   ========================================================================== */
#v2 .bp-bar {
  --bp-bar-bg: var(--surface);
  left: var(--edge); bottom: 24px;
  width: min(420px, calc(100vw - 48px));
  padding: 16px;
  border: 0; border-radius: var(--r);
  background: var(--surface);
  box-shadow: var(--shadow-pop);
  -webkit-backdrop-filter: none; backdrop-filter: none;
  color: var(--ink);
}
#v2 .bp-bar.is-active { --bp-bar-bg: var(--surface); box-shadow: var(--shadow-pop); }
#v2 .bp-bar__inner { gap: 12px; }
#v2 .bp-bar__info { gap: 2px; padding: 0 4px; }
#v2 .bp-bar__info strong { color: var(--ink); font-size: 15px; font-weight: 500; line-height: 1.3; }
#v2 .bp-bar__info > span { color: var(--muted); font-size: 13px; line-height: 1.4; }
#v2 .bp-bar__picks { max-height: min(32vh, 248px); padding-right: 4px; }
#v2 .bp-bar__picks.is-scrollable { border-bottom: 1px solid var(--hairline); padding-bottom: 8px; }
#v2 .bp-bar__picks::-webkit-scrollbar-thumb { border-radius: var(--r-pill); background: var(--line-strong); }
#v2 .bp-bar__picks::-webkit-scrollbar-thumb:hover { background: var(--control); }
#v2 .bp-bar .bp-chips { gap: 0; padding: 0; }
#v2 .bp-chip {
  gap: 10px;
  padding: 8px 0;
  border: 0; border-bottom: 1px solid var(--hairline); border-radius: 0;
  background: none;
}
#v2 .bp-chip:last-child { border-bottom: 0; }
#v2 .bp-chip__media {
  display: grid; place-items: center;
  width: 40px; height: 40px;
  border-radius: var(--r-in);
  background: var(--field);
}
#v2 .bp-chip__media img { width: 84%; height: 84%; object-fit: contain; mix-blend-mode: multiply; }
#v2 .bp-chip__name { color: var(--ink); font-size: 14px; font-weight: 500; line-height: 1.3; }
#v2 .bp-chip__vol { color: var(--muted); font-size: 13px; }
#v2 .bp-chip__qty { gap: 0; padding: 2px; border-radius: var(--r-pill); background: var(--field); }
#v2 .bp-chip__step {
  width: 32px; height: 32px;
  border: 0; border-radius: var(--r-pill);
  background: transparent;
}
#v2 .bp-chip__step svg { stroke: var(--ink); stroke-width: 1.6; }
#v2 .bp-chip__step:hover { background: var(--surface); }
#v2 .bp-chip__step:disabled { opacity: .4; }
#v2 .bp-chip__step:disabled:hover { background: transparent; }
#v2 .bp-chip__num { min-width: 24px; color: var(--ink); font-size: 14px; font-weight: 500; }
/* Крестик не сжимается: в строке с длинным названием он ужимался до 28px и сдвигал счётчик на 3px */
#v2 .bp-chip__drop {
  flex: 0 0 auto;
  width: 32px; height: 32px;
  border: 0; border-radius: var(--r-pill);
  background: transparent;
}
#v2 .bp-chip__drop svg { stroke: var(--muted); stroke-width: 1.6; }
#v2 .bp-chip__drop:hover { background: var(--danger-bg); }
#v2 .bp-chip__drop:hover svg { stroke: var(--danger); }

#v2 .bp-bar__peek {
  gap: 12px; min-height: 52px;
  padding: 6px 14px 6px 6px;
  border: 0; border-radius: var(--r-pill);
  background: var(--field); color: var(--ink);
}
#v2 .bp-bar__peek:hover, #v2 .bp-bar__peek:focus-visible { border: 0; background: var(--hairline); }
#v2 .bp-bar__thumb {
  width: 40px; height: 40px; margin-left: -12px;
  border: 2px solid var(--surface); border-radius: var(--r-in);
  background: var(--field);
}
#v2 .bp-bar__thumb:first-child { margin-left: 0; }
#v2 .bp-bar__thumb img { width: 84%; height: 84%; object-fit: contain; mix-blend-mode: multiply; }
#v2 .bp-bar__thumb--more {
  width: auto; min-width: 40px; margin-left: 6px; padding: 0 8px;
  border-color: var(--surface); border-radius: var(--r-pill);
  background: var(--brand-tint); color: var(--brand-hover);
  font-size: 13px; font-weight: 500;
}
#v2 .bp-bar__peek-txt strong { color: var(--ink); font-size: 15px; font-weight: 500; }
#v2 .bp-bar__peek-txt span { color: var(--muted); font-size: 13px; }
#v2 .bp-bar__peek-arrow { stroke: var(--muted); stroke-width: 1.6; }
#v2 .bp-bar__actions { gap: 8px 12px; }
#v2 .bp-bar .bp-btn { min-height: var(--btn-h-sm); padding: 0 var(--btn-px-sm); font-size: 15px; }
#v2 .bp-bar .bp-btn--primary { background: var(--brand); border-color: var(--brand); color: #fff; }
#v2 .bp-bar .bp-btn--primary:hover { background: var(--brand-hover); border-color: var(--brand-hover); }
#v2 .bp-bar__go svg { width: 18px; height: 18px; stroke-width: 1.6; }
#v2 .bp-bar__clear {
  min-height: 36px; padding: 0 12px;
  border: 0; border-radius: var(--r-pill);
  color: var(--muted);
  font-size: 14px; font-weight: 400;
  text-decoration: underline; text-underline-offset: 3px;
}
#v2 .bp-bar__clear:hover { color: var(--ink); }
#v2 .bp-bar__clear.is-armed { border: 0; background: var(--danger-bg); color: var(--danger); text-decoration: none; font-weight: 500; }
@keyframes v2-bp-go-pulse {
  0% { box-shadow: 0 0 0 0 rgb(44 96 51 / .45); }
  70% { box-shadow: 0 0 0 13px rgb(44 96 51 / 0); }
  100% { box-shadow: 0 0 0 0 rgb(44 96 51 / 0); }
}
#v2 .bp-bar.is-bump .bp-bar__go { animation: v2-bp-go-pulse 1.1s ease-out 2; }
/* Пока под окном блоки пакета и «Свой список» (у них те же кнопки заявки), окно уезжает вниз и не
   закрывает их - syncBusinessBarTuck. Видимость меняется после выезда, иначе окно исчезало рывком */
#v2 .bp-bar { transition: transform 280ms var(--ease), opacity var(--speed) var(--ease), visibility 0s; }
#v2 .bp-bar.is-tucked {
  transform: translateY(calc(100% + 24px));
  opacity: 0; visibility: hidden; pointer-events: none;
  transition: transform 280ms var(--ease), opacity var(--speed) var(--ease), visibility 0s linear 280ms;
}

/* ≥1101: окно со списком (так просил заказчик) не выше ~30% окна. «Снять выбор» - в строке итога справа,
   а не отдельной строкой; кнопка - во всю ширину окна; список листается внутри и показывает 1-2 строки
   на ноутбуке 1280×720 и около трёх на 1440×900 (было 39-58% экрана на ноутбуках) */
@media (min-width: 1101px) {
  #v2 .bp-bar__inner { grid-template-columns: minmax(0, 1fr) auto; align-items: center; column-gap: 12px; }
  #v2 .bp-bar__info { grid-column: 1; grid-row: 1; }
  #v2 .bp-bar__actions { display: contents; }
  #v2 .bp-bar__clear { grid-column: 2; grid-row: 1; align-self: center; }
  #v2 .bp-bar__picks { grid-column: 1 / -1; grid-row: 2; max-height: clamp(76px, 30vh - 150px, 248px); }
  #v2 .bp-bar__go { grid-column: 1 / -1; grid-row: 3; width: 100%; }
}
/* 901-1100: окно во всю ширину, список над строкой итога - тоже не выше ~30% окна */
@media (min-width: 901px) and (max-width: 1100px) {
  #v2 .bp-bar__picks { max-height: clamp(60px, 30vh - 110px, 248px); }
}

/* Шторка: холст, радиус 20, строки на белой карточке через волосяную линию */
#v2 .bp-sheet__backdrop { background: rgb(22 30 23 / .45); -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px); }
#v2 .bp-sheet__panel {
  width: min(760px, 100%);
  border-radius: var(--r);
  background: var(--canvas);
  box-shadow: var(--shadow-pop);
}
#v2 .bp-sheet__head {
  gap: 12px 18px;
  padding: clamp(20px, 2.4vw, 28px) clamp(20px, 2.4vw, 28px) 16px;
  border-bottom: 0;
}
#v2 .bp-sheet__head .bp-eyebrow { display: block; margin: 0 0 8px; color: var(--brand); font-size: 15px; font-weight: 500; line-height: 1.3; }
#v2 .bp-sheet__head h3 {
  margin: 0;
  color: var(--ink);
  font-size: clamp(22px, 2.2vw, 28px); font-weight: 500; line-height: 1.15; letter-spacing: -0.03em;
}
#v2 .bp-sheet__count { margin: 8px 0 0; color: var(--muted); font-size: 14px; }
#v2 .bp-sheet__close {
  width: 40px; height: 40px;
  border: 0; border-radius: var(--r-pill);
  background: var(--surface);
}
#v2 .bp-sheet__close svg { stroke: var(--ink); stroke-width: 1.6; }
#v2 .bp-sheet__close:hover { border: 0; background: var(--brand); }
#v2 .bp-sheet__close:hover svg { stroke: #fff; }
#v2 .bp-sheet__body { gap: 24px; padding: 0 clamp(20px, 2.4vw, 28px) clamp(20px, 2.4vw, 28px); }
#v2 .bp-sheet__empty {
  padding: 14px 18px;
  border: 0; border-radius: var(--r);
  background: var(--surface);
  color: var(--muted);
  font-size: 14px; line-height: 1.5;
}
#v2 .bp-picked {
  gap: 0;
  padding: 4px 20px;
  border-radius: var(--r);
  background: var(--surface); box-shadow: var(--shadow);
}
#v2 .bp-picked__row {
  grid-template-columns: 56px minmax(0, 1fr) auto auto auto;
  gap: 14px;
  padding: 12px 0;
  border: 0; border-bottom: 1px solid var(--hairline); border-radius: 0;
  background: none;
}
#v2 .bp-picked__row:last-child { border-bottom: 0; }
#v2 .bp-picked__media {
  display: grid; place-items: center;
  width: 56px; height: 56px;
  border-radius: var(--r-in);
  background: var(--field);
}
#v2 .bp-picked__media img { width: 84%; height: 84%; object-fit: contain; mix-blend-mode: multiply; }
#v2 .bp-picked__body strong { color: var(--ink); font-size: 15px; font-weight: 500; line-height: 1.35; }
#v2 .bp-picked__body small { color: var(--muted); font-size: 13px; }
#v2 .bp-picked__qty { gap: 0; padding: 4px; border: 0; border-radius: var(--r-pill); background: var(--field); }
#v2 .bp-picked__step { width: 36px; height: 36px; border: 0; border-radius: var(--r-pill); background: transparent; }
#v2 .bp-picked__step svg { stroke: var(--ink); stroke-width: 1.6; }
#v2 .bp-picked__step:hover { background: var(--surface); }
#v2 .bp-picked__step:disabled:hover { background: transparent; }
#v2 .bp-picked__num,
#v2 .bp-picked__num:hover,
#v2 .bp-picked__num:focus {
  width: 40px; height: 36px; min-height: 0;
  padding: 0;
  border: 0; border-radius: 0;
  background: transparent;
  color: var(--ink);
  font-size: 15px; font-weight: 500; text-align: center;
}
#v2 .bp-picked__num:focus-visible { outline: 2px solid var(--brand); outline-offset: 1px; border-radius: var(--r-check); }
/* Сумма строки - колонка постоянной ширины по правому краю: степперы у всех строк стоят на одной линии,
   какой бы длины ни была сумма (52 400 ₸ и 12 200 ₸ сдвигали их на 2-4px) */
#v2 .bp-picked__price { min-width: 104px; color: var(--ink); font-size: 15px; font-weight: 500; text-align: right; font-variant-numeric: tabular-nums; }
#v2 .bp-picked__drop { width: 36px; height: 36px; border: 0; border-radius: var(--r-pill); background: var(--field); }
#v2 .bp-picked__drop svg { stroke: var(--ink); stroke-width: 1.6; }
#v2 .bp-picked__drop:hover { border: 0; background: var(--danger-bg); }
#v2 .bp-picked__drop:hover svg { stroke: var(--danger); }
#v2 .bp-picked__total { margin-top: 16px; padding: 0 4px; border-top: 0; }
#v2 .bp-picked__total span { color: var(--muted); font-size: 14px; }
#v2 .bp-picked__total strong { color: var(--ink); font-size: 24px; font-weight: 500; letter-spacing: -0.02em; }
#v2 .bp-picked__foot { margin-top: 12px; }
#v2 .bp-picked__clear {
  min-height: var(--btn-h-sm); padding: 0 var(--btn-px-sm);
  border: 1px solid var(--line-strong); border-radius: var(--r-pill);
  background: transparent; color: var(--ink);
  font-size: 15px; font-weight: 500;
}
#v2 .bp-picked__clear:hover { border-color: var(--danger); background: var(--danger-bg); color: var(--danger); }
#v2 .bp-picked__clear.is-armed { border-color: var(--danger); background: var(--danger-bg); color: var(--danger); }

/* Форма подборки (на странице и в шторке): поля 5.3, на холсте белые */
#v2 .bp-sheet .bp-form { padding: 0; border: 0; border-radius: 0; background: none; }
#v2 .bp-form__grid { gap: 16px; }
#v2 .bp-field { gap: 8px; }
#v2 .bp-field > span { padding-left: 4px; color: var(--muted); font-size: 14px; font-weight: 400; letter-spacing: inherit; }
#v2 .bp-sheet .bp-field :is(input, textarea) { background-color: var(--surface); }
#v2 .bp-sheet .bp-field :is(input, textarea):focus { border-color: var(--brand); box-shadow: none; }
#v2 .bp-form__foot { gap: 12px 16px; margin-top: 20px; }
#v2 .bp-sheet .bp-btn--primary { background: var(--brand); border-color: var(--brand); color: #fff; }
#v2 .bp-sheet .bp-btn--primary:hover { background: var(--brand-hover); border-color: var(--brand-hover); }
#v2 .bp-sheet .bp-btn--ghost { background: transparent; border-color: var(--line-strong); color: var(--ink); }
#v2 .bp-sheet .bp-btn--ghost:hover { background: var(--surface); border-color: var(--surface); color: var(--ink); }
#v2 .bp-form__legal { color: var(--muted); font-size: 13px; line-height: 1.45; }
#v2 .bp-status {
  margin: 16px 0 0; padding: 14px 18px;
  border: 0; border-radius: var(--r-in);
  background: var(--brand-tint); color: var(--brand-hover);
  font-size: 14px; font-weight: 400; line-height: 1.5;
}
#v2 .bp-status:empty { display: none; }

/* ==========================================================================
   10. Адаптив
   ========================================================================== */
@media (max-width: 1240px) {
  #view-zhk .calculator-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 1180px) {
  #view-zhk .calculator-layout { grid-template-columns: minmax(0, 1fr); }
  #view-zhk .calculator-controls { position: static; }
  #view-zhk .calculator-metrics { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  #view-tenders .trq { grid-template-columns: minmax(0, 1fr); }
  #view-tenders .trq__aside { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px clamp(24px, 3vw, 40px); align-items: start; }
  #view-mvo .mvo-request { grid-template-columns: minmax(0, 1fr); }
  #view-mvo .mvo-request__facts { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
  #view-mvo .mvo-request .mvo-term,
  #view-mvo .mvo-request .mvo-term:first-child { grid-template-columns: minmax(0, 1fr); gap: 12px; padding: 0; border-top: 0; }
  #view-mvo .mvo-why { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #view-mvo .mvo-compat { grid-template-columns: minmax(0, 1fr); }
  #view-mvo .mvo-compat__media > .mvo-shot { aspect-ratio: 4 / 5; }
  #view-mvo .mvo-terms { grid-template-columns: minmax(0, 1fr); }
  #view-mvo .mvo-terms__media { position: static; }
}

/* До 1100px окно во всю ширину - по краям контента (--edge), а кнопки связи справа стоят над ним,
   как в v1: иначе круг WhatsApp уходил под «Оформить заявку». --bp-bar-h - высота окна + отступ
   снизу (syncBusinessBarHeight), следит за ростом окна при выборе позиций */
@media (max-width: 1100px) {
  #v2 .bp-bar { left: var(--edge); right: var(--edge); width: auto; bottom: calc(16px + env(safe-area-inset-bottom, 0px)); padding: 12px; }
  #v2 body.is-business-selection-view.has-bp-bar .floating-contacts { bottom: calc(var(--bp-bar-h, 78px) + 12px); }
}
/* 901-1100: в окне во всю ширину название позиции не ограничено 226px (это предел узкого окна шире 1100) -
   иначе оно переносилось на 2 строки, а до счётчика оставалось ~550px пустоты */
@media (min-width: 901px) and (max-width: 1100px) and (min-height: 561px) {
  #v2 .bp-bar .bp-chip__label { max-width: none; }
}

/* Калькулятор в одну колонку, а в карточке настроек исходные данные и опции - рядом, доставка и
   кнопка - под ними. Только шире 900px: при 800 колонка 339px, и «Евроконтейнер пластиковый 1100 л»
   в селекте обрезался; уже - настройки друг под другом, как на телефоне */
@media (min-width: 901px) and (max-width: 1180px) {
  #view-zhk .calculator-controls { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(24px, 3vw, 40px); }
  #view-zhk .calculator-controls__group { align-content: start; padding-bottom: 0; border-bottom: 0; }
  #view-zhk .calculator-controls__group:last-of-type { grid-column: 1 / -1; padding-top: 24px; border-top: 1px solid var(--hairline); }
  #view-zhk .calculator-mini { grid-column: 1 / -1; }
}

@media (max-width: 1040px) {
  :is(#view-zhk, #view-tenders, #view-mvo) .sol-hero {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: none;
  }
  :is(#view-zhk, #view-tenders, #view-mvo) .sol-kicker { grid-row: 1; }
  :is(#view-zhk, #view-tenders, #view-mvo) .sol-hero h1 { grid-row: 2; }
  :is(#view-zhk, #view-tenders, #view-mvo) .sol-hero__lead { grid-row: 3; }
  :is(#view-zhk, #view-tenders, #view-mvo) .sol-hero__actions { grid-row: 4; }
  :is(#view-zhk, #view-tenders, #view-mvo) .sol-hero__media {
    grid-column: 1; grid-row: 5;
    height: clamp(320px, 56vw, 480px);
    margin-top: 40px;
  }
  #view-mvo .mvo-hero__video { grid-column: 1; grid-row: 5; width: clamp(140px, 22vw, 200px); }
  :is(#view-zhk, #view-tenders, #view-mvo) .sol-hero__facts { grid-row: 6; }
  #view-mvo .sol-hero__facts { grid-auto-flow: row; grid-template-columns: repeat(2, minmax(0, 1fr)); }

  :is(#view-zhk, #view-tenders) .sol-conditions { grid-template-columns: minmax(0, 1fr); }
  :is(#view-zhk, #view-tenders) .sol-condition {
    display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 20px; align-items: start;
  }
  :is(#view-zhk, #view-tenders) .sol-condition__number { grid-row: 1 / span 2; margin: 0; }
  :is(#view-zhk, #view-tenders) .sol-condition p { grid-column: 2; }
  :is(#view-zhk, #view-tenders) .sol-info { grid-template-columns: minmax(0, 1fr); }
  #view-zhk .sol-cta { grid-template-columns: minmax(0, 1fr); }

  #view-zhk .sol-picker { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #view-zhk .sol-picker .btn { width: 100%; }


  #view-mvo .mvo-picks { grid-template-columns: minmax(0, 1fr); }
  #view-mvo .mvo-pick { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); column-gap: 12px; }
  #view-mvo .mvo-pick__media { aspect-ratio: auto; height: 100%; min-height: 300px; }
  #view-mvo .mvo-gallery { grid-template-columns: repeat(4, minmax(0, 1fr)); }

  #view-business-selection .bs-hero__inner { grid-template-columns: minmax(0, 1fr); }
  #view-business-selection .bs-hero__inner::after { grid-column: 1; grid-row: 2; height: clamp(260px, 44vw, 400px); margin-top: 32px; }
  #view-business-selection .bs-section__head { grid-template-columns: minmax(0, 1fr); }
  #view-business-selection .bs-use-cases { grid-template-columns: minmax(0, 1fr); }
  /* Мини-каталог на планшете: колонки по ширине (190px+), а не 2 огромные карточки до 900px -
     640-834 - три колонки, 900-1040 - четыре, шире - пять, как на десктопе */
  #view-business-selection .bp-mini__grid { grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); }
  #view-business-selection .bp-item__media { max-height: 220px; }
  #view-business-selection .bp-grid { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 900px) {
  #v2 .bp-bar { padding: 10px; }
  #v2 .bp-bar__go { min-height: var(--btn-h-sm); }

  :is(#view-zhk, #view-tenders) .sol-products { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  /* Третья карточка во всю ширину - горизонтальная: фото слева, текст справа */
  :is(#view-zhk, #view-tenders) .sol-products .sol-product:last-child {
    grid-column: 1 / -1;
    display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 8px;
  }
  :is(#view-zhk, #view-tenders) .sol-products .sol-product:last-child .sol-product__media { aspect-ratio: auto; height: 100%; min-height: 260px; }

}

@media (max-width: 860px) {
  #view-business-selection .bp-facts { grid-template-columns: minmax(0, 1fr); }
  #view-business-selection .bp-facts li { flex-direction: row; align-items: center; }
  #view-tenders .trq__aside { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 760px) {
  :is(#view-zhk, #view-tenders, #view-mvo) .sol-hero__media {
    height: auto; aspect-ratio: 7 / 6;
    margin-top: 28px;
  }
  #view-mvo .mvo-hero__video { width: 38%; margin: 0 12px 12px 0; border-width: 3px; }
  #view-mvo .mvo-hero__video .mvo-video__caption { padding: 28px 10px 10px; font-size: 12px; line-height: 1.3; }
  #view-mvo .mvo-hero__video .mvo-video__play { width: 44px; height: 44px; }
  #view-mvo .mvo-hero__video .mvo-video__play svg { width: 18px; height: 18px; }
  :is(#view-zhk, #view-tenders, #view-mvo) .sol-hero__actions { flex-direction: column; align-self: stretch; }
  :is(#view-zhk, #view-tenders, #view-mvo) .sol-hero__actions .btn { width: 100%; }
  /* Факты - по одному в строку: без grid-auto-flow: row ЖК и Тендеры оставались в три узкие колонки */
  :is(#view-zhk, #view-tenders, #view-mvo) .sol-hero__facts { grid-auto-flow: row; grid-template-columns: minmax(0, 1fr); gap: 10px; margin-top: 24px; }

  :is(#view-zhk, #view-tenders, #view-mvo) .sol-heading--row { flex-direction: column; align-items: flex-start; }
  :is(#view-zhk, #view-tenders, #view-mvo) .sol-heading p { font-size: 16px; }

  :is(#view-zhk, #view-tenders) .sol-products { grid-template-columns: minmax(0, 1fr); }
  :is(#view-zhk, #view-tenders) .sol-products .sol-product:last-child { display: flex; }
  :is(#view-zhk, #view-tenders) .sol-products .sol-product:last-child .sol-product__media { aspect-ratio: 4 / 3; height: auto; min-height: 0; }
  :is(#view-zhk, #view-tenders) .sol-product__body { padding: 16px 8px 8px; }
  :is(#view-zhk, #view-tenders) .sol-product h3 { font-size: 18px; }
  :is(#view-zhk, #view-tenders) .sol-condition { display: flex; }
  :is(#view-zhk, #view-tenders) .sol-condition__number { margin-bottom: 20px; }
  :is(#view-zhk, #view-tenders) .sol-info__item { grid-template-columns: 40px minmax(0, 1fr); gap: 14px; padding: 18px 0; }
  :is(#view-zhk, #view-tenders) .sol-info__ic { width: 40px; height: 40px; }
  :is(#view-zhk, #view-tenders) .sol-info__intro p { font-size: 16px; }

  #view-zhk .sol-cta { padding: 28px 16px 24px; }
  #view-zhk .sol-cta::after { top: var(--mark-top-m); height: var(--mark-size-m); transform: none; }
  #view-zhk .sol-cta h2 { font-size: 28px; text-wrap: wrap; }
  #view-zhk .sol-cta p { font-size: 16px; }
  #view-zhk .sol-cta__actions { flex-direction: column; }
  #view-zhk .sol-cta__actions .btn { width: 100%; }

  #view-zhk .calculator-controls { padding: 20px 16px; }
  /* Тип контейнера: шрифт остаётся 16px (iOS не увеличивает поле), поэтому ужимаем поля и стрелку -
     «Евроконтейнер пластиковый 1100 л» помещается целиком от 390px, на более узком - многоточие */
  #view-zhk .calculator-field select {
    padding-left: 16px; padding-right: 32px;
    background-position: right 12px center;
    text-overflow: ellipsis;
  }
  #view-zhk .calculator-summary { grid-template-columns: minmax(0, 1fr); gap: 4px; padding: 6px 6px 16px; }
  #view-zhk .calculator-visual { min-height: 240px; }
  #view-zhk .calculator-main-number { padding: 16px 10px 4px; }
  #view-zhk .calculator-main-number h2 { font-size: 40px; }
  #view-zhk .calculator-main-number h2 small { font-size: 20px; }
  #view-zhk .calculator-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #view-zhk .calculator-metric { padding: 14px 16px 16px; gap: 8px; }
  #view-zhk .calculator-metric strong { font-size: 18px; }
  /* Расчёт на телефоне - одна карточка-чек: строки через волосяную линию, итог - зелёная плашка */
  #view-zhk .calculator-breakdown-grid {
    grid-template-columns: minmax(0, 1fr); gap: 0;
    padding: 6px 16px;
    border-radius: var(--r);
    background: var(--surface); box-shadow: var(--shadow);
  }
  #view-zhk .calculator-breakdown {
    flex-direction: row; align-items: baseline; justify-content: space-between; gap: 12px;
    padding: 14px 0;
    border-bottom: 1px solid var(--hairline); border-radius: 0;
    background: none; box-shadow: none;
  }
  #view-zhk .calculator-breakdown:last-child { border-bottom: 0; }
  #view-zhk .calculator-breakdown span { font-size: 14px; }
  #view-zhk .calculator-breakdown strong { font-size: 16px; text-align: right; }
  #view-zhk .calculator-breakdown--total {
    flex-direction: column; align-items: flex-start; gap: 6px;
    margin: 8px -10px; padding: 16px;
    border-bottom: 0; border-radius: var(--r-in);
    background: var(--brand);
  }
  #view-zhk .calculator-breakdown--total strong { font-size: 22px; text-align: left; }
  #view-zhk .calculator-docs { padding: 20px 16px; }
  #view-zhk .calculator-docs h2, #view-zhk .calculator-controls h2 { font-size: 22px; }
  #view-zhk .sol-picker { grid-template-columns: minmax(0, 1fr); padding: 20px 16px; }
  /* Как у типа контейнера: поля и стрелка уже - «Контейнерная площадка» и «Оцинкованные контейнеры» целиком */
  #view-zhk .sol-field select { padding-left: 16px; padding-right: 32px; background-position: right 12px center; }

  #view-tenders .trq { padding: 24px 16px; }
  #view-tenders .trq__fields { grid-template-columns: minmax(0, 1fr); }
  #view-tenders .trq__picked { padding: 14px 16px; }
  #view-tenders .trq__picked-link { margin-left: 0; }
  #view-tenders .trq__actions .btn { width: 100%; }
  #view-tenders .trq__legal { flex-basis: 100%; }
  #view-tenders .trq__media img { height: 220px; }

  #view-mvo .mvo-why { grid-template-columns: minmax(0, 1fr); }
  #view-mvo .mvo-why__item { display: grid; grid-template-columns: 44px minmax(0, 1fr); column-gap: 16px; padding: 20px 18px; }
  #view-mvo .mvo-why__ic { grid-row: 1 / span 2; width: 40px; height: 40px; }
  #view-mvo .mvo-why__item h3 { margin-top: 8px; }
  #view-mvo .mvo-why__item p { grid-column: 2; }
  #view-mvo .mvo-pick { display: flex; }
  #view-mvo .mvo-pick__media { aspect-ratio: 4 / 3; height: auto; min-height: 0; }
  #view-mvo .mvo-pick__body { padding: 16px 8px 8px; }
  #view-mvo .mvo-pick__actions .btn { flex: 1 1 auto; }
  #view-mvo .mvo-compat__list li { font-size: 15px; }
  #view-mvo .mvo-compat__actions .btn { width: 100%; }
  /* Плитки на телефоне - лента с прокруткой, как .v2-photos */
  #view-mvo .mvo-compat__media,
  #view-mvo .mvo-gallery {
    display: flex; gap: 10px;
    margin-inline: calc(var(--gutter) * -1); padding-inline: var(--gutter); scroll-padding-inline: var(--gutter);
    overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none;
  }
  #view-mvo .mvo-compat__media > *,
  #view-mvo .mvo-gallery > * { flex: 0 0 248px; scroll-snap-align: start; }
  #view-mvo .mvo-stats { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  #view-mvo .mvo-stat { min-height: 132px; gap: 16px; padding: 18px; }
  #view-mvo .mvo-stat b { font-size: 32px; }
  #view-mvo .mvo-stat .mvo-ph { font-size: 26px; }
  #view-mvo .mvo-stat > span { font-size: 14px; }
  #view-mvo .mvo-term { grid-template-columns: 40px minmax(0, 1fr); gap: 14px; padding: 16px; }
  #view-mvo .mvo-term__ic { width: 40px; height: 40px; }
  #view-mvo .mvo-term div strong { font-size: 16px; }
  #view-mvo .mvo-term div span { font-size: 14px; }
  #view-mvo .mvo-terms__media { gap: 10px; }
  #view-mvo .mvo-request { padding: 24px 16px; }
  #view-mvo .mvo-form__grid { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  #view-mvo .mvo-form__actions .btn { width: 100%; }
  #view-mvo .mvo-request__facts { grid-template-columns: minmax(0, 1fr); gap: 0; }
  #view-mvo .mvo-request .mvo-term,
  #view-mvo .mvo-request .mvo-term:first-child { grid-template-columns: 40px minmax(0, 1fr); gap: 14px; padding: 14px 0; border-top: 1px solid var(--hairline); }
  #view-mvo .mvo-request .mvo-term:first-child { padding-top: 0; border-top: 0; }

  #view-business-selection .bs-hero__inner::after { height: auto; aspect-ratio: 16 / 11; margin-top: 24px; }
  #view-business-selection .bs-section__head p { font-size: 16px; }
  #view-business-selection .bs-use-case { padding: 20px 16px 16px; }
  #view-business-selection .bs-use-case__head h3 { font-size: 18px; }
  #view-business-selection .bp-card-foot { flex-direction: column; align-items: stretch; }
  #view-business-selection .bp-card-link { justify-content: center; }
  #view-business-selection .bp-head { padding: 20px 16px; }
  #view-business-selection .bp-mini__head { justify-content: stretch; }
  #view-business-selection .bp-sort { display: grid; width: 100%; gap: 8px; }
  #view-business-selection .bp-sort select,
  #view-business-selection .bp-sort select:hover,
  #view-business-selection .bp-sort select:focus { width: 100%; min-width: 0; }
  #view-business-selection .bp-item { padding: 6px 6px 12px; }
  #view-business-selection .bp-item__body { padding: 10px 6px 0; }
  #view-business-selection .bp-item__title { font-size: 14px; }
  #view-business-selection .bp-item__price { font-size: 15px; }
  #view-business-selection .bp-item__mark { top: 12px; right: 12px; width: 28px; height: 28px; }
  #view-business-selection .bp-item__qty { top: 12px; left: 12px; }
  #view-business-selection .bp-pack, #view-business-selection .bp-cta { padding: 20px 16px; }
  #view-business-selection .bp-cta__actions .bp-btn,
  #view-business-selection .bp-pack__actions .bp-btn { width: 100%; }
}

/* Телефон: мини-каталог в две колонки (по ширине 190px+ на 390 вышла бы одна) */
@media (max-width: 600px) {
  #view-business-selection .bp-mini__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* 320-360: у карточки подборки поля карточки уже - «Оцинкованные контейнеры» (210px) помещается в селект */
@media (max-width: 360px) {
  #view-zhk .sol-picker { padding-inline: 12px; }
}
/* 320-359: карточка мини-каталога ~138px - по слогам только очень длинные слова («четырёх-секционная»).
   Порог 16: предлог с неразрывным пробелом считается со словом («для мусорного» - 13 знаков), и при 12
   переносы шли почти в каждом названии («для му-сорного», «металличе-ская») */
@media (max-width: 359px) {
  #view-business-selection .bp-item__title { -webkit-hyphens: auto; hyphens: auto; hyphenate-limit-chars: 16 6 6; }
}

@media (max-width: 640px) {
  #v2 .bp-sheet { align-items: end; padding: 0; }
  #v2 .bp-sheet__panel { width: 100%; max-height: 92vh; border-radius: var(--r) var(--r) 0 0; }
  #v2 .bp-sheet__head { padding: 20px 16px 12px; }
  #v2 .bp-sheet__body { padding: 0 16px 24px; gap: 20px; }
  #v2 .bp-picked { padding: 2px 14px; }
  #v2 .bp-picked__row { grid-template-columns: 52px minmax(0, 1fr) auto; column-gap: 12px; row-gap: 10px; }
  #v2 .bp-picked__media { width: 52px; height: 52px; }
  /* На телефоне строки сложены в два ряда, сумма - под крестиком: постоянная колонка не нужна */
  #v2 .bp-picked__price { min-width: 0; }
  #v2 .bp-form__grid { grid-template-columns: minmax(0, 1fr); }
  #v2 .bp-form__foot .bp-btn { width: 100%; }
}

@media (pointer: coarse), (max-width: 900px) {
  #v2 .bp-chip__step, #v2 .bp-chip__drop { width: 40px; height: 40px; }
  #v2 .bp-picked__step, #v2 .bp-picked__drop { width: 44px; height: 44px; }
  #v2 .bp-picked__num,
  #v2 .bp-picked__num:hover,
  #v2 .bp-picked__num:focus { width: 44px; height: 44px; }
  #v2 .bp-sheet__close { width: 44px; height: 44px; }
}

@media (prefers-reduced-motion: reduce) {
  :is(#view-zhk, #view-tenders, #view-mvo, #view-business-selection) :is(img, svg) { transition: none; }
  :is(#view-zhk, #view-tenders, #view-mvo) :is(.sol-link, .sol-heading--row > .btn)::after { transition: none; }
  :is(#view-zhk, #view-tenders) .sol-product:hover .sol-product__media img,
  #view-mvo .mvo-pick:hover .mvo-pick__media img,
  #view-mvo .mvo-shot:not(.mvo-video):hover img,
  #view-business-selection .bp-item:hover .bp-item__media img { transform: none; }
  #v2 .bp-bar.is-bump .bp-bar__go { animation: none; }
  #v2 .bp-bar, #v2 .bp-bar.is-tucked { transition: none; }
  #view-tenders :is(.tf__panel, .tf.is-panel-open .tf__panel, .tf__overlay) { transition: none; }
}