/* ============================================================
   Dusha — страница /transfer/
   Шапка type_dusha (sticky transparent → blur при скролле) уже
   подключается глобально через type_dusha/header.php. Здесь
   — стили самой страницы: hero + 6 секций + модалка + mobile-bar.
   Класс-обёртка: <div class="dusha-page"> (как в food.detail).
   ============================================================ */

.dusha-page { background: #fff; }
.dusha-page, .dusha-page * { box-sizing: border-box; }
.dusha-page a { text-decoration: none; }

/* Сброс шаблонных Bitrix-контейнеров для страниц с .dusha-page обёрткой.
   Используем :has() вместо body-class — стили применяются ДО первого рендера, без flicker. */
.page_content_container:has(.dusha-page),
.container_page:has(.dusha-page),
.content_container:has(> .dusha-page) {
  max-width: none !important;
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}
body:has(.dusha-page) .container_page > .content_container > .bx-breadcrumb,
body:has(.dusha-page) .container_page .content_container > h1.styled,
body:has(.dusha-page) .air.p50,
body:has(.dusha-page) .container_page > .air,
body:has(.dusha-page) main + .air { display: none !important; }
/* Шаблонный футер по дефолту position:absolute (резерв через padding-bottom у .container_page);
   мы padding-bottom обнулили — переключаем футер в обычный flow. */
body:has(.dusha-page) .sk-footer { position: static !important; bottom: auto !important; top: auto !important; }
.dusha-page { overflow-x: visible; margin-bottom: 0 !important; }
.dusha-page .tr-cta { margin-bottom: 0 !important; }

/* full-bleed helper (выход за родительский max-width Bitrix-main) */
.dusha-page .dd-bleed { position: relative; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); width: 100vw; }

/* ============ HERO (.dd-hero) ============ */
.dusha-page .dd-hero {
  position: relative; min-height: 80vh;
  margin: 0 calc(50% - 50vw); width: 100vw;
  background: center/cover no-repeat;
  /* Картинка передаётся через CSS-переменную из transfer/index.php (значение из инфоблока) */
  background-image: var(--hero-bg-desktop, url('/bitrix/images/apart/soul-konig/transfer-hero.webp'));
  color: #fff; overflow: hidden;
}
.dusha-page .dd-hero__overlay {
  position: absolute; inset: 0;
  background: linear-gradient(rgba(15,40,60,0.30) 0%, rgba(15,40,60,0.55) 60%, rgba(15,40,60,0.85) 100%);
}

/* Встроенная волна в нижней части hero — как на /catalog/ (.dusha-catalog__hero-wave) */
.dusha-page .dd-hero__wave {
  position: absolute; left: 0; right: 0; bottom: -1px;
  height: 60px; line-height: 0; pointer-events: none;
  z-index: 1; overflow: hidden;
}
.dusha-page .dd-hero__wave svg {
  position: absolute; left: 0; top: 0;
  display: block; width: 200%; height: 60px;
}
.dusha-page .dd-hero__wave .wave-back  { animation: dushaWaveSlide 14s linear infinite reverse; opacity: 0.7; }
.dusha-page .dd-hero__wave .wave-mid   { animation: dushaWaveSlide 18s linear infinite; }
.dusha-page .dd-hero__wave .wave-front { animation: dushaWaveSlide 11s linear infinite; opacity: 0.55; }
@keyframes dushaWaveSlide { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (max-width: 768px) {
  .dusha-page .dd-hero__wave, .dusha-page .dd-hero__wave svg { height: 44px; }
}
.dusha-page .dd-hero__inner {
  position: relative; max-width: var(--max-content); margin: 0 auto;
  padding: 160px var(--side-margin) 110px;
}
.dusha-page .dd-hero__overline {
  display: inline-block;
  font-size: 11px; font-weight: 700;
  letter-spacing: var(--ls-caps); text-transform: uppercase;
  color: var(--amber-200);
  margin-bottom: 22px;
  padding: 5px 14px;
  background: rgba(245,124,24,0.22);
  border-radius: var(--radius-pill);
  border: 1px solid rgba(255,180,97,0.35);
}
.dusha-page .dd-hero__title {
  font-family: var(--font-display); font-weight: 600;
  font-size: clamp(40px, 7vw, 68px); line-height: var(--lh-tight);
  letter-spacing: var(--ls-tight); color: #fff;
  text-shadow: 0 2px 24px rgba(15,40,60,0.4);
  margin: 0 0 22px; max-width: 820px;
}
.dusha-page .dd-hero__title .accent { color: var(--amber-300); }
.dusha-page .dd-hero__lead {
  font-size: 18px; line-height: 1.5;
  color: rgba(255,255,255,0.92);
  max-width: 620px; margin: 0 0 30px;
}
.dusha-page .dd-hero__meta {
  display: flex; gap: 12px; flex-wrap: wrap; margin: 0 0 34px;
}
.dusha-page .dd-hero__meta-chip {
  display: inline-flex; align-items: center; gap: 8px;
  background: rgba(255,255,255,0.15); backdrop-filter: blur(12px);
  padding: 8px 16px; border-radius: var(--radius-pill);
  font-size: 14px; font-weight: 500; color: #fff;
  border: 1px solid rgba(255,255,255,0.18);
}
.dusha-page .dd-hero__meta-chip svg { width: 16px; height: 16px; }
.dusha-page .dd-hero__cta { display: flex; gap: 12px; flex-wrap: wrap; }

/* кнопки в hero — pill-форма, белый текст для primary */
.dusha-page .btn { display: inline-flex; align-items: center; gap: 8px; flex: 0 0 auto; max-width: max-content; cursor: pointer; }
.dusha-page .dd-hero__cta .btn { color: #fff; }
.dusha-page .dd-hero__cta .btn.btn-white { color: var(--sky-900); }
.dusha-page .btn-primary { background: var(--amber-500); color: #fff; box-shadow: 0 2px 10px rgba(245,124,24,0.28); border-radius: var(--radius-pill); border: 0; }
.dusha-page .btn-primary:hover { background: var(--amber-600); }
.dusha-page .btn-white { background: #fff; color: var(--sky-900); border-radius: var(--radius-pill); box-shadow: var(--shadow-soft); border: 0; }
.dusha-page .btn-white:hover { background: var(--sky-50); }
.dusha-page .btn-ghost { background: transparent; color: var(--sky-700); border: 1.5px solid var(--sky-600); border-radius: var(--radius-pill); }
.dusha-page .btn-ghost:hover { background: var(--sky-50); }
/* Sky-700 (#175E82) — для «Смотреть маршруты» и «Заказать» в карточках. Перебиваем стили шаблона. */
.dusha-page .btn-secondary {
  background: var(--sky-700) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: var(--radius-pill) !important;
  box-shadow: 0 2px 10px rgba(23, 94, 130, 0.25);
}
.dusha-page .btn-secondary:hover { background: var(--sky-800) !important; }

/* ============ TRUST STRIP (.tr-trust) ============ */
.dusha-page .tr-trust {
  background: var(--sand-50);
  border-top: 1px solid var(--sand-200);
  border-bottom: 1px solid var(--sand-200);
}
.dusha-page .tr-trust__grid {
  max-width: var(--max-content); margin: 0 auto;
  padding: 28px var(--side-margin);
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 32px;
}
.dusha-page .tr-trust__item { display: flex; gap: 14px; align-items: flex-start; }
.dusha-page .tr-trust__icon {
  flex-shrink: 0; width: 44px; height: 44px; border-radius: var(--radius-md);
  background: var(--amber-50); color: var(--amber-600);
  display: grid; place-items: center;
}
.dusha-page .tr-trust__icon svg { width: 22px; height: 22px; }
.dusha-page .tr-trust__title { font-family: var(--font-display); font-weight: 600; font-size: 15px; color: var(--sky-900); margin-bottom: 2px; letter-spacing: var(--ls-snug); }
.dusha-page .tr-trust__sub { font-size: 13px; color: var(--ink-500); line-height: 1.4; }

/* ============ SECTION HEADERS (общие для tr-why/routes/howto/faq) ============ */
.dusha-page .tr-section { padding: 80px 0; }
.dusha-page .tr-section--sand { background: var(--sand-50); }
.dusha-page .tr-section--sky  { background: var(--sky-50); }
.dusha-page .tr-section__head { max-width: 720px; margin: 0 auto 40px; padding: 0 var(--side-margin); text-align: center; }
.dusha-page .tr-section__overline { font-family: var(--font-body); font-size: 12px; font-weight: 600; letter-spacing: var(--ls-caps); text-transform: uppercase; color: var(--amber-700); display: block; margin-bottom: 10px; }
.dusha-page .tr-section__title {
  font-family: var(--font-display); font-weight: 600;
  font-size: clamp(28px, 4vw, 40px); line-height: var(--lh-snug);
  letter-spacing: var(--ls-tight); color: var(--sky-900);
  margin: 0 0 14px;
}
.dusha-page .tr-section__lead { font-size: 16px; color: var(--ink-500); line-height: 1.55; }

/* ============ ПОЧЕМУ МЫ (.tr-why) — 4 карточки CategoryTile ============ */
.dusha-page .tr-why__grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px;
  max-width: var(--max-content); margin: 0 auto;
  padding: 0 var(--side-margin);
}
.dusha-page .tr-why__card {
  background: #fff; border: 1px solid var(--ink-100);
  border-radius: var(--radius-lg); padding: 28px 24px;
  transition: all var(--dur-med) var(--ease-out-soft);
}
.dusha-page .tr-why__card:hover {
  background: var(--sky-50);
  transform: translateY(-3px);
  box-shadow: var(--shadow-lift);
  border-color: var(--sky-200);
}
.dusha-page .tr-why__icon {
  width: 52px; height: 52px; border-radius: var(--radius-md);
  background: var(--amber-100); color: var(--amber-600);
  display: grid; place-items: center; margin-bottom: 18px;
}
.dusha-page .tr-why__card:nth-child(2) .tr-why__icon,
.dusha-page .tr-why__card:nth-child(4) .tr-why__icon {
  background: var(--sky-100); color: var(--sky-700);
}
.dusha-page .tr-why__icon svg { width: 26px; height: 26px; }
.dusha-page .tr-why__title {
  font-family: var(--font-display); font-weight: 600; font-size: 20px;
  color: var(--sky-900); letter-spacing: var(--ls-snug); margin-bottom: 8px;
}
.dusha-page .tr-why__text { font-size: 14px; color: var(--ink-500); line-height: 1.55; }

/* ============ МАРШРУТЫ (.tr-routes) ============ */
.dusha-page .tr-routes__grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px;
  max-width: var(--max-content); margin: 0 auto;
  padding: 0 var(--side-margin);
}
.dusha-page .tr-route {
  background: #fff; border-radius: var(--radius-lg); overflow: hidden;
  box-shadow: var(--shadow-soft);
  transition: all var(--dur-med) var(--ease-out-soft);
  display: flex; flex-direction: column;
}
.dusha-page .tr-route:hover { transform: translateY(-3px); box-shadow: var(--shadow-lift); }
.dusha-page .tr-route__media {
  position: relative; aspect-ratio: 4/3; overflow: hidden;
  background: var(--sand-100) center/cover no-repeat;
}
.dusha-page .tr-route__media img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--dur-slow) var(--ease-out-soft); }
.dusha-page .tr-route:hover .tr-route__media img { transform: scale(1.04); }
.dusha-page .tr-route__media::after {
  content: ''; position: absolute; inset: 0;
  background: var(--gradient-protect-bottom);
  pointer-events: none;
}
.dusha-page .tr-route__badge {
  position: absolute; top: 14px; left: 14px; z-index: 2;
  background: var(--amber-500); color: #fff;
  padding: 4px 12px; border-radius: var(--radius-pill);
  font-size: 11px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase;
}
.dusha-page .tr-route__body { padding: 18px 22px 22px; display: flex; flex-direction: column; flex: 1; gap: 10px; }
.dusha-page .tr-route__title { font-family: var(--font-display); font-weight: 600; font-size: 22px; color: var(--sky-900); letter-spacing: var(--ls-snug); }
.dusha-page .tr-route__meta { display: flex; align-items: center; gap: 8px; font-size: 13.5px; color: var(--ink-500); }
.dusha-page .tr-route__meta svg { width: 14px; height: 14px; color: var(--amber-500); flex-shrink: 0; }
.dusha-page .tr-route__cta { margin-top: auto; padding-top: 6px; }
.dusha-page .tr-route__cta .btn { width: 100%; justify-content: center; padding: 11px 18px; font-size: 14px; font-weight: 600; }

/* «Любая точка области» — тёмная sky-900 карточка */
.dusha-page .tr-route--dark { background: var(--sky-900); color: #fff; padding: 28px 24px; justify-content: center; align-items: center; text-align: center; gap: 0; }
.dusha-page .tr-route--dark .tr-route__icon {
  width: 56px; height: 56px; border-radius: 50%;
  background: rgba(245,124,24,0.18); color: var(--amber-400);
  display: grid; place-items: center; margin: 0 auto 18px;
}
.dusha-page .tr-route--dark .tr-route__icon svg { width: 28px; height: 28px; }
.dusha-page .tr-route--dark .tr-route__title { color: #fff; margin-bottom: 8px; }
.dusha-page .tr-route--dark .tr-route__text { font-size: 13.5px; color: rgba(255,255,255,0.75); line-height: 1.5; margin-bottom: 18px; max-width: 240px; }
.dusha-page .tr-route--dark .tr-route__cta { width: 100%; padding-top: 0; }

/* ============ КАК ЭТО РАБОТАЕТ (.tr-howto) ============ */
.dusha-page .tr-howto__grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px;
  max-width: 980px; margin: 0 auto;
  padding: 0 var(--side-margin);
  position: relative;
}
.dusha-page .tr-howto__grid::before {
  content: ""; position: absolute;
  top: 30px; left: 14%; right: 14%; height: 2px;
  background: repeating-linear-gradient(90deg, var(--amber-300) 0 8px, transparent 8px 16px);
  opacity: 0.55; z-index: 0;
}
.dusha-page .tr-howto__step { position: relative; z-index: 1; padding: 0 8px; text-align: center; }
.dusha-page .tr-howto__num {
  display: inline-flex; align-items: center; justify-content: center;
  width: 60px; height: 60px; border-radius: 50%;
  background: var(--amber-500); color: #fff;
  font-family: var(--font-display); font-weight: 600; font-size: 24px;
  margin-bottom: 18px;
  box-shadow: 0 4px 16px rgba(245,124,24,0.32);
}
.dusha-page .tr-howto__title { font-family: var(--font-display); font-weight: 600; font-size: 19px; color: var(--sky-900); margin-bottom: 8px; letter-spacing: var(--ls-snug); }
.dusha-page .tr-howto__text { font-size: 14px; color: var(--ink-500); line-height: 1.55; }

/* ============ FAQ (.tr-faq) ============ */
.dusha-page .tr-faq__list {
  max-width: 760px; margin: 0 auto;
  padding: 0 var(--side-margin);
  display: flex; flex-direction: column; gap: 12px;
}
.dusha-page .tr-faq__item {
  background: #fff; border: 1px solid var(--ink-100);
  border-radius: var(--radius-lg); overflow: hidden;
  transition: all var(--dur-fast) var(--ease-out-soft);
}
.dusha-page .tr-faq__item[open] { border-color: var(--sky-200); box-shadow: var(--shadow-soft); }
.dusha-page .tr-faq__q {
  padding: 18px 22px;
  font-family: var(--font-display); font-weight: 600; font-size: 17px;
  color: var(--sky-900); cursor: pointer;
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  list-style: none;
}
.dusha-page .tr-faq__q::-webkit-details-marker { display: none; }
.dusha-page .tr-faq__q::after {
  content: ''; flex-shrink: 0;
  width: 24px; height: 24px; border-radius: 50%;
  background: var(--sky-50); color: var(--sky-700);
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23175E82' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
  background-repeat: no-repeat; background-position: center;
  transition: transform var(--dur-fast) var(--ease-out-soft);
}
.dusha-page .tr-faq__item[open] .tr-faq__q::after { transform: rotate(180deg); }
.dusha-page .tr-faq__a { padding: 0 22px 20px; font-size: 14.5px; color: var(--ink-500); line-height: 1.6; }

/* ============ ФИНАЛЬНЫЙ CTA (.tr-cta) ============ */
.dusha-page .tr-cta {
  background: var(--gradient-sky-sunset);
  padding: 80px 0; position: relative; overflow: hidden;
}
/* Затемняющая вуаль поверх закатного градиента: без неё белый заголовок и лид
   на светлых sky-300/amber-200 почти не читались (правка 2026-08-25).
   Контент лежит в .tr-cta__inner с position:relative — он поверх вуали. */
.dusha-page .tr-cta::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(180deg, rgba(15,47,68,.60) 0%, rgba(15,47,68,.40) 50%, rgba(15,47,68,.58) 100%);
}
.dusha-page .tr-cta__inner {
  max-width: 720px; margin: 0 auto;
  padding: 0 var(--side-margin); text-align: center;
  position: relative;
}
.dusha-page .tr-cta__overline {
  font-family: var(--font-body); font-size: 12px; font-weight: 700;
  letter-spacing: var(--ls-caps); text-transform: uppercase;
  color: #fff; display: block; margin-bottom: 14px;
  text-shadow: 0 1px 4px rgba(15,40,60,0.35);
}
.dusha-page .tr-cta__title {
  font-family: var(--font-display); font-weight: 600;
  font-size: clamp(28px, 4.5vw, 44px); line-height: var(--lh-tight);
  letter-spacing: var(--ls-tight); color: #fff;
  margin: 0 0 16px;
  text-shadow: 0 2px 16px rgba(15,40,60,0.30);
}
.dusha-page .tr-cta__lead {
  font-size: 16px; color: rgba(255,255,255,0.92); opacity: 1; margin: 0 0 28px;
  text-shadow: 0 1px 6px rgba(15,40,60,0.25);
}
.dusha-page .tr-cta .btn { padding: 16px 32px; font-size: 16px; font-weight: 700; }

/* ============ MOBILE STICKY BAR (.tr-mobile-cta) ============ */
.dusha-page .tr-mobile-cta { display: none; }

/* ============ MODAL (Bitrix24-форма) ============ */
.dusha-page .tr-modal {
  position: fixed; inset: 0; z-index: 1100;
  background: rgba(15,40,60,0.65); backdrop-filter: blur(8px);
  display: flex; align-items: center; justify-content: center;
  padding: 20px;
  opacity: 0; visibility: hidden;
  transition: opacity var(--dur-med) var(--ease-out-soft), visibility var(--dur-med);
}
.dusha-page .tr-modal.is-open { opacity: 1; visibility: visible; }
.dusha-page .tr-modal__panel {
  background: #fff; border-radius: var(--radius-2xl);
  width: 100%; max-width: 520px; max-height: 90vh; overflow-y: auto;
  position: relative;
  box-shadow: var(--shadow-float);
  transform: translateY(20px);
  transition: transform var(--dur-slow) var(--ease-out-soft);
}
.dusha-page .tr-modal.is-open .tr-modal__panel { transform: translateY(0); }
.dusha-page .tr-modal__head {
  position: sticky; top: 0; background: #fff;
  padding: 22px 28px 12px;
  display: flex; justify-content: space-between; align-items: center;
  border-radius: var(--radius-2xl) var(--radius-2xl) 0 0;
  z-index: 5;
}
.dusha-page .tr-modal__title { font-family: var(--font-display); font-weight: 600; font-size: 22px; color: var(--sky-900); letter-spacing: var(--ls-snug); }
.dusha-page .tr-modal__close {
  width: 36px; height: 36px; border-radius: 50%;
  background: var(--ink-50); color: var(--ink-700);
  border: 0; cursor: pointer;
  display: grid; place-items: center;
  transition: all var(--dur-fast);
}
.dusha-page .tr-modal__close:hover { background: var(--amber-100); color: var(--amber-700); }
.dusha-page .tr-modal__close svg { width: 18px; height: 18px; }
.dusha-page .tr-modal__body { padding: 0 16px 24px; }

/* ============ MEDIA: tablet ============ */
@media (max-width: 1024px) {
  .dusha-page .dd-hero__inner { padding: 140px var(--side-margin) 90px; }
  .dusha-page .tr-trust__grid { grid-template-columns: repeat(2, 1fr); gap: 22px; }
  .dusha-page .tr-why__grid { grid-template-columns: repeat(2, 1fr); }
  .dusha-page .tr-routes__grid { grid-template-columns: repeat(2, 1fr); }
  .dusha-page .tr-howto__grid { grid-template-columns: 1fr; gap: 32px; }
  .dusha-page .tr-howto__grid::before { display: none; }
  .dusha-page .tr-section { padding: 64px 0; }
}

/* ============ MEDIA: mobile ============ */
@media (max-width: 640px) {
  /* Mobile-фон через CSS-переменную; fallback на desktop, если mob не задан */
  .dusha-page .dd-hero { background-image: var(--hero-bg-mobile, var(--hero-bg-desktop, url('/bitrix/images/apart/soul-konig/transfer-hero-mob.webp'))); }

  .dusha-page .dd-hero { min-height: 78vh; }
  .dusha-page .dd-hero__inner { padding: 120px 20px 64px; }
  .dusha-page .dd-hero__title { font-size: clamp(34px, 9.5vw, 46px); }
  .dusha-page .dd-hero__lead { font-size: 15px; }
  .dusha-page .dd-hero__meta { gap: 8px; margin-bottom: 26px; }
  .dusha-page .dd-hero__meta-chip { padding: 6px 12px; font-size: 12px; }
  .dusha-page .dd-hero__cta .btn { flex: 1 1 auto; justify-content: center; }

  .dusha-page .tr-trust__grid { grid-template-columns: 1fr; gap: 16px; padding: 22px var(--side-margin); }
  .dusha-page .tr-trust__icon { width: 38px; height: 38px; }
  .dusha-page .tr-trust__icon svg { width: 18px; height: 18px; }

  .dusha-page .tr-section { padding: 56px 0; }
  .dusha-page .tr-section__head { margin-bottom: 28px; }
  .dusha-page .tr-why__grid { grid-template-columns: 1fr; gap: 14px; }
  /* Layout карточки: [icon][title] сверху одной строкой, description снизу во всю ширину */
  .dusha-page .tr-why__card {
    display: grid;
    grid-template-columns: auto 1fr;
    column-gap: 16px;
    padding: 20px;
  }
  .dusha-page .tr-why__icon { width: 44px; height: 44px; margin-bottom: 0; flex-shrink: 0; grid-column: 1; grid-row: 1; }
  .dusha-page .tr-why__icon svg { width: 22px; height: 22px; }
  .dusha-page .tr-why__title { grid-column: 2; grid-row: 1; align-self: center; font-size: 17px; margin: 0; }
  .dusha-page .tr-why__text { grid-column: 1 / -1; grid-row: 2; margin-top: 14px; font-size: 13.5px; }

  .dusha-page .tr-routes__grid {
    display: flex; gap: 14px;
    overflow-x: auto; scroll-snap-type: x mandatory;
    padding: 0 var(--side-margin) 16px;
    margin: 0;
    -webkit-overflow-scrolling: touch;
  }
  .dusha-page .tr-routes__grid::-webkit-scrollbar { display: none; }
  .dusha-page .tr-route { flex: 0 0 280px; scroll-snap-align: start; }

  .dusha-page .tr-howto__step { padding: 0; }
  .dusha-page .tr-faq__q { font-size: 15.5px; padding: 16px 18px; }
  .dusha-page .tr-faq__a { padding: 0 18px 18px; font-size: 14px; }

  .dusha-page .tr-cta { padding: 64px 0; }

  /* Sticky bottom-bar */


  .dusha-page .tr-modal { padding: 0; align-items: flex-end; }
  .dusha-page .tr-modal__panel {
    border-radius: var(--radius-xl) var(--radius-xl) 0 0;
    max-height: 85vh; transform: translateY(100%);
  }
  .dusha-page .tr-modal.is-open .tr-modal__panel { transform: translateY(0); }
  .dusha-page .tr-modal__head { padding: 18px 22px 10px; }
}

/* Сбросить padding-top у шаблонных контейнеров (чтобы hero сидел впритык к шапке) */
body:has(.dusha-page) .page_content_container,
body:has(.dusha-page) .page_content { padding-top: 0 !important; }

/* ---- Таблица тарифов (Ф1) ---- */
.dusha-page .tr-tariffs__wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; max-width: var(--max-content); margin: 0 auto; padding: 0 var(--side-margin); }
.dusha-page .tr-tariffs { width: 100%; border-collapse: collapse; min-width: 520px; background: #fff;
  border: 1px solid var(--ink-100); border-radius: var(--radius-lg); overflow: hidden; }
.dusha-page .tr-tariffs th, .dusha-page .tr-tariffs td { padding: 16px 18px; text-align: left; border-bottom: 1px solid var(--ink-100); }
.dusha-page .tr-tariffs thead th { background: var(--sky-50); font-family: var(--font-body); font-weight: 700;
  font-size: 14px; color: var(--sky-900); vertical-align: bottom; }
.dusha-page .tr-tariffs tbody th { background: transparent; font-weight: 400; }
.dusha-page .tr-tariffs__class-h { text-align: right; }
.dusha-page .tr-tariffs__class-name { display: block; }
/* Ориентир по классу — словами, поэтому переносится по строкам (см. $capHint в _tariff-table.php) */
/* Колонки таблицы фактически выровнены ВЛЕВО: правило `.tr-tariffs th, td { text-align:left }`
   специфичнее, чем `text-align:right` у класса-колонки, поэтому названия и цены идут слева.
   `margin-left:auto` у пояснения уводил его к правому краю — название слева, подпись справа.
   min-height в две строки: у минивэна подпись короче, чем у соседей, и без него нижние
   границы блоков шапки расходились — колонки переставали читаться одним блоком. */
.dusha-page .tr-tariffs__class-cap { display: block; max-width: 190px; margin-left: 0; margin-right: auto; font-weight: 500; font-size: 12px; line-height: 1.35; color: var(--ink-400); margin-top: 5px; text-wrap: balance; min-height: 2.7em; }
.dusha-page .tr-tcard__clshint { display: block; width: 100%; font-weight: 400; font-size: 12px; line-height: 1.35; color: var(--ink-400); margin-top: 2px; }
.dusha-page .tr-tariffs__cap-item { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; line-height: 1; }
.dusha-page .tr-tariffs__ico { width: 15px; height: 15px; flex: 0 0 auto; color: var(--ink-400); vertical-align: middle; }
.dusha-page .tr-tariffs__route-arrow { width: 15px; height: 15px; vertical-align: -2px; margin: 0 3px; color: var(--amber-500); }
.dusha-page .tr-tariffs__notes { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; margin-top: 18px; }
.dusha-page .tr-tariffs__note { display: inline-flex; align-items: center; gap: 7px; padding: 8px 15px; border-radius: var(--radius-pill); font-size: 13px; font-weight: 600; background: var(--sky-50); color: var(--sky-900); border: 1px solid var(--ink-100); }
.dusha-page .tr-tariffs__note svg { width: 16px; height: 16px; flex: 0 0 auto; }
.dusha-page .tr-tariffs__note--amber { background: var(--amber-50); color: var(--amber-600); border-color: transparent; }
.dusha-page .tr-tariffs__route-name { display: block; font-weight: 600; color: var(--sky-900); }
.dusha-page .tr-tariffs__route-eta { display: block; font-size: 12px; color: var(--ink-400); margin-top: 2px; }
.dusha-page .tr-tariffs__price { text-align: right; font-family: var(--font-display); font-weight: 600;
  font-size: 17px; color: var(--ink-900); white-space: nowrap; }
.dusha-page .tr-tariffs tbody tr:last-child td,
.dusha-page .tr-tariffs tbody tr:last-child th { border-bottom: none; }
.dusha-page .tr-tariffs tbody tr:hover { background: var(--amber-50); }
@media (max-width: 600px) { .dusha-page .tr-tariffs th, .dusha-page .tr-tariffs td { padding: 12px 14px; } .dusha-page .tr-tariffs__price { font-size: 15px; } }

/* Тарифы на мобиле — карточки по маршрутам (без горизонтального скролла) */
.dusha-page .tr-tariffs__cards { display: none; }
.dusha-page .tr-tcard { background: #fff; border: 1px solid var(--ink-100); border-radius: var(--radius-lg); box-shadow: var(--shadow-soft); padding: 16px 18px; }
.dusha-page .tr-tcard__route { font-family: var(--font-display); font-weight: 600; font-size: 16px; color: var(--sky-900); display: flex; align-items: center; gap: 4px; }
.dusha-page .tr-tcard__route .tr-tariffs__route-arrow { color: var(--amber-500); }
.dusha-page .tr-tcard__eta { font-size: 12px; color: var(--ink-400); margin: 2px 0 8px; }
.dusha-page .tr-tcard__row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 0; border-top: 1px solid var(--ink-100); }
.dusha-page .tr-tcard__cls { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 14px; font-weight: 500; color: var(--ink-900); }
.dusha-page .tr-tcard__price { font-family: var(--font-display); font-weight: 600; font-size: 17px; color: var(--ink-900); white-space: nowrap; }

/* Акция на класс авто (см. include/portal/transfer-promo.php): бейдж и «было/стало».
   Амбер по канону портала — им отмечаются только скидки и действия, не декор. */
.dusha-page .tr-tariffs__note--promo { background: var(--amber-500); color: #fff; border-color: transparent; }
.dusha-page .tr-promo-badge { display: inline-flex; align-items: center; margin-left: 6px; padding: 1px 7px;
  border-radius: var(--radius-pill); background: var(--amber-500); color: #fff;
  font-family: var(--font-body); font-size: 11px; font-weight: 700; line-height: 1.6; white-space: nowrap; letter-spacing: .01em; }
/* В таблице «было» и «стало» идут ОДНОЙ строкой: два блока подняли бы строку и увели
   цену минивэна на 38px ниже цен соседних колонок — глаз ждёт их на одной линии. */
.dusha-page .tr-tariffs__price-old { display: inline; margin-right: 8px; font-family: var(--font-body); font-size: 13px;
  font-weight: 500; color: var(--ink-400); text-decoration: line-through; }
.dusha-page .tr-tariffs__price-new { display: inline; color: var(--amber-600); font-weight: 600; }
/* Шапка выравнивается по верху ЦЕЛИКОМ, вместе с «Направлением»: подписи классов разной
   длины (у минивэна одна строка против двух у соседей), и при vertical-align:bottom
   названия расходились по вертикали. Выравнивать только колонки классов нельзя —
   тогда «Направление» остаётся внизу и шапка выглядит разъехавшейся. */
.dusha-page .tr-tariffs thead th { vertical-align: top; }
/* Цена в плитке перелинковки на хаб класса. Внутри .rtd-mv__body у <b> стоит display:block
   (это заголовок плитки), поэтому цена в строке — <span>, иначе она уезжает на свою строку. */
.dusha-page .rtd-mv__old { color: var(--ink-400); text-decoration: line-through; }
.dusha-page .rtd-mv__new { font-weight: 700; color: var(--amber-600); white-space: nowrap; }
/* В мобильных карточках места по ширине нет — там «было/стало» в две строки, столбиком. */
.dusha-page .tr-tcard__price--promo { display: flex; flex-direction: column; align-items: flex-end; line-height: 1.3; }
.dusha-page .tr-tcard__price--promo .tr-tariffs__price-old { display: block; margin-right: 0; font-size: 12px; }
.dusha-page .tr-tcard__price--promo .tr-tariffs__price-new { display: block; }

@media (max-width: 640px) {
  .dusha-page .tr-tariffs__wrap { display: none; }
  .dusha-page .tr-tariffs__cards { display: flex; flex-direction: column; gap: 14px; max-width: 520px; margin: 0 auto; padding: 0 var(--side-margin); }
}
/* Перелинковка на хаб класса «Минивэн» */
/* Плитки-перелинковки («как добраться», «в аэропорт», «минивэн») идут секциями подряд,
   а у .tr-section по 80px сверху и снизу — между соседними плитками зияло 160px пустоты.
   Секции с плиткой жмём, а отбивку от обычных секций сохраняем. */
.dusha-page .tr-section:has(> .rtd-mv) { padding-top: 14px; padding-bottom: 14px; }
.dusha-page .tr-section:not(:has(> .rtd-mv)) + .tr-section:has(> .rtd-mv) { padding-top: 34px; }
.dusha-page .tr-section:has(> .rtd-mv):last-of-type { padding-bottom: 34px; }

.dusha-page .rtd-mv{display:flex;align-items:center;gap:18px;max-width:1080px;margin:0 auto;padding:20px 24px;background:#fff;border:1px solid var(--sand-200);border-radius:var(--radius-lg);box-shadow:var(--shadow-soft);text-decoration:none;transition:border-color .15s,transform .15s}
.dusha-page .rtd-mv:hover{border-color:var(--amber-500);transform:translateY(-2px)}
.dusha-page .rtd-mv__ico{flex:0 0 auto;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:var(--amber-50);color:var(--amber-600)}
.dusha-page .rtd-mv__body{flex:1 1 auto;min-width:0}
.dusha-page .rtd-mv__body b{display:block;font-family:var(--font-display);font-weight:600;font-size:16px;color:var(--sky-900);letter-spacing:var(--ls-snug);margin-bottom:4px}
.dusha-page .rtd-mv__body small{display:block;font-size:13.5px;line-height:1.45;color:var(--ink-500)}
.dusha-page .rtd-mv__go{flex:0 0 auto;display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:700;color:var(--amber-600);white-space:nowrap}
@media (max-width:700px){
.dusha-page .rtd-mv{flex-wrap:wrap;gap:12px;padding:18px}
.dusha-page .rtd-mv__go{width:100%}
}
@media (max-width:1020px){.dusha-page .rtd-links{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* Липкая полоса заказа — собственный брейкпоинт 760, чтобы не задевать остальные мобильные правила */
@media (max-width: 760px) {
  .dusha-page .tr-mobile-cta {
    display: flex; align-items: center; gap: 12px;
    position: fixed; bottom: 0; left: 0; right: 0;
    z-index: 90;
    background: rgba(255,255,255,0.96); backdrop-filter: blur(12px);
    border-top: 1px solid var(--ink-100);
    padding: 10px 14px calc(10px + env(safe-area-inset-bottom));
    box-shadow: 0 -2px 14px rgba(15,47,68,.10);
  }
  .dusha-page .tr-mobile-cta .btn { flex: 1 1 auto; justify-content: center; padding: 14px 20px; font-size: 15px; font-weight: 700; }
  .dusha-page .tr-mobile-cta__price { flex: 0 0 auto; display: flex; flex-direction: column; line-height: 1.1; }
  .dusha-page .tr-mobile-cta__price span { font-size: 10.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-400); }
  .dusha-page .tr-mobile-cta__price b { font-family: var(--font-display); font-size: 17px; font-weight: 600; color: var(--sky-900); white-space: nowrap; font-variant-numeric: tabular-nums; }
  /* чтобы полоса не накрывала низ подвала */
  body:has(.tr-mobile-cta) { padding-bottom: 76px; }
}

/* Видимые хлебные крошки (шаблонные .bx-breadcrumb на .dusha-page скрыты) */
.dusha-page .tr-crumbs { max-width: var(--max-content); margin: 0 auto; padding: 20px var(--side-margin) 0;
  font-size: 13.5px; line-height: 2.2; color: #5A6675; }
.dusha-page .tr-crumbs a { display: inline-block; padding: 6px 2px; color: #5A6675; text-decoration: none; }
.dusha-page .tr-crumbs a:hover { color: var(--amber-700); }
.dusha-page .tr-crumbs__sep { padding: 0 6px; color: var(--ink-300); }
@media (max-width: 760px) { .dusha-page .tr-crumbs { padding-top: 14px; font-size: 13px; } }