#rec3712729701 .t1067__content { position: relative; transition: transform 0.2s ease, box-shadow 0.2s ease; }
#rec3712729701 .t-card__btn { display: none !important; }
#rec3713080301 .t185__text { border-left: 3px solid #E2701F; padding-left: 20px; }
#rec3717247101 .t1231__tile { position: relative !important; overflow: hidden !important; }
#rec3717247101 .t1231__tile::before { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 45%; background: linear-gradient(to top, rgba(0,0,0,.65), rgba(0,0,0,0)); pointer-events: none; z-index: 1; }
#rec3717247101 .t1231__tile::after { position: absolute; left: 24px; right: 24px; bottom: 20px; color: #fff; font-weight: 500; line-height: 1.3; pointer-events: none; z-index: 2; }
#rec3717247101 .t1231__tile:nth-child(1)::after { content: 'Работаем не только по Москве — по всей России'; font-size: 20px; }
#rec3717247101 .t1231__tile:nth-child(2)::after { content: 'Тяжёлые круизеры — без проблем'; font-size: 15px; }
#rec3717247101 .t1231__tile:nth-child(3)::after { content: 'Погрузка по аппарели'; font-size: 15px; }
#rec3717247101 .t1231__tile:nth-child(4)::after { content: 'Бережная фиксация любой техники'; font-size: 15px; }
#rec3717247101 .t1231__tile:nth-child(5)::after { content: 'Снегоходы, квадроциклы и гидроциклы'; font-size: 15px; } /* 18.09.2026 — 5-я плитка галереи */
#rec3718437201 .t016 .t-container { border-top: 1px solid #E0E0E0; }
#rec3718437201 .t016__col { padding-top: 32px; }
@media screen and (max-width: 640px) { #rec3718437201 .t016 .t-row { display: flex !important; flex-wrap: wrap !important; } #rec3718437201 .t016__col { flex: 0 0 50% !important; max-width: 50% !important; box-sizing: border-box !important; margin-bottom: 24px; } }
@media screen and (max-width: 640px) { #rec3718437201 .t016__col { padding-left: 28px !important; padding-right: 28px !important; margin-left: 0 !important; margin-right: 0 !important; } }
@media screen and (max-width:479px) { #rec3696891301 .t396__artboard { margin-top: 70px !important; } }
@media screen and (max-width:479px) { #rec3696891301 .t396__carrier { background-size: contain !important; background-position: left 50% bottom 260px !important; background-repeat: no-repeat !important; background-color: #17181A !important; } }

/* ===== ТЗ v4 — Часть A: отклик на действия пользователя (2026-09-09) ===== */

/* A1 — иконки мессенджеров: подложка (см. выше, ревизия 3) + добавлена непрерывная мягкая
   пульсация в покое (ревизия 4, 2026-09-09), по тому же принципу, что кнопка «Вызвать эвакуатор»
   (A3, см. ниже) — расширяющееся затухающее кольцо через box-shadow. На hover/tap пульсация
   останавливается (animation-play-state: paused), а кольцо наведения задано с !important, чтобы
   гарантированно перекрыть застывший кадр анимации на паузе. */
.t-sociallinks__item a {
  transition: transform 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
  border-radius: 50%;
  box-sizing: border-box;
  background: #F1EFE9;
  animation: pulse-msg-icon 2.5s ease-out infinite;
}
.t-sociallinks__item a svg path { fill: #17181A !important; transition: fill 0.2s ease; }
.t-sociallinks__item a:hover { background-color: #E2701F !important; transform: scale(1.15); box-shadow: 0 0 0 3px rgba(226,112,31,0.25) !important; animation-play-state: paused; }
.t-sociallinks__item a:hover svg path { fill: #fff !important; }
@keyframes pulse-msg-icon {
  0%   { box-shadow: 0 0 0 0 rgba(226,112,31,.5); }
  70%  { box-shadow: 0 0 0 10px rgba(226,112,31,0); }
  100% { box-shadow: 0 0 0 0 rgba(226,112,31,0); }
}

/* A1 — мобильная липкая панель (блок 9): та же логика подложки, :active вместо :hover.
   Иконки здесь — растровые emoji-картинки (не SVG), перекрасить их в тёмный/оранжевый нельзя —
   меняем только подложку, сама картинка остаётся как есть. Та же непрерывная пульсация, что и выше. */
.t975__icon-wrapper {
  transition: transform 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
  border-radius: 8px;
  box-sizing: border-box;
  background: #F1EFE9;
  animation: pulse-msg-icon 2.5s ease-out infinite;
}
.t975__menu-link:active .t975__icon-wrapper { background-color: #E2701F !important; transform: scale(1.15); box-shadow: 0 0 0 3px rgba(226,112,31,0.25) !important; animation-play-state: paused; }

/* A2 — магнитная кнопка "Вызвать эвакуатор" (переходы; сам расчёт движения — в JS, см. HEAD).
   Кнопка в Zero Block состоит из 2 слоёв — фигура-подложка (a.tn-atom) и текст (div.tn-atom) — двигаем оба синхронно. */
#rec3696891301 .tn-elem__36968913011788861985940000005 .tn-atom,
#rec3696891301 .tn-elem__36968913011788862405411000007 .tn-atom { transition: transform 0.15s ease-out; }

/* A3 — пульсация основной CTA-кнопки (только заливка-подложка, не текст) */
@keyframes pulse-cta { 0%{box-shadow:0 0 0 0 rgba(226,112,31,.55);} 70%{box-shadow:0 0 0 16px rgba(226,112,31,0);} 100%{box-shadow:0 0 0 0 rgba(226,112,31,0);} }
#rec3696891301 .tn-elem__36968913011788861985940000005 .tn-atom { animation: pulse-cta 2.2s ease-out infinite; }

/* A4 — карточки цен: подъём + полоска "выезжает" от центра. Заменяет прежнюю статичную
   border-top-полоску (см. первую строку файла — там же убран border-top, добавлены position/transition). */
#rec3712729701 .t1067__content:hover { transform: translateY(-7px); box-shadow: 0 20px 36px rgba(23,24,26,0.22); }
#rec3712729701 .t1067__content::before { content:''; position: absolute; top:0; left:50%; width:0; height:3px; background:#E2701F; border-radius: 5px 5px 0 0; transition: width 0.3s ease, left 0.3s ease; }
#rec3712729701 .t1067__content:hover::before { width:100%; left:0; }

/* A5 — zoom фото в галерее (плитки — div.t1231__bgimg с background-image, а не ) */
#rec3717247101 .t1231__tile .t1231__bgimg { transition: transform 0.5s ease; will-change: transform; backface-visibility: hidden; -webkit-backface-visibility: hidden; transform: translateZ(0) scale(1); -webkit-transform: translateZ(0) scale(1); }
#rec3717247101 .t1231__tile:hover .t1231__bgimg { transform: translateZ(0) scale(1.1); -webkit-transform: translateZ(0) scale(1.1); }

/* A6 — FAQ: плюсик поворачивается в крестик. Правило без привязки к record-ID —
   применяется сразу к обоим TX16N-блокам, т.к. оба используют одну и ту же разметку t585. */
.t585__icon { transition: transform 0.25s ease; }
.t585__header.t585__opened .t585__icon { transform: rotate(45deg); }

/* A7 — пропущено: ни у одной кнопки сайта нет иконки-стрелки, добавлять новую ради эффекта не стали */

/* ===== Часть B — сигнатурный момент ===== */

/* B1 — «линия маршрута» в диспетчерской карточке (hero): статичный
   прогресс-бар с заливкой ~35% (SVG-путь по ТЗ не делаем).
   FIX 10.09.2026: заливка и пульсирующая точка были отдельным элементом канвы
   со своими координатами, а сама дорожка — привязана к правому краю канвы,
   поэтому на десктопе они разъезжались. Теперь заливка и точка — это
   псевдоэлементы самой дорожки (35% от её ширины): разъехаться уже не могут. */
#rec3696891301 .tn-elem__36968913011788864251522000014 { display: none !important; }
#rec3696891301 .tn-elem[data-elem-id="1788864198045000013"] .tn-atom { position: relative; overflow: visible; }
#rec3696891301 .tn-elem[data-elem-id="1788864198045000013"] .tn-atom::before {
  content: ''; position: absolute; left: 0; top: 0; height: 100%; width: 35%;
  background: #E2701F; border-radius: inherit;
}
#rec3696891301 .tn-elem[data-elem-id="1788864198045000013"] .tn-atom::after {
  content: ''; position: absolute; left: 35%; top: 50%;
  width: 8px; height: 8px; margin: -4px 0 0 -4px;
  background: #E2701F; border-radius: 50%;
  animation: dot-pulse 1.8s ease-in-out infinite;
}
@keyframes dot-pulse { 0%,100%{opacity:1;} 50%{opacity:.4;} }

/* B2 — параллакс фона hero. Только десктоп/планшет (min-width:641px) — на мобильном
   background-attachment:fixed исторически ненадёжен, поэтому там сознательно оставлено
   как есть (статичный фон), без JS-заглушки — рисков меньше, чем от неработающего fixed. */
@media screen and (min-width: 641px) {
  #rec3696891301 .t396__carrier { background-attachment: fixed; }
}


/* ===== ТЗ v4 — Часть C: полировка при скролле (2026-09-09) ===== */

/* C1 — шапка сжимается и темнеет при скролле. Реальный узел шапки — #nav3693982001
   (position:fixed и на десктопе, и на мобильном), а отступы сверху/снизу заданы не
   на нём самом (там padding:0), а на вложенном .tmenu-mobile__container (15px/15px
   по умолчанию) — transition/padding применены именно к нему. Фон шапки и так уже
   сплошной #17181A (rgb(23,24,26)) с самого начала, не полупрозрачный поверх hero,
   поэтому затемнение через rgba(23,24,26,0.97) визуально почти незаметно — оставлено
   по ТЗ как есть, основной заметный эффект — уменьшение отступов (шапка компактнее). */
#nav3693982001 { transition: background-color 0.3s ease; }
#nav3693982001 .tmenu-mobile__container { transition: padding 0.3s ease; }
#nav3693982001.scrolled { background-color: rgba(23,24,26,0.97); }
#nav3693982001.scrolled .tmenu-mobile__container { padding-top: 6px; padding-bottom: 6px; }

/* C2 — каскадное появление карточек при скролле. Класс .reveal-on-scroll добавляется
   на карточки через JS (см. HEAD-код) для 4 групп: услуги, цены, галерея, преимущества
   (FAQ и CTA-блоки вне области C2 по ТЗ). */
.reveal-on-scroll { opacity: 0; transform: translateY(24px); transition: opacity 0.6s ease, transform 0.6s ease; }
.reveal-on-scroll.is-visible { opacity: 1; transform: translateY(0); }


/* BUGFIX 2026-09-10 — hero «Прибытие» (4-й шаг таймлайна) — у этого элемента в собственной адаптивной настройке Тильды (не наш код) оказался opacity:0.1 на брейкпоинте ≤999px вместо opacity:1, как у остальных 3 шагов. Причина не найдена (никто из наших правок это не трогало), чиним точечным перебитьем вместо правки через визуальный редактор (там «Очистить адаптивный дизайн» задевает не тот набор брейкпоинтов — пробовали, откатили без сохранения). */
#rec3696891301 .tn-elem[data-elem-id="1788864467956000018"] .tn-atom { opacity: 1 !important; }


/* BUGFIX 2026-09-10 -- A5 zoom в галерее не работал у пользователя в Yandex Browser, хотя тест в Chrome-based автоматизации показывал scale(1.1) стабильно.
   Структурное отличие плиток галереи от других hover-элементов (карточки цен, иконки мессенджеров): у галереи было включено нативное свойство Тильды
   'Увеличение изображения по клику' (t-zoomable, лайтбокс по клику) -- отключено в настройках блока (Настройки блока -> Увеличение изображения по клику), т.к. этого не было в ТЗ.
   Плюс усилили сам hover-transform ниже: добавили will-change/backface-visibility/translateZ(0) как защиту от известного класса багов "transform не применяется визуально в отдельных браузерах" при conflicting composited layers. */


/* BUGFIX 2026-09-10 (round 2) -- карточка диспетчера в hero: 4-й пункт таймлайна «Прибытие» физически вылезает за правый край экрана на многих desktop-разрешениях (напр. 1440-1536px), а не только на брейкпоинте <=1199px, который чинили раньше.
   Причина: вся карточка (фон, заголовок, таймер, прогресс-бар, все 4 пункта таймлайна) спроектирована в Zero Block на канве шириной 1600px и позиционируется через фиксированный 'left' в px от левого края канвы. Для брейкпоинта Desktop (>=1200px) Тильда не масштабирует и не центрирует эти элементы, когда реальная ширина окна меньше 1600px -- канва просто обрезается по правому краю, и самый правый элемент (Прибытие, а на узких экранах и часть 'В пути') оказывается за пределами видимой области.
   Фикс: для всех элементов этой карточки заменили позиционирование с 'left' (от левого края) на 'right' (от правого края канвы), с отступами, соответствующими исходному дизайну на канве 1600px (1600 - left - width для каждого элемента). Это делает карточку и весь таймлайн внутри неё видимыми при любой ширине экрана Desktop, не трогая брейкпоинт <=1199px (там уже есть свои отдельные адаптивные значения, не затронуты). */
/* FIX 10.09.2026: правые якоря карточки диспетчера работают только на
   десктопном артборде (от 1200px). Ниже 1200px у Tilda свой адаптивный
   артборд с собственными координатами — там эти правила уводили карточку
   за правый край экрана и накладывали подписи шагов друг на друга. */
@media screen and (min-width: 1200px) {
  #rec3696891301 [data-elem-id="1788863454226000010"] { left: auto !important; right: 10px !important; }
  #rec3696891301 [data-elem-id="1788863917429000011"] { left: auto !important; right: 50px !important; }
  #rec3696891301 [data-elem-id="1788864105078000012"] { left: auto !important; right: 50px !important; }
  #rec3696891301 [data-elem-id="1788864198045000013"] { left: auto !important; right: 50px !important; }
  #rec3696891301 [data-elem-id="1788864320943000015"] { left: auto !important; right: 305px !important; }
  #rec3696891301 [data-elem-id="1788864388595000016"] { left: auto !important; right: 220px !important; }
  #rec3696891301 [data-elem-id="1788864428918000017"] { left: auto !important; right: 135px !important; }
  #rec3696891301 [data-elem-id="1788864467956000018"] { left: auto !important; right: 50px !important; }
}


/* FIX 10.09.2026 (Вариант 1) — надписи на борту фургона просвечивали сквозь
   полупрозрачную карточку диспетчера. Поднимаем плотность фона до 0.94
   и размываем подложку под карточкой. */
#rec3696891301 .tn-elem[data-elem-id="1788863454226000010"] .tn-atom {
  opacity: 1 !important;
  background-color: rgba(23, 24, 26, 0.94) !important;
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}

/* FIX 10.09.2026 (раунд 2) — заголовок hero гас на адаптивном артборде:
   у .tn-atom заголовка стояла opacity 0.2 на всех ширинах до 1200px
   (на десктопе он нормальный). Та же поломка Tilda поперёк брейкпоинтов,
   что была у пункта «Прибытие» с opacity 0.1. */
@media screen and (max-width: 1199px) {
  #rec3696891301 .tn-elem[data-elem-id="1788860932292000003"] .tn-atom { opacity: 1 !important; }
}

/* FIX 10.09.2026 (раунд 2), ИСПРАВЛЕН 11.09.2026 — в узкой десктопной полосе 1200-1279px
   карточка диспетчера, прижатая к правому краю, доходила до последних букв заголовка.
   Карточку по горизонтали не двигаем и заголовок не трогаем — опускаем всю группу карточки
   (8 элементов) на +225px, ниже последней строки заголовка.
   11.09: в прежней версии 7 из 8 селекторов были с неверными id (выведены из id карточки) —
   на живом сайте опускалась только подложка, а текст карточки оставался наверху. Теперь все
   8 id прочитаны из живого DOM и проверены. Верхняя граница 1279.98px — чтобы при
   масштабе браузера (дробная ширина 1279.5) не было «дыры» между диапазонами. */
@media screen and (min-width: 1200px) and (max-width: 1279.98px) {
  #rec3696891301 .tn-elem[data-elem-id="1788863454226000010"] { top: 375px !important; }
  #rec3696891301 .tn-elem[data-elem-id="1788863917429000011"] { top: 415px !important; }
  #rec3696891301 .tn-elem[data-elem-id="1788864105078000012"] { top: 450px !important; }
  #rec3696891301 .tn-elem[data-elem-id="1788864198045000013"] { top: 555px !important; }
  #rec3696891301 .tn-elem[data-elem-id="1788864320943000015"] { top: 575px !important; }
  #rec3696891301 .tn-elem[data-elem-id="1788864388595000016"] { top: 575px !important; }
  #rec3696891301 .tn-elem[data-elem-id="1788864428918000017"] { top: 575px !important; }
  #rec3696891301 .tn-elem[data-elem-id="1788864467956000018"] { top: 575px !important; }
}

/* FIX 11.09.2026 — новый фон hero (фургон + «Ява 350»). На 1280-1319px карточка диспетчера
   задевала хвост телефона «…911» и «www.motohelp.ME» на борту фургона (на 1280px низ «www»
   y≈200, правый край надписей до x≈848, карточка x≥835, top 150). Минимальное смещение:
   вся группа карточки (8 элементов) +65px → top 215, зазор 15px. По X ничего не двигаем,
   right-anchor и подписи шагов не трогаем. Id элементов прочитаны из живого DOM. */
@media screen and (min-width: 1280px) and (max-width: 1319.98px) {
  #rec3696891301 .tn-elem[data-elem-id="1788863454226000010"] { top: 215px !important; }
  #rec3696891301 .tn-elem[data-elem-id="1788863917429000011"] { top: 255px !important; }
  #rec3696891301 .tn-elem[data-elem-id="1788864105078000012"] { top: 290px !important; }
  #rec3696891301 .tn-elem[data-elem-id="1788864198045000013"] { top: 395px !important; }
  #rec3696891301 .tn-elem[data-elem-id="1788864320943000015"] { top: 415px !important; }
  #rec3696891301 .tn-elem[data-elem-id="1788864388595000016"] { top: 415px !important; }
  #rec3696891301 .tn-elem[data-elem-id="1788864428918000017"] { top: 415px !important; }
  #rec3696891301 .tn-elem[data-elem-id="1788864467956000018"] { top: 415px !important; }
}

/* FIX 11.09.2026 — затемнение hero под новое фото (фургон + «Ява 350»). Само фото (кроп, фокус,
   зеркальность) не трогаем — только слой .t396__filter между фото и элементами (под карточкой,
   заголовком и кнопками). Два градиента:
   1) сверху вниз под шапкой: 0.85 → 0.7 на 69px (низ шапки) → 0.35 на 110px → 0 на 170px —
      надписи с борта фургона, торчащие из-под шапки, уходят в тень и не спорят с меню;
   2) слева направо: ровные 0.42 до правого края заголовка (центр + 200px на десктопе,
      центр + 300px на планшете), затем плавно в ноль. Работает поверх старого бокового
      градиента-элемента, не заменяя его. Худший контраст белого H1 к фото был 3.2–3.7,
      стал 7.0–7.6; подзаголовка было 2.8–4.1, стало 6.3–8.2.
   На телефонах (<480px) фото и так вписано в тёмный фон — там слой не включаем. */
@media screen and (min-width: 480px) {
  #rec3696891301 .t396__filter {
    background-image: linear-gradient(180deg, rgba(15, 15, 15, 0.85) 0px, rgba(15, 15, 15, 0.7) 69px, rgba(15, 15, 15, 0.35) 110px, rgba(15, 15, 15, 0) 170px), linear-gradient(90deg, rgba(15, 15, 15, 0.42) 0%, rgba(15, 15, 15, 0.42) calc(50% + 300px), rgba(15, 15, 15, 0) calc(50% + 460px)) !important;
  }
}
@media screen and (min-width: 1200px) {
  #rec3696891301 .t396__filter {
    background-image: linear-gradient(180deg, rgba(15, 15, 15, 0.85) 0px, rgba(15, 15, 15, 0.7) 69px, rgba(15, 15, 15, 0.35) 110px, rgba(15, 15, 15, 0) 170px), linear-gradient(90deg, rgba(15, 15, 15, 0.42) 0%, rgba(15, 15, 15, 0.42) calc(50% + 200px), rgba(15, 15, 15, 0) calc(50% + 480px)) !important;
  }
}


/* FIX 12.09.2026 - mobilnyj hero, variant B: polosa foto opushchena pod tekst i rastushevana v temnyj.
   Verh do 438px - sploshnoj 17181A (podzagolovok vsegda na rovnom fone, styka ne vidno);
   okno foto 500-552px; nizhe plavnyj uhod v temnyj k 628px, niz polosy pryachetsya pod kartochkoj dispetchera. */
@media screen and (max-width: 479px) {
  #rec3696891301 .t396__filter { background-image: linear-gradient(to bottom, #17181A 0px, #17181A 438px, rgba(23, 24, 26, 0.2) 500px, rgba(23, 24, 26, 0.2) 552px, #17181A 628px) !important; background-color: transparent !important; opacity: 1 !important; }
}

/* FIX 28.09.2026: кнопки под ценами одной ширины (звонок rec3713080301 и Telegram rec3994553201) */
#rec3713080301 .t-btnflex__text,
#rec3994553201 .t-btnflex__text{
  min-width: 196px;
  text-align: center;
}