/* 1136 (вход BB): единое оформление по замечаниям владельца 20.09 (снимки 01–06).
 * Слой печатается напрямую (inc/layout-bb.php, приоритет 50 — после AZ/49), dist не пересобирается.
 * Цвета только токенами темы; новых hex нет. Тексты, суммы и логика калькуляторов не меняются.
 *
 * 01 Полосы сцены формы · 03 «Что хотите привезти?» · 04 мото · 05 «Остались вопросы?» · 06 журнал
 * · 07 сцена «Шины и диски».
 * Пятна на кузове и паттерн кадра GT-R — дефект самого изображения, CSS их не лечит: ретушь ведёт root.
 */

/* ------------------------------------------------------------------------- *
 * 01. Сцена формы «Рассчитайте стоимость»: кадр закрывает свой бокс целиком.
 * Было: у варианта .gtyres-form-car слой кадра стоял background-size:100% auto,
 * поэтому при ширине окна меньше 1920 высота кадра оказывалась меньше высоты
 * секции и сверху и снизу оставались сплошные полосы #191919 — замер на 1440
 * дал 50 px сверху. Эталон владельца (снимок 02, страницы 2808/2814) — тот же
 * слой в cover, полос нет. Ставим cover и сохраняем правый край: обрезается
 * пустая левая часть кадра, автомобиль остаётся целиком.
 * Ниже 1101 действует мобильная раскладка (кадр полосой снизу) — её не трогаем.
 *
 * Кадр root (gtr-gpt25-flare-max-4k, 3840x1648) шире прежнего по пропорции, и
 * при cover блок 1424x685 показывает 89 % ширины кадра с правого края: кузов
 * начинается на 0,36 ширины блока, планшет кончается на 0,94. Прежнее окно
 * прозрачности 57–92 % пришлось бы поверх кузова и правого края планшета,
 * поэтому окно сдвинуто: сплошной фон держит только левую треть под формой
 * (поля кончаются на 0,47), дальше затемнение сходит на нет. Цвет тот же
 * #191919, что и в базовом правиле, — нового цвета в слое нет.
 * ------------------------------------------------------------------------- */
@media (min-width: 1101px) {
  .gtyres-marketing .gtyres-form-scene.gtyres-form-car::before {
    /* кадр уже блока и прижат к правому нижнему углу: машина и планшет
       целиком стоят правее формы, пропорции не тронуты (вторая величина auto).
       Первый слой — растушёвка верхней кромки кадра: его бокс равен самому
       кадру по высоте (доля / пропорция мастера 3840:1648) и прижат к низу,
       поэтому растушёвка привязана к кромке фотографии, а не к верху секции. */
    background-size: 100% calc(0.30901 * min(100vw, 1680px)), 100% 100%, 72% auto;
    background-position: center bottom, center, right bottom;
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-image:
      /* кромка: сплошной графит первые 2 % высоты кадра, прозрачность к 15 % */
      linear-gradient(180deg, #191919 0%, #191919 2%, #19191900 15%),
      /* поле под формой: слева сплошной графит, к машине сходит на нет */
      linear-gradient(90deg, #191919 0%, #191919 44%, #19191900 60%),
      var(--form-scene);
  }
}

/* От 1280 форма занимает меньшую долю блока, и кадр можно поднять до 86 % —
   замер зазора между правой кромкой формы и кузовом: 54 px на 1440, 56 на 1920. */
@media (min-width: 1280px) {
  .gtyres-marketing .gtyres-form-scene.gtyres-form-car::before {
    background-size: 100% calc(0.36908 * min(100vw, 1680px)), 100% 100%, 86% auto;
  }
}

/* Ниже 1101 кадр уходит полосой под форму. База держит его в боксе
   min(100%, 850px) при background-size: auto 100%, поэтому кадр высотой 340
   давал ширину 792 px и на 851–1100 по краям оставались тёмные поля — полоса
   выглядела вставленной картинкой. Полоса растянута на всю ширину, кадр
   закрывает её cover от правого нижнего угла: машина и планшет целиком,
   срезается верх стены, который и так скрыт маской затухания. */
@media (max-width: 1100px) {
  .gtyres-marketing .gtyres-form-scene.gtyres-form-car::before {
    width: 100%;
    background-size: 100% 100%, cover;
    background-position: center, right bottom;
  }
}

/* ------------------------------------------------------------------------- *
 * 07. Сцена «Шины и диски» (1121) под баннер root wheels-original-pattern.
 * Тот же приём, что у сцены GT-R выше, — второго языка на сайте не появляется.
 * У этой формы нет класса .gtyres-form-car, поэтому правила адресуются
 * странице: body.page-id-1121 даёт (0,3,1) против (0,2,0) базового правила.
 * Изделия занимают 0,48–0,91 ширины мастера; при cover на 1101 они начинались
 * на x=518 при правой кромке полей 592 — диск оказывался под полями.
 * ------------------------------------------------------------------------- */
@media (min-width: 1101px) {
  body.page-id-1121 .application-form.gtyres-form-scene::before {
    /* первый слой — растушёвка верхней кромки кадра, бокс ровно по кадру;
       ширина слоя здесь min(100%,1920px) из section-refinement.css */
    background-size: 100% calc(0.30901 * min(100vw, 1920px)), 100% 100%, 72% auto;
    background-position: center bottom, center, right bottom;
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-image:
      linear-gradient(180deg, #191919 0%, #191919 2%, #19191900 15%),
      linear-gradient(90deg, #191919 0%, #191919 40%, #19191900 58%),
      var(--form-scene);
  }
}

@media (min-width: 1280px) {
  body.page-id-1121 .application-form.gtyres-form-scene::before {
    background-size: 100% calc(0.36908 * min(100vw, 1920px)), 100% 100%, 86% auto;
  }
}

/* ≤700 полоса в базе уже есть (300 px), но запаса под неё у этой сцены нет:
   замер на 390 дал нижнюю кромку формы на 260 px внутри полосы. Ставим тот же
   запас, что у сцены GT-R на своих ширинах, — 20 px просвета над полосой. */
@media (max-width: 700px) {
  body.page-id-1121 .application-form.gtyres-form-scene { padding-bottom: 320px; }

  /* База держит здесь сплошное затемнение 74 % — оно для случая, когда кадр лежит
     под полями. В полосе снизу поля стоят выше кадра, и затемнение только гасит
     изделия. Оставляем один мягкий стык сверху, как у сцены GT-R на этих же
     ширинах; размер и положение кадра — базовые, мастер не трогаем. */
  body.page-id-1121 .application-form.gtyres-form-scene::before {
    background-image: linear-gradient(180deg, #191919 0%, #19191900 30%), var(--form-scene);
    -webkit-mask-image: linear-gradient(180deg, transparent, #000 20%);
    mask-image: linear-gradient(180deg, transparent, #000 20%);
  }
}

/* 701–1100: поля занимают 560 px из 768–1100, кадру рядом места нет — он
   уходит полосой снизу, как у сцены GT-R. Ниже 701 полоса уже в базе. */
@media (min-width: 701px) and (max-width: 1100px) {
  body.page-id-1121 .application-form.gtyres-form-scene { padding-bottom: 360px; }

  body.page-id-1121 .application-form.gtyres-form-scene::before {
    inset: auto 0 0;
    width: 100%;
    height: 340px;
    margin: 0;
    background-size: 100% 100%, cover;
    background-position: center, right bottom;
    background-repeat: no-repeat, no-repeat;
    background-image: linear-gradient(180deg, #191919 0%, #19191900 30%), var(--form-scene);
    -webkit-mask-image: linear-gradient(180deg, transparent, #000 20%);
    mask-image: linear-gradient(180deg, transparent, #000 20%);
  }
}

/* ------------------------------------------------------------------------- *
 * 05. «Остались вопросы?» — полоса во всю ширину с новым парным портретом.
 * Владелец 21.09 отклонил прежний кадр: артефакты на лицах, подрезанные головы,
 * низкое качество. Отдельно отклонён способ показа: кадр стоял абсолютом на
 * 82 % полосы и зумился object-fit: cover, поэтому на 2560 лица растягивались
 * через полэкрана.
 *
 * Мастер root family-close-portrait-imagegen-v1, 1536x1024. Самая крупная
 * производная равна ему — увеличения нет ни на одной ширине.
 * Стало: полоса по-прежнему от края до края, но текст и пара стоят в
 * ограниченном контейнере 1320 px, а кадр — колонка не шире 700 px (на 1384 и
 * выше ровно 634 px; при DPR 2 это 1268 px из 1536 доступных). Соотношение
 * сторон равно исходному 3:2, поэтому cover ничего не режет и не тянет.
 *
 * Стык с фоном. Стена студии замерена по верхним углам мастера: #c9caca.
 * Первая редакция брала полосу на ступень светлее (#d7d8d8); замер шва по
 * снимку 8088 показал скачок 15 уровней на левой кромке кадра — он был виден.
 * Поэтому полоса взята ровно в цвет стены: остаток скачка — 1–3 уровня, это
 * собственная неравномерность студийного фона. Контраст на этом сером:
 * --gt-iron 5,2:1 и --gt-black 9,9:1 — оба выше AA для 17 px.
 * Растушёвка только по верхнему краю: чистая стена занимает верхние 3,1 %
 * кадра (замер по мастеру: первый непрозрачный пиксель волос на y=32 из 1024),
 * а по бокам и снизу стоят плечи и руки — фейд там срезал бы людей.
 * Рамки, радиуса и подложки у кадра нет.
 * ------------------------------------------------------------------------- */
.gt-lead-closing--photo { background: #c9caca; }

.gt-lead-closing--photo .gt-lead-closing__figure img {
  aspect-ratio: 3 / 2;
  object-position: 50% 50%;
  border-radius: 0;
  background: none;
  -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 3.4%);
  mask-image: linear-gradient(180deg, transparent 0, #000 3.4%);
}

/* Одна колонка кадра на всех desktop-ширинах: 461 px на 1024, 634 px на 1384 и
   дальше не растёт. Подпись sizes в gtyres_lead_closing_figure_html повторяет
   ровно эти величины.
   Кадр стоит на нижней кромке полосы, а не висит посередине: на первом прогоне
   снизу оставалось 88 px фона, и обрез торсов читался нижней границей карточки.
   Текст держит прежний нижний отступ, поэтому по вертикали он остаётся там же,
   где был при центровке (94 px от верха строки против 91 px). */
@media (min-width: 1024px) {
  .gt-lead-closing--photo .gt-lead-closing__inner {
    width: min(calc(100% - 64px), 1320px);
    grid-template-columns: minmax(0, 1fr) minmax(0, clamp(380px, 48%, 700px));
    gap: clamp(40px, 4vw, 64px);
    align-items: end;
    padding-bottom: 0;
  }

  .gt-lead-closing--photo .gt-lead-closing__copy { padding-bottom: clamp(56px, 7vw, 88px); }
}

/* Ниже 1024 полоса идёт в одну колонку. Кадр завершает её, а не открывает:
   база ставит ему order: -1, и под срезом футболок оставался серый воздух —
   это и читалось вставленной карточкой. Теперь люди кончаются вместе с
   секцией. Заодно кадр выходит на всю ширину полосы: поля по краям делали из
   него тот же прямоугольник. Ширина набрана от контейнера, а не через 100vw:
   vw считает и полосу прокрутки, и на узком desktop-окне дал бы скролл. */
@media (max-width: 1023px) {
  .gt-lead-closing--photo .gt-lead-closing__inner {
    --gt-closing-gutter: 32px;
    padding-bottom: 0;
  }

  .gt-lead-closing--photo .gt-lead-closing__figure {
    order: 0;
    width: calc(100% + 2 * var(--gt-closing-gutter));
    margin-left: calc(-1 * var(--gt-closing-gutter));
    margin-right: calc(-1 * var(--gt-closing-gutter));
  }
}

/* На телефоне поля контейнера 20 px, а не 32 px. */
@media (max-width: 767px) {
  .gt-lead-closing--photo .gt-lead-closing__inner { --gt-closing-gutter: 20px; }
}

/* ------------------------------------------------------------------------- *
 * 05б. Тот же закрывающий блок, но сцена мотоциклов (страница по slug
 * motoczikly-iz-yaponii; на body висит gt-moto-page).
 * У страницы не было ни формы, ни CTA — владелец 21.09 просил один CTA во всю
 * ширину с крупной деталью мотоцикла, по образцу принятого CTA с автофарой.
 * Компонент тот же: подпись, заголовок, телефон и та же пара кнопок, которые
 * открывают настоящую форму. Отличаются кадр и цвет полосы.
 *
 * Мастер root moto-headlight-imagegen-v1, 1672x941. Кромки замерены: левая
 * отклоняется от --gt-night (#121313) максимум на 11 уровней и ярких пикселей
 * там нет вовсе — это чистый фон сцены, поэтому полоса взята ровно этим токеном,
 * а левый край кадра растворён маской. Верх и правый край — 7 и 15 % ярких
 * пикселей (зеркало и руль), низ 29 % (колесо и выпуск): там стоит содержание
 * кадра, и растушёвка срезала бы мотоцикл. Кадр, как и семейный, стоит на нижней
 * кромке полосы — мотоцикл заканчивается вместе с секцией.
 * Панель кадра не шире 820 px: при DPR 2 это 1640 px из 1672 доступных, то есть
 * сырое фото не увеличивается ни на одной ширине.
 * ------------------------------------------------------------------------- */
.gt-lead-closing--scene { background: var(--gt-night); border-top-color: #272828; }
.gt-lead-closing--scene .gtyres-section-label { color: var(--gt-red-soft); }
.gt-lead-closing--scene h2 { color: var(--gt-paper); }
.gt-lead-closing--scene .gt-lead-closing__lead { color: #c4c5c5; }
.gt-lead-closing--scene .gt-lead-closing__lead a { color: var(--gt-white); }
.gt-lead-closing--scene .gt-lead-closing__lead a:hover { color: var(--gt-red-soft); }

.gt-lead-closing--scene .gt-lead-closing__figure--moto img {
  aspect-ratio: 1672 / 941;
  object-fit: cover;
  object-position: 50% 50%;
  border-radius: 0;
  background: none;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 9%);
  mask-image: linear-gradient(90deg, transparent 0, #000 9%);
}

@media (min-width: 1024px) {
  .gt-lead-closing--scene .gt-lead-closing__inner {
    grid-template-columns: minmax(0, 1fr) minmax(0, clamp(420px, 56%, 820px));
  }
}

/* Телефон: сначала действия, затем отдельный кроп на саму фару. Весь мотоцикл в
   390 px стал бы мелким, поэтому кадр обрезается по правой части — кроп, а не
   уменьшение и не растяжение. */
@media (max-width: 1023px) {
  .gt-lead-closing--scene .gt-lead-closing__figure--moto img {
    aspect-ratio: 3 / 2;
    object-position: 74% 42%;
    -webkit-mask-image: none;
    mask-image: none;
  }
}

/* ------------------------------------------------------------------------- *
 * 03. «Что хотите привезти?» — большая форма со сценой.
 * Было: текст и поля на пустом светлом поле. Первая редакция добавила форме
 * белую карточку с красной кромкой — root на просмотре 8088 сказал, что рамка
 * и фон замечание владельца не закрывают: нужна сцена с изображением.
 * Стало: тот же язык, что у формы «Рассчитайте стоимость» — полоса от края до
 * края на графите, слева содержание и поля, справа настоящая фотография офиса
 * images/owner/office-1280.webp (снимок владельца, SHA 42382e42…; геометрию
 * здания не трогаем, кадрирование пропорциональное). Нового стиля не заводим
 * и семейный CTA не повторяем: там светлая полоса и люди, здесь графит и офис.
 *
 * Почему фотография отдельным слоем с маской, а не фоном всей полосы: снимок
 * светлый, и общий градиент поверх него дал бы грязную виньетку. Панель кадра
 * занимает правые 44 % и растворяется влево маской — приём уже принят в теме
 * (section-refinement.css, страницы Кореи и Китая).
 * Ширина панели считана от кадра: 1280 px исходника хватает без апскейла до
 * 2900 px полосы; дальше кадр начинает мылить, поэтому ставим потолок.
 * ------------------------------------------------------------------------- */
@media (min-width: 1280px) {
  .gtyres-contact-section {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background: #191919;
    padding-block: clamp(56px, 5vw, 84px);
  }

  /* панель фотографии: правые 44 % полосы, мягкий левый край.
     Кадр по центру: здание стоит в левой половине снимка, и правый якорь
     показывал бы только фургон и небо. */
  .gtyres-contact-section::after {
    content: "";
    position: absolute;
    inset: 0 0 0 auto;
    z-index: -1;
    width: min(44%, 1280px);
    background: url(../../images/owner/office-1280.webp) center center / cover no-repeat;
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 14%);
    mask-image: linear-gradient(90deg, transparent 0, #000 14%);
  }

  /* Содержание и форма остаются двумя колонками базы — одна колонка растянула
     бы полосу вдвое и кадр в высокой панели превратился бы в вертикальную
     полосу. Ширина зоны считается от полосы, а не от контейнера: сама зона
     начинается от левого края контейнера, поэтому его отступ вычитается,
     иначе текст заезжает под панель. 40 px — воздух до кромки кадра. */
  .gtyres-contact-section .gtyres-contact-layout {
    position: relative;
    z-index: 1;
    max-width: min(
      820px,
      calc(58% - max(32px, (100% - var(--content-max, 1200px)) / 2) - 40px)
    );
    /* блок базы стоит margin:0 auto, и ограниченная ширина центрировала бы его
       в полосе — прижимаем к левой кромке контейнера */
    margin-inline: max(32px, calc((100% - var(--content-max, 1200px)) / 2)) auto;
    grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
    gap: clamp(24px, 2.6vw, 40px);
    align-items: center;
  }
}

/* Ниже 1280 фотография уходит полосой под форму — так же, как кадр машины
   в сцене «Рассчитайте стоимость» ниже 1101. Две колонки базы остаются. */
@media (max-width: 1279px) {
  .gtyres-contact-section {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background: #191919;
    padding-block: clamp(48px, 5vw, 72px) 0;
  }

  .gtyres-contact-section .gtyres-contact-layout {
    position: relative;
    z-index: 1;
    padding-bottom: clamp(48px, 5vw, 72px);
  }

  .gtyres-contact-section::after {
    content: "";
    display: block;
    height: clamp(200px, 26vw, 300px);
    margin-top: clamp(32px, 4vw, 48px);
    background: url(../../images/owner/office-1280.webp) center 62% / cover no-repeat;
    -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 22%);
    mask-image: linear-gradient(180deg, transparent 0, #000 22%);
  }
}

/* Текст секции на графите. */
.gtyres-contact-section .gtyres-section-label { color: var(--gt-red-soft); }
.gtyres-contact-section h2,
.gtyres-contact-section .gtyres-contact-phone { color: var(--gt-white); }
.gtyres-contact-section .gtyres-contact-layout > div > p { color: rgba(255, 255, 255, .78); }
.gtyres-contact-section .gtyres-inline-link { color: var(--gt-white); border-bottom-color: #4a4a4a; }

/* Посещённая ссылка на графите. home-refinement.css отдаёт ей цвет родителя
   (`:visited { color: inherit }`, вес 0,3,0) — на этой полосе это rgb(17,17,17)
   и контраст 1,07. Правило выше весит 0,2,0 и до :visited не достаёт, поэтому
   состояние задаётся явно; порядок L–V–H сохранён, :hover ниже. */
.gtyres-marketing .gtyres-contact-section .gtyres-inline-link,
.gtyres-marketing .gtyres-contact-section .gtyres-inline-link:visited { color: var(--gt-white); }

.gtyres-contact-section .gtyres-inline-link:hover { color: var(--gt-red-soft); }
.gtyres-contact-section .gtyres-contact-jumps { margin-block: 20px 16px; }
.gtyres-contact-section .gtyres-contact-phone { margin-top: 4px; }
.gtyres-contact-section .gtyres-contact-form .form { gap: 18px; }

/* Форма: short-form.css держит два варианта одной формы — тёмный по умолчанию
 * и светлый для страницы Контактов (`.application-form.contact-page-form`,
 * специфичность 0,3,1). Полоса снова графитовая, поэтому светлый вариант здесь
 * гасится и возвращаются значения, заданные в том же файле для графита.
 * Ничего нового не придумываем: цвета переписаны из его тёмных правил. */
.gtyres-contact-section .application-form.contact-page-form .gt-apply-field label {
  color: var(--gt-white, #fff);
}
.gtyres-contact-section .application-form.contact-page-form .gt-apply-field .form-optional {
  color: rgba(255, 255, 255, .72);
}
.gtyres-contact-section .application-form.contact-page-form .gt-apply .checkbox-wrapper label {
  color: rgba(255, 255, 255, .86);
}
.gtyres-contact-section .application-form.contact-page-form .gt-apply .checkbox-wrapper a {
  color: var(--gt-red-soft, #f26d65);
}
.gtyres-contact-section .application-form.contact-page-form .gt-apply .form-error {
  color: var(--gt-red-soft, #f26d65);
}
.gtyres-contact-section .application-form.contact-page-form .gt-apply .gt-consent-hint {
  color: #fff;
  opacity: .72;
}
.gtyres-contact-section .application-form.contact-page-form .gt-apply p.success-form-message {
  color: var(--gt-white, #fff);
}
.gtyres-contact-section .application-form.contact-page-form .gt-apply-field :is(input, textarea):focus {
  outline-color: var(--gt-red-soft, #f26d65);
  border-color: var(--gt-red-soft, #f26d65);
}
.gtyres-contact-section .application-form.contact-page-form .gt-apply-field.is-invalid :is(input, textarea) {
  border-color: var(--gt-red-soft, #f26d65);
}

@media (max-width: 1699px) {
  .gtyres-contact-section .gt-apply-fields { grid-template-columns: minmax(0, 1fr); }
}

/* Комментарий: поле растёт скриптом по вводу, но пустое остаётся в одну строку,
   и в колонке уже 1200 px длинная подсказка обрезалась. Два ряда — минимум. */
.gtyres-contact-section .gt-apply-field--message textarea {
  min-height: calc(var(--field-height, 48px) + 22px);
}

/* ------------------------------------------------------------------------- *
 * 04. Мотоциклы из Японии: иерархия, существующие иконки, схема этапов и
 * расходов, работа с шириной. Правый край перестаёт пустовать: метка и
 * заголовок уходят в левый столбец — тот же приём, что у соседней секции
 * «Что входит в „Услуги компании“» на этой же странице.
 * Текст, ставки и суммы не меняются ни одним символом.
 * ------------------------------------------------------------------------- */
@media (min-width: 1024px) {
  .gt-moto-page .gtyres-landing .gtyres-landing-reading {
    max-width: none;
    display: grid;
    /* рельс держит долю контейнера, а не фиксированное число: на 1024 это 287 px,
       на 1200 — 336 px, текстовая колонка в обоих случаях остаётся 640–810 px */
    grid-template-columns: minmax(0, clamp(240px, 28%, 340px)) minmax(0, 1fr);
    column-gap: clamp(40px, 4vw, 72px);
    align-items: start;
  }

  .gt-moto-page .gtyres-landing .gtyres-landing-reading > .gtyres-section-label { grid-column: 1; margin-bottom: 10px; }
  .gt-moto-page .gtyres-landing .gtyres-landing-reading > h2 { grid-column: 1; margin-bottom: 0; }
  .gt-moto-page .gtyres-landing .gtyres-landing-reading > :not(.gtyres-section-label):not(h2) { grid-column: 2; }
  .gt-moto-page .gtyres-landing .gtyres-landing-reading > :not(.gtyres-section-label):not(h2):first-of-type { margin-top: 0; }
  .gt-moto-page .gtyres-landing .gtyres-landing-reading > p { max-width: 74ch; }
}

/* Этапы 01–06 — схема заказа во всю ширину под заголовком. Двухколоночный
   рельс остальных секций страницы здесь снят: список этапов высотой 947 px
   оставлял рядом пустой столбец 336 px (замер root на 1440: секция 1008 px,
   левая треть пустая). Заголовок встаёт сверху, карточки — сеткой 3x2.
   На 701–1023 работают две колонки базы, ≤700 — столбик. Знак этапа берётся
   из действующего набора темы (images/icons, маска как у .gtyres-icon);
   номера и тексты прежние. */
@media (min-width: 1024px) {
  .gt-moto-page .gtyres-landing .gtyres-landing-reading[data-moto-steps] { display: block; }
  .gt-moto-page .gtyres-landing .gtyres-landing-reading[data-moto-steps] > h2 { margin-bottom: 4px; }
  .gt-moto-page .gtyres-landing .gtyres-landing-reading[data-moto-steps] > ol {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.gt-moto-page [data-moto-steps] > ol > li { position: relative; padding-right: 58px; }

.gt-moto-page [data-moto-steps] > ol > li::after {
  content: "";
  position: absolute;
  top: 20px;
  right: 20px;
  width: 26px;
  height: 26px;
  background: var(--gt-red);
  -webkit-mask: var(--gtyres-icon) center / contain no-repeat;
  mask: var(--gtyres-icon) center / contain no-repeat;
}

/* подбор — значок поиска, а не автомобильный руль */
.gt-moto-page [data-moto-steps] > ol > li:nth-child(1) { --gtyres-icon: url("../../images/icons/phosphor/magnifying-glass-duotone.svg"); }
.gt-moto-page [data-moto-steps] > ol > li:nth-child(2) { --gtyres-icon: url("../../images/icons/gavel.svg"); }
.gt-moto-page [data-moto-steps] > ol > li:nth-child(3) { --gtyres-icon: url("../../images/icons/package.svg"); }
.gt-moto-page [data-moto-steps] > ol > li:nth-child(4) { --gtyres-icon: url("../../images/icons/file-text.svg"); }
.gt-moto-page [data-moto-steps] > ol > li:nth-child(5) { --gtyres-icon: url("../../images/icons/shield-check.svg"); }
.gt-moto-page [data-moto-steps] > ol > li:nth-child(6) { --gtyres-icon: url("../../images/icons/truck.svg"); }

/* Короткие связанные шаги, подробности в раскрытии (владелец 21.09). Обёртку
   <details> ставит inc/moto-page.php; тексты и названия те же. Свёрнутая
   карточка — номер, значок и название, поэтому шесть шагов занимают два ряда
   вместо прежних 626 px сплошного текста.
   Номер и значок остаются на самом <li>: счётчик route-step из
   contact-city-layouts.css и маска выше по этому файлу. */
.gt-moto-page [data-moto-steps] .gt-moto-step > summary {
  display: flex;
  align-items: center;
  gap: 8px;
  list-style: none;
  cursor: pointer;
  color: var(--gt-black);
}

/* название шага в общей строке со знаком: базовое правило списка делает strong
   блоком, и уголок уходил бы на строку ниже */
.gt-moto-page [data-moto-steps] .gt-moto-step > summary strong { display: inline; }

.gt-moto-page [data-moto-steps] .gt-moto-step > summary::-webkit-details-marker { display: none; }

/* Знак раскрытия — не эмодзи и не картинка: уголок из границ, он поворачивается
   вместе с состоянием. Стоит после названия в потоке, поэтому не спорит со
   значком этапа в правом верхнем углу карточки. */
.gt-moto-page [data-moto-steps] .gt-moto-step > summary::after {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  flex: 0 0 auto;
  margin: 0 0 3px;
  border-right: 2px solid var(--gt-red);
  border-bottom: 2px solid var(--gt-red);
  transform: rotate(45deg);
  transition: transform 160ms ease;
}

.gt-moto-page [data-moto-steps] .gt-moto-step[open] > summary::after { transform: rotate(-135deg); }

.gt-moto-page [data-moto-steps] .gt-moto-step > summary:focus-visible {
  outline: 2px solid var(--gt-red);
  outline-offset: 3px;
}

.gt-moto-page [data-moto-steps] .gt-moto-step > summary strong { color: inherit; }

.gt-moto-page [data-moto-steps] .gt-moto-step > p {
  margin: 10px 0 0;
  font-size: 14px;
  line-height: 1.7;
  color: var(--gt-iron);
}

/* Свёрнутые карточки одинаковой высоты — иначе ряд из трёх выглядит рваным. */
@media (min-width: 1024px) {
  .gt-moto-page .gtyres-landing .gtyres-landing-reading[data-moto-steps] > ol { align-items: start; }
}

/* Расходы — тоже схема, а не сплошной список: четыре составляющих платежа
   одинаковыми карточками со знаком, текст пунктов прежний.
   1138, замечание владельца 21.09: композиция должна быть заметной и компактной,
   с крупными подписями, как принятые блоки главной. Образец взят не на глаз:
   .gtyres-service-grid на главной — та же сетка 2x2, красный значок сверху,
   подпись 40 px и короткий текст под ней. Здесь подпись 32 px: «Утилизационный
   сбор» — самая длинная из четырёх и в колонку 592 px она встаёт одной строкой.
   Двухколоночный рельс секции снят, как у этапов: заголовок стоял в левой трети
   и переносился на четыре строки, а карточки жались в 806 px из 1200. */
@media (min-width: 1024px) {
  .gt-moto-page .gtyres-landing .gtyres-landing-reading[data-moto-customs] { display: block; }
  .gt-moto-page .gtyres-landing .gtyres-landing-reading[data-moto-customs] > h2 { margin-bottom: 4px; }
}

@media (min-width: 900px) {
  .gt-moto-page [data-moto-customs] > ul {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    margin: 24px 0 0;
    padding: 0;
    list-style: none;
  }

  .gt-moto-page [data-moto-customs] > ul > li {
    position: relative;
    margin: 0;
    padding: 26px 28px 28px;
    background: var(--gt-white);
    border: 1px solid var(--gt-cloud);
    border-top: 2px solid var(--gt-red);
    font-size: 15px;
    line-height: 1.7;
    color: var(--gt-iron);
  }

  .gt-moto-page [data-moto-customs] > ul > li::marker { content: none; }

  /* значок стоит над подписью, а не сбоку: так же собран принятый блок главной */
  .gt-moto-page [data-moto-customs] > ul > li::before {
    content: "";
    display: block;
    width: 28px;
    height: 28px;
    margin-bottom: 14px;
    background: var(--gt-red);
    -webkit-mask: var(--gtyres-icon) center / contain no-repeat;
    mask: var(--gtyres-icon) center / contain no-repeat;
  }

  .gt-moto-page [data-moto-customs] > ul > li:nth-child(1) { --gtyres-icon: url("../../images/icons/gavel.svg"); }
  .gt-moto-page [data-moto-customs] > ul > li:nth-child(2) { --gtyres-icon: url("../../images/icons/calculator-fill.svg"); }
  .gt-moto-page [data-moto-customs] > ul > li:nth-child(3) { --gtyres-icon: url("../../images/icons/file-text.svg"); }
  .gt-moto-page [data-moto-customs] > ul > li:nth-child(4) { --gtyres-icon: url("../../images/icons/package.svg"); }

  .gt-moto-page [data-moto-customs] > ul > li strong {
    display: block;
    margin-bottom: 10px;
    color: var(--gt-black);
    font-size: 32px;
    line-height: 1.1;
    letter-spacing: -0.01em;
  }
}

/* 900–1023 рельса нет, но колонка уже: подпись 26 px, иначе «Утилизационный
   сбор» ломается по слогам. */
@media (min-width: 900px) and (max-width: 1023px) {
  .gt-moto-page [data-moto-customs] > ul > li strong { font-size: 26px; }
}

/* Телефон: та же композиция столбиком. Подпись крупная, но в 350 px строка
   одна только у трёх из четырёх — «Утилизационный сбор» переносится, и это
   нормальный перенос, а не поломка. */
@media (max-width: 899px) {
  .gt-moto-page [data-moto-customs] > ul > li strong {
    display: block;
    margin-bottom: 8px;
    color: var(--gt-black);
    font-size: 24px;
    line-height: 1.15;
  }
}

/* Пример сметы. Рельс оставлял под заголовком 909 px пустоты на 1440: таблица из
   пятнадцати строк высокая, а слева стояли только подпись и заголовок. Заголовок
   уходит наверх, таблица занимает все 1200 px и становится ниже. Сама смета,
   порядок строк и суммы не меняются — владелец просил таблицу-пример сохранить.
   Соседняя секция «Какие мотоциклы идут контейнером» остаётся на рельсе: там под
   заголовком 191 px, это обычная работа двухколоночной сетки, а не пустота. */
@media (min-width: 1024px) {
  .gt-moto-page .gtyres-landing .gtyres-landing-reading[data-moto-example] { display: block; }
  .gt-moto-page .gtyres-landing .gtyres-landing-reading[data-moto-example] > h2 { margin-bottom: 10px; }
  .gt-moto-page .gtyres-landing .gtyres-landing-reading[data-moto-example] > p { max-width: 90ch; }
}

/* Вопросы перед заказом. Было: заголовок в левой трети, вопросы — свободным
   текстом в правых двух третях; под заголовком оставалось пустое поле 336 px
   на всю высоту секции (1139 px на 1440). Владелец 21.09 просил сгруппировать
   вопросы и убрать пустоты.
   Стало: заголовок сверху во всю ширину, вопросы — одна группа с красной
   кромкой сверху и волосяными разделителями между парами. Колонки, а не сетка:
   порядок чтения остаётся сверху вниз. Тексты и порядок вопросов прежние. */
@media (min-width: 1024px) {
  .gt-moto-page .gtyres-landing .gtyres-landing-reading[data-moto-faq] { display: block; }
  .gt-moto-page .gtyres-landing .gtyres-landing-reading[data-moto-faq] > h2 { margin-bottom: 4px; }
}

@media (min-width: 900px) {
  .gt-moto-page [data-moto-faq] .schema-faq {
    column-count: 2;
    column-gap: clamp(32px, 3vw, 56px);
    margin-top: 24px;
    border-top: 2px solid var(--gt-red);
  }

  .gt-moto-page [data-moto-faq] .schema-faq-section {
    break-inside: avoid;
    padding: 18px 0;
    border-bottom: 1px solid var(--gt-cloud);
  }

  .gt-moto-page [data-moto-faq] .schema-faq-question {
    display: block;
    margin-bottom: 8px;
    color: var(--gt-black);
    font-size: 17px;
  }

  .gt-moto-page [data-moto-faq] .schema-faq-answer {
    margin: 0;
    font-size: 15px;
    line-height: 1.7;
    color: var(--gt-iron);
  }
}

/* Телефон: та же группа в один столбец. */
@media (max-width: 899px) {
  .gt-moto-page [data-moto-faq] .schema-faq { margin-top: 20px; border-top: 2px solid var(--gt-red); }
  .gt-moto-page [data-moto-faq] .schema-faq-section { padding: 16px 0; border-bottom: 1px solid var(--gt-cloud); }
  .gt-moto-page [data-moto-faq] .schema-faq-question { display: block; margin-bottom: 8px; color: var(--gt-black); }
  .gt-moto-page [data-moto-faq] .schema-faq-answer { margin: 0; font-size: 15px; line-height: 1.7; color: var(--gt-iron); }
}

/* ------------------------------------------------------------------------- *
 * 06. Журнал: теги и нижние действия на общей сетке.
 * Было: у карточки семь строк, но свободной («1fr») стояла строка тегов, а
 * анонс занимал строку auto. Из-за этого блок тегов начинался на разной высоте —
 * замер дал разброс 50,4 px на 1440 и 68,6 px на 390 при нулевом разбросе
 * нижних действий. Стало: свободная строка — анонс, зона тегов постоянной
 * высоты в два ряда (та же высота, что и прежний потолок). Верх и низ зоны
 * тегов встают на общие линии при любом числе тегов; ничего не скрывается —
 * потолок в два ряда принят ещё во входе AT.
 * ------------------------------------------------------------------------- */
/* journal-shelf.css печатается ПОСЛЕ этого слоя (enqueue из journal-social.php),
   поэтому равной специфичности мало: добавляем атрибут карточки — [data-journal-card]
   стоит в шаблоне у каждой карточки и поднимает вес, не привязываясь к body-классу. */
.r57-video-shelf .r56-video-rail .gt-journal-card[data-journal-card] {
  grid-template-rows: auto auto auto auto minmax(0, 1fr) auto auto;
}

.r57-video-shelf .r56-video-rail .gt-journal-card[data-journal-card] > p { align-self: start; }

.r57-video-shelf .r56-video-rail .gt-journal-card[data-journal-card] > .gt-journal-tags {
  align-self: start;
  min-height: calc(2 * 26px + 6px);
}

/* Тип материала различим: не 10 px серым в потоке анонса, а метка 12 px с
   красной точкой — рубрика (красная), дата (серая), заголовок и тип читаются
   каждый своим. 12 px — нижняя граница мелкого текста по решению владельца. */
.r57-video-shelf .r56-video-rail .gt-journal-card__format {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin: 0 0 12px;
  font-size: 12px;
  line-height: 1.5;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--gt-iron);
}

.r57-video-shelf .r56-video-rail .gt-journal-card__format::before {
  content: "";
  flex: none;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--gt-red);
}

@media (max-width: 700px) {
  /* На телефоне слот заголовка тоже фиксируется: иначе строка тегов уезжает
     вслед за высотой заголовка (замер: 19,5 / 39 / 58,5 px в одном ряду). */
  .r57-video-shelf .r56-video-rail .gt-journal-card[data-journal-card] > h3 {
    min-height: calc(3 * var(--h3-leading, 1.3) * 1em);
  }

  .r57-video-shelf .r56-video-rail .gt-journal-card[data-journal-card] > h3 a {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    max-height: calc(3 * var(--h3-leading, 1.3) * 1em + 1px);
  }

  .r57-video-shelf .r56-video-rail .gt-journal-card[data-journal-card] > .gt-journal-tags {
    min-height: calc(2 * 28px + 6px);
  }
}

/* Первый экран мото. В v1 правая половина сетки пустовала — в разметке не было
   .country-choice-visual, и копия раскладывалась по рельсу. root выбрал
   иллюстрацию (MOTO_SELECTION.json), фигура добавлена дельтой содержимого самой
   мотостраницы, поэтому обход снят: работает базовое правило site-flow.css
   .country-choice { 1.1fr 1fr } — тот же первый экран, что на «Из Японии» и
   «Из Кореи». Здесь остаётся только снять нижний отступ фигуры: он рассчитан
   на подпись, а подписи нет — новых фактов о компании мы не пишем. */
.gt-moto-page .country-choice-visual figure { margin: 0; }

/* Полоса cookie здесь НЕ трогается. По inline-атрибуту плагина кажется, будто у
   кнопки свой красный #ff0000, но итоговый CSS темы (marketing.css, вход 1078)
   уже переопределяет её на --btn-primary-bg с геометрией primary: замер дал
   rgb(220,1,0) и высоту 52 px. Любая правка здесь была бы откатом принятого. */

/* ------------------------------------------------------------------------- *
 * 08. Журнал: одна шапка у хаба и у фильтров.
 * Замер на 1440: хаб .r56-masthead — 90 px высотой, h1 700/56 px без знака;
 * архив .gt-journal-heading--archive — 199 px, h1 750/57,6 px и декоративный
 * знак 62×62 перед названием. Один раздел, а выглядит как два сайта.
 * Название берёт те же токены, что хаб; знак (aria-hidden, только украшение)
 * убирается. Ссылка «Наш Telegram», тексты и порядок элементов прежние.
 * ------------------------------------------------------------------------- */
header.gt-journal-heading--archive .gt-journal-symbol { display: none; }

header.gt-journal-heading--archive .gt-journal-title {
  gap: 0;
  font-size: var(--h1-size);
  font-weight: var(--h1-weight);
  line-height: var(--h1-leading);
  letter-spacing: var(--h1-tracking);
}

header.gt-journal-heading--archive > div > .gtyres-section-label { margin-bottom: 10px; }

/* ------------------------------------------------------------------------- *
 * Общее: несогласованный контейнер галереи колёс.
 * Договор контейнеров входа AV (1129): услуги, главная, компания и контакты —
 * 120/1200 на 1440. Замер по 168 проходам показал ровно одно отклонение на
 * 1440: .gtyres-wheel-gallery даёт 152/1136 на /shiny-i-diski/ и его EN-зеркале,
 * потому что frontend-r57.css вычитает ещё 64 px внутри уже суженного родителя
 * (width: min(calc(100% - 64px), 1200px)). Убираем двойное поле — галерея встаёт
 * на ту же вертикаль, что соседние секции страницы: 1200 на 1440, 960 на 1024,
 * 350 на 390 (там значение и так было равно ширине родителя).
 * ------------------------------------------------------------------------- */
.page-id-1121.gtyres-marketing .gtyres-wheel-gallery {
  width: min(100%, 1200px);
}

/* ------------------------------------------------------------------------- *
 * «Наша команда» на Контактах — щель возле фотографии Владимира и Софьи
 * (исторический дефект 09 аудита 1128, группа Н6). Замер на 1440: карточки
 * 617 / 534 / 556 px, нижняя кромка ряда рваная на 84 px; у карточки основателей
 * блок ролей опущен на 16 px лишнего margin, поэтому красные линии и имена
 * соседей стоят на разной высоте (407 против 391, имена 468 против 452).
 * Лечим тем же приёмом, что уже принят для сетки журнала: общая сетка строк
 * (subgrid) и снятый лишний отступ. Кадрирование и тексты не трогаем.
 * ------------------------------------------------------------------------- */
.gtyres-team-member--founders .gtyres-founders-roles { margin-top: 0; }

@supports (grid-template-rows: subgrid) {
  .gtyres-team-grid { align-items: stretch; }

  .gtyres-team-grid > .gtyres-team-member {
    display: grid;
    grid-template-rows: subgrid;
    grid-row: span 2;
  }

  /* кадр остаётся своей высоты, тянется только текстовая зона */
  .gtyres-team-grid > .gtyres-team-member > img { align-self: start; }
}

/* Четвёртая карточка в команде (поправка владельца 20.09: Константин-сан).
 * Сетка базы — 2fr 1fr 1fr, ровно на три карточки: четвёртая ушла бы во второй
 * ряд в широкую колонку основателей и встала бы вдвое шире соседей. Правило
 * включается только когда карточек действительно четыре, поэтому на сегодняшней
 * странице с тремя ничего не меняет. :has держим отдельным правилом, а не в
 * списке селекторов: в списке он погасил бы и соседние селекторы там, где
 * не поддерживается. Граница 1101 — та же, что у базы: ниже неё база сама даёт
 * 1fr 1fr и растягивает карточку основателей на всю ширину, и четыре карточки
 * ложатся в эту сетку без правки. Замер на 1024 с четырьмя карточками показал,
 * почему граница именно здесь: при 1024 карточка основателей уже во всю ширину,
 * и четыре колонки дали бы трём соседям 303/190/190. */
@media (min-width: 1101px) {
  .gtyres-team-grid:has(> .gtyres-team-member:nth-child(4)) {
    grid-template-columns: 1.6fr 1fr 1fr 1fr;
  }
}

/* Роль — основная строка карточки, описание под ней тише и мельче.
   Карточку основателей это не задевает: там <p> лежит глубже, в блоке ролей. */
.gtyres-team-grid > .gtyres-team-member > div > p:first-of-type {
  color: var(--gt-black);
  font-weight: 500;
}

.gtyres-team-grid .gtyres-person-note {
  margin-top: 8px;
  font-size: 13px;
  line-height: 1.55;
  color: var(--gt-iron);
}

/* Ниже 1101 сетка базы — две колонки, карточка основателей на всю ширину.
   Четвёртая карточка остаётся одна в последнем ряду: ставим её по центру,
   ширину держим равной соседям, чтобы ряд не выглядел обрывом. */
@media (max-width: 1100px) {
  .gtyres-team-grid > .gtyres-team-member:nth-child(4):last-child {
    grid-column: 1 / -1;
    justify-self: center;
    inline-size: calc(50% - 12px);
  }
}

@media (max-width: 700px) {
  .gtyres-team-grid > .gtyres-team-member:nth-child(4):last-child {
    inline-size: calc(50% - 8px);
  }
}
/* ------------------------------------------------------------------------- *
 * R14/R15 (ROOT_FINISH_ALL 20.09): японская запись дат таймлайна и белые
 * карточки «Наш подход». Правила дословно из принятого кандидата 1071
 * (вариант дат «б» и блок «А» без фотографий — те, что root назвал принятыми).
 * В 1071 они лежали в src/frontend/company.css и требовали пересборки dist;
 * здесь тот же текст стоит в слое входа BB, который отдаётся напрямую и
 * печатается после бандлов, поэтому dist не трогается.
 * ------------------------------------------------------------------------- */
/* 1071 · даты таймлайна в японской записи (2010年, 2024年4月19日): кандзи отдельными span lang="ja",
   машиночитаемое значение — в datetime. Семейство для кандзи — системные японские шрифты, без веб-шрифта. */
.gtyres-company-timeline time { white-space:nowrap; }
.gtyres-company-kanji { font-family:"Hiragino Sans","Yu Gothic","Noto Sans JP",sans-serif; }
/* кандзи мельче цифр, на базовой линии, тот же красный — как счётные слова в японской записи дат */
.gtyres-company-kanji { font-size:.6em; font-weight:600; line-height:1; margin:0 .14em 0 .06em; }
.gtyres-company-kanji:last-child { margin-right:0; }

/* 1071 · «Наш подход»: серая подложка ограничена контейнером секции (скруглённая плита с внутренним отступом),
   три пункта — белые карточки с крупным красным номером и тонкой красной линейкой сверху, как у таймлайна выше.
   Селекторы с .gtyres-company — чтобы перекрыть правила section-refinement.css, идущие в бандле позже. */
.gtyres-company .gtyres-company-principles { background:none; }
.gtyres-company .gtyres-company-principles > .gtyres-section { box-sizing:border-box; padding:72px 64px 64px; background:var(--gt-paper); border-radius:var(--radius-md); }
.gtyres-company .gtyres-company-principle-grid { gap:24px; align-items:stretch; }
.gtyres-company .gtyres-company-principle-grid article { display:flex; flex-direction:column; min-width:0; padding:28px 28px 32px; background:var(--gt-white); border-top:2px solid var(--gt-red); border-radius:0 0 var(--radius-md) var(--radius-md); }
.gtyres-company .gtyres-company-principle-grid article > span { display:block; font:700 clamp(28px,3vw,42px)/1 Montserrat,sans-serif; color:var(--gt-red); margin:0 0 24px; }
.gtyres-company .gtyres-company-principle-grid h3 { margin:0 0 12px; }
@media(max-width:1100px) {
 .gtyres-company .gtyres-company-principles > .gtyres-section { padding:56px 40px 48px; }
}
@media(max-width:700px) {
 .gtyres-company .gtyres-company-principle-grid { gap:16px; }
 .gtyres-company .gtyres-company-principle-grid article { padding:24px 20px 26px; }
}
@media(max-width:600px) {
 .gtyres-company .gtyres-company-principles > .gtyres-section { padding:40px 20px 36px; }
}
/* ------------------------------------------------------------------------- *
 * R15, выбор root 20.09 (ROOT_COMPANY_SELECTION): «Наш подход» — вариант B,
 * те же карточки плюс реальный кадр сверху. Правила дословно из пина 1071
 * block-B; кадры уже лежат в теме (images/company/jimny-service-*,
 * images/cases/honda-vezel-02, honda-wr-v-01), новых материалов нет.
 * ------------------------------------------------------------------------- */
/* вариант (Б): фотография сверху карточки */
.gtyres-company .gtyres-company-principle-grid article { padding-top:0; border-top:0; overflow:hidden; border-radius:var(--radius-md); }
.gtyres-company .gtyres-company-principle-grid figure { margin:0 -28px 24px; border-top:2px solid var(--gt-red); }
.gtyres-company .gtyres-company-principle-grid figure img { display:block; width:100%; aspect-ratio:4/3; object-fit:cover; }
@media(max-width:700px) {
 .gtyres-company .gtyres-company-principle-grid figure { margin:0 -20px 20px; }
 .gtyres-company .gtyres-company-principle-grid figure img { aspect-ratio:16/10; }
}
/* ------------------------------------------------------------------------- *
 * R24 (ROOT_FINISH_ALL 20.09): общее мобильное меню и верхние углы дока.
 *
 * 1. Просвечивание. mobile-life.css (бандл marketing) красит открытое меню
 *    и шапку в --gt-mobile-glass-fill-strong = rgba(255,255,255,.78) с
 *    backdrop-filter: blur(16px). Размытие не спасает от крупного пятна:
 *    красная кнопка страницы просвечивает розовым под разделами «О GTYRES» и
 *    «Полезное» (root видел глазами). Поверхность становится непрозрачной,
 *    размытие снимается — под сплошным фоном оно только тратит GPU.
 *    Тени, линии, раскладка, фокус, ESC и блокировка скролла не трогаются:
 *    здесь только background/backdrop-filter.
 *
 * 2. Верхние углы нижней панели. Наряд 1118 сделал их прямыми («без
 *    скруглений»), но это была интерпретация: на позднем образце владельца
 *    (jp.mercari.com на iPhone, 1138/evidence/owner-images/L11181-0 и -1)
 *    панель во всю ширину у нижнего края и с закруглёнными верхними углами.
 *    Обмер дуги на L11181-0: 28–35 px изображения шириной 889 px при экране
 *    390 CSS px (2,28 px на CSS-пиксель) = 12–15 CSS px; ставим 14.
 *    Панель остаётся во всю ширину и у края — плавающая таблетка не
 *    возвращается: left/right/bottom, ширина и высота прежние.
 * ------------------------------------------------------------------------- */
@media (max-width: 767px) {
  .gtyres-navigation.is-open,
  body.gtyres-menu-open .gtyres-nav-shell {
    background: var(--gt-white, #fff);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }

  /* Разделы внутри меню лежат на той же непрозрачной поверхности. */
  .gtyres-navigation.is-open .gtyres-menu-items,
  .gtyres-navigation.is-open .gt-shell-menu-meta { background: transparent; }

  nav.gt-mobile-dock { border-radius: 14px 14px 0 0; }
}
/* ------------------------------------------------------------------------- *
 * T25 (приёмка Telegram, 20.09): один ▶ вместо двух и значок внутри круга.
 *
 * 1. Рельс кружков. Кадр — круг (border-radius 50%, overflow: hidden) с
 *    каймой 2 px цвета rgb(220,1,0). Значок видео того же красного стоял от
 *    угла квадрата (inset auto 3px 2px auto в creative-studio.css, auto 6px
 *    6px auto для data-round="false" в life-stories-circle.css). На кадре
 *    122 px (768–1440) дальняя точка значка уходила на 14 px за радиус:
 *    круг её срезал, и на красном кольце оставался красный нарост вместо
 *    треугольника. Ставим значок внутрь. Отступ считается от padding-box, и
 *    при A = R − 2 условие «значок целиком внутри кольца» — X ≥ (A − r)·
 *    (1 − 1/√2): кадр 122 -> X ≥ 14,1 (берём 17), кадр 84 -> X ≥ 8,5 (берём
 *    11), кадр 60 -> X ≥ 5,6 и действующие 6 px уже подходят, их и
 *    сохраняем. Размер, цвет, кайма и правило показа не меняются.
 *
 * 2. Просмотрщик. data-media="video" выставляется только когда файл видео
 *    есть на сайте, и тогда же видна панель с доступной кнопкой ▶/⏸. Значок
 *    в центре кадра показывался по тому же условию, поэтому на паузе всегда
 *    выходило два одинаковых круга с ▶. Центральный — aria-hidden и
 *    pointer-events: none, то есть украшение: убираем его, а кнопку панели
 *    с подписью, фокусом и клавиатурой оставляем. Тап по кадру по-прежнему
 *    ставит и снимает паузу (обработчик на stage не тронут); ссылка «Видео
 *    в Telegram» для истории без файла тоже не тронута.
 * ------------------------------------------------------------------------- */
.gtyres-life-feed__stories.gt-stories-track .gtyres-life-feed__story[data-round]
  .gtyres-life-feed__story-image > .gtyres-life-feed__play {
  inset: auto 17px 17px auto;
}

@media (max-width: 767px) {
  .gtyres-life-feed__stories.gt-stories-track .gtyres-life-feed__story[data-round]
    .gtyres-life-feed__story-image > .gtyres-life-feed__play {
    inset: auto 11px 11px auto;
  }

  /* Рельс главной оставляем ровно как был: кадр 60 px, значок 18 px и
     действующие 6 px уже держат его внутри круга (дальняя точка 27,4 при
     A = 28). Правило нужно только чтобы сюда не дотянулись 11 px выше. */
  .gt-mobile-stories .gtyres-life-feed__stories.gt-stories-track
    .gtyres-life-feed__story[data-round] .gtyres-life-feed__story-image
    > .gtyres-life-feed__play {
    inset: auto 6px 6px auto;
  }
}

.gtyres-life-viewer[data-media="video"][data-loading="false"]:not([data-playing="true"])
  .gtyres-life-viewer__stage .gtyres-life-viewer__play {
  display: none;
}
/* ------------------------------------------------------------------------- *
 * 1133/15 (правило AF v2 #26 снимается): карточки кейсов одного размера.
 *
 * #26 (layout-c5.css, вход AF v2 -> AL) при ровно семи видимых карточках
 * переводил сетку на ≥1101 в 12 колонок: первые три по 4 колонки (384 px),
 * остальные четыре по 3 (282 px). Ряд из одной карточки исчезал, но взамен
 * в одной сетке оказывались карточки двух размеров — владелец видит именно
 * это. Возвращаем обычные три колонки: неполный последний ряд допустим,
 * карточка в нём остаётся в первой колонке и не растягивается.
 *
 * Принятый пин layout-c5.css не переписывается: здесь те же селекторы из
 * более позднего слоя, специфичность равная, побеждает порядок печати.
 * Ширины 700–1100 (две колонки) и 390 (одна) правилом #26 не затрагивались
 * и остаются как были.
 * ------------------------------------------------------------------------- */
@media (min-width: 1101px) {
  .gtyres-case-grid__items:has(> .gtyres-case-card:nth-child(1 of :not([hidden])):nth-last-child(7 of :not([hidden]))) {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .gtyres-case-grid__items:has(> .gtyres-case-card:nth-child(1 of :not([hidden])):nth-last-child(7 of :not([hidden]))) > .gtyres-case-card,
  .gtyres-case-grid__items:has(> .gtyres-case-card:nth-child(1 of :not([hidden])):nth-last-child(7 of :not([hidden])))
    > .gtyres-case-card:nth-child(n+4 of :not([hidden])) {
    grid-column: auto;
  }
}
/* ------------------------------------------------------------------------- *
 * 1133/13 (рельс подборок на 390) и оформление раскрывашки «Все подборки».
 *
 * Карточки рельса имели разную высоту: 191, 147, 231, 147, 234, 162, 162,
 * 162, 103 px — из-за align-self: start в catalog-collections-hub.css.
 * Ставим одинаковую высоту (align-self: stretch у карточки в grid-строке),
 * подпись ссылки обрезаем двумя строками, чтобы длинное название не тянуло
 * карточку, и оставляем под блоком не больше 24 px вместо 34.
 * Правый край получает затухание: «хвост» следующей карточки виден на 64 px,
 * а градиент подсказывает, что полосу можно листать. Снап, клавиатура и
 * колесо не трогаются.
 * ------------------------------------------------------------------------- */
@media (max-width: 700px) {
  .gt-collection-shortcuts { margin-bottom: 24px; }

  .gt-collection-shortcuts .gt-collection-shortcuts__rail
    > .gt-collection-shortcuts__group {
    align-self: stretch;
  }

  .gt-collection-shortcuts .gt-collection-shortcuts__links a {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
  }

  /* Затухание только когда есть куда листать: маска на самой полосе.
     Обе формы записи — Chrome до 120 понимает лишь -webkit-. */
  .gt-collection-shortcuts__rail {
    -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 28px),
      rgba(0, 0, 0, 0.15));
    mask-image: linear-gradient(to right, #000 calc(100% - 28px),
      rgba(0, 0, 0, 0.15));
  }
}

/* Раскрывашка «Все подборки»: та же строгая строка, что у прочих заголовков
   каталога. Содержимое внутри сохраняет свои стили. */
.gt-collection-all {
  margin: 0 0 32px;
  border-top: 1px solid var(--gt-cloud, #dedede);
}

.gt-collection-all > summary {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  min-height: 48px;
  padding: 12px 0;
  cursor: pointer;
  color: var(--gt-black, #111);
  font: 700 16px/1.35 Montserrat, Arial, sans-serif;
  list-style: none;
}

.gt-collection-all > summary::-webkit-details-marker { display: none; }

.gt-collection-all > summary::after {
  content: "+";
  color: var(--gt-red, #dc0100);
  font: 600 18px/1 Montserrat, Arial, sans-serif;
}

.gt-collection-all[open] > summary::after { content: "–"; }

.gt-collection-all > summary > span {
  margin-left: auto;
  color: var(--gt-iron, #4c4c4c);
  font: 500 12px/1.4 Montserrat, Arial, sans-serif;
  font-variant-numeric: tabular-nums;
}

.gt-collection-all__body { padding-top: 8px; }

/* AU v3 (замечание root по 1132): в диалоге отзыва знак площадки стоит последним в
   строке-шапке, а кнопка закрытия висит абсолютно в правом верхнем углу. На 390
   её бокс 50×36 доходит до x 309, знак — до 329, и верхние 2,3 px «M» уходят под
   крестик (замер AUV3_PROBE_BEFORE.json). Отводим шапке место справа на ширину
   кнопки с запасом; на 1440 строки расходятся по высоте и правило не нужно. */
@media (max-width: 700px) {
  .gt-review-dialog .gt-review-dialog__identity { padding-right: 44px; }
}