
:root{--rp-yellow:#FFCF08;--rp-ink:#1D1D1D;--rp-grey:#F5F5F5}
body{padding-top:0!important}
.mos-hero,.mos-eyebrow,.mos-hero-sub,.mos-subnav{display:none!important}
/* мобильный дубль футера (Служба поддержки/Позвонить/MAX/Telegram) вылезал поверх десктопного футера — прячем на широких экранах */
@media(min-width:769px){.ftr-mob-support,.ftr-mob-menu,.ftr-mob-copy{display:none!important}}
/* ── Шапка (белая, russpass) ── */
.rp-hdr{position:sticky;top:0;left:0;right:0;z-index:9500;background:#fff;border-bottom:1px solid #ececf0;font-family:"Golos Text",system-ui,-apple-system,sans-serif}
.rp-hdr-in{max-width:1160px;margin:0 auto;display:flex;align-items:center;gap:13px;padding:12px 22px}
.rp-logo{display:flex;align-items:center;text-decoration:none;flex:0 0 auto}
.rp-logo-svg{display:block;height:54px;width:auto;flex:0 0 auto}
/* город в шапке (кликабельный) */
.rp-hdr .rp-city-hdr{position:relative;flex:0 0 auto;margin-bottom:0;width:auto}
/* Кнопки внутри больше нет (см. разметку выше) — это просто точка привязки
   для выпадающего списка городов, ширины в объединённом поле не занимает.
   !important бьёт мобильный .rp-hdr .rp-city-hdr{flex:1 1 auto} ниже —
   тот раньше растягивал видимую пилюлю города, теперь растягивать нечего. */
.rp-searchbar .rp-city-hdr{flex:0 0 auto!important;width:0!important;overflow:visible}
.rp-city-hbtn{display:inline-flex;align-items:center;gap:6px;background:var(--rp-grey);border:0;cursor:pointer;color:var(--rp-ink);font:800 15px "Golos Text",system-ui;padding:9px 12px;border-radius:100px}
.rp-city-hbtn:hover{filter:brightness(.96)}
.rp-city-hbtn svg:first-child{color:var(--rp-ink);opacity:.75}
.rp-city-hbtn .rp-chev{opacity:.55;transition:transform .2s}
.rp-city-hbtn[aria-expanded="true"] .rp-chev{transform:rotate(180deg)}
.rp-hdr .rp-city-drop{left:0;margin-top:10px}
/* ── Объединённый блок: «Все разделы» + поиск (один pill, как russpass) ── */
.rp-searchbar{flex:1 1 auto;display:flex;align-items:center;background:#fff;border:1.5px solid #e4e6ea;border-radius:14px;min-width:0;height:52px}
.rp-searchbar:focus-within{border-color:#cdd0d6;box-shadow:0 3px 16px rgba(20,20,20,.07)}
.rp-all-wrap{position:relative;flex:0 0 auto;height:100%}
.rp-all{display:inline-flex;align-items:center;gap:8px;height:100%;background:0;border:0;color:var(--rp-ink);font:700 15px "Golos Text",system-ui;padding:0 15px;border-radius:14px 0 0 14px;cursor:pointer}
.rp-all:hover{background:#fafafb}
.rp-all .rp-chev{opacity:.55;transition:transform .2s}
.rp-all[aria-expanded="true"] .rp-chev{transform:rotate(180deg)}
.rp-sb-div{width:1px;height:26px;background:#e4e6ea;flex:0 0 auto}
.rp-all-wrap-hidden{display:none}

/* Вторая строка шапки — «Ялта: исследовать дальше», как у GetYourGuide:
   отдельная полоса под основной шапкой, а не втиснута в неё же. Владелец
   решил убрать совсем (30.08.2026) — раньше только прятали на узких
   экранах, теперь не показываем нигде. Разметку/JS не трогаю (закрытие
   через display:none безопаснее, чем резать вывод в PHP — hover-инициализация
   ищет .rp-explore-row через querySelector и просто не найдёт элемент видимым). */
.rp-explore-row{display:none!important;border-top:1px solid #ececf0;background:#fff}
.rp-explore-row-in{max-width:1280px;margin:0 auto;padding:0 24px;display:flex;
  align-items:center;gap:22px;height:52px}
.rp-explore-lb{color:#8a8f98;font:600 14px "Golos Text",system-ui;white-space:nowrap;
  text-decoration:none;cursor:pointer}
.rp-explore-lb:hover{color:#111827;text-decoration:underline}
.rp-explore-dot{color:#c7ccd3;font-size:10px}
.rp-explore-row .rp-all-wrap{height:auto}
.rp-explore-btn{height:auto!important;padding:0!important;border-radius:0!important;
  color:#5a6270;font-weight:600!important}
.rp-explore-btn:hover{background:none!important;color:#111827}
@media(max-width:1279px){.rp-explore-row{display:none}}
.rp-sb-wrap{position:relative;flex:1 1 auto;height:100%;min-width:0}
.rp-sb-inp{width:100%;height:100%;background:0;border:0;color:var(--rp-ink);font:500 15px "Golos Text",system-ui;padding:0 16px;outline:0;min-width:0}
.rp-sb-inp::placeholder{color:#9aa2ad}
/* ── Подсказки поиска (живой выпадающий список) ── */
.rp-sugg{position:absolute;top:calc(100% + 12px);left:-16px;right:-16px;background:#fff;border:1px solid #ececf0;border-radius:16px;box-shadow:0 18px 50px rgba(20,20,20,.18);padding:8px;z-index:45;max-height:min(70vh,520px);overflow-y:auto;overflow-x:hidden;font-family:"Golos Text",system-ui,sans-serif;-webkit-text-size-adjust:100%;text-size-adjust:100%}
.rp-sugg[hidden]{display:none}
.rp-sugg-lbl{color:#c0c5cd;font:800 10.5px "Golos Text";text-transform:uppercase;letter-spacing:.06em;padding:10px 14px 5px}
.rp-sugg-cats{display:flex;flex-wrap:wrap;gap:7px;padding:2px 10px 8px}
.rp-sugg-cat{display:inline-flex;align-items:center;gap:7px;padding:8px 13px;border-radius:100px;background:var(--rp-grey);color:var(--rp-ink);text-decoration:none;font:700 14px "Golos Text",system-ui}
.rp-sugg-cat:hover,.rp-sugg-cat.rp-hi{background:var(--rp-yellow)}
.rp-sugg-cat i{font-style:normal;color:#8b8f98;font-weight:600}
.rp-sugg-cat:hover i,.rp-sugg-cat.rp-hi i{color:#5c5a44}
.rp-sugg-it{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:12px;text-decoration:none;color:var(--rp-ink);box-sizing:border-box;max-width:100%;overflow:hidden}
.rp-sugg-it:hover,.rp-sugg-it.rp-hi{background:var(--rp-grey)}
.rp-sugg-im{flex:0 0 auto;width:52px;height:40px;border-radius:9px;object-fit:cover;background:#eef0f3;display:grid;place-items:center;font-size:19px}
.rp-sugg-tx{min-width:0;flex:1 1 auto;overflow:hidden}
.rp-sugg-tx b{display:block;font:700 14px/1.25 "Golos Text",system-ui;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rp-sugg-tx span{display:block;margin-top:2px;color:#8b8f98;font:600 12px "Golos Text";overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rp-sugg-pr{flex:0 1 auto;font:800 13.5px "Golos Text";color:var(--rp-ink);white-space:nowrap;overflow:hidden;text-overflow:clip;max-width:78px;text-align:right}
.rp-sugg-all{display:block;text-align:center;padding:12px;margin-top:4px;border-top:1px solid #f0f0f3;color:var(--rp-red,#E4231D);text-decoration:none;font:800 14px "Golos Text",system-ui}
.rp-sugg-all:hover{text-decoration:underline}
.rp-sugg-none{padding:18px 14px;text-align:center;color:#9aa2ad;font:600 14.5px "Golos Text"}
.rp-sb-go{height:100%;background:0;border:0;color:#8a8f98;padding:0 16px;cursor:pointer;display:grid;place-items:center;border-radius:0 14px 14px 0}
.rp-sb-go:hover{color:var(--rp-ink)}
/* Кнопка «Отмена» — только в полноэкранном мобильном режиме поиска (rp-search-mode) */
.rp-sb-cancel{display:none;flex:0 0 auto;background:0;border:0;color:var(--rp-ink);font:700 15px "Golos Text",system-ui;padding:0 4px;cursor:pointer;white-space:nowrap}
/* действия */
.rp-actions{display:flex;align-items:center;gap:7px;flex:0 0 auto}
.rp-act{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;color:var(--rp-ink);text-decoration:none;background:var(--rp-grey);font-size:17px;transition:.15s}
.rp-act:hover{filter:brightness(.95)}
.rp-act-txt{width:auto;border-radius:100px;padding:0 15px 0 12px;gap:7px;grid-auto-flow:column;place-items:center;font:600 14px "Golos Text",system-ui,sans-serif;white-space:nowrap}
.rp-act-txt svg{flex:0 0 auto}
/* «Мой план» — только сердечко и на десктопе тоже (владелец, 31.08.2026):
   тот же кружок, что раньше был мобильным видом кнопки, теперь везде. */
.rp-act-txt>span:not(.rp-plan-ico){display:none}
.rp-act-txt{width:44px;padding:0}
/* Гамбургер убран из шапки на десктопе (владелец, 31.08.2026) — «Мой план»
   и «Бронирования» уже видны отдельно; на телефоне кнопка нужна, оставлена. */
@media(min-width:861px){.rp-burger{display:none!important}}
/* «Бронирования» на десктопе — снова с текстом (владелец, 05.09.2026):
   правило выше 31.08 сделало иконкой И «Мой план», И «Бронирования» разом
   (общий класс .rp-act-txt) — для «Бронирования» это отменяем, для «Мой
   план» оставляем как было. Селектор по href, а не по классу/id — метка
   .rp-plan-ico занята под сердечко, третьего маркера заводить не стали. */
@media(min-width:861px){
  .rp-hdr a[href$="/kabinet/"].rp-act-txt{width:auto;padding:0 15px 0 12px}
  .rp-hdr a[href$="/kabinet/"].rp-act-txt>span{display:inline}
}
/* ── Счётчик отложенного в «Мой план» (ставит rpPlanSync) ──
   Кружок висит на самой иконке-сердце, поэтому одинаково смотрится и на десктопе
   (кнопка-пилюля с подписью), и на мобильном, где от кнопки остаётся один кружок. */
.rp-plan-ico{position:relative;display:inline-flex;align-items:center;justify-content:center}
.rp-plan-cnt{position:absolute;top:-6px;right:-9px;min-width:17px;height:17px;padding:0 4px;border-radius:9px;background:#e4231d;color:#fff;font:800 11px/17px "Golos Text",system-ui,sans-serif;text-align:center;box-shadow:0 0 0 2px #fff;font-variant-numeric:tabular-nums;pointer-events:none}
.rp-plan-cnt[hidden]{display:none}
/* Подтверждение добавления — короткий подскок сердца, без скачка на пол-экрана */
@keyframes rpPlanPop{0%{transform:scale(1)}45%{transform:scale(1.15)}100%{transform:scale(1)}}
.rp-plan-hit .rp-plan-ico{animation:rpPlanPop .35s ease}
/* Тот же спокойный подскок вместо ядрового at3TabPulse (scale ×2) в нижнем таббаре */
#at3-tabbar .at3-tab-pulse svg{animation:rpPlanPop .35s ease}
@media(prefers-reduced-motion:reduce){.rp-plan-hit .rp-plan-ico,#at3-tabbar .at3-tab-pulse svg{animation:none}}
/* Кнопка-иконка поиска в шапке — видна только на мобильном (см. media-запрос ниже),
   на десктопе поиск уже есть строкой в .rp-searchbar */
.rp-search-trigger{display:none}
/* мега-меню «Все разделы» */
.rp-menu{position:absolute;top:100%;left:0;background:#fff;border:1px solid #ececf0;border-radius:16px;box-shadow:0 18px 50px rgba(20,20,20,.18);padding:8px;min-width:300px;margin-top:10px;z-index:40}
.rp-explore-row .rp-menu{min-width:560px}
/* Список в два столбца со своей прокруткой — одной колонкой список
   достопримечательностей/категорий не помещался по высоте и вылезал за
   экран. Как у GetYourGuide: два столбца, панель не растёт бесконечно. */
.rp-menu-in{display:grid;grid-template-columns:1fr 1fr;gap:0 6px;
  max-height:70vh;overflow-y:auto}
.rp-menu[hidden]{display:none}
.rp-menu a{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:11px;text-decoration:none;color:var(--rp-ink);font:600 15px "Golos Text",system-ui}
.rp-menu a:hover{background:var(--rp-grey)}
.rp-menu a span{font-size:18px;width:24px;text-align:center}
.rp-menu a img{width:36px;height:36px;border-radius:50%;object-fit:cover;flex:0 0 auto;background:var(--rp-grey)}
.rp-menu a i{margin-left:auto;font-style:normal;font-weight:600;font-size:13px;color:#9a9aa2}
.rp-noqr{max-width:1160px;margin:26px auto;padding:30px;text-align:center;color:#7a7f88;font:600 17px "Golos Text",system-ui}
/* ── Гармошка категорий (мобильное меню, как на russpass.ru) ── */
.rp-drawer{position:fixed;inset:0;z-index:9700;visibility:hidden;overflow:hidden}
.rp-drawer.rp-open{visibility:visible}
.rp-drawer-bg{position:absolute;inset:0;background:rgba(20,20,20,.45);opacity:0;transition:opacity .22s}
.rp-drawer.rp-open .rp-drawer-bg{opacity:1}
.rp-drawer-panel{position:absolute;top:0;right:0;bottom:0;width:min(84vw,360px);background:#fff;box-shadow:-16px 0 50px rgba(20,20,20,.22);display:flex;flex-direction:column;transform:translateX(100%);transition:transform .26s cubic-bezier(.2,.8,.3,1);font-family:"Golos Text",system-ui,-apple-system,sans-serif}
.rp-drawer.rp-open .rp-drawer-panel{transform:translateX(0)}
.rp-drawer-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:20px 18px;border-bottom:1px solid #ececf0;flex:0 0 auto}
.rp-drawer-head b{font:800 16px "Golos Text",system-ui;color:var(--rp-ink)}
.rp-drawer-head .rp-city-hbtn b,.rp-drawer-head .rp-city-hbtn .rp-chev{display:inline-flex}
.rp-drawer-panel .rp-city-drop{position:fixed;left:12px;right:12px;top:78px;margin-top:0;width:auto;max-width:none;z-index:30}
.rp-drawer-x{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--rp-grey);border:0;color:var(--rp-ink);cursor:pointer;flex:0 0 auto}
.rp-drawer-x:hover{filter:brightness(.95)}
.rp-drawer-body{overflow-y:auto;padding:10px 10px 24px}
.rp-drawer-acct{flex:0 0 auto;border-top:8px solid var(--rp-grey);padding-top:14px}
.rp-drawer-body a{display:flex;align-items:center;gap:13px;padding:14px 12px;border-radius:12px;text-decoration:none;color:var(--rp-ink);font:700 16px "Golos Text",system-ui;border-bottom:1px solid #f4f4f6}
.rp-drawer-body a img{width:40px;height:40px;border-radius:50%;object-fit:cover;flex:0 0 auto;background:var(--rp-grey)}
.rp-drawer-body a span:not(.rp-explore-ph){font-size:19px;width:24px;text-align:center;flex:0 0 auto}
.rp-drawer-body a i{margin-left:auto;font-style:normal;font-weight:600;font-size:13px;color:#9a9aa2;flex:0 0 auto}
.rp-drawer-body a:last-child{border-bottom:0}
.rp-drawer-body a:active{background:var(--rp-grey)}
.rp-drawer-body+.rp-drawer-body{border-top:8px solid var(--rp-grey);padding-top:14px}

/* «Исследовать дальше» в гамбургере — строки со стрелкой вправо, тап
   открывает отдельный экран со списком и стрелкой назад, как у GYG. */
.rp-explore-mrow{display:flex;align-items:center;gap:13px;width:100%;
  padding:14px 12px;border-radius:12px;border:0;background:none;text-align:left;
  color:var(--rp-ink);font:700 16px "Golos Text",system-ui;cursor:pointer;
  border-bottom:1px solid #f4f4f6}
.rp-explore-mrow:last-child{border-bottom:0}
.rp-explore-mrow:active{background:var(--rp-grey)}
.rp-explore-mrow span{font-size:19px;width:22px;text-align:center;flex:0 0 auto}
.rp-explore-chev{margin-left:auto;flex:0 0 auto;display:flex;opacity:.5;transform:rotate(-90deg)}
.rp-explore-back{display:flex;align-items:center;gap:10px;width:100%;
  padding:10px 4px 16px;border:0;background:none;text-align:left;cursor:pointer;
  color:var(--rp-ink);font:800 17px "Golos Text",system-ui}
.rp-explore-back svg{transform:rotate(90deg);opacity:.7}
.rp-drawer-h{font:800 13px "Golos Text",system-ui;color:var(--rp-ink);text-transform:uppercase;
  letter-spacing:.04em;padding:6px 12px 10px;opacity:.6}
.rp-drawer-body a span{font-size:19px;width:26px;text-align:center;flex:0 0 auto}
.rp-drawer-body a i{margin-left:auto;font-style:normal;font-weight:600;font-size:13px;color:#9a9aa2}
body.rp-drawer-lock{overflow:hidden}
/* ── Герой ── */
/* Высота растёт с шириной экрана: на макете баннер был вдвое шире своей высоты, а на
   широком мониторе при фиксированных 320px он превращался в узкую ленту — фотография
   кадрировалась совсем по-другому, чем на картинке. */
.rp-hero{position:relative;z-index:5;min-height:clamp(320px,27vw,400px);display:flex;align-items:flex-end;padding:32px 22px 35px;font-family:"Golos Text",system-ui,-apple-system,sans-serif}
.rp-hero-deco{position:absolute;inset:0;overflow:hidden;z-index:0}
.rp-hero-bg{position:absolute;inset:0;background-size:cover;background-position:center 42%;z-index:0}
/* Полосы широкие (по 7% ширины) и сдвинуты влево — так, как на макете вариантов баннера:
   тонкие линии по 2.25%, разбросанные по всей ширине, читались как царапины по фотографии,
   широкие ложатся цветным клином за текстом, а правая часть с Кремлём остаётся чистой. */
.rp-hero-stripes{position:absolute;inset:-25% -12%;z-index:1;pointer-events:none;opacity:.92;background:linear-gradient(122deg,transparent 8%,#e4231d 8%,#e4231d 15%,transparent 15%),linear-gradient(122deg,transparent 20%,#2f855a 20%,#2f855a 27%,transparent 27%),linear-gradient(122deg,transparent 32%,#2b6cb0 32%,#2b6cb0 39%,transparent 39%),linear-gradient(122deg,transparent 44%,#e8a33d 44%,#e8a33d 51%,transparent 51%)}
.rp-hero-scrim{position:absolute;inset:0;z-index:2;background:linear-gradient(180deg,rgba(20,20,20,.5) 0%,rgba(20,20,20,.18) 38%,rgba(20,20,20,.62) 100%)}
/* ── Городской баннер с фотографией ──────────────────────────────────────────
   Затемнение направленное: густое слева под текстом и почти прозрачное справа,
   чтобы снимок было видно. Раньше фото накрывали два тёмных слоя подряд и оно
   выглядело серым. Полосы уводим вправо и приглушаем: над фотографией они
   работают как фирменный акцент, а не как заплатка. */
.rp-hero-city.rp-hero-hasphoto .rp-hero-scrim{
  background:linear-gradient(100deg,rgba(10,14,22,.78) 0%,rgba(10,14,22,.55) 30%,rgba(10,14,22,.16) 58%,rgba(10,14,22,.05) 100%),
             linear-gradient(180deg,rgba(10,14,22,.30) 0%,transparent 34%,rgba(10,14,22,.42) 100%)}
/* Сами полосы у Москвы нарисованы в левой половине (8–51%) — там, где на городском
   баннере лежит текст. Поэтому для фото рисуем их заново справа (58–87%) и гасим
   маской ближе к тексту: клин фирменных цветов уходит к правому краю. */
.rp-hero-city.rp-hero-hasphoto .rp-hero-stripes{opacity:.32;
  background:linear-gradient(122deg,transparent 85%,#e4231d 85%,#e4231d 88%,transparent 88%),
             linear-gradient(122deg,transparent 90%,#2f855a 90%,#2f855a 93%,transparent 93%),
             linear-gradient(122deg,transparent 95%,#2b6cb0 95%,#2b6cb0 98%,transparent 98%);
  -webkit-mask-image:linear-gradient(90deg,transparent 62%,#000 92%);
  mask-image:linear-gradient(90deg,transparent 62%,#000 92%)}
/* Обводка в 2 px по букве — грубовато поверх аккуратно затемнённого фото:
   на городских баннерах меняем её на мягкую тень, читаемость держит скрим. */
.rp-hero-city.rp-hero-hasphoto .rp-hero-in h1{-webkit-text-stroke:0!important;text-stroke:0!important;
  text-shadow:0 2px 18px rgba(8,12,20,.55),0 1px 3px rgba(8,12,20,.45)!important}
.rp-hero-city.rp-hero-hasphoto .rp-hero-sub{text-shadow:0 1px 10px rgba(8,12,20,.6)}
/* Фокус кадра: у баннера Ай-Петри небо сверху, гид с флагом и панорама — в середине,
   головы группы у нижнего края. 58% держит в полосе гида и горизонт и не срезает лица. */
.rp-hero-city.rp-hero-hasphoto .rp-hero-bg{background-position:center 58%}
.rp-hero-in{position:relative;z-index:3;max-width:1160px;margin:0 auto;width:100%;color:#fff}
/* Кегли и отступы — доли с макета (заголовок : подпись : пилюля ≈ 1 : 0.4 : 0.35),
   пересчитанные на ширину колонки сайта: на картинке заголовок занимает ~70% ширины.
   paint-order:stroke — обводка уходит ЗА букву. Без него обводка рисуется поверх заливки
   и съедает половину штриха: на крупном кегле заголовок выглядел не белым, а грязно-чёрным. */
/* !important и второй селектор — против скина листингов (at3m_listing_skin_css идёт ПОЗЖЕ
   и содержит body.has-tour h1{font:900 …38px…;color:var(--rp-ink)!important}). Раньше герой
   от него спасался тем, что белым был не сам h1, а вложенный span; теперь заголовок цельный. */
.rp-hero-in h1,body.has-tour .rp-hero-in h1{font-family:"Golos Text",system-ui!important;font-weight:800!important;font-size:clamp(30px,5.2vw,62px)!important;line-height:1.06!important;color:#fff!important;margin:0 0 17px;letter-spacing:-.02em;text-wrap:balance;-webkit-text-stroke:2px #000;text-stroke:2px #000;paint-order:stroke fill;text-shadow:0 2px 6px rgba(0,0,0,.6)}
.rp-hero-sub{margin:0 0 27px;color:#fff;opacity:.94;max-width:36ch;font:500 clamp(14px,1.75vw,24px)/1.4 "Golos Text",system-ui;text-shadow:0 1px 6px rgba(0,0,0,.5)}
.rp-city{position:relative;margin-bottom:28px;width:max-content;max-width:100%}
.rp-city-btn{display:inline-flex;align-items:center;gap:9px;background:0;border:0;cursor:pointer;color:var(--rp-yellow);font:900 clamp(26px,4.6vw,40px)/1 "Golos Text",system-ui;padding:0 0 4px;border-bottom:3px dashed rgba(255,207,8,.65)}
.rp-city-btn svg:first-child{opacity:.9}
/* В баннере кнопка города — пилюля с макета, но жёлтая плашкой логотипа (#FFC72C — тот же
   fill, что у квадрата с «7»), а не белая: на пёстром фото белую пилюлю не видно. */
.rp-hero-in .rp-city{margin-bottom:0}
.rp-hero-in .rp-city-btn{background:#FFC72C;color:var(--rp-ink);border:0;border-radius:99px;padding:.72em 1.15em;gap:.5em;font:800 clamp(14px,1.5vw,21px)/1 "Golos Text",system-ui;box-shadow:0 6px 20px rgba(0,0,0,.28)}
.rp-hero-in .rp-city-btn svg{width:.6em;height:.6em;opacity:.75;transition:transform .2s}
.rp-hero-in .rp-city-btn[aria-expanded="true"] svg{transform:rotate(180deg)}
/* Пилюля стоит у нижнего края баннера, поэтому открытый список выходит за него и ложится
   на секцию ниже — свой z-index (и z-index у самой секции) держат его сверху. */
.rp-hero-in .rp-city-drop{top:100%;margin-top:12px;letter-spacing:normal;text-wrap:wrap;text-align:left;z-index:30}
.rp-city-drop{position:absolute;top:100%;left:0;margin-top:16px;background:#fff;border-radius:18px;box-shadow:0 20px 60px rgba(20,20,20,.3);padding:14px;width:340px;max-width:88vw;z-index:6}
.rp-city-drop[hidden]{display:none}
.rp-city-search input{width:100%;border:0;background:var(--rp-grey);border-radius:12px;padding:14px 16px;font:500 15px "Golos Text",system-ui;color:var(--rp-ink);outline:0;box-sizing:border-box}
.rp-city-lbl{color:#9aa2ad;font:700 12px "Golos Text";text-transform:uppercase;letter-spacing:.05em;margin:16px 8px 6px}
.rp-city-list{max-height:340px;overflow-y:auto;margin-top:2px}
.rp-city-list::-webkit-scrollbar{width:8px}
.rp-city-list::-webkit-scrollbar-thumb{background:#e2e4e9;border-radius:8px}
.rp-city-reg{color:#c0c5cd;font:800 10.5px "Golos Text";text-transform:uppercase;letter-spacing:.06em;padding:13px 14px 4px}
.rp-city-item{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 14px;border-radius:11px;text-decoration:none;color:var(--rp-ink);font:600 16px "Golos Text",system-ui}
a.rp-city-item:hover{background:var(--rp-grey)}
.rp-city-nm{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rp-city-cnt{flex:0 0 auto;font:600 13px "Golos Text";color:#9aa2ad;white-space:nowrap}
.rp-city-item.rp-on{font-weight:800}
.rp-city-item.rp-on .rp-city-cnt{display:none}
.rp-city-item.rp-on::after{content:"✓";color:var(--rp-yellow);font-weight:900;font-size:18px;flex:0 0 auto}
.rp-city-none{display:none;color:#9aa2ad;font:600 15px "Golos Text";padding:16px 14px;text-align:center}
/* Прячет НЕсовпавшие в поиске. Классом, а не inline-стилем: на телефоне список усечён
   через CSS, и «показать» через style.display='' там ничего не показывало. */
.rp-city-item.rp-hide,.rp-city-reg.rp-hide{display:none}
/* Во время поиска показан весь список, и «Популярные» дают второй такой же пункт —
   прячем их (кроме Москвы, которую ставим вручную: у неё нет data-pop-idx) */
.rp-city-list.rp-q .rp-city-reg[data-reg="popular"],
.rp-city-list.rp-q .rp-city-item[data-pop-idx]{display:none}
.rp-hero-cta-row{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:28px}
.rp-cta{display:inline-flex;align-items:center;gap:8px;background:var(--rp-yellow);color:var(--rp-ink);text-decoration:none;font:800 16px "Golos Text",system-ui;padding:16px 27px;border-radius:14px;transition:.16s}
.rp-cta:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(255,207,8,.45)}
.rp-cta2{display:inline-flex;align-items:center;background:rgba(255,255,255,.17);color:#fff;text-decoration:none;font:800 16px "Golos Text",system-ui;padding:16px 25px;border-radius:14px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1.5px solid rgba(255,255,255,.38)}
.rp-cta2:hover{background:rgba(255,255,255,.27)}
.rp-hstats{display:flex;gap:12px;flex-wrap:wrap}
.rp-hstats div{background:rgba(255,255,255,.15);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:14px;padding:13px 24px;text-align:center}
.rp-hstats b{display:block;font:900 26px "Golos Text",system-ui;color:#fff}
.rp-hstats span{font:600 13px "Golos Text";color:rgba(255,255,255,.86)}
/* Сердечко «Мой план» из шапки убрано: та же ссылка /plan/ есть в нижнем
   таб-баре, а он показывается ровно по этому же порогу (max-width:768px).
   Освободившийся 51px отдан названию курорта. */
@media(max-width:768px){
  #rp-plan-link{display:none!important}
}
@media(max-width:860px){
  .rp-hdr-in{gap:8px;padding:10px 14px}
  /* Гео-кнопка с названием курорта. Раньше на телефоне оставалась одна булавка,
     и гость не видел, какой курорт выбран, — а это главный контекст страницы.
     Пилюля забирает свободное место шапки и обрезает хвост многоточием,
     поэтому длинное название её не ломает. */
  .rp-hdr .rp-city-hdr{display:flex;flex:1 1 auto;min-width:0}
  .rp-city-hbtn{padding:8px 11px;gap:5px;min-width:0;max-width:100%;font-size:14px}
  .rp-city-hbtn svg{flex:0 0 auto}
  .rp-city-hbtn b{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .rp-city-hbtn .rp-chev{display:inline-flex;flex:0 0 auto}
  /* Окошко выбора города — то же самое, что на десктопе, но компактное: свой город
     + всего 3 «Популярных», без разбивки по регионам, чтобы не растягивалось на весь экран */
  .rp-hdr .rp-city-drop{position:fixed;left:12px;right:12px;top:64px;margin-top:0;width:auto;max-width:none}
  /* …но ТОЛЬКО пока в поиске пусто (.rp-q ставит rpCityFilter): иначе усечение переживало
     ввод и «Москва» с телефона не находилась — она 4-я в популярных и попадала под правило. */
  .rp-city-list:not(.rp-q) .rp-city-item:not([data-reg="popular"]):not([data-reg="current"]),
  .rp-city-list:not(.rp-q) .rp-city-reg:not([data-reg="popular"]),
  .rp-city-list:not(.rp-q) .rp-city-item[data-pop-idx="4"],
  .rp-city-list:not(.rp-q) .rp-city-item[data-pop-idx="5"],
  .rp-city-list:not(.rp-q) .rp-city-item[data-pop-idx="6"]{display:none}
  .rp-all span{display:none}
  .rp-all{padding:0 12px}
  /* На телефоне от кнопки остаётся кружок с иконкой: прячем подпись, но не обёртку
     иконки и не счётчик — они тоже span, а правило было по всем вложенным */
  .rp-act-txt>span:not(.rp-plan-ico){display:none}
  .rp-act-txt{width:44px;padding:0}
  .rp-menu{left:auto;right:0;min-width:0;width:min(90vw,320px)}
  /* на телефоне подсказки во всю ширину экрана, а не под узким полем */
  .rp-sugg{position:fixed;left:8px;right:8px;top:62px}
  /* телефонный масштаб с макета: заголовок 27px, подпись 14px, пилюля компактнее */
  .rp-hero{min-height:256px;padding:22px 16px 26px}
  .rp-hero-in h1,body.has-tour .rp-hero-in h1{font-size:27px!important;margin-bottom:9px}
  .rp-hero-sub{font-size:14px;margin-bottom:14px;max-width:none}
  .rp-hero-in .rp-city-btn{padding:9px 14px;font-size:14px}
  /* ── Мобильная шапка: строка поиска видна всегда, в ОДНОЙ строке с
     логотипом и гамбургером — не спрятана за значком лупы и не занимает
     отдельную вторую строку (владелец, 05.09.2026, второй заход: по записям
     визитов видно — люди листают карточки, не находят что искали, и уходят;
     значок вместо поля не замечают, как и на большинстве сайтов с такой
     экономией места; двухстрочный вариант с прошлого захода — лишняя высота,
     объединили с городом — освободившегося места хватает на одну строку).
     Тап по полю по-прежнему разворачивает полноэкранный поиск с подсказками
     и «Отмена» — это не менялось. */
  .rp-searchbar{height:46px}
  .rp-sb-div{display:none}
  .rp-actions{margin-left:auto}
  /* Логотип чуть меньше — в одной строке с ним теперь ещё и поле поиска,
     а на телефоне узко (был только гамбургер, город переехал в поле). */
  .rp-logo-svg{height:38px}
  /* «Липнет только поле поиска» — класс ставит JS выше (rpToggleCity рядом).
     Полноэкранный поиск (rp-search-mode) прячет их же своим правилом ниже —
     конфликта нет, оба говорят display:none одному и тому же. */
  body.at3-hdr-mini .rp-hdr-in .rp-logo,
  body.at3-hdr-mini .rp-hdr-in .rp-actions{display:none}
  body.rp-search-mode{overflow:hidden}
  body.rp-search-mode .rp-hdr{position:fixed;top:0;left:0;right:0;height:auto;z-index:9800;border-bottom:0}
  /* Сетка вместо flex-wrap: у flex-обёртки .rp-searchbar своя внутренняя ширина
     считается неоднозначно (авто/0-базис по-разному "не влезает" рядом с гео-кнопкой),
     поэтому даём .rp-searchbar display:contents — её дети становятся прямыми ячейками
     грида шапки, и раскладка по строкам/колонкам детерминирована. */
  body.rp-search-mode .rp-hdr-in{display:grid;grid-template-columns:auto 1fr auto auto;column-gap:8px;row-gap:8px;align-items:center}
  body.rp-search-mode .rp-logo,body.rp-search-mode .rp-actions{display:none}
  /* геокнопка остаётся видна в поиске — слева от «Все разделы», со своим текстом */
  body.rp-search-mode .rp-city-hdr{display:block;grid-column:1;grid-row:1}
  body.rp-search-mode .rp-city-hdr .rp-city-hbtn{padding:9px 12px}
  body.rp-search-mode .rp-city-hdr .rp-city-hbtn b,body.rp-search-mode .rp-city-hdr .rp-city-hbtn .rp-chev{display:inline}
  body.rp-search-mode .rp-searchbar{display:contents}
  body.rp-search-mode .rp-sb-wrap,body.rp-search-mode .rp-sb-go,body.rp-search-mode .rp-sb-cancel{height:46px}
  body.rp-search-mode .rp-sb-wrap{grid-column:1/3;grid-row:2}
  body.rp-search-mode .rp-sb-go{grid-column:3;grid-row:2}
  body.rp-search-mode .rp-sb-cancel{grid-column:4;grid-row:2;display:block}
  body.rp-search-mode .rp-sb-div{display:none}
  /* «Все разделы» — справа от гео-кнопки, в той же первой строке грида */
  body.rp-search-mode .rp-all-wrap{grid-column:2/5;grid-row:1;height:auto}
  body.rp-search-mode .rp-all{width:100%;height:46px;justify-content:space-between;background:var(--rp-grey);border-radius:12px;padding:0 14px}
  body.rp-search-mode .rp-all span{display:inline}
  /* меню категорий — шторкой поверх результатов поиска, с затемнением фона */
  body.rp-search-mode #rp-menu{position:fixed;left:0;right:0;top:auto;bottom:0;margin-top:0;border-radius:20px 20px 0 0;width:100%;max-width:none;min-width:0;max-height:75vh;z-index:9850;box-shadow:0 -10px 40px rgba(20,20,20,.28)}
  /* затемнение — псевдоэлемент именно .rp-hdr (не body!): .rp-hdr сам является stacking
     context (position:fixed+z-index), поэтому #rp-menu (z-index внутри контекста) экранируется
     затемнением body-уровня, если оно выше .rp-hdr по z-index — тогда шторка тоже темнеет */
  body.rp-search-mode .rp-hdr:has(#rp-menu:not([hidden]))::before{content:'';position:fixed;inset:0;background:rgba(20,20,20,.45);z-index:9840}
  body.rp-search-mode .rp-sugg{position:fixed;left:0;right:0;top:66px;bottom:0;max-height:none;border:0;border-radius:0;box-shadow:none;padding:6px 8px 24px;z-index:9820}
  body.rp-search-mode .rp-sugg[hidden]{display:block}
}

/* Узкий телефон. Бюджет пилюли жёсткий: 390 − логотип 110 − две кнопки 95 −
   отступы и зазоры 44 = 141px. С шевроном и кеглем 14 в него не влезал даже
   «Кисловодск». Убираем шеврон (пилюля и так читается как кнопка — булавка,
   серый фон, тап) и снимаем один пункт кегля: помещаются 48 курортов из 49,
   «Солнечногорское» доедает многоточие. */
@media(max-width:430px){
  .rp-city-hbtn{padding:7px 10px;gap:4px;font-size:13px}
  .rp-city-hbtn .rp-chev{display:none}
}
