/* =============================================================
   ДА-ТРАНС — мобильные шапка и подвал.
   Все визуальные правила живут внутри @media (max-width:1019px),
   поэтому ПК-версия не затрагивается. Единственное правило для
   десктопа — скрытие мобильных элементов шапки.
   Подключается в views/layouts/main.html.twig после cssmain.css.
   ============================================================= */

/* --- мобильные элементы на ПК не показываем --- */
@media (min-width: 1020px) {
  .header__mgeo,
  .header__mcall,
  .ya-rating { display: none !important; }
}

@media (max-width: 1019px) {

  /* ---------- токены ---------- */
  .section--header,
  .section--footer {
    --mhf-ink:    #15171b;
    --mhf-ink-2:  #565b63;
    --mhf-ink-3:  #8b9099;
    --mhf-line:   #e6e3dd;
    --mhf-line-2: #f0eeea;
    --mhf-red:    #cf2229;
    --mhf-paper:  #f7f6f3;
  }

  /* =========================================================
     ШАПКА
     логотип · город · кнопки меню и звонка
     ========================================================= */
  .section--header {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    background: rgba(255, 255, 255, .94);
    -webkit-backdrop-filter: saturate(180%) blur(12px);
    backdrop-filter: saturate(180%) blur(12px);
    border-bottom: 1px solid var(--mhf-line);
    box-shadow: 0 1px 2px rgba(20, 22, 26, .035);
  }

  .section--header .section__inner--header {
    padding-left: 14px;
    padding-right: 14px;
  }

  .section--header .header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    min-height: 58px;
  }

  /* логотип */
  .section--header .header__logo {
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
    -ms-flex: 0 0 auto;
        flex: 0 0 auto;
    margin: 0;
  }
  .section--header .header__logo .logo { display: block; }
  .section--header .header__logo .logo img {
    display: block;
    width: 96px;
    height: auto;
  }

  /* город — открывает существующий попап выбора города */
  .section--header .header__mgeo {
    -ms-flex-order: 2;
        order: 2;
    -ms-flex: 1 1 auto;
        flex: 1 1 auto;
    min-width: 0;
    padding-left: 4px;
  }
  .section--header .mgeo {
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex-align: center;
        align-items: center;
    max-width: 100%;
    margin: 0;
    padding: 6px 4px;
    border: 0;
    background: none;
    font-family: inherit;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.15;
    color: var(--mhf-ink-2);
    cursor: pointer;
  }
  .section--header .mgeo__icon {
    width: 13px;
    height: 13px;
    margin-right: 5px;
    -ms-flex: 0 0 auto;
        flex: 0 0 auto;
    color: var(--mhf-red);   /* иконки используют fill="currentColor" */
  }
  .section--header .mgeo__icon svg {
    display: block;
    width: 100%;
    height: 100%;
  }
  .section--header .mgeo__city {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    border-bottom: 1px dashed rgba(86, 91, 99, .45);
  }

  /* на мобиле в шапке не нужны: разделы, поиск, расчёт и большой телефон */
  .section--header .header__nav,
  .section--header .header__search,
  .section--header .header__calc,
  .section--header .header__call { display: none !important; }

  /* кнопка меню */
  .section--header .header__nav-toggle {
    -ms-flex-order: 9;
        order: 9;
    -ms-flex: 0 0 auto;
        flex: 0 0 auto;
    /* в cssmain.css у бургера margin-right:-20px — сбрасываем, иначе он вылезает за поле */
    margin-right: 0;
    margin-left: 8px;
  }
  .section--header .header__nav-toggle .nav-toggle {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center;
    width: 40px;
    height: 40px;
    padding: 0;
    border: 1px solid var(--mhf-line);
    border-radius: 12px;
    background: #fff !important;
    box-shadow: 0 1px 2px rgba(20, 22, 26, .04);
  }
  .section--header .header__nav-toggle .nav-toggle span {
    display: block;
    width: 16px;
    height: 2px;
    margin: 2px 0;
    border-radius: 2px;
    background: var(--mhf-ink) !important;
  }
  .section--header .header__nav-toggle .nav-toggle span:nth-child(3) { width: 11px; }
  /* в раскрытом виде третья полоска должна полностью исчезать из потока,
     иначе крестик уезжает от центра кнопки */
  .section--header .header__nav-toggle .nav-toggle.is-active span:nth-child(3) {
    width: 0;
    height: 0;
    margin: 0;
    opacity: 0;
  }

  /* кнопка звонка */
  .section--header .header__mcall {
    -ms-flex-order: 8;
        order: 8;
    margin-right: 8px;
    -ms-flex: 0 0 auto;
        flex: 0 0 auto;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 12px;
    background: var(--mhf-red);
    box-shadow: 0 6px 16px -8px rgba(207, 34, 41, .55);
  }
  .section--header .header__mcall .mcall__icon {
    width: 17px;
    height: 17px;
    color: #fff;
  }
  .section--header .header__mcall .mcall__icon svg {
    display: block;
    width: 100%;
    height: 100%;
  }
  .section--header .header__mcall:active { -webkit-transform: translateY(1px); transform: translateY(1px); }

  /* =========================================================
     ПОДВАЛ
     состав прежний: логотип, соцсети, разделы, копирайт,
     политика, рейтинг Яндекс.Карт — меняется только оформление
     ========================================================= */
  .section--footer {
    padding-top: 24px !important;
    padding-bottom: 28px !important;
    background: var(--mhf-paper);
    border-top: 1px solid var(--mhf-line);
  }
  .section--footer .section__inner--footer {
    padding-left: 16px;
    padding-right: 16px;
  }

  /* верх подвала: логотип + соцсети */
  .section--footer .footer__header {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: justify;
        justify-content: space-between;
    padding-bottom: 18px;
    border-bottom: 1px solid var(--mhf-line);
  }
  .section--footer .footer__logo .logo img {
    width: 104px !important;
    height: auto !important;
  }
  .section--footer .footer__social { margin-left: auto; }
  .section--footer .footer__social .social {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 0;
  }
  .section--footer .footer__social .social__item { margin: 0 0 0 9px; }
  /* иконки соцсетей на сайте — белые SVG, поэтому подложка тёмная */
  .section--footer .footer__social .social__link {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center;
    width: 38px;
    height: 38px;
    border: 0;
    border-radius: 11px;
    background: var(--mhf-ink);
    box-shadow: 0 2px 6px -2px rgba(20, 22, 26, .35);
  }
  .section--footer .footer__social .social__link:active { opacity: .85; }
  .section--footer .footer__social .social__link img {
    width: 18px;
    height: 18px;
    -o-object-fit: contain;
       object-fit: contain;
  }

  /* разделы */
  .section--footer .footer__section { padding: 0; }
  .section--footer .footer__nav {
    display: block !important;
    margin: 0;
    padding: 0;
    list-style: none;
  }
  .section--footer .footer__nav-block {
    margin: 0;
    padding: 16px 0 14px;
    border-bottom: 1px solid var(--mhf-line-2);
  }
  .section--footer .footer__nav-title {
    display: block !important;
    margin: 0 0 8px !important;
    font-size: 15px !important;
    line-height: 1.3 !important;
    font-weight: 700 !important;
    letter-spacing: 0 !important;
    color: var(--mhf-ink) !important;
  }
  .section--footer .footer__nav-list {
    margin: 0;
    padding: 0;
    list-style: none;
  }
  .section--footer .footer__nav-item { margin: 0; }
  .section--footer .footer__nav-link {
    display: block;
    padding: 8px 0;
    font-size: 13.5px;
    line-height: 1.35;
    color: var(--mhf-ink-2);
    text-decoration: none;
  }
  .section--footer .footer__nav-link:active { color: var(--mhf-red); }

  /* короткие списки (филиалы, доп. ссылки) — в две колонки */
  .section--footer .footer__nav-list--inline,
  .section--footer .footer__nav-list--accent {
    -webkit-columns: 2;
       -moz-columns: 2;
            columns: 2;
    -webkit-column-gap: 14px;
       -moz-column-gap: 14px;
            column-gap: 14px;
  }
  .section--footer .footer__nav-list--inline .footer__nav-item,
  .section--footer .footer__nav-list--accent .footer__nav-item {
    -webkit-column-break-inside: avoid;
       -moz-column-break-inside: avoid;
            break-inside: avoid;
  }

  /* низ подвала: копирайт, политика, рейтинг */
  .section--footer .footer__footer {
    display: block !important;
    margin-top: 18px;
    padding-top: 0 !important;
    border-top: 0 !important;
  }
  .section--footer .footer__main { display: block; }
  .section--footer .footer__copyright {
    margin-bottom: 10px;
    font-size: 13px;
    line-height: 1.4;
    color: var(--mhf-ink-3);
  }
  .section--footer .footer__links {
    margin: 0 0 16px;
    padding: 0;
    list-style: none;
  }
  .section--footer .footer__links-item { margin: 0; }
  .section--footer .footer__links-link {
    font-size: 13px;
    line-height: 1.4;
    color: var(--mhf-ink-2);
    border-bottom: 1px solid rgba(86, 91, 99, .25);
    text-decoration: none;
  }
  /* на мобильных виджет Яндекса не показываем — вместо него свой блок */
  .section--footer .footer__author { display: block; }
  .section--footer .footer__author iframe { display: none !important; }

  .section--footer .ya-rating {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    max-width: 260px;
    padding: 12px 14px;
    border: 1px solid var(--mhf-line);
    border-radius: 14px;
    background: #fff;
    text-decoration: none;
    box-shadow: 0 1px 2px rgba(20, 22, 26, .04);
  }
  .section--footer .ya-rating__value {
    margin-right: 9px;
    font-size: 20px;
    font-weight: 700;
    line-height: 1;
    color: var(--mhf-ink);
  }
  .section--footer .ya-rating__stars {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
  }
  .section--footer .ya-rating__stars i {
    width: 14px;
    height: 14px;
    margin-right: 2px;
    background: #fc0;
    -webkit-clip-path: polygon(50% 0, 61.8% 35%, 100% 35%, 69% 57%, 80.9% 91%, 50% 70%, 19.1% 91%, 31% 57%, 0 35%, 38.2% 35%);
            clip-path: polygon(50% 0, 61.8% 35%, 100% 35%, 69% 57%, 80.9% 91%, 50% 70%, 19.1% 91%, 31% 57%, 0 35%, 38.2% 35%);
  }
  .section--footer .ya-rating__label {
    -ms-flex: 1 0 100%;
        flex: 1 0 100%;
    margin-top: 7px;
    font-size: 12.5px;
    line-height: 1.3;
    color: var(--mhf-ink-3);
  }
  .section--footer .ya-rating:active { background: #fcfbf9; }
}

/* =============================================================
   МЕНЮ, которое открывается кнопкой в шапке.
   Структура и анимация прежние — меняется только оформление.
   ============================================================= */
@media (max-width: 1019px) {

  .section--navbar {
    --mhf-ink:    #15171b;
    --mhf-ink-2:  #565b63;
    --mhf-line:   #e6e3dd;
    --mhf-line-2: #f0eeea;
    --mhf-red:    #cf2229;
    background: #fff;
    border-bottom: 1px solid var(--mhf-line);
    box-shadow: 0 18px 40px -22px rgba(20, 22, 26, .35);
  }

  /* город уже показан в шапке — в меню не дублируем */
  .section--navbar .navbar__location { display: none !important; }

  .section--navbar .navbar__nav { margin-top: 4px; }

  .section--navbar .nav__item { border-bottom: 1px solid var(--mhf-line-2); }
  .section--navbar .nav__link {
    font-size: 16px !important;
    font-weight: 600 !important;
    line-height: 1.3;
    padding-top: 13px;
    padding-bottom: 13px;
    color: var(--mhf-ink);
  }
  .section--navbar .nav__item--current > .nav__link { color: var(--mhf-red); }
  .section--navbar .nav__sub .nav__link {
    font-size: 14.5px !important;
    font-weight: 500 !important;
    color: var(--mhf-ink-2);
  }

  /* телефон отдельной кнопкой внизу меню */
  .section--navbar .navbar__private { padding: 14px 20px 4px; }
  .section--navbar .navbar__private .button {
    display: block !important;
    width: 100%;
    padding: 13px 16px;
    border-radius: 14px;
    background: var(--mhf-red);
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    text-align: center;
    text-decoration: none;
    box-shadow: 0 10px 22px -12px rgba(207, 34, 41, .6);
  }
  .section--navbar .navbar__private .link { margin-top: 12px; }

  .section--navbar .navbar__search { padding: 4px 20px 14px; }
}

/* =============================================================
   ПЛАШКА ПРО COOKIE на мобильных.
   Пока плашка видна, кнопки чатов поднимаются выше, чтобы её не
   перекрывать (класс has-cookiebar вешает скрипт в layout).
   ============================================================= */
@media (max-width: 1019px) {

  .cookie {
    z-index: 2147483000 !important;
    padding: 14px 16px !important;
    padding-bottom: calc(14px + env(safe-area-inset-bottom)) !important;
    background: rgba(21, 23, 27, .96) !important;
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
  }
  .cookie__inner {
    display: block !important;
    max-width: 100%;
    padding: 0 !important;
  }
  .cookie__text {
    margin-bottom: 12px;
    font-size: 13px;
    line-height: 1.45;
    color: #fff;
  }
  .cookie__text a { color: #ff9ea2; }
  .cookie .cookie__button {
    display: inline-block;
    min-width: 116px;
    margin: 0 8px 0 0;
    padding: 10px 18px;
    border: 0;
    border-radius: 12px;
    background: var(--mhf-red, #cf2229);
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
  }
  .cookie .cookie__button + .cookie__button {
    background: transparent;
    border: 1px solid rgba(255, 255, 255, .35);
  }

  /* поднимаем кнопки чатов, пока показывается плашка */
  html.has-cookiebar .b24-widget-button-wrapper,
  html.has-cookiebar .b24-widget-button-position-bottom-right,
  html.has-cookiebar #jvlabelWrap,
  html.has-cookiebar #jivo-iframe-container {
    bottom: 168px !important;
    -webkit-transition: bottom .25s ease;
    transition: bottom .25s ease;
  }
}

/* =============================================================
   Нижняя фиксированная панель (.mobilepanel) висит поверх страницы.
   Даём подвалу запас снизу, чтобы последний блок не уходил под неё,
   и учитываем «домашнюю полосу» iPhone.
   ============================================================= */
@media (max-width: 1019px) {

  .section--footer {
    padding-bottom: calc(96px + env(safe-area-inset-bottom)) !important;
  }

  .mobilepanel {
    padding-bottom: calc(10px + env(safe-area-inset-bottom)) !important;
  }
}

/* =============================================================
   Защита от горизонтальной прокрутки.
   У body уже стоит overflow-x:hidden, но прокрутка возникает на
   уровне <html>. Используем clip, а не hidden: clip не создаёт
   контейнер прокрутки и не ломает position:sticky у шапки.
   ============================================================= */
@media (max-width: 1019px) {
  html { overflow-x: clip; }
  .mobilepanel,
  .cookie { max-width: 100%; }
}

/* =============================================================
   Нижняя панель: четыре кнопки вместо трёх.
   Панель показывается только до 1024px, ПК не затрагивается.
   ============================================================= */
@media (max-width: 1019px) {

  .mobilepanel {
    gap: 8px !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
  .mobilepanel a {
    -ms-flex: 1 1 0px;
        flex: 1 1 0;
    min-width: 0;
    padding: 8px 4px !important;
    border-radius: 12px !important;
  }
  .mobilepanel a.is-loading {
    opacity: .55;
    pointer-events: none;
  }
}

/* =============================================================
   Окно выбора канала связи (кнопка «Написать» в нижней панели).
   Полностью наше, без сторонних скриптов. Jivo подключается
   только при выборе «Оставить сообщение».
   ============================================================= */
.dt-sheet {
  --mhf-ink: #15171b;
  --mhf-ink-3: #8b9099;
  --mhf-line-2: #ececec;
  position: fixed;
  z-index: 2147483001;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  display: none;
  -ms-flex-direction: column;
      flex-direction: column;
  -ms-flex-pack: end;
      justify-content: flex-end;
  padding: 8px 8px calc(8px + env(safe-area-inset-bottom));
}
.dt-sheet.is-open { display: -ms-flexbox; display: flex; }

.dt-sheet__backdrop {
  position: absolute;
  left: 0; right: 0; top: 0; bottom: 0;
  background: rgba(20, 22, 26, .45);
  -webkit-animation: dtSheetFade .2s ease both;
          animation: dtSheetFade .2s ease both;
}

.dt-sheet__panel,
.dt-sheet__cancel {
  position: relative;
  border-radius: 16px;
  background: #fff;
  overflow: hidden;
  -webkit-animation: dtSheetUp .26s cubic-bezier(.23, 1, .32, 1) both;
          animation: dtSheetUp .26s cubic-bezier(.23, 1, .32, 1) both;
}
.dt-sheet__title {
  padding: 14px 16px 12px;
  border-bottom: 1px solid var(--mhf-line-2);
  font-size: 13.5px;
  line-height: 1.3;
  color: var(--mhf-ink-3);
  text-align: center;
}
.dt-sheet__list { margin: 0; padding: 0; list-style: none; }
.dt-sheet__row + .dt-sheet__row { border-top: 1px solid var(--mhf-line-2); }

.dt-sheet__item {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  width: 100%;
  padding: 15px 16px;
  border: 0;
  background: none;
  font-family: inherit;
  font-size: 16px;
  line-height: 1.25;
  color: var(--mhf-ink);
  text-align: left;
  text-decoration: none;
  cursor: pointer;
}
.dt-sheet__item:active { background: #f5f4f1; }
.dt-sheet__icon {
  -ms-flex: 0 0 auto;
      flex: 0 0 auto;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  -ms-flex-pack: center;
      justify-content: center;
  width: 34px;
  height: 34px;
  margin-right: 13px;
  border-radius: 11px;
}
.dt-sheet__icon svg { width: 19px; height: 19px; display: block; }
.dt-sheet__icon--tg   { background: #eaf5fd; color: #29a2e2; }
.dt-sheet__icon--call { background: #eaf7ee; color: #1e9e4a; }
.dt-sheet__icon--chat { background: #fcefef; color: #cf2229; }

.dt-sheet__cancel {
  display: block;
  width: 100%;
  margin-top: 8px;
  padding: 16px;
  border: 0;
  font-family: inherit;
  font-size: 16px;
  font-weight: 600;
  color: #cf2229;
  cursor: pointer;
}
.dt-sheet__item.is-loading { opacity: .5; pointer-events: none; }

@-webkit-keyframes dtSheetUp { from { -webkit-transform: translateY(18px); opacity: 0 } to { -webkit-transform: none; opacity: 1 } }
@keyframes dtSheetUp { from { transform: translateY(18px); opacity: 0 } to { transform: none; opacity: 1 } }
@-webkit-keyframes dtSheetFade { from { opacity: 0 } to { opacity: 1 } }
@keyframes dtSheetFade { from { opacity: 0 } to { opacity: 1 } }

/* =============================================================
   КОНТЕНТ СТРАНИЦ на мобильных (первый приоритет).
   Меняется только оформление: тексты, таблицы, отзывы, клиенты,
   вкладки и FAQ остаются те же и в том же порядке.
   ============================================================= */
@media (max-width: 1019px) {

  body {
    --mhf-ink: #15171b;
    --mhf-ink-2: #565b63;
    --mhf-ink-3: #8b9099;
    --mhf-line: #e6e3dd;
    --mhf-line-2: #f0eeea;
    --mhf-red: #cf2229;
  }

  /* ---------- хлебные крошки ---------- */
  .section_breadcrumbs .breadcrumbs__list {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    margin: 0;
    padding: 0;
  }
  .section_breadcrumbs .breadcrumbs__list::-webkit-scrollbar { display: none; }
  .section_breadcrumbs .breadcrumbs__item { white-space: nowrap; }
  .section_breadcrumbs .breadcrumbs__link {
    font-size: 12px;
    line-height: 1.3;
    color: var(--mhf-ink-3);
  }

  /* ---------- заголовки и текст ---------- */
  section.section h1.block__title,
  section.section .block__title.title {
    font-size: 26px !important;
    line-height: 1.18 !important;
    letter-spacing: -.01em;
    color: var(--mhf-ink);
  }
  section.section h2,
  section.section .block__title h2 { font-size: 21px !important; line-height: 1.22 !important; }
  section.section h3 { font-size: 17px !important; line-height: 1.3 !important; }

  section.section .text,
  section.section .text p,
  section.section .text li {
    font-size: 15px;
    line-height: 1.55;
    color: var(--mhf-ink-2);
  }
  /* выключенная выключка: на узком экране «по ширине» рвёт слова дырами */
  section.section .text,
  section.section .text p,
  section.section .text li,
  section.section .text div,
  section.section .text h2,
  section.section .text h3 { text-align: left !important; }
  section.section .text a { color: var(--mhf-red); }

  /* картинки внутри текста: на телефоне не обтекаем, а показываем во всю ширину —
     иначе текст ужимается в узкую колонку рядом с картинкой */
  section.section .text img {
    float: none !important;
    display: block;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 0 14px !important;
    border-radius: 14px;
  }
  section.section .text .icon img,
  section.section .text img.emoji {
    display: inline;
    width: auto !important;
    margin: 0 !important;
    border-radius: 0;
  }

  /* широкие таблицы прокручиваются внутри себя, а не ломают страницу */
  section.section .text table,
  section.section table.price_from_table {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  /* ---------- «Показать полностью» для длинных текстов ---------- */
  .dt-clamp {
    position: relative;
    max-height: 290px;
    overflow: hidden;
  }
  /* если в блоке есть картинка, оставляем видимой её и несколько строк текста */
  .dt-clamp.dt-clamp--media { max-height: 480px; }
  .dt-clamp::after {
    content: "";
    position: absolute;
    left: 0; right: 0; bottom: 0;
    height: 92px;
    background: -webkit-linear-gradient(top, rgba(255,255,255,0), #fff 82%);
    background: linear-gradient(180deg, rgba(255,255,255,0), #fff 82%);
    pointer-events: none;
  }
  .section--light-grey .dt-clamp::after {
    background: -webkit-linear-gradient(top, rgba(246,246,246,0), #f6f6f6 82%);
    background: linear-gradient(180deg, rgba(246,246,246,0), #f6f6f6 82%);
  }
  .dt-clamp.is-open { max-height: none; }
  .dt-clamp.is-open::after { display: none; }
  .dt-clamp__more {
    display: block;
    width: 100%;
    margin: 6px 0 2px;
    padding: 10px 0;
    border: 0;
    background: none;
    font-family: inherit;
    font-size: 14px;
    font-weight: 600;
    color: var(--mhf-red);
    text-align: center;
    cursor: pointer;
  }
  .dt-clamp__more:active { opacity: .6; }

  /* ---------- отзывы: горизонтальная лента ---------- */
  .testimonials .testimonials__list {
    display: -ms-flexbox;
    display: flex;
    margin: 0 -16px;
    padding: 2px 16px 14px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    list-style: none;
  }
  .testimonials .testimonials__list::-webkit-scrollbar { display: none; }
  .testimonials .testimonials__item {
    -ms-flex: 0 0 84%;
        flex: 0 0 84%;
    margin: 0 10px 0 0;
    scroll-snap-align: start;
  }
  .testimonials .testimonials__inner {
    height: 100%;
    padding: 16px;
    border: 1px solid var(--mhf-line);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 2px 4px rgba(20, 22, 26, .04), 0 8px 20px -12px rgba(20, 22, 26, .16);
  }
  .testimonials .testimonials__title { font-size: 15px; line-height: 1.3; }
  .testimonials .testimonials__date { font-size: 12.5px; color: var(--mhf-ink-3); }

  /* ---------- вкладки ---------- */
  section.section .tabs__toggle {
    padding: 13px 14px;
    font-size: 15px;
    line-height: 1.3;
  }
  section.section .tabs__content { font-size: 15px; line-height: 1.55; }

  /* ---------- FAQ ---------- */
  section.section .accordion__item {
    margin: 0;
    border-bottom: 1px solid var(--mhf-line-2);
  }
  section.section .accordion__toggle {
    padding: 15px 34px 15px 0;
    font-size: 15.5px;
    line-height: 1.35;
    font-weight: 600;
    color: var(--mhf-ink);
    text-align: left;
  }
  section.section .accordion__body { font-size: 15px; line-height: 1.55; }

  /* ---------- клиенты ---------- */
  section.section .clients__item { padding: 0 6px; }
  section.section .clients__inner {
    padding: 12px;
    border: 1px solid var(--mhf-line-2);
    border-radius: 14px;
    background: #fff;
  }
}


/* =============================================================
   ПЕРВЫЙ ЭКРАН страниц тарифов (мобильные).
   Заголовок поднимается над калькулятором. Перестановку делает
   скрипт в layout — переносит секцию заголовка выше в DOM,
   потому что разметка страницы не позволяет сделать это стилями.
   Содержимое блоков не меняется.
   ============================================================= */
@media (max-width: 1019px) {

  /* фоновое фото направления на мобильных не показываем: оно общее для всех
     маршрутов и не несёт информации, зато занимает экран и трафик */
  .dt-tariff .section--image {
    padding-top: 4px !important;
    padding-bottom: 20px !important;
    background: var(--mhf-paper, #f7f6f3);
  }
  .dt-tariff .section--image > div[style*="absolute"] { display: none !important; }

  /* подсказки «Быстрый выбор» в форме расчёта не нужны — города уже подставлены */
  .dt-tariff .tools .calculator__place-featured { display: none !important; }

  /* заголовок маршрута — обычным регистром, как в прототипе */
  /* заголовки обычным регистром — капсом на телефоне читать тяжело */
  section.section h1.block__title,
  section.section h2,
  section.section h3,
  section.section .block__title { text-transform: none !important; }
  /* на странице маршрута общий заголовок про «перевозки по России» не нужен —
     над калькулятором теперь стоит H1 маршрута */
  .dt-tariff .dt-mobile-hero { display: none; }

  /* калькулятор одной карточкой: убираем вложенные рамки сайта.
     visibility снимаем — сайт прячет блок до первого касания, из-за чего
     на месте калькулятора виден пустой блок */
  .dt-tariff .tools.nofixedblock {
    visibility: visible !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 18px;
    background: transparent;
  }
  .dt-tariff .tools .tabs__contents {
    border: 1px solid var(--mhf-line) !important;
    border-radius: 18px !important;
    background: #fff;
    box-shadow: 0 4px 8px rgba(20, 22, 26, .05), 0 18px 40px -20px rgba(20, 22, 26, .22);
    overflow: hidden;
  }
  .dt-tariff .tools .tabs__data {
    border: 0 !important;
    border-radius: 0 !important;
    padding: 14px !important;
  }
  .dt-tariff .tools .calculator__place-field,
  .dt-tariff .tools .bordernoanim { border-radius: 12px; }
  .dt-tariff .tools .zagolovoki_tools {
    margin-bottom: 6px;
    font-size: 13px;
    font-weight: 600;
    color: var(--mhf-ink);
  }
  .dt-tariff .tools .input {
    height: 46px;
    border-radius: 12px;
    font-size: 15px;
  }
  .dt-tariff .tools .calculator__submit {
    width: 100%;
    height: 52px;
    border-radius: 14px;
    font-size: 16px;
    font-weight: 700;
  }

  /* заголовок маршрута над калькулятором */
  .dt-s-title {
    padding-top: 12px !important;
    padding-bottom: 10px !important;
  }
  .dt-s-title .block__title { margin-bottom: 8px !important; }
  .dt-clamp--lede { max-height: 150px; }

  /* в лиде картинка не должна занимать весь экран — уводим в миниатюру,
     чтобы над калькулятором был виден текст про маршрут */
  section.section.dt-s-title .text img {
    float: right !important;
    display: block;
    width: 112px !important;
    height: auto !important;
    margin: 2px 0 8px 12px !important;
    border-radius: 12px;
  }
}

/* =============================================================
   Доводка контента (мобильные)
   ============================================================= */
@media (max-width: 1019px) {

  /* выключка «по ширине» приходит инлайном из редактора — снимаем везде */
  [style*="justify"] { text-align: left !important; }

  /* в свёрнутом блоке картинка не должна закрывать собой весь текст */
  .dt-clamp--media img {
    max-height: 210px !important;
    -o-object-fit: cover;
       object-fit: cover;
  }
  .dt-clamp--media.is-open img { max-height: none !important; }
}

/* =============================================================
   Строка характеристик маршрута под H1 (мобильные).
   Значения — из того же расчёта, что и таблица тарифов ниже.
   ============================================================= */
.dt-meta { display: none; }

@media (max-width: 1019px) {
  .dt-tariff .dt-meta {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    margin: 0 0 12px;
    padding: 0;
    list-style: none;
  }
  .dt-tariff .dt-meta__item {
    margin: 0 8px 8px 0;
    padding: 7px 12px;
    border: 1px solid var(--mhf-line);
    border-radius: 10px;
    background: #fff;
    font-size: 13.5px;
    font-weight: 600;
    line-height: 1.2;
    color: var(--mhf-ink-2);
    white-space: nowrap;
  }
  .dt-tariff .dt-meta__item--price {
    border-color: rgba(207, 34, 41, .25);
    background: #fcefef;
    color: var(--mhf-red);
  }
}

/* =============================================================
   Карточка маршрута под H1 (мобильные): линия «откуда — куда»
   с машинкой, расстояние, срок, цена и кнопка расчёта.
   Значения — из того же расчёта, что и таблица тарифов ниже.
   ============================================================= */
.dt-route,
.dt-hero-bottom { display: none; }

@media (max-width: 1019px) {

  .dt-tariff .dt-route , .dt-pereezd .dt-route {
    display: block;
    margin: 0 0 14px;
    padding: 34px 18px 16px;
    border: 1px solid var(--mhf-line);
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 2px 4px rgba(20, 22, 26, .04), 0 14px 32px -18px rgba(20, 22, 26, .22);
  }

  .dt-tariff .dt-route__line , .dt-pereezd .dt-route__line { position: relative; }

  /* рельса фиксированной ширины — не зависит от длины названий городов */
  .dt-tariff .dt-route__track , .dt-pereezd .dt-route__track {
    position: relative;
    height: 14px;
    margin: 0 27px;
  }
  .dt-tariff .dt-route__track::before , .dt-pereezd .dt-route__track::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    height: 3px;
    margin-top: -1.5px;
    border-radius: 2px;
    background: -webkit-repeating-linear-gradient(left, #b6bac0 0, #b6bac0 6px, transparent 6px, transparent 12px);
    background: repeating-linear-gradient(90deg, #b6bac0 0 6px, transparent 6px 12px);
  }
  .dt-tariff .dt-route__dot , .dt-pereezd .dt-route__dot {
    position: absolute;
    top: 50%;
    width: 13px;
    height: 13px;
    margin-top: -6.5px;
    border: 3px solid var(--mhf-ink);
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 0 0 4px #fff;
    z-index: 2;
  }
  .dt-tariff .dt-route__dot--start , .dt-pereezd .dt-route__dot--start { left: -25px; }
  .dt-tariff .dt-route__dot--end , .dt-pereezd .dt-route__dot--end { right: -25px; border-color: var(--mhf-red); }

  /* машинка ездит по рельсе; её можно перетаскивать */
  .dt-tariff .dt-route__truck , .dt-pereezd .dt-route__truck {
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 10px;
    background: var(--mhf-red);
    box-shadow: 0 8px 20px -8px rgba(207, 34, 41, .55);
    cursor: -webkit-grab;
    cursor: grab;
    touch-action: none;
    z-index: 3;
  }
  .dt-tariff .dt-route__truck.is-dragging , .dt-pereezd .dt-route__truck.is-dragging {
    -webkit-transform: translate(-50%, -50%) scale(1.08);
            transform: translate(-50%, -50%) scale(1.08);
    cursor: -webkit-grabbing;
    cursor: grabbing;
  }
  .dt-tariff .dt-route__truck svg , .dt-pereezd .dt-route__truck svg { width: 18px; height: 18px; display: block; }

  /* метка «Доставлено» — появляется, когда машинка дошла до города назначения */
  .dt-tariff .dt-route__flag , .dt-pereezd .dt-route__flag {
    position: absolute;
    bottom: calc(100% + 9px);
    left: 50%;
    -webkit-transform: translate(-50%, 4px);
            transform: translate(-50%, 4px);
    padding: 5px 9px;
    border-radius: 8px;
    background: var(--mhf-ink);
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
    opacity: 0;
    pointer-events: none;
    -webkit-transition: opacity .2s ease, -webkit-transform .2s ease;
    transition: opacity .2s ease, transform .2s ease;
  }
  /* метка видна во всех трёх состояниях, а прижимается к тому краю,
     у которого стоит машинка, чтобы не вылезать за карточку */
  .dt-tariff .dt-route.is-loading .dt-route__flag,
  .dt-tariff .dt-route.is-delivered .dt-route__flag , .dt-pereezd .dt-route.is-delivered .dt-route__flag {
    opacity: 1;
    -webkit-transform: translate(-50%, 0);
            transform: translate(-50%, 0);
  }
  .dt-tariff .dt-route.is-loading .dt-route__flag , .dt-pereezd .dt-route.is-loading .dt-route__flag {
    left: -4px;
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0);
  }
  .dt-tariff .dt-route.is-delivered .dt-route__flag , .dt-pereezd .dt-route.is-delivered .dt-route__flag {
    left: auto;
    right: -4px;
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0);
  }

  .dt-tariff .dt-route__cities , .dt-pereezd .dt-route__cities {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
        justify-content: space-between;
    margin-top: 10px;
  }
  .dt-tariff .dt-route__city , .dt-pereezd .dt-route__city {
    max-width: 47%;
    font-size: 13.5px;
    font-weight: 600;
    line-height: 1.2;
    color: var(--mhf-ink);
  }
  .dt-tariff .dt-route__city--end , .dt-pereezd .dt-route__city--end {
    color: var(--mhf-red);
    text-align: right;
  }

  .dt-tariff .dt-route__meta , .dt-pereezd .dt-route__meta {
    display: -ms-flexbox;
    display: flex;
    margin-top: 16px;
    padding-top: 14px;
    border-top: 1px solid var(--mhf-line-2);
  }
  .dt-tariff .dt-route__meta > div , .dt-pereezd .dt-route__meta > div {
    -ms-flex: 1 1 0px;
        flex: 1 1 0;
    text-align: center;
  }
  .dt-tariff .dt-route__meta > div + div , .dt-pereezd .dt-route__meta > div + div { border-left: 1px solid var(--mhf-line-2); }
  .dt-tariff .dt-route__meta .v , .dt-pereezd .dt-route__meta .v {
    font-size: 17px;
    font-weight: 700;
    line-height: 1;
    color: var(--mhf-ink);
  }
  .dt-tariff .dt-route__meta .l , .dt-pereezd .dt-route__meta .l {
    margin-top: 5px;
    font-size: 11px;
    letter-spacing: .02em;
    color: var(--mhf-ink-3);
  }

  /* цена и кнопка */
  .dt-tariff .dt-hero-bottom , .dt-pereezd .dt-hero-bottom {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    margin: 0 0 16px;
  }
  .dt-tariff .dt-price , .dt-pereezd .dt-price { -ms-flex: 0 0 auto; flex: 0 0 auto; padding-right: 14px; }
  .dt-tariff .dt-price .from , .dt-pereezd .dt-price .from {
    font-size: 11px;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--mhf-ink-3);
  }
  .dt-tariff .dt-price .val , .dt-pereezd .dt-price .val {
    margin-top: 3px;
    font-size: 22px;
    font-weight: 700;
    line-height: 1;
    color: var(--mhf-ink);
  }
  .dt-tariff .dt-price .val span , .dt-pereezd .dt-price .val span { color: var(--mhf-red); }
  .dt-tariff .dt-btn , .dt-pereezd .dt-btn {
    -ms-flex: 1 1 auto;
        flex: 1 1 auto;
    height: 50px;
    border: 0;
    border-radius: 14px;
    background: var(--mhf-red);
    color: #fff;
    font-family: inherit;
    font-size: 16px;
    font-weight: 700;
    box-shadow: 0 10px 24px -12px rgba(207, 34, 41, .6);
    cursor: pointer;
  }
  .dt-tariff .dt-btn:active , .dt-pereezd .dt-btn:active { -webkit-transform: translateY(1px); transform: translateY(1px); }
}

/* =============================================================
   Лента преимуществ под ценой (мобильные).
   Прокручивается пальцем, содержимое — факты, уже указанные
   на самой странице.
   ============================================================= */
.dt-trust { display: none; }

@media (max-width: 1019px) {
  .dt-tariff .dt-trust , .dt-pereezd .dt-trust {
    display: -ms-flexbox;
    display: flex;
    margin: 0 -16px 16px;
    padding: 2px 16px 6px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scroll-padding-left: 16px;
    scrollbar-width: none;
  }
  .dt-tariff .dt-trust::-webkit-scrollbar , .dt-pereezd .dt-trust::-webkit-scrollbar { display: none; }

  .dt-tariff .dt-trust__item , .dt-pereezd .dt-trust__item {
    -ms-flex: 0 0 auto;
        flex: 0 0 auto;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    margin-right: 8px;
    padding: 9px 13px 9px 10px;
    border: 1px solid var(--mhf-line);
    border-radius: 12px;
    background: #fff;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.2;
    color: var(--mhf-ink);
    white-space: nowrap;
    box-shadow: 0 1px 2px rgba(20, 22, 26, .04);
  }
  .dt-tariff .dt-trust__item:last-child , .dt-pereezd .dt-trust__item:last-child { margin-right: 16px; }
  .dt-tariff .dt-trust__ic , .dt-pereezd .dt-trust__ic {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center;
    width: 26px;
    height: 26px;
    margin-right: 8px;
    border-radius: 8px;
    background: #fcefef;
    color: var(--mhf-red);
  }
  .dt-tariff .dt-trust__ic svg , .dt-pereezd .dt-trust__ic svg { width: 15px; height: 15px; display: block; }
}

/* =============================================================
   Заголовок формы расчёта и стрелка на кнопке (мобильные).
   ============================================================= */
.dt-calc-head { display: none; }

@media (max-width: 1019px) {
  .dt-tariff .dt-calc-head {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    padding: 16px 14px 4px;
  }
  .dt-tariff .dt-calc-head__ic {
    -ms-flex: 0 0 auto;
        flex: 0 0 auto;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center;
    width: 40px;
    height: 40px;
    margin-right: 12px;
    border-radius: 12px;
    background: var(--mhf-red);
    color: #fff;
    box-shadow: 0 8px 18px -10px rgba(207, 34, 41, .6);
  }
  .dt-tariff .dt-calc-head__ic svg { width: 20px; height: 20px; display: block; }
  .dt-tariff .dt-calc-head__txt { display: block; min-width: 0; }
  .dt-tariff .dt-calc-head__t {
    display: block;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.2;
    color: var(--mhf-ink);
  }
  .dt-tariff .dt-calc-head__s {
    display: block;
    margin-top: 3px;
    font-size: 13px;
    line-height: 1.3;
    color: var(--mhf-ink-3);
  }

  /* стрелка на кнопке расчёта, как в прототипе */
  .dt-tariff .tools .calculator__submit::after {
    content: "\2192";
    margin-left: 10px;
    font-size: 18px;
    line-height: 1;
  }
}

/* подпись про минимальный вес — только при вводе меньше 500 кг */
@media (max-width: 1019px) {
  .dt-tariff .tools .weight_text { display: none !important; }
  .dt-tariff .tools .weight_text.is-visible {
    display: block !important;
    margin-top: 6px;
    font-size: 12.5px;
    line-height: 1.3;
    color: var(--mhf-red);
  }
  .dt-tariff .tools .weight_text.is-visible span::before { content: "Минимальный вес — "; color: var(--mhf-red); }
  .dt-tariff .tools .weight_text.is-visible span { font-size: 0; }
  .dt-tariff .tools .weight_text.is-visible span::before { font-size: 12.5px; }
  .dt-tariff .tools .weight_text.is-visible span::after { content: "500 кг"; font-size: 12.5px; color: var(--mhf-red); }
}

/* =============================================================
   Быстрый выбор веса в форме расчёта (мобильные).
   Градации совпадают с таблицей тарифов на странице.
   ============================================================= */
.dt-weight { display: none; }

@media (max-width: 1019px) {
  /* все кнопки помещаются в ширину экрана, ничего не режется */
  .dt-tariff .dt-weight {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    margin: 0 0 10px;
    padding: 2px 0 0;
  }
  .dt-tariff .dt-weight__chip {
    -ms-flex: 1 1 auto;
        flex: 1 1 auto;
    margin-right: 6px;
    padding: 8px 6px;
    border: 1px solid var(--mhf-line);
    border-radius: 10px;
    text-align: center;
    background: #fff;
    font-family: inherit;
    font-size: 13.5px;
    font-weight: 600;
    line-height: 1;
    color: var(--mhf-ink-2);
    white-space: nowrap;
    cursor: pointer;
  }
  .dt-tariff .dt-weight__chip:last-child { margin-right: 0; }
  .dt-tariff .dt-weight__chip.is-active {
    border-color: var(--mhf-red);
    background: #fcefef;
    color: var(--mhf-red);
  }

  /* единицы прямо в поле */
  .dt-tariff .dt-weight__field {
    position: relative;
    max-width: 168px;
  }
  .dt-tariff .dt-weight__unit {
    position: absolute;
    top: 50%;
    right: 14px;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    font-size: 14px;
    color: var(--mhf-ink-3);
    pointer-events: none;
  }
  .dt-tariff .dt-weight__field .calculator__weight-input { padding-right: 40px; }
}

/* кнопка «поменять города местами»: ровно в промежутке между полями, у правого края */
@media (max-width: 1019px) {
  .dt-tariff .tools .calculator__swap {
    right: 0 !important;
    left: auto !important;
    width: auto !important;
    height: auto !important;
    -webkit-transform: translateY(-24px);
            transform: translateY(-24px);
  }
  .dt-tariff .tools .calculator__swap-button {
    display: -ms-flexbox !important;
    display: flex !important;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center;
    width: 38px !important;
    height: 38px !important;
    min-width: 0 !important;
    padding: 0 !important;
    border: 1px solid var(--mhf-line) !important;
    border-radius: 50% !important;
    background: #fff !important;
    box-shadow: 0 2px 6px rgba(20, 22, 26, .08);
  }
  .dt-tariff .tools .calculator__swap-icon { color: var(--mhf-red); }
  .dt-tariff .tools .calculator__swap-icon svg { width: 16px; height: 16px; display: block; }
}

/* стрелки обмена — вертикальные, как и должно быть */
@media (max-width: 1019px) {
  .dt-tariff .tools .calculator__swap-icon svg {
    -webkit-transform: rotate(90deg);
            transform: rotate(90deg);
  }

  /* блок «Нестандартный груз» — отдельная плашка внизу карточки, а не пустое поле */
  .dt-tariff .tools .special_block {
    margin: 14px -14px -14px !important;
    padding: 16px 14px !important;
    border-top: 1px solid var(--mhf-line-2);
    border-radius: 0 0 18px 18px;
    background: #faf9f7;
  }
  .dt-tariff .tools .special_block .spectext {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: start;
        align-items: flex-start;
    margin: 0 0 12px !important;
  }
  .dt-tariff .tools .special_block .spectext > svg {
    -ms-flex: 0 0 auto;
        flex: 0 0 auto;
    width: 26px !important;
    height: 26px !important;
    margin-right: 10px;
  }
  .dt-tariff .tools .special_block .text_special { font-size: 14px; line-height: 1.4; }
  .dt-tariff .tools .special_block .getspecial {
    display: block;
    width: 100%;
    padding: 12px 16px;
    border: 1px solid var(--mhf-red);
    border-radius: 12px;
    background: #fff;
    font-family: inherit;
    font-size: 15px;
    font-weight: 600;
    color: var(--mhf-red);
  }

  /* серая рамка вокруг калькулятора — одинаковая сверху и снизу */
  .dt-tariff .section--image {
    padding-top: 16px !important;
    padding-bottom: 16px !important;
  }
  .dt-tariff .section--image .block { margin-bottom: 0 !important; padding-bottom: 0 !important; }
  .dt-tariff .section--image .tools.nofixedblock { margin-bottom: 0 !important; }
}

/* доводка блока «Нестандартный груз» */
@media (max-width: 1019px) {
  .dt-tariff .tools .special_block .spectext > svg { display: none !important; }
  .dt-tariff .tools .special_block .text_special > *:first-child {
    font-size: 16px !important;
    line-height: 1.25 !important;
    font-weight: 700 !important;
    margin: 0 0 4px !important;
  }
  .dt-tariff .tools .special_block .text_special { color: var(--mhf-ink-2); }
}

/* «Нестандартный груз» — отдельная карточка под калькулятором */
@media (max-width: 1019px) {
  .dt-tariff .dt-special {
    margin: 14px 0 0 !important;
    padding: 16px 16px 18px !important;
    border: 1px solid var(--mhf-line);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(20, 22, 26, .04);
  }
  .dt-tariff .dt-special .spectext { margin: 0 0 12px !important; }
  .dt-tariff .dt-special .spectext > svg { display: none !important; }
  .dt-tariff .dt-special .text_special { font-size: 14px; line-height: 1.4; color: var(--mhf-ink-2); }
  .dt-tariff .dt-special .text_special > *:first-child {
    margin: 0 0 4px !important;
    font-size: 16px !important;
    line-height: 1.25 !important;
    font-weight: 700 !important;
    color: var(--mhf-ink);
  }
  .dt-tariff .dt-special .getspecial {
    display: block;
    width: 100%;
    padding: 12px 16px;
    border: 1px solid var(--mhf-red);
    border-radius: 12px;
    background: #fff;
    font-family: inherit;
    font-size: 15px;
    font-weight: 600;
    color: var(--mhf-red);
  }
}

/* серый фон обрамляет только калькулятор и заканчивается сразу после кнопки расчёта */
@media (max-width: 1019px) {
  .dt-tariff .section--image {
    background: transparent !important;
    padding-top: 6px !important;
    padding-bottom: 18px !important;
  }
  .dt-tariff .tools.nofixedblock {
    padding: 14px !important;
    border-radius: 22px;
    background: var(--mhf-paper, #f7f6f3) !important;
  }
}

/* карточка калькулятора — той же ширины, что и остальные карточки на странице */
@media (max-width: 1019px) {
  .dt-tariff .tools .tabs__contents {
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: auto !important;
  }
}
@media (max-width: 1019px) {
  .dt-tariff .tools.nofixedblock { padding-left: 0 !important; padding-right: 0 !important; }
}

/* =============================================================
   FAQ на мобильных: карточки по ширине страницы, аккуратные
   отступы и разделители. Содержимое не меняется.
   ============================================================= */
@media (max-width: 1019px) {
  section.section .accord { padding-left: 0 !important; padding-right: 0 !important; }
  section.section .accordion__list { margin: 0; padding: 0; list-style: none; }

  section.section .accordion__item {
    margin: 0 0 8px !important;
    border: 1px solid var(--mhf-line) !important;
    border-radius: 14px !important;
    background: #fff;
    overflow: hidden;
  }
  section.section .accordion__item:last-child { margin-bottom: 0 !important; }

  section.section .accordion__toggle {
    width: 100%;
    padding: 14px 46px 14px 14px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    line-height: 1.35 !important;
    color: var(--mhf-ink);
    text-align: left;
  }
  section.section .accordion__body {
    padding: 0 14px 14px !important;
    font-size: 14.5px !important;
    line-height: 1.55 !important;
    color: var(--mhf-ink-2);
  }
  section.section .accordion__body p { margin: 0 0 8px; }
  section.section .accordion__body p:last-child { margin-bottom: 0; }
}

/* =============================================================
   Форма заявки на мобильных: компактная карточка + модальное окно.
   Сама форма и её поля не меняются — переносится тот же узел.
   ============================================================= */
.dt-lead, .dt-modal { display: none; }

@media (max-width: 1019px) {
  .dt-tariff .dt-lead-sec > .section__inner > .block > *:not(.dt-lead) { display: none !important; }
  .dt-tariff .dt-lead-sec #LR_form { display: none !important; }

  .dt-tariff .dt-lead {
    display: block;
    padding: 18px 16px 20px;
    border: 1px solid var(--mhf-line);
    border-radius: 18px;
    background: #fff;
  }
  .dt-tariff .dt-lead__t { font-size: 18px; font-weight: 700; line-height: 1.25; color: var(--mhf-ink); }
  .dt-tariff .dt-lead__s { margin: 6px 0 14px; font-size: 14px; line-height: 1.45; color: var(--mhf-ink-2); }
  .dt-tariff .dt-lead__btn {
    display: block;
    width: 100%;
    height: 50px;
    border: 0;
    border-radius: 14px;
    background: var(--mhf-red);
    color: #fff;
    font-family: inherit;
    font-size: 16px;
    font-weight: 700;
    box-shadow: 0 10px 24px -12px rgba(207, 34, 41, .6);
  }

  .dt-modal.is-open {
    display: -ms-flexbox;
    display: flex;
    position: fixed;
    z-index: 2147483002;
    left: 0; right: 0; top: 0; bottom: 0;
    -ms-flex-direction: column;
        flex-direction: column;
    -ms-flex-pack: end;
        justify-content: flex-end;
  }
  .dt-modal__backdrop {
    position: absolute;
    left: 0; right: 0; top: 0; bottom: 0;
    background: rgba(20, 22, 26, .5);
  }
  .dt-modal__panel {
    position: relative;
    max-height: 88vh;
    padding: 18px 16px calc(20px + env(safe-area-inset-bottom));
    border-radius: 20px 20px 0 0;
    background: #fff;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    -webkit-animation: dtSheetUp .26s cubic-bezier(.23, 1, .32, 1) both;
            animation: dtSheetUp .26s cubic-bezier(.23, 1, .32, 1) both;
  }
  .dt-modal__title { margin: 0 40px 14px 0; font-size: 18px; font-weight: 700; color: var(--mhf-ink); }
  .dt-modal__close {
    position: absolute;
    top: 10px; right: 10px;
    width: 36px; height: 36px;
    border: 0; border-radius: 50%;
    background: #f2f0ec;
    font-size: 22px; line-height: 1;
    color: var(--mhf-ink-2);
  }
  .dt-modal__body #LR_form { display: block !important; }
  html.dt-modal-open, html.dt-modal-open body { overflow: hidden; }
}

/* строка согласия в форме заявки: мелким и спокойным, ссылки без крика */
@media (max-width: 1019px) {
  .dt-modal .checkbox,
  .dt-modal label,
  section.section .dt-lead-sec .checkbox {
    font-size: 12.5px !important;
    line-height: 1.4 !important;
    color: var(--mhf-ink-3) !important;
  }
  .dt-modal label { display: -ms-flexbox; display: flex; -ms-flex-align: start; align-items: flex-start; }
  .dt-modal label input[type="checkbox"] {
    -ms-flex: 0 0 auto;
        flex: 0 0 auto;
    width: 18px;
    height: 18px;
    margin: 1px 9px 0 0;
    accent-color: #cf2229;
  }
  .dt-modal label a {
    color: var(--mhf-ink-2) !important;
    text-decoration: underline;
    text-underline-offset: 2px;
  }
  .dt-modal label svg { display: none !important; }
}
@media (max-width: 1019px) {
  .dt-modal__body a {
    color: var(--mhf-ink-2) !important;
    text-decoration: underline;
    text-underline-offset: 2px;
  }
}

/* блок «Нестандартный груз» объединён с формой заявки — отдельная плашка не нужна */
@media (max-width: 1019px) {
  .dt-tariff .dt-special { display: none !important; }
}

/* межблочные отступы на телефоне: 48px сверху и снизу давали разрыв почти в 100px */
@media (max-width: 1019px) {
  section.section:not(.dt-s-title):not(.section--image):not(.section_breadcrumbs) {
    padding-top: 24px !important;
    padding-bottom: 24px !important;
  }
}

/* ---------- тарифы: прайс-лист вместо таблицы «характеристика × вес» ---------- */
@media (max-width: 1019px) {
  /* штатные заголовки-аккордеоны заменяем своей строкой направлений */
  main.section .tabs__toggle { display: none !important; }
  main.section .tabs__content { display: none; }
  main.section .tabs__content.is-active { display: block; }

  .dt-kinds {
    display: flex;
    gap: 4px;
    padding: 4px;
    margin: 0 0 14px;
    background: var(--mhf-line-2);
    border-radius: 12px;
  }
  .dt-kinds__btn {
    flex: 1 1 0;
    padding: 9px 6px;
    border: 0;
    border-radius: 9px;
    background: transparent;
    font-family: inherit;
    font-size: 14px;
    line-height: 1.2;
    font-weight: 600;
    color: var(--mhf-ink-2);
    cursor: pointer;
  }
  .dt-kinds__btn.is-active {
    background: #fff;
    color: var(--mhf-red);
    box-shadow: 0 1px 3px rgba(0,0,0,.14);
  }
  .dt-kinds__intro { font-size: 13px; line-height: 1.5; }
  .dt-kinds__intro img { display: none; }

  .dt-dir {
    display: flex;
    gap: 6px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    margin: 0 0 12px;
  }
  .dt-dir::-webkit-scrollbar { display: none; }
  .dt-dir__btn {
    flex: 0 0 auto;
    max-width: 68%;
    padding: 7px 13px;
    border: 1px solid var(--mhf-line);
    border-radius: 999px;
    background: #fff;
    font-family: inherit;
    font-size: 12.5px;
    line-height: 1.25;
    color: var(--mhf-ink-2);
    text-align: left;
    cursor: pointer;
  }
  .dt-dir__btn.is-active {
    border-color: var(--mhf-red);
    background: var(--mhf-red);
    color: #fff;
  }

  .dt-pl { margin: 0; }
  .dt-pl__common {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 10px;
    padding: 11px 13px;
    margin: 0 0 12px;
    background: var(--mhf-paper);
    border-radius: 12px;
  }
  .dt-pl__common-l { font-size: 14px; color: var(--mhf-ink-2); }
  .dt-pl__common-v { font-size: 16px; font-weight: 700; color: var(--mhf-ink); white-space: nowrap; }
  .dt-pl__head {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    padding: 0 2px 7px;
    font-size: 11px;
    line-height: 1.2;
    letter-spacing: .03em;
    text-transform: uppercase;
    color: var(--mhf-ink-3);
  }
  .dt-pl__row {
    display: -ms-grid;
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: baseline;
    gap: 2px 12px;
    padding: 11px 2px;
    border-top: 1px solid var(--mhf-line-2);
  }
  .dt-pl__row:last-child { border-bottom: 1px solid var(--mhf-line-2); }
  .dt-pl__w { font-size: 16px; font-weight: 600; color: var(--mhf-ink); }
  .dt-pl__p {
    font-size: 19px;
    font-weight: 700;
    color: var(--mhf-ink);
    white-space: nowrap;
    text-align: right;
  }
  .dt-pl__meta {
    grid-column: 1 / -1;
    font-size: 12.5px;
    line-height: 1.35;
    color: var(--mhf-ink-3);
  }

  .dt-pl__cta {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 16px 0 4px;
  }
  .dt-pl__cta-btn {
    display: block;
    padding: 14px 16px;
    border: 1px solid var(--mhf-red);
    border-radius: 12px;
    font-family: inherit;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.2;
    text-align: center;
    text-decoration: none !important;
    cursor: pointer;
  }
  .dt-pl__cta-btn--main { background: var(--mhf-red); color: #fff; }
  .dt-pl__cta-btn--ghost { background: #fff; color: var(--mhf-red) !important; }

  .dt-pl__terms-btn {
    display: inline-block;
    padding: 0;
    margin: 6px 0 0;
    border: 0;
    background: none;
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    color: var(--mhf-red);
    cursor: pointer;
  }
  .dt-pl__terms-btn::after { content: " ↓"; }
  .dt-pl__terms-btn.is-open::after { content: " ↑"; }
  main.section .note ul.dt-pl__terms { display: none; }
  main.section .note ul.dt-pl__terms.is-open { display: block; margin-top: 8px; }
}

/* заголовки и кнопка выгрузки внутри блока тарифов */
@media (max-width: 1019px) {
  main.section h2,
  main.section .block__title,
  main.section .block__title h2 {
    text-transform: none !important;
    font-size: 21px !important;
    line-height: 1.22 !important;
  }
  main.section .block > .text,
  main.section .block > .text p,
  main.section .block > .text li {
    font-size: 15px;
    line-height: 1.55;
    color: var(--mhf-ink-2);
    text-align: left !important;
  }
  main.section .note .dt-pl__dl {
    display: inline-block;
    margin-top: 10px;
    padding: 10px 14px !important;
    background: #fff !important;
    border: 1px solid var(--mhf-line) !important;
    border-radius: 10px !important;
    font-size: 13px !important;
    font-weight: 600;
    color: var(--mhf-ink-2) !important;
    box-shadow: none !important;
  }
}

/* ---------- тарифы: воздух внутри карточки и явное направление ---------- */
@media (max-width: 1019px) {
  /* .prices тянулся отрицательными полями на всю ширину рамки — текст лип к границе */
  main.section .prices { margin-left: 0 !important; margin-right: 0 !important; }
  main.section .tabs__data { padding: 16px !important; }
  main.section .tabs__contents { border-radius: 14px; }
  main.section .note { padding: 0 !important; margin-top: 14px !important; }
  .dt-pl__row { padding-left: 0; padding-right: 0; }
  .dt-pl__head { padding-left: 0; padding-right: 0; }

  .dt-dir {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 12px;
    margin: 0 0 12px;
  }
  .dt-dir__cur {
    flex: 1 1 100%;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.25;
    color: var(--mhf-ink);
  }
  .dt-dir__swap {
    padding: 9px 14px;
    border: 1px solid var(--mhf-line);
    border-radius: 999px;
    background: #fff;
    font-family: inherit;
    font-size: 13px;
    line-height: 1.2;
    font-weight: 600;
    color: var(--mhf-red);
    cursor: pointer;
  }
  .dt-dir__swap::before { content: "⇄ "; }
}

/* срок доставки — шапка карточки, а не плашка со сдвигом внутрь */
@media (max-width: 1019px) {
  .dt-pl__common {
    margin: -16px -16px 12px !important;
    padding: 13px 16px !important;
    border-radius: 14px 14px 0 0 !important;
    border-bottom: 1px solid var(--mhf-line-2);
  }
}

/* подводка сборного тарифа на телефоне не нужна: тип перевозки уже назван переключателем.
   Скрываем, а не удаляем — в коде страницы текст остаётся и на ПК показывается как раньше. */
@media (max-width: 1019px) {
  .dt-kinds__intro { display: none !important; }
}

/* «машины на маршруте» рисуем стилями: в тексте страницы остаётся только число,
   как и в исходной таблице */
@media (max-width: 1019px) {
  .dt-pl__cars--one::after  { content: " машина на маршруте"; }
  .dt-pl__cars--few::after  { content: " машины на маршруте"; }
  .dt-pl__cars--many::after { content: " машин на маршруте"; }
}

/* хвост блока тарифов: на телефоне выгрузка прайса не нужна, а разрыв до блока заявки
   держался на padding-bottom 48px у <main class="section"> — наше правило 24px его не ловило,
   потому что селектор требовал тег <section> */
@media (max-width: 1019px) {
  main.section .dt-pl__dl { display: none !important; }
  main.section { padding-bottom: 16px !important; }
  .dt-lead-sec { padding-top: 16px !important; }
}

/* перебиваем общее правило межсекционных отступов — оно специфичнее из-за :not-цепочки */
@media (max-width: 1019px) {
  section.section.dt-lead-sec:not(.dt-s-title):not(.section--image):not(.section_breadcrumbs) {
    padding-top: 16px !important;
  }
}

/* направление в две строки: «из города» / «в город» */
@media (max-width: 1019px) {
  .dt-dir__from,
  .dt-dir__to { display: block; }
}

/* ---------- блок преимуществ (copmany-icons): вертикальные плитки → строки ---------- */
@media (max-width: 1019px) {
  .copmany-icons {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    gap: 10px;
  }
  .copmany-icons-item {
    display: grid;
    grid-template-columns: 46px 1fr;
    column-gap: 14px;
    align-items: start;
    margin: 0 !important;
    padding: 14px 15px;
    width: auto !important;
    background: #fff;
    border: 1px solid var(--mhf-line);
    border-radius: 14px;
    text-align: left !important;
  }
  .copmany-icons-item .icon {
    grid-column: 1;
    grid-row: 1 / span 2;
    width: 46px !important;
    height: 46px !important;
    min-width: 46px;
    margin: 0 !important;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center;
    border: 1px solid var(--mhf-line);
    border-radius: 50%;
  }
  .copmany-icons-item .icon img {
    width: 24px !important;
    height: 24px !important;
    margin: 0 !important;
    border-radius: 0 !important;
  }
  .copmany-icons-item .strong {
    grid-column: 2;
    margin: 0 0 3px !important;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.25;
    color: var(--mhf-ink);
    text-transform: none;
  }
  .copmany-icons-item p {
    grid-column: 2;
    margin: 0 !important;
    font-size: 14px;
    line-height: 1.45;
    color: var(--mhf-ink-2);
    text-align: left !important;
  }
}

/* ---------- галерея перевозок: свайп со «прилипанием», счётчик и прогресс ---------- */
@media (max-width: 1019px) {
  .dt-gal__strip {
    display: -ms-flexbox;
    display: flex;
    gap: 10px;
    margin: 0;
    padding: 0;
    list-style: none;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }
  .dt-gal__strip::-webkit-scrollbar { display: none; }
  .dt-gal__strip > li {
    -ms-flex: 0 0 100%;
        flex: 0 0 100%;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none;
    scroll-snap-align: center;
  }
  .dt-gal__strip a,
  .dt-gal__strip picture { display: block; }
  .dt-gal__strip img {
    display: block;
    width: 100% !important;
    height: 260px !important;
    max-width: 100% !important;
    margin: 0 !important;
    object-fit: cover;
    border-radius: 14px;
  }
  .dt-gal__bar {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    gap: 12px;
    margin-top: 12px;
  }
  .dt-gal__count {
    font-size: 13px;
    font-weight: 600;
    color: var(--mhf-ink-3);
    white-space: nowrap;
  }
  .dt-gal__prog {
    -ms-flex: 1 1 auto;
        flex: 1 1 auto;
    height: 3px;
    background: var(--mhf-line);
    border-radius: 2px;
    overflow: hidden;
  }
  .dt-gal__prog span {
    display: block;
    width: 10%;
    height: 100%;
    background: var(--mhf-red);
    border-radius: 2px;
    -webkit-transition: width .25s ease;
            transition: width .25s ease;
  }
}

/* xslider прячет все слайды кроме активного (opacity/visibility) — своей листалке нужны все */
@media (max-width: 1019px) {
  .dt-gal__strip > li,
  .dt-gal__strip > li a,
  .dt-gal__strip > li picture {
    opacity: 1 !important;
    visibility: visible !important;
    -webkit-transition: none !important;
            transition: none !important;
  }
}

/* последний кадр галереи — переход в «Кейсы» */
@media (max-width: 1019px) {
  .dt-gal__promo a {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    -ms-flex-pack: center;
        justify-content: center;
    height: 260px;
    padding: 22px 20px;
    border-radius: 14px;
    background: var(--mhf-ink);
    color: #fff !important;
    text-decoration: none !important;
  }
  .dt-gal__promo-t {
    font-size: 19px;
    font-weight: 700;
    line-height: 1.25;
  }
  .dt-gal__promo-s {
    margin: 8px 0 18px;
    font-size: 14px;
    line-height: 1.45;
    color: rgba(255,255,255,.72);
  }
  .dt-gal__promo-b {
    -ms-flex-item-align: start;
        align-self: flex-start;
    padding: 11px 18px;
    border-radius: 999px;
    background: var(--mhf-red);
    font-size: 15px;
    font-weight: 700;
  }
  .dt-gal__promo-b::after { content: " →"; }
}

/* просмотр фото (GLightbox): на сайте подложка переопределена на белую — на телефоне
   это полэкрана пустоты вокруг кадра. Возвращаем тёмный фон и убираем стрелки: листается свайпом */
@media (max-width: 1019px) {
  .goverlay { background: #0d0e10 !important; }
  .gslide-image img {
    width: auto !important;
    max-width: 100% !important;
    max-height: 78vh !important;
    border-radius: 8px;
  }
  .gclose.gbtn {
    width: 40px !important;
    height: 40px !important;
    background: rgba(255,255,255,.16) !important;
    border: 0 !important;
    border-radius: 50% !important;
    opacity: 1 !important;
    color: #fff !important;
  }
  .gclose.gbtn svg { width: 18px !important; height: 18px !important; fill: #fff !important; }
  .gclose.gbtn path { fill: #fff !important; }
  .gnext.gbtn, .gprev.gbtn { display: none !important; }
  .gslide-description { background: transparent !important; color: #fff !important; }
}

/* ---------- отзывы: лента со «прилипанием», компактная карточка ---------- */
@media (max-width: 1019px) {
  .dt-rev__list {
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    gap: 10px;
    padding-bottom: 2px !important;
  }
  .dt-rev__list::-webkit-scrollbar { display: none; }
  .dt-rev__list > .testimonials__item {
    -ms-flex: 0 0 88%;
        flex: 0 0 88%;
    width: 88% !important;
    max-width: 88% !important;
    margin: 0 !important;
    scroll-snap-align: center;
  }
  .dt-rev__list .testimonials__inner {
    height: 100%;
    padding: 15px 16px !important;
    border-radius: 14px;
  }

  /* шапка: компания в одну колонку на всю ширину, автор и дата — одной строкой под ней */
  .dt-rev__list .testimonials__header {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -ms-flex-align: baseline;
        align-items: baseline;
    gap: 2px 8px;
    margin-bottom: 10px !important;
  }
  .dt-rev__list .testimonials__title {
    -ms-flex-order: 1;
        order: 1;
    -ms-flex: 1 1 100%;
        flex: 1 1 100%;
    width: 100% !important;
    font-size: 15px;
    line-height: 1.25;
  }
  .dt-rev__list .testimonials__author {
    -ms-flex-order: 2;
        order: 2;
    font-size: 13px;
    color: var(--mhf-ink-2);
  }
  .dt-rev__list .testimonials__date {
    -ms-flex-order: 3;
        order: 3;
    font-size: 12px;
    color: var(--mhf-ink-3);
    width: auto !important;
    height: auto !important;
  }
  .dt-rev__list .testimonials__date::before { content: "· "; }
  .dt-rev__list .testimonials__author .icon { display: none; }

  .dt-rev__list .testimonials__body,
  .dt-rev__list .testimonials__body p {
    font-size: 14px !important;
    line-height: 1.5 !important;
    color: var(--mhf-ink-2);
  }
  .dt-rev__list .dt-rev__body {
    position: relative;
    max-height: 168px;
    overflow: hidden;
  }
  .dt-rev__list .dt-rev__body::after {
    content: "";
    position: absolute;
    left: 0; right: 0; bottom: 0;
    height: 54px;
    background: -webkit-linear-gradient(top, rgba(255,255,255,0), #fff 85%);
    background: linear-gradient(180deg, rgba(255,255,255,0), #fff 85%);
  }
  .dt-rev__list .dt-rev__body.is-open { max-height: none; }
  .dt-rev__list .dt-rev__body.is-open::after { display: none; }
  .dt-rev__more {
    margin-top: 8px;
    padding: 0;
    border: 0;
    background: none;
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    color: var(--mhf-red);
    cursor: pointer;
  }

  .dt-rev__links {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    gap: 8px;
    margin-top: 14px;
  }
  .dt-rev__links a {
    -ms-flex: 1 1 auto;
        flex: 1 1 auto;
    padding: 11px 14px;
    border: 1px solid var(--mhf-line);
    border-radius: 12px;
    background: #fff;
    font-size: 13.5px;
    font-weight: 600;
    line-height: 1.2;
    text-align: center;
    text-decoration: none !important;
    color: var(--mhf-ink) !important;
  }
  .dt-rev__links .dt-rev__add { color: var(--mhf-red) !important; border-color: var(--mhf-red); }
}

/* автор и дата — одной строкой (у сайта author растянут на всю ширину) */
@media (max-width: 1019px) {
  .dt-rev__list .testimonials__author {
    -ms-flex: 0 0 auto;
        flex: 0 0 auto;
    width: auto !important;
  }
  .dt-rev__sub {
    margin: -6px 0 14px;
    font-size: 14px;
    line-height: 1.45;
    color: var(--mhf-ink-2);
  }
}

/* «Читать полностью» на одной линии во всех карточках: заголовок держит высоту двух строк,
   кнопка прижимается к низу карточки */
@media (max-width: 1019px) {
  .dt-rev__list .testimonials__inner {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
  }
  .dt-rev__list .testimonials__title { min-height: 2.5em; }
  .dt-rev__list .dt-rev__more {
    margin-top: auto;
    padding-top: 8px;
    text-align: left;
  }
}

/* ---------- «Последние рейсы»: таблица → карточки ---------- */
@media (max-width: 1019px) {
  .dt-trips {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    gap: 8px;
  }
  .dt-trip {
    padding: 13px 14px;
    background: #fff;
    border: 1px solid var(--mhf-line);
    border-radius: 14px;
  }
  .dt-trip__head {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: start;
        align-items: flex-start;
    gap: 10px;
  }
  .dt-trip__dir {
    -ms-flex: 1 1 auto;
        flex: 1 1 auto;
    font-size: 14.5px;
    font-weight: 700;
    line-height: 1.3;
    color: var(--mhf-ink);
  }
  /* звёзды рисуем двумя слоями: серый фон и красная заливка по оценке */
  .dt-trip__stars {
    position: relative;
    -ms-flex: 0 0 auto;
        flex: 0 0 auto;
    width: 74px;
    height: 13px;
    margin-top: 3px;
    background-repeat: repeat-x;
    background-size: 14.8px 13px;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='13' viewBox='0 0 15 13'%3E%3Cpath d='M7.4 0l1.9 4h4.2l-3.4 2.7 1.3 4.3-4-2.6-4 2.6 1.3-4.3L1.3 4h4.2z' fill='%23dcdcdc'/%3E%3C/svg%3E");
  }
  .dt-trip__stars-on {
    position: absolute;
    left: 0; top: 0; bottom: 0;
    background-repeat: repeat-x;
    background-size: 14.8px 13px;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='13' viewBox='0 0 15 13'%3E%3Cpath d='M7.4 0l1.9 4h4.2l-3.4 2.7 1.3 4.3-4-2.6-4 2.6 1.3-4.3L1.3 4h4.2z' fill='%23cf2229'/%3E%3C/svg%3E");
  }
  .dt-trip__cargo {
    margin-top: 5px;
    font-size: 13px;
    line-height: 1.4;
    color: var(--mhf-ink-3);
  }
  .dt-trip__foot {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: baseline;
        align-items: baseline;
    -ms-flex-pack: justify;
        justify-content: space-between;
    gap: 12px;
    margin-top: 9px;
    padding-top: 9px;
    border-top: 1px solid var(--mhf-line-2);
  }
  .dt-trip__car {
    font-size: 13px;
    color: var(--mhf-ink-2);
  }
  .dt-trip__price {
    font-size: 17px;
    font-weight: 700;
    color: var(--mhf-ink);
    white-space: nowrap;
  }
}

/* карточка рейса: пометка обратного, подпись тарифа и переход в расчёт */
@media (max-width: 1019px) {
  .dt-trip__back {
    display: inline-block;
    margin-bottom: 7px;
    padding: 4px 9px;
    border-radius: 999px;
    background: var(--mhf-paper);
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: .02em;
    text-transform: uppercase;
    color: var(--mhf-ink-2);
  }
  .dt-trip__back::before { content: "⟲ "; }
  .dt-trip__cta-row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: justify;
        justify-content: space-between;
    gap: 10px;
    margin-top: 8px;
  }
  .dt-trip__tariff {
    font-size: 12px;
    line-height: 1.3;
    color: var(--mhf-ink-3);
  }
  .dt-trip__cta {
    -ms-flex: 0 0 auto;
        flex: 0 0 auto;
    padding: 9px 14px;
    border: 1px solid var(--mhf-red);
    border-radius: 999px;
    background: #fff;
    font-family: inherit;
    font-size: 13px;
    font-weight: 700;
    color: var(--mhf-red);
    cursor: pointer;
  }
  .dt-trip__cta::after { content: " →"; }
}

/* «Хочу так же» — ссылкой, без рамки: рамка добавляла карточке лишнюю строку */
@media (max-width: 1019px) {
  .dt-trip__cta-row { margin-top: 3px; }
  .dt-trip__cta {
    padding: 0 !important;
    border: 0 !important;
    background: none !important;
    font-size: 13px;
    line-height: 1.3;
  }
}

/* пометка обратного рейса: без иконки, со ссылкой на страницу обратного маршрута */
@media (max-width: 1019px) {
  .dt-trip__back::before { content: none; }
  .dt-trip__backline {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: justify;
        justify-content: space-between;
    gap: 10px;
    margin-bottom: 7px;
  }
  .dt-trip__back { margin-bottom: 0; }
  .dt-trip__backlink {
    font-size: 12.5px;
    font-weight: 600;
    color: var(--mhf-red) !important;
    text-decoration: none !important;
    white-space: nowrap;
  }
  .dt-trip__backlink::after { content: " →"; }

  /* рейсы лентой: один рейс на экране */
  .dt-trips--slider {
    -ms-flex-direction: row;
        flex-direction: row;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    padding-bottom: 2px;
  }
  .dt-trips--slider::-webkit-scrollbar { display: none; }
  .dt-trips--slider > .dt-trip {
    -ms-flex: 0 0 94%;
        flex: 0 0 94%;
    scroll-snap-align: center;
  }
  .dt-trips__bar { margin-top: 12px; }
}

/* штатная кнопка «Оставить отзыв» в блоке отзывов маршрута: на телефоне убираем,
   место для неё — страница /reviews/ (там её сейчас нет вовсе) */
@media (max-width: 1019px) {
  .dt-tariff .bnt_add { display: none !important; }
}

/* «Обратный рейс» — подпись без плашки: с фоном и внутренним отступом текст уезжал
   вправо от заголовка карточки, а разные кегли ломали общую базовую линию со ссылкой */
@media (max-width: 1019px) {
  .dt-trip__backline { -ms-flex-align: baseline; align-items: baseline; }
  .dt-trip__back {
    padding: 0 !important;
    background: none !important;
    border-radius: 0 !important;
    font-size: 12px;
    line-height: 1.3;
    letter-spacing: .04em;
    color: var(--mhf-ink-3);
  }
  .dt-trip__backlink { font-size: 12px; line-height: 1.3; }
}

/* Виды перевозки: иконки разной ширины разъезжались, заголовки стояли на разной вертикали */
@media (max-width: 1019px) {
  section.section .tabs.js-tabs:not(.tabs--plain) .tabs__toggle {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    gap: 12px;
    width: 100%;
    text-align: left;
  }
  section.section .tabs.js-tabs:not(.tabs--plain) .tabs__icon {
    -ms-flex: 0 0 34px;
        flex: 0 0 34px;
    width: 34px !important;
    max-width: 34px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
        justify-content: center;
    -ms-flex-align: center;
        align-items: center;
    margin: 0 !important;
  }
  section.section .tabs.js-tabs:not(.tabs--plain) .tabs__icon svg,
  section.section .tabs.js-tabs:not(.tabs--plain) .tabs__icon img {
    width: auto !important;
    max-width: 34px !important;
    max-height: 22px !important;
  }
  section.section .tabs.js-tabs:not(.tabs--plain) .tabs__title {
    -ms-flex: 1 1 auto;
        flex: 1 1 auto;
    font-size: 15px;
    line-height: 1.25;
  }
}

/* согласие на обработку ПД: 15–18px для служебной подписи слишком много */
@media (max-width: 1019px) {
  .checkbox label,
  .checkbox label a,
  .checkbox label span {
    font-size: 12.5px !important;
    line-height: 1.4 !important;
  }
  .checkbox label { color: var(--mhf-ink-3) !important; }
  .checkbox label a { color: var(--mhf-ink-2) !important; }
}

/* ---------- контакт-центр: филиалы маршрута отдельно, остальные под кнопкой ---------- */
@media (max-width: 1019px) {
  .dt-fil { margin-top: 4px; }
  .dt-fil__card {
    padding: 12px 14px;
    margin-bottom: 8px;
    background: #fff;
    border: 1px solid var(--mhf-line);
    border-radius: 12px;
  }
  .dt-fil__city {
    margin-bottom: 4px;
    font-size: 15px;
    font-weight: 700;
    color: var(--mhf-ink);
  }
  .dt-fil__line {
    font-size: 14px;
    line-height: 1.45;
    color: var(--mhf-ink-2);
  }
  .dt-fil__line a { color: var(--mhf-ink-2) !important; }
  .dt-fil__line a[href^="tel:"] {
    font-weight: 700;
    color: var(--mhf-red) !important;
    text-decoration: none !important;
  }
  .dt-fil__more {
    display: block;
    width: 100%;
    padding: 11px 14px;
    border: 1px solid var(--mhf-line);
    border-radius: 12px;
    background: #fff;
    font-family: inherit;
    font-size: 13px;
    line-height: 1.35;
    text-align: left;
    color: var(--mhf-ink-2);
    cursor: pointer;
  }
  .dt-fil__more::after { content: " ↓"; color: var(--mhf-red); font-weight: 700; }
  .dt-fil__more.is-open::after { content: " ↑"; }
  .dt-fil__rest { display: none; }
  .dt-fil__rest.is-open { display: block; margin-top: 8px; }
}

/* ---------- «Какие грузы мы перевозим»: теги вместо списка в столбик ---------- */
@media (max-width: 1019px) {
  .results__title {
    text-transform: none !important;
    font-size: 16px !important;
    line-height: 1.25 !important;
  }
  .results__item { padding: 14px 15px !important; }
  .dt-cargo__lead {
    margin: 0 0 12px;
    font-size: 14px;
    line-height: 1.5;
    color: var(--mhf-ink-2);
  }
  .dt-cargo__lead p { margin: 0 0 8px; font-size: 14px; line-height: 1.5; }
  .dt-cargo__lead p:last-child { margin-bottom: 0; }
  .dt-cargo__tags {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    gap: 6px;
  }
  .dt-cargo__tag {
    display: inline-block;
    padding: 6px 11px;
    border: 1px solid var(--mhf-line);
    border-radius: 999px;
    background: #fff;
    font-size: 13px;
    line-height: 1.3;
    color: var(--mhf-ink-2);
  }
  .dt-cargo__tag--tail {
    border-style: dashed;
    color: var(--mhf-ink-3);
  }
  /* ограничения оставляем списком — их читают, но кегль и отступы сжимаем */
  .results__item--warning .results__features-item {
    font-size: 13.5px !important;
    line-height: 1.4 !important;
    margin-bottom: 7px !important;
  }
  .results__item--warning .results__body p { font-size: 14px !important; }
}

/* .results__data — flex-строка: лид и теги вставали двумя узкими колонками */
@media (max-width: 1019px) {
  .results__item--success .results__data,
  .results__item--warning .results__data {
    display: block !important;
    width: 100% !important;
  }
  .dt-cargo__lead, .dt-cargo__tags { width: 100% !important; }
}

@media (max-width: 1019px) {
  .dt-cargo__tag { padding: 5px 10px; font-size: 12.5px; }
}

/* рамки блоков «возим / не возим» съедали по 30 px ширины с каждой стороны —
   на телефоне важнее, чтобы теги паковались по два в строку */
@media (max-width: 1019px) {
  .results__item,
  .results__item--success,
  .results__item--warning {
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
  }
  .results__list { margin: 0 !important; padding: 0 !important; }
  .results__item + .results__item {
    margin-top: 20px !important;
    padding-top: 16px !important;
    border-top: 1px solid var(--mhf-line) !important;
  }
  .results__header { margin-bottom: 10px !important; }
  .results__item--warning .results__title { color: var(--mhf-red) !important; }
}

@media (max-width: 1019px) {
  .dt-cargo__tag { padding: 5px 9px; font-size: 11.5px; }
  .dt-cargo__tags { gap: 5px; }
}

/* рамки рисуют .results__header и .results__content, а не сам .results__item */
@media (max-width: 1019px) {
  .results__header,
  .results__content {
    border: 0 !important;
    border-radius: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    background: transparent !important;
  }
  .results__header { padding: 0 0 8px !important; }
  .results__content { padding-top: 0 !important; padding-bottom: 0 !important; }
}

/* ---------- контакт-центр: телефон кнопкой, каналы связи плитками ---------- */
@media (max-width: 1019px) {
  .contact_centr .zag_filiali span {
    font-size: 14px !important;
    font-weight: 700;
    text-transform: none !important;
    color: var(--mhf-ink);
  }
  .contact_centr__mobile { display: block !important; margin-bottom: 18px; }
  .dt-cc__call {
    display: block;
    padding: 15px 16px;
    border-radius: 14px;
    background: var(--mhf-red);
    font-size: 19px;
    font-weight: 700;
    line-height: 1.1;
    text-align: center;
    text-decoration: none !important;
    color: #fff !important;
  }
  .dt-cc__note {
    margin-top: 7px;
    font-size: 12.5px;
    text-align: center;
    color: var(--mhf-ink-3);
  }

  .contact_centr__socials { display: block !important; }
  .contact_centr__socials__links ul {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin: 10px 0 0 !important;
    padding: 0 !important;
    list-style: none;
  }
  .contact_centr__socials__links li { margin: 0 !important; }
  .dt-cc__tile {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    gap: 9px;
    height: 100%;
    padding: 12px;
    border: 1px solid var(--mhf-line);
    border-radius: 12px;
    background: #fff;
    font-size: 13.5px;
    line-height: 1.25;
    text-decoration: none !important;
    color: var(--mhf-ink) !important;
    word-break: break-word;
  }
  .dt-cc__tile img {
    -ms-flex: 0 0 22px;
        flex: 0 0 22px;
    width: 22px !important;
    height: 22px !important;
    margin: 0 !important;
  }
  .dt-cc__mail-ic {
    -ms-flex: 0 0 22px;
        flex: 0 0 22px;
    width: 22px;
    height: 22px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 22px 22px;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23cf2229' stroke-width='1.8'%3E%3Crect x='2.5' y='5' width='19' height='14' rx='2.5'/%3E%3Cpath d='M3 7l9 6 9-6'/%3E%3C/svg%3E");
  }
}

@media (max-width: 1019px) {
  /* заголовок секции контактов — без капса, как остальные */
  .contact_centr__title,
  .contact-centr .block__title,
  section.section .block__title.title { text-transform: none !important; }
  /* плитки в строке одной высоты */
  .contact_centr__socials__links li { display: flex; }
  .contact_centr__socials__links li > a { width: 100%; }
}

@media (max-width: 1019px) {
  .contact_centr__socials__links ul { grid-auto-rows: 1fr; align-items: stretch; }
  .contact_centr__socials__links li > a { height: 100%; }
  .zag_con_center { font-size: 19px !important; line-height: 1.25 !important; }
}

/* адрес почты не должен разрываться на две строки */
@media (max-width: 1019px) {
  .dt-cc__tile--mail {
    white-space: nowrap;
    font-size: 12.5px;
    padding-left: 10px;
    padding-right: 10px;
  }
  .dt-cc__tile--mail .dt-cc__mail-ic { flex: 0 0 20px; width: 20px; height: 20px; background-size: 20px 20px; }
}

/* ---------- благодарственные письма ---------- */
@media (max-width: 1019px) {
  .dt-th__sub {
    margin: -4px 0 12px;
    font-size: 13.5px;
    line-height: 1.45;
    color: var(--mhf-ink-3);
  }
  .dt-th__strip {
    display: -ms-flexbox;
    display: flex;
    gap: 10px;
    margin: 0;
    padding: 0 0 6px;
    list-style: none;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }
  .dt-th__strip::-webkit-scrollbar { display: none; }
  .dt-th__strip > li {
    -ms-flex: 0 0 47%;
        flex: 0 0 47%;
    width: 47% !important;
    max-width: 47% !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none;
    scroll-snap-align: center;
    opacity: 1 !important;
    visibility: visible !important;
  }
  .dt-th__strip a { display: block; }
  .dt-th__strip picture { display: block; }
  /* показываем верх листа: шапка бланка и заголовок письма */
  .dt-th__strip img {
    display: block;
    width: 100% !important;
    height: 210px !important;
    max-width: 100% !important;
    margin: 0 !important;
    object-fit: cover;
    object-position: top center;
    border: 1px solid var(--mhf-line);
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 6px 16px -12px rgba(0,0,0,.5);
  }
  .dt-thanks__name {
    margin-top: 7px;
    font-size: 12px;
    line-height: 1.3;
    color: var(--mhf-ink-2);
  }
  /* «стопка»: у последней карточки слои позади — видно, что письма не кончаются */
  .dt-th__strip > li:last-child { position: relative; }
  .dt-th__strip > li:last-child::after {
    content: "";
    position: absolute;
    top: 6px; right: -8px; bottom: 24px; width: 8px;
    border: 1px solid var(--mhf-line);
    border-left: 0;
    border-radius: 0 8px 8px 0;
    background: #fff;
  }
}

@media (max-width: 1019px) {
  /* штатные стрелки слайдера не нужны — лента листается свайпом */
  .dt-thanks .xslider__arrow,
  .dt-thanks [class*="xslider__arrow"] { display: none !important; }
}

/* письма показываем целиком, в своих пропорциях — обрезка искажала лист */
@media (max-width: 1019px) {
  .dt-th__strip img {
    height: auto !important;
    object-fit: fill;
  }
  .dt-thanks__name { display: none !important; }
}

/* Переездные направления: заголовок как на грузовых. Там секцию с H1 скрипт выносит
   из main, и она попадает под правило 26px; здесь H1 остаётся внутри main.section,
   где действует правило 21px — выравниваем явно. */
@media (max-width: 1019px) {
  .dt-pereezd main.section { padding-top: 12px !important; }
  .dt-pereezd main.section .block__title,
  .dt-pereezd main.section h1.block__title {
    font-size: 26px !important;
    line-height: 1.18 !important;
    margin-bottom: 8px !important;
  }
}

/* «Выберите решение» на телефоне: в основных стилях у списка min-width:1000px,
   из-за чего блок уезжал за экран и его не было видно. Ставим карточки столбиком. */
@media (max-width: 1019px) {
  .achievements.decisions { overflow-x: visible !important; padding: 0 !important; }
  /* стрелка старой карусели: список решений теперь колонка, её сдвиг margin-left уводит карточки за экран.
     На ПК кнопка и так display:none — приводим телефон к тому же виду. */
  .narrow_to { display: none !important; }

  /* «Выберите решение»: убираем внешнюю рамку блока — карточки получают всю ширину экрана,
     текст переносится реже и блок становится ниже. Селектор по id блока — основной,
     :has() ниже подстрахует, если блок пересоберут. */
  #block-49299 > .box-shadow:first-of-type { padding: 0 !important; box-shadow: none !important; background: transparent !important; }
  .box-shadow:has(> .achievements.decisions) { padding: 0 !important; box-shadow: none !important; background: transparent !important; }

  /* «Актуально сейчас»: та же история — внешняя рамка не нужна, текст занимает всю ширину.
     Тяжёлую тень внутренней плашки меняем на тонкую рамку, текст выравниваем по левому краю. */
  #block-49299 > .box-shadow:last-of-type { padding: 0 !important; box-shadow: none !important; background: transparent !important; }
  .box-shadow:has(> .act_text) { padding: 0 !important; box-shadow: none !important; background: transparent !important; }
  .box-shadow.dt-noframe { padding: 0 !important; box-shadow: none !important; background: transparent !important; }

  /* FAQ: контейнер аккордеона держал отступ 18px, из-за него плашки были уже остального контента.
     Тени меняем на рамку — как у прочих мобильных карточек. */
  .accord { padding: 0 !important; }
  .accordion__list { margin: 0 !important; padding: 0 !important; list-style: none !important; }
  .accordion__item {
    margin: 0 0 8px !important;
    box-shadow: none !important;
    border: 1px solid var(--mhf-line, #e6e3dd) !important;
    border-radius: 12px !important;
    overflow: hidden;
  }
  /* компактнее: узкие поля и меньшая стрелка дают строке ~10px ширины,
     часть вопросов после этого умещается в одну строку */
  .accordion__toggle { padding: 11px 34px 11px 14px !important; }
  .accordion__toggle::before { right: 16px !important; width: 9px !important; height: 9px !important; }
  .accordion__title { font-size: 14px !important; line-height: 1.3 !important; }

  /* Раскрытый вопрос выделяем: красная рамка, светлая подложка у строки вопроса,
     красный жирный заголовок и развёрнутая вверх стрелка.
     Скрипт сайта вешает active_tab на пункт и active на кнопку — на них и опираемся. */
  .accordion__item.active_tab {
    border-color: var(--mhf-red, #cf2229) !important;
    box-shadow: 0 2px 12px rgba(207, 34, 41, .10) !important;
  }
  .accordion__item.active_tab .accordion__toggle,
  .accordion__toggle.active { background: #fdf4f4 !important; color: var(--mhf-red, #cf2229) !important; }
  .accordion__item.active_tab .accordion__title { color: var(--mhf-red, #cf2229) !important; font-weight: 700 !important; }
  .accordion__item.active_tab .panel,
  .accordion__item.active_tab .accordion__body { border-top: 1px solid var(--mhf-line, #e6e3dd) !important; padding-top: 12px !important; }
  /* стрелка вниз → вверх */
  .accordion__toggle.active::before,
  .accordion__item.active_tab .accordion__toggle::before {
    transform: rotate(-135deg) !important;
    top: calc(50% - 3px) !important;
  }
  .accordion__body.text, .accordion__item .panel { padding-left: 14px !important; padding-right: 14px !important; }
  .accordion__body.text, .accordion__item .panel { padding-bottom: 12px !important; }
  .act_text {
    margin-top: 12px !important;
    padding: 16px !important;
    box-shadow: none !important;
    border: 1px solid var(--mhf-line, #e6e3dd) !important;
    border-radius: 14px !important;
    text-align: left !important;
  }
  .act_text p { text-align: left !important; }
  .decisions__list { min-width: 0 !important; display: flex !important; flex-direction: column !important; gap: 14px; }
  .decisions__list .decision__item { width: 100% !important; max-width: 100% !important; margin: 0 !important; }
  /* Иконки в красном круге на телефоне не несут смысла и съедают высоту — убираем.
     Тяжёлая тень карточек (24px размытия) между плитками читалась как серая полоса —
     меняем на тонкую рамку, как у остальных мобильных карточек. */
  .decisions__list .decision__item .achievements__image { display: none !important; }
  .decisions__list .decision__item {
    box-shadow: none !important;
    border: 1px solid var(--mhf-line, #e6e3dd) !important;
    border-radius: 14px !important;
  }

  /* Аккордеон в «Выберите решение»: свёрнутая плитка показывает только заголовок */
  .dt-dacc .decision__item:not(.is-open) { padding: 14px 16px !important; gap: 0 !important; }
  .dt-dacc .decision__item:not(.is-open) .achievements__image,
  .dt-dacc .decision__item:not(.is-open) .achievements__body,
  .dt-dacc .decision__item:not(.is-open) .achievements__button { display: none !important; }
  .dt-dacc .decisions_name { position: relative; padding-right: 30px; cursor: pointer; }
  .dt-dacc .decision__item:not(.is-open) .decisions_name { margin: 0 !important; }
  .dt-dacc .decisions_name::after {
    content: ""; position: absolute; right: 8px; top: 50%;
    width: 9px; height: 9px; border-right: 2px solid var(--mhf-red, #cf2229); border-bottom: 2px solid var(--mhf-red, #cf2229);
    transform: translateY(-70%) rotate(45deg); transition: transform .2s ease;
  }
  .dt-dacc .decision__item.is-open .decisions_name::after { transform: translateY(-30%) rotate(-135deg); }
}


/* ---------- FAQ на ПК: капс и 18px делали блок громоздким ----------
   Файл подключается на всех устройствах, поэтому десктопные правила держим здесь же,
   в явной выборке min-width:1020px. Разметка и скрипты не меняются. */
@media (min-width: 1020px) {
  .accordion__list {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
    align-items: start;
    margin: 0;
    padding: 0;
    list-style: none;
  }
  .accordion__item {
    margin: 0 !important;
    background: #fff;
    border: 1px solid #e6e3dd;
    border-radius: 12px;
    box-shadow: none;
    overflow: hidden;
  }
  .accordion__toggle { padding: 13px 44px 13px 18px; }
  .accordion__title { font-size: 16px; line-height: 1.35; text-transform: none; }
  .accordion__toggle::before { right: 18px; width: 10px; height: 10px; }
  .accordion__body.text, .accordion__item .panel { padding: 0 18px 14px; font-size: 15px; line-height: 1.55; }

  /* раскрытый вопрос выделяем так же, как на телефоне */
  .accordion__item.active_tab { border-color: #cf2229; box-shadow: 0 2px 12px rgba(207, 34, 41, .10); }
  .accordion__item.active_tab .accordion__toggle,
  .accordion__toggle.active { background: #fdf4f4; color: #cf2229; }
  .accordion__item.active_tab .accordion__title { color: #cf2229; }
  .accordion__item.active_tab .panel,
  .accordion__item.active_tab .accordion__body { border-top: 1px solid #e6e3dd; padding-top: 12px; }
  .accordion__toggle.active::before,
  .accordion__item.active_tab .accordion__toggle::before { transform: rotate(-135deg); top: calc(50% - 3px); }
}


/* ---------- Аккордеон: фокус после клика оставлял свёрнутый вопрос красным ----------
   В cssmain.css стоит `.accordion__toggle:focus, :hover { color: #d51218 }`. Кнопка после
   тапа сохраняет фокус, поэтому подсветка не сбрасывалась. Красный оставляем только
   раскрытому пункту (класс active) и наведению мышью; для клавиатуры — обводка. */
.accordion__toggle:focus:not(.active),
.accordion__toggle:focus:not(.active) .accordion__title { color: #15171b; }
@media (hover: none) {
  .accordion__toggle:hover:not(.active),
  .accordion__toggle:hover:not(.active) .accordion__title { color: #15171b; }
}
.accordion__toggle:focus-visible { outline: 2px solid #cf2229; outline-offset: 2px; }
