/* =========================================================================
   REBPM 3.0 — оформление темы (стиль cian.ru: белый фон, воздух, синий акцент).

   Грузится ПОСЛЕДНИМ (см. Layouts/default.ctp), поэтому перекрывает
   realia/bootstrap (это Bootstrap 2), select2, jquery-ui и стили плагинов.

   Разделы:
     1. переменные и база
     2. типовые элементы (контейнер, секции, кнопки, поля)
     3. шапка и меню
     4. первый экран (hero)
    4а. слайдер CMS (Agency.Slider + slick)
     5. строка поиска (filter_widget)
    5а. страховка: строка поиска нарисована не темой (микроблок)
     6. плитки разделов, чипы подборок, «почему мы», блок заявки
     7. карточка объекта и списки объектов
    7а. фотография объекта и заглушка «нет фото»
    7б. компактный список объектов (виджеты «Последние» / «Новые» / «Похожие»)
    7в. страховка для НЕпереопределённых виджетов объектов
     8. внутренние страницы (Nodes, сайдбар, пагинация)
    8а. каталог объектов (шапка, крошки, панель сортировки, пустой результат)
    8б. фильтр каталога (чужая разметка Agency: поля, диапазоны, ползунок, кнопки)
    8в. карточка объекта (сетка «контент + правая колонка», сайдбар, агент)
    8г. галерея фотографий объекта (.rb3-gallery)
     9. подвал
    9а. секции перед подвалом (услуги, регион «Главная : Преимущества»)
    10. страница 404
    11. адаптив
   ========================================================================= */


/* ----------------------------------------- 1. переменные и база --------- */
:root {
    /* Палитра в духе cian.ru */
    --rb3-blue: #0468ff;
    --rb3-blue-dark: #0353cc;
    --rb3-blue-soft: #eaf2ff;
    --rb3-green: #2f9c00;
    --rb3-red: #e8442f;
    --rb3-text: #152242;
    --rb3-muted: #7a7f94;
    --rb3-border: #e4e6ef;
    --rb3-border-soft: #eef0f5;
    --rb3-bg: #fff;
    --rb3-bg-light: #f7f8fa;

    --rb3-radius: 12px;
    --rb3-radius-lg: 20px;
    --rb3-shadow: 0 2px 10px rgba(21, 34, 66, .06);
    --rb3-shadow-hover: 0 8px 28px rgba(21, 34, 66, .12);

    /* Лёгкость темы — это в первую очередь расстояния между элементами.
       Все вертикальные отступы секций считаются от этих двух переменных. */
    --rb3-container: 1264px;
    --rb3-gap: 28px;
    --rb3-section-pad: 88px;

    --rb3-font: 'Lato', -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
}

body.rb3-body {
    font-family: var(--rb3-font);
    color: var(--rb3-text);
    background: var(--rb3-bg);
    font-size: 16px;
    line-height: 1.6;
}

/* ⚠ Все блоки темы считают ширину ВМЕСТЕ с padding и border.
   Это не косметика, а обязательное условие вёрстки: базовый realia/bootstrap —
   Bootstrap 2, он НЕ объявляет border-box глобально (только для
   `.row-fluid [class*="span"]`, `.input-block-level` и пары компонентов). Без
   этого правила:
     • `.rb3-container` (width:100% + padding 0 24px) становится на 48px ШИРЕ
       родителя — контент вылезает за секцию, появляется горизонтальная
       прокрутка, и контейнер перестаёт совпадать с `.rb3-header__inner`;
     • `.rb3-input` (height:48px + padding + border) получается ~72px вместо 48,
       и поля строки поиска не совпадают по высоте с кнопкой «Найти».
   Правило НАМЕРЕННО ограничено классами темы (`rb3-`): переключать в border-box
   всю страницу нельзя — на content-box рассчитаны сетка `.span*` Bootstrap 2
   (фиксированные ширины в px) и шаблоны плагинов. */
.rb3-body [class^="rb3-"],
.rb3-body [class*=" rb3-"],
.rb3-body [class^="rb3-"]::before,
.rb3-body [class^="rb3-"]::after,
.rb3-body [class*=" rb3-"]::before,
.rb3-body [class*=" rb3-"]::after {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
}

/* ⚠ Специфичность: `.rb3-body a` — это (0,1,1). Любое одноклассовое правило
   темы (`.rb3-logo`, `.rb3-footer__title` — 0,1,0) ему проигрывает НЕЗАВИСИМО
   от порядка в файле. Поэтому правилам на `<a>` ниже селектор пишется
   с префиксом-контекстом (`.rb3-body .rb3-logo`). */
.rb3-body a {
    color: var(--rb3-blue);
    text-decoration: none;
    -webkit-transition: color .15s ease;
            transition: color .15s ease;
}

.rb3-body a:hover,
.rb3-body a:focus {
    color: var(--rb3-blue-dark);
    text-decoration: none;
}

/* Цвет заголовкам НЕ задаём: bootstrap объявляет `h1…h6 { color: inherit }`,
   значит они наследуют цвет от `body` и корректно выглядят на любом фоне. */
.rb3-body h1,
.rb3-body h2,
.rb3-body h3,
.rb3-body h4 {
    font-family: var(--rb3-font);
    font-weight: 900;
    line-height: 1.2;
    margin: 0;
}

/* ⚠ `img { max-width: 100% }` НЕЛЬЗЯ объявлять глобально: тайлы и спрайты
   меток Яндекс.Карт — обычные `<img>` внутри абсолютно позиционированных слоёв,
   и сжатые этим правилом они уводят подложку относительно меток (снаружи это
   «карта смотрит не туда, объектов на ней нет»). Поэтому правило ограничено
   контентом темы, а для карт стоит явная отмена ниже. */
.rb3-body .rb3-wrapper img {
    max-width: 100%;
    height: auto;
}

.rb3-body ymaps img,
.rb3-body .map-wrapper img,
.rb3-body #map img,
.rb3-body .ymaps-2-1-79-map img {
    max-width: none;
    max-height: none;
}

.rb3-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    min-height: 100vh;
}

.rb3-main {
    -webkit-box-flex: 1;
        -ms-flex: 1 0 auto;
            flex: 1 0 auto;
}


/* --------------------------------------- 2. типовые элементы ------------ */
.rb3-container {
    width: 100%;
    max-width: var(--rb3-container);
    margin: 0 auto;
    padding: 0 24px;
}

/* Секция — основной «кирпич» лёгкой вёрстки: белый фон и большие вертикальные
   отступы. Именно из них складывается «воздух» между блоками. */
.rb3-section {
    padding: var(--rb3-section-pad) 0;
    background: var(--rb3-bg);
}

.rb3-section_light {
    background: var(--rb3-bg-light);
}

.rb3-section_tiles {
    /* плитки идут сразу за строкой поиска — верхний отступ меньше */
    padding-top: 56px;
    padding-bottom: 24px;
}

/* ⚠ Между слайдером «Специальные предложения» и «Предложениями дня»
   складывались ДВА полных отступа секции (88px снизу + 88px сверху) — на
   экране это выглядело как пустой экран между блоками. Слайдер и список
   объектов — части одного смыслового блока «предложения», поэтому здесь
   отступ сокращён; «воздух» остальных секций не меняется. */
.rb3-slider-section {
    padding-bottom: 28px;
}

.rb3-slider-section + .rb3-objects,
.rb3-slider-region + .rb3-objects {
    padding-top: 44px;
}

.rb3-section__head {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 36px;
}

.rb3-section__title {
    font-size: 32px;
    letter-spacing: -.4px;
}

.rb3-body .rb3-section__more {
    font-size: 15px;
    font-weight: 700;
    color: var(--rb3-blue);
    white-space: nowrap;
}

.rb3-body .rb3-section__more::after {
    content: ' →';
}

/* --- кнопки ------------------------------------------------------------- */
/* ⚠ Селекторы с `.rb3-body` — чтобы перебить `.rb3-body a` (0,1,1) и
   `.btn` Bootstrap 2 (у него градиент, тень и text-shadow). */
.rb3-body .rb3-btn {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    min-height: 48px;
    padding: 0 26px;
    border: 1.5px solid transparent;
    border-radius: var(--rb3-radius);
    background: var(--rb3-blue);
    color: #fff;
    font-family: var(--rb3-font);
    font-size: 16px;
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
    text-shadow: none;
    box-shadow: none;
    cursor: pointer;
    -webkit-transition: background .15s ease, border-color .15s ease, color .15s ease;
            transition: background .15s ease, border-color .15s ease, color .15s ease;
}

.rb3-body .rb3-btn_blue {
    background: var(--rb3-blue);
    border-color: var(--rb3-blue);
    color: #fff;
}

.rb3-body .rb3-btn_blue:hover {
    background: var(--rb3-blue-dark);
    border-color: var(--rb3-blue-dark);
    color: #fff;
}

.rb3-body .rb3-btn_ghost {
    background: #fff;
    border-color: var(--rb3-border);
    color: var(--rb3-text);
}

.rb3-body .rb3-btn_ghost:hover {
    background: #fff;
    border-color: var(--rb3-blue);
    color: var(--rb3-blue);
}

.rb3-body .rb3-btn_sm {
    min-height: 40px;
    padding: 0 18px;
    font-size: 15px;
}

/* --- поля ввода --------------------------------------------------------- */
.rb3-body .rb3-input,
.rb3-body input.rb3-input,
.rb3-body select.rb3-select {
    width: 100%;
    height: 48px;
    margin: 0;
    padding: 0 16px;
    border: 1.5px solid var(--rb3-border);
    border-radius: var(--rb3-radius);
    background: #fff;
    font-family: var(--rb3-font);
    font-size: 16px;
    color: var(--rb3-text);
    box-shadow: none;
    -webkit-transition: border-color .15s ease;
            transition: border-color .15s ease;
}

.rb3-body .rb3-input:focus,
.rb3-body select.rb3-select:focus {
    border-color: var(--rb3-blue);
    outline: none;
    box-shadow: none;
}

.rb3-body .rb3-input::-webkit-input-placeholder { color: var(--rb3-muted); }
.rb3-body .rb3-input::-moz-placeholder          { color: var(--rb3-muted); opacity: 1; }
.rb3-body .rb3-input:-ms-input-placeholder      { color: var(--rb3-muted); }

/* кнопка «наверх» */
.rb3-scrollup {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 40;
    width: 48px;
    height: 48px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    /* дублируем геометрию на случай, если display переопределят извне */
    line-height: 48px;
    text-align: center;
    padding: 0;
    border: 1px solid var(--rb3-border);
    border-radius: 50%;
    background: #fff;
    color: var(--rb3-text);
    box-shadow: var(--rb3-shadow);
    cursor: pointer;
    opacity: 0;
    visibility: hidden;
    -webkit-transform: translateY(8px);
            transform: translateY(8px);
    -webkit-transition: opacity .2s ease, visibility .2s ease, -webkit-transform .2s ease;
            transition: opacity .2s ease, visibility .2s ease, transform .2s ease;
}

.rb3-scrollup.is-visible {
    opacity: 1;
    visibility: visible;
    -webkit-transform: none;
            transform: none;
}

.rb3-scrollup:hover {
    border-color: var(--rb3-blue);
    color: var(--rb3-blue);
}

.rb3-flash {
    padding-top: 20px;
}

.rb3-seo-text {
    padding-top: 32px;
    padding-bottom: 32px;
    color: var(--rb3-muted);
    font-size: 15px;
}


/* ------------------------------------------- 3. шапка и меню ------------ */
.rb3-header {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 50;
    background: #fff;
    border-bottom: 1px solid var(--rb3-border-soft);
    -webkit-transition: box-shadow .2s ease;
            transition: box-shadow .2s ease;
}

/* тень появляется только при прокрутке (класс ставит rebpm3.js, п. 2):
   на белой странице постоянная тень под белой шапкой смотрится грязно */
.rb3-header.is-stuck {
    box-shadow: 0 2px 12px rgba(21, 34, 66, .08);
}

.rb3-header__inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 24px;
    min-height: 76px;
}

/* --- логотип (Elements/logo.ctp) ----------------------------------------
   Знак темы (`webroot/img/logo.svg`) + название сайта. Если в настройках
   заполнена `Site.logo`, вместо знака печатается загруженная картинка;
   при её недоступности `rebpm3.js` (п. 12) возвращает знак темы, чтобы в
   шапке никогда не оставалось пустое место вместо логотипа.
   ------------------------------------------------------------------------ */
.rb3-body .rb3-logo {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 10px;
    -ms-flex-negative: 0;
        flex-shrink: 0;
    color: var(--rb3-text);
}

.rb3-logo__img {
    display: block;
    max-height: 44px;
    max-width: 220px;
    width: auto;
}

.rb3-logo__mark {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    width: 40px;
    height: 40px;
    -ms-flex-negative: 0;
        flex-shrink: 0;
}

.rb3-logo__mark img,
.rb3-logo__mark svg {
    display: block;
    width: 40px;
    height: 40px;
}

.rb3-logo__name {
    font-size: 21px;
    font-weight: 900;
    letter-spacing: -.5px;
    line-height: 1.1;
    white-space: nowrap;
}

/* Название сайта в шапке прячется только на очень узких экранах (см. §11):
   на планшете под бургером место есть, а знак без подписи читается хуже. */
.rb3-logo__text {
    font-size: 24px;
    font-weight: 900;
    letter-spacing: -.5px;
}

.rb3-nav {
    -webkit-box-flex: 1;
        -ms-flex: 1 1 auto;
            flex: 1 1 auto;
    min-width: 0;
}

.rb3-nav__body {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    gap: 20px;
}

/* Меню из плагина Menus. Разметка: .rb3-menu > ul.rb3-nav__list > li > a
   ⚠ `min-width: 0` обязателен: без него flex-элемент не может стать уже
   своего содержимого, и длинное меню распирает шапку вместо того, чтобы
   отдать лишние пункты в «Ещё» (rebpm3.js, п. 11). */
.rb3-menu {
    -webkit-box-flex: 1;
        -ms-flex: 1 1 auto;
            flex: 1 1 auto;
    min-width: 0;
}

.rb3-nav__list,
.rb3-nav__list li {
    list-style: none;
    margin: 0;
    padding: 0;
}

/* ⚠ Перенос строки ВЫКЛЮЧЕН намеренно (`flex-wrap: nowrap`).
   С `wrap` последние пункты («Избранное») сваливались на вторую строку и
   наезжали на первый экран. Теперь пункты, которым не хватило места,
   переезжают в выпадающее «Ещё» — его собирает `rebpm3.js` (п. 11).
   `overflow: hidden` — страховка на случай, если JS не отработал:
   лучше обрезать хвост меню, чем сломать высоту шапки. */
.rb3-nav__list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 22px;
    flex-wrap: nowrap;
    overflow: hidden;
}

.rb3-nav__list > li {
    position: relative;
    -ms-flex-negative: 0;
        flex-shrink: 0;
}

.rb3-body .rb3-nav__list > li > a {
    display: block;
    padding: 8px 0;
    color: var(--rb3-text);
    font-size: 15px;
    font-weight: 700;
    white-space: nowrap;
}

/* --- пункт «Ещё» (создаётся скриптом, в разметке шаблона его нет) ------- */
.rb3-nav__more {
    position: relative;
}

.rb3-nav__more[hidden] {
    display: none;
}

.rb3-body .rb3-nav__more-btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 6px;
    padding: 8px 0;
    border: none;
    background: none;
    color: var(--rb3-text);
    font-family: var(--rb3-font);
    font-size: 15px;
    font-weight: 700;
    white-space: nowrap;
    cursor: pointer;
}

.rb3-body .rb3-nav__more-btn::after {
    content: '';
    width: 6px;
    height: 6px;
    margin-top: -3px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    -webkit-transform: rotate(45deg);
            transform: rotate(45deg);
}

.rb3-body .rb3-nav__more:hover .rb3-nav__more-btn,
.rb3-body .rb3-nav__more:focus-within .rb3-nav__more-btn {
    color: var(--rb3-blue);
}

/* выпадающий список «Ещё» — та же карточка, что у второго уровня меню */
.rb3-nav__more > .rb3-nav__sub {
    right: 0;
    left: auto;
}

.rb3-nav__more:hover > .rb3-nav__sub,
.rb3-nav__more:focus-within > .rb3-nav__sub {
    opacity: 1;
    visibility: visible;
    -webkit-transform: none;
            transform: none;
}

/* пункт, переехавший в «Ещё», — обычная строка списка, а не строка шапки */
.rb3-nav__more > .rb3-nav__sub > li {
    position: relative;
}

.rb3-body .rb3-nav__more > .rb3-nav__sub > li > a {
    display: block;
    padding: 9px 20px;
    color: var(--rb3-text);
    font-size: 15px;
    font-weight: 700;
    white-space: nowrap;
}

.rb3-body .rb3-nav__more > .rb3-nav__sub > li > a:hover {
    background: var(--rb3-blue-soft);
    color: var(--rb3-blue);
}

/* третий уровень внутри «Ещё» выпадать некуда — показываем списком */
.rb3-nav__more > .rb3-nav__sub .rb3-nav__sub {
    position: static;
    opacity: 1;
    visibility: visible;
    min-width: 0;
    padding: 0 0 6px 16px;
    border: none;
    box-shadow: none;
    -webkit-transform: none;
            transform: none;
}

.rb3-body .rb3-nav__list > li > a:hover,
.rb3-body .rb3-nav__list > li.is-active > a {
    color: var(--rb3-blue);
}

/* второй уровень — выпадающий список */
.rb3-nav__sub,
.rb3-nav__sub li {
    list-style: none;
    margin: 0;
    padding: 0;
}

.rb3-nav__sub {
    position: absolute;
    top: 100%;
    left: -16px;
    min-width: 220px;
    padding: 10px 0;
    background: #fff;
    border: 1px solid var(--rb3-border);
    border-radius: var(--rb3-radius);
    box-shadow: var(--rb3-shadow-hover);
    opacity: 0;
    visibility: hidden;
    -webkit-transform: translateY(6px);
            transform: translateY(6px);
    -webkit-transition: opacity .15s ease, visibility .15s ease, -webkit-transform .15s ease;
            transition: opacity .15s ease, visibility .15s ease, transform .15s ease;
    z-index: 5;
}

.rb3-nav__list > li:hover > .rb3-nav__sub,
.rb3-nav__list > li:focus-within > .rb3-nav__sub {
    opacity: 1;
    visibility: visible;
    -webkit-transform: none;
            transform: none;
}

.rb3-body .rb3-nav__sub a {
    display: block;
    padding: 9px 20px;
    color: var(--rb3-text);
    font-size: 15px;
    font-weight: 400;
    white-space: nowrap;
}

.rb3-body .rb3-nav__sub a:hover {
    background: var(--rb3-blue-soft);
    color: var(--rb3-blue);
}

.rb3-nav__right {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 20px;
    -ms-flex-negative: 0;
        flex-shrink: 0;
}

.rb3-nav__contacts {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    line-height: 1.25;
}

.rb3-body .rb3-nav__phone {
    color: var(--rb3-text);
    font-size: 17px;
    font-weight: 900;
    white-space: nowrap;
}

.rb3-body .rb3-nav__phone:hover {
    color: var(--rb3-blue);
}

.rb3-body .rb3-nav__phone_second {
    font-size: 14px;
    font-weight: 400;
    color: var(--rb3-muted);
}

.rb3-body .rb3-nav__cta {
    min-height: 44px;
    padding: 0 20px;
    font-size: 15px;
}

/* бургер */
.rb3-burger {
    display: none;
    width: 44px;
    height: 44px;
    margin-left: auto;
    padding: 0;
    border: 1px solid var(--rb3-border);
    border-radius: 10px;
    background: #fff;
    cursor: pointer;
}

.rb3-burger span {
    display: block;
    width: 20px;
    height: 2px;
    margin: 4px auto;
    background: var(--rb3-text);
    border-radius: 2px;
}


/* ------------------------------------------------- 4. hero -------------- */
.rb3-hero {
    padding: 72px 0 40px;
    background: -webkit-linear-gradient(top, var(--rb3-blue-soft) 0%, #fff 100%);
    background: linear-gradient(180deg, var(--rb3-blue-soft) 0%, #fff 100%);
}

.rb3-hero__inner {
    max-width: 840px;
    text-align: center;
}

.rb3-hero__eyebrow {
    margin: 0 0 18px;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    color: var(--rb3-blue);
}

.rb3-hero__title {
    font-size: 54px;
    line-height: 1.08;
    letter-spacing: -1.2px;
    margin: 0 0 24px;
}

.rb3-hero__title span {
    color: var(--rb3-blue);
}

.rb3-hero__subtitle {
    font-size: 19px;
    line-height: 1.6;
    color: var(--rb3-muted);
}

.rb3-hero__subtitle p {
    margin: 0 0 10px;
}

.rb3-hero__note {
    margin: 22px 0 0;
    font-size: 15px;
    color: var(--rb3-muted);
}

.rb3-hero__note strong {
    color: var(--rb3-text);
}


/* ------------------------------------- 4а. слайдер CMS (Agency.Slider) --
   Разметку печатает `Elements/home/slider.ctp` темы ИЛИ блок региона
   `main_slider`, собранный штатным способом:

     .slick-sliders > .slider-content > .slide
                                        ├ .image-wrapper > a.main-photo-wrap > img.main-photo
                                        └ .slider-info > .main-slider.title …

   Инициализацию slick делает `webroot/js/rebpm3.js` (п. 7).
   ⚠ Правило `:not(.slick-initialized) .slide + .slide { display: none }`
   страхует случай «JS не отработал»: без него все слайды встают стопкой
   и первый экран «разъезжается» на всю высоту галереи.
   ------------------------------------------------------------------------ */
.rb3-slider,
.rb3-slider-region .slick-sliders {
    position: relative;
    border-radius: var(--rb3-radius-lg);
    overflow: hidden;
    background: var(--rb3-bg-light);
}

.rb3-body .slick-sliders .slider-content:not(.slick-initialized) .slide + .slide {
    display: none;
}

.rb3-body .slick-sliders .slide {
    position: relative;
}

.rb3-body .slick-sliders .image-wrapper,
.rb3-body .slick-sliders .main-photo-wrap {
    display: block;
    width: 100%;
}

.rb3-body .slick-sliders .main-photo {
    display: block;
    width: 100%;
    height: 440px;
    -o-object-fit: cover;
       object-fit: cover;
}

/* подпись слайда — лёгкая белая карточка поверх фото, без тёмной «шторы» */
.rb3-body .slick-sliders .slider-info {
    position: absolute;
    left: 24px;
    bottom: 24px;
    max-width: 70%;
    padding: 18px 22px;
    background: rgba(255, 255, 255, .95);
    border-radius: var(--rb3-radius);
    box-shadow: var(--rb3-shadow);
}

.rb3-body .slick-sliders .slider-info .main-slider.title {
    font-size: 24px;
    font-weight: 900;
    line-height: 1.2;
    color: var(--rb3-text);
}

.rb3-body .slick-sliders .slider-info .block-slider-street {
    margin-top: 6px;
    font-size: 16px;
    font-weight: 400;
}

.rb3-body .slick-sliders .slider-info .block-slider-street a {
    color: var(--rb3-text);
}

.rb3-body .slick-sliders .rb3-slide__type,
.rb3-body .slick-sliders .rb3-slide__price-suffix {
    font-size: 14px;
    font-weight: 400;
    color: var(--rb3-muted);
}

/* стрелки и точки slick */
.rb3-body .rb3-slider__arrow {
    position: absolute;
    top: 50%;
    z-index: 3;
    width: 44px;
    height: 44px;
    margin-top: -22px;
    padding: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    border: none;
    border-radius: 50%;
    background: rgba(255, 255, 255, .92);
    color: var(--rb3-text);
    box-shadow: var(--rb3-shadow);
    cursor: pointer;
}

.rb3-body .rb3-slider__arrow_prev { left: 20px; }
.rb3-body .rb3-slider__arrow_next { right: 20px; }

.rb3-body .rb3-slider__arrow:hover {
    background: #fff;
    color: var(--rb3-blue);
}

.rb3-body .slick-sliders .navigation {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 16px;
    z-index: 3;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.rb3-body .slick-sliders .navigation li button {
    width: 8px;
    height: 8px;
    padding: 0;
    border: none;
    border-radius: 50%;
    background: rgba(255, 255, 255, .7);
    font-size: 0;
    cursor: pointer;
}

.rb3-body .slick-sliders .navigation li.slick-active button {
    background: var(--rb3-blue);
}


/* --------------------------------- 5. строка поиска (filter_widget) -----
   Структура, которую печатает `Elements/filter_widget_form.ctp` темы:

     .rb3-search
       ├ .rb3-search__tabs > input.rb3-search__tab-input + label.rb3-search__tab
       └ form.rb3-search__form > .rb3-search__row > .rb3-search__field × N

   ⚠ Поле цены рисует `CustomSearchViewHelper::renderRange()`, и его разметку
   из шаблона изменить НЕЛЬЗЯ:

     div.input.range > label
                     + div.range-wrapper > div.beds.control-group
                                         + div.baths.control-group
                     + div.clearfix

   Поэтому «от/до» приводятся к одной строке правилами ниже, а встроенный
   `<label>` гасится (подпись рисует обёртка темы).
   ------------------------------------------------------------------------ */
.rb3-searchbar {
    padding-bottom: 8px;
    background: -webkit-linear-gradient(top, #fff 0%, #fff 100%);
    background: #fff;
}

/* ⚠ Ширину НЕ ограничиваем: карточка поиска обязана совпадать по краям с
   плитками разделов, слайдером и списком объектов — все секции главной идут
   в одном `.rb3-container`. Раньше здесь стояло `max-width: 1060px`, и строка
   поиска была заметно уже остальных блоков. */
.rb3-search {
    position: relative;
    max-width: none;
    margin: -32px auto 0;
    padding: 28px;
    background: #fff;
    border: 1px solid var(--rb3-border-soft);
    border-radius: var(--rb3-radius-lg);
    box-shadow: 0 10px 40px rgba(21, 34, 66, .10);
}

/* --- вкладки «Купить / Снять» (радиокнопки) ----------------------------- */
.rb3-search__tabs {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 6px;
    margin-bottom: 22px;
    padding: 4px;
    background: var(--rb3-bg-light);
    border-radius: 999px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
}

/* input прячем визуально, но оставляем доступным с клавиатуры */
.rb3-search__tab-input {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
}

.rb3-search__tab {
    display: block;
    margin: 0;
    padding: 9px 26px;
    border-radius: 999px;
    color: var(--rb3-muted);
    font-size: 15px;
    font-weight: 700;
    line-height: 1.2;
    cursor: pointer;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
    -webkit-transition: background .15s ease, color .15s ease;
            transition: background .15s ease, color .15s ease;
}

.rb3-search__tab-input:checked + .rb3-search__tab {
    background: #fff;
    color: var(--rb3-text);
    box-shadow: var(--rb3-shadow);
}

.rb3-search__tab-input:focus-visible + .rb3-search__tab {
    outline: 2px solid var(--rb3-blue);
    outline-offset: 2px;
}

/* --- строка полей ------------------------------------------------------- */
.rb3-search__form {
    margin: 0;
}

.rb3-search__row {
    display: grid;
    grid-template-columns: 1.4fr 1.6fr 1fr auto;
    gap: 16px;
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: end;
}

.rb3-search__field {
    min-width: 0;
}

.rb3-search__cap {
    display: block;
    margin-bottom: 7px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .5px;
    text-transform: uppercase;
    color: var(--rb3-muted);
}

/* обёртки, которые печатают FormHelper и SearchViewHelper */
.rb3-search__field .input,
.rb3-search__field .input.range,
.rb3-search__field .control-group {
    margin: 0;
    padding: 0;
}

/* встроенный <label> renderRange() не нужен — подпись даёт .rb3-search__cap */
.rb3-search__field .input.range > label,
.rb3-search__field .input > label {
    display: none;
}

.rb3-search__field input[type="text"],
.rb3-search__field input[type="number"],
.rb3-search__field input[type="search"],
.rb3-search__field select {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
    width: 100%;
    height: 48px;
    margin: 0;
    padding: 0 16px;
    border: 1.5px solid var(--rb3-border);
    border-radius: var(--rb3-radius);
    background: #fff;
    font-family: var(--rb3-font);
    font-size: 16px;
    color: var(--rb3-text);
    box-shadow: none;
}

.rb3-search__field input:focus,
.rb3-search__field select:focus {
    border-color: var(--rb3-blue);
    outline: none;
    box-shadow: none;
}

/* диапазон «от / до» в одну строку */
.rb3-search__field .range-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 10px;
}

.rb3-search__field .range-wrapper > div,
.rb3-search__field .range-wrapper .control-group {
    position: relative;
    -webkit-box-flex: 1;
        -ms-flex: 1 1 0px;
            flex: 1 1 0;
    min-width: 0;
    margin: 0;
    padding: 0;
}

/* ⚠ Подписи «от»/«до» рисуются псевдоэлементами: в разметке их НЕТ вовсе
   (`CustomSearchViewHelper::renderRange()` выбрасывает `:label-from:` /
   `:label-to:` базового шаблона), а различить два одинаковых пустых поля
   посетителю иначе нечем. Классы `.beds`/`.baths` — наследие вёрстки Realia,
   это именно «от» и «до». */
.rb3-search__field .range-wrapper .beds::before,
.rb3-search__field .range-wrapper .baths::before {
    content: 'от';
    position: absolute;
    left: 14px;
    top: 50%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    font-size: 13px;
    color: var(--rb3-muted);
    pointer-events: none;
}

.rb3-search__field .range-wrapper .baths::before {
    content: 'до';
}

.rb3-search__field .range-wrapper input {
    padding-left: 40px;
}

.rb3-search__field .input.range .clearfix {
    display: none;
}

.rb3-search__submit {
    -ms-flex-negative: 0;
        flex-shrink: 0;
}

.rb3-body .rb3-search__submit input[type="submit"],
.rb3-body .rb3-search__submit .rb3-btn {
    width: 100%;
    min-width: 150px;
    height: 48px;
    min-height: 48px;
    border: none;
    border-radius: var(--rb3-radius);
    background: var(--rb3-blue);
    color: #fff;
    font-family: var(--rb3-font);
    font-size: 16px;
    font-weight: 700;
    text-shadow: none;
    box-shadow: none;
    cursor: pointer;
}

.rb3-body .rb3-search__submit input[type="submit"]:hover {
    background: var(--rb3-blue-dark);
    color: #fff;
}

.rb3-body .rb3-search__advanced {
    display: inline-block;
    margin-top: 18px;
    font-size: 15px;
    font-weight: 700;
}


/* --- 5а. страховка: строка поиска нарисована НЕ темой --------------------
   Если файл `Elements/filter_widget.ctp` удалить из темы (чтобы вернуть
   штатный микроблок `Agency.realty/filter_widget`), в `.rb3-searchbar`
   придёт дефолтная разметка CMS:

     div.span3 > .property-filter.widget > .content > form > div.input × N

   Правила ниже приводят её к виду строки поиска темы: убирают bootstrap-колонку
   и раскладывают поля в ряд. Это именно СТРАХОВКА — основной путь выше.
   ------------------------------------------------------------------------ */
.rb3-searchbar .property-filter,
.rb3-searchbar .widget {
    float: none;
    width: auto;
    max-width: 1060px;
    margin: -32px auto 0;
    padding: 28px;
    background: #fff;
    border: 1px solid var(--rb3-border-soft);
    border-radius: var(--rb3-radius-lg);
    box-shadow: 0 10px 40px rgba(21, 34, 66, .10);
}

.rb3-searchbar .span3,
.rb3-searchbar .span4,
.rb3-searchbar .span9 {
    float: none;
    width: auto;
    margin-left: 0;
}

.rb3-searchbar .property-filter .content {
    padding: 0;
    background: none;
    border: none;
}

.rb3-searchbar .property-filter form {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 16px;
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: end;
    margin: 0;
}

.rb3-searchbar .property-filter .input,
.rb3-searchbar .property-filter .form-actions {
    margin: 0;
    padding: 0;
    background: none;
    border: none;
    box-shadow: none;
}

.rb3-searchbar .property-filter label {
    display: block;
    float: none;
    width: auto;
    margin: 0 0 7px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .5px;
    text-transform: uppercase;
    color: var(--rb3-muted);
}

.rb3-searchbar .property-filter input[type="text"],
.rb3-searchbar .property-filter input[type="number"],
.rb3-searchbar .property-filter select {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
    width: 100%;
    height: 48px;
    padding: 0 16px;
    border: 1.5px solid var(--rb3-border);
    border-radius: var(--rb3-radius);
    box-shadow: none;
}

.rb3-searchbar .property-filter .range-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 10px;
}

.rb3-searchbar .property-filter .range-wrapper > div {
    -webkit-box-flex: 1;
        -ms-flex: 1 1 0px;
            flex: 1 1 0;
    min-width: 0;
    margin: 0;
}

.rb3-searchbar .property-filter .params-slider {
    display: none;
}

.rb3-body .rb3-searchbar .property-filter .btn,
.rb3-body .rb3-searchbar .property-filter input[type="submit"] {
    width: 100%;
    height: 48px;
    border: none;
    border-radius: var(--rb3-radius);
    background: var(--rb3-blue);
    color: #fff;
    font-weight: 700;
    text-shadow: none;
    box-shadow: none;
}


/* ---------------------------- 6. плитки, чипы, преимущества, CTA -------- */
/* --- плитки разделов (меню `catalog`) ----------------------------------- */
.rb3-tiles,
.rb3-tiles li {
    list-style: none;
    margin: 0;
    padding: 0;
}

.rb3-tiles {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(234px, 1fr));
    gap: 16px;
}

.rb3-body .rb3-tiles__item > a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 14px;
    min-height: 76px;
    padding: 14px 18px;
    border: 1px solid var(--rb3-border);
    border-radius: var(--rb3-radius);
    background: #fff;
    color: var(--rb3-text);
    font-size: 16px;
    font-weight: 700;
    -webkit-transition: border-color .15s ease, box-shadow .15s ease, color .15s ease;
            transition: border-color .15s ease, box-shadow .15s ease, color .15s ease;
}

/* Иконка раздела. Разметку печатает `Elements/menu_tile.ctp` (element_item
   для `nestedLinks()`), сам рисунок — `Elements/category_icon.ctp`:
   инлайновый SVG со `stroke: currentColor`, поэтому иконка перекрашивается
   вместе с текстом плитки и не требует отдельных файлов-картинок. */
.rb3-tiles__icon {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    width: 44px;
    height: 44px;
    -ms-flex-negative: 0;
        flex-shrink: 0;
    border-radius: 12px;
    background: var(--rb3-blue-soft);
    color: var(--rb3-blue);
    -webkit-transition: background .15s ease, color .15s ease;
            transition: background .15s ease, color .15s ease;
}

.rb3-tiles__icon svg {
    display: block;
    width: 24px;
    height: 24px;
}

.rb3-tiles__label {
    -webkit-box-flex: 1;
        -ms-flex: 1 1 auto;
            flex: 1 1 auto;
    min-width: 0;
}

.rb3-body .rb3-tiles__item > a::after {
    content: '→';
    margin-left: auto;
    color: var(--rb3-muted);
    font-weight: 400;
}

.rb3-body .rb3-tiles__item > a:hover {
    border-color: var(--rb3-blue);
    box-shadow: var(--rb3-shadow);
    color: var(--rb3-blue);
}

.rb3-body .rb3-tiles__item > a:hover .rb3-tiles__icon {
    background: var(--rb3-blue);
    color: #fff;
}

.rb3-body .rb3-tiles__item > a:hover::after {
    color: var(--rb3-blue);
}

/* второй уровень меню плиток — простыми ссылками под плиткой */
.rb3-tiles__sub,
.rb3-tiles__sub li {
    list-style: none;
    margin: 0;
    padding: 0;
}

.rb3-tiles__sub {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap;
    gap: 6px 14px;
    margin-top: 10px;
    padding-left: 4px;
}

/* ⚠ `nestedLinks()` применяет и `li`, и `element_item` ко ВСЕМ уровням
   рекурсивно: подпункт тоже получает класс `rb3-tiles__item` и разметку
   плитки с иконкой. Ветвления по уровню в хелпере нет, поэтому второй
   уровень возвращаем к виду простой ссылки стилями. */
.rb3-tiles__sub .rb3-tiles__icon {
    display: none;
}

.rb3-body .rb3-tiles__sub .rb3-tiles__item > a,
.rb3-body .rb3-tiles__sub a {
    display: inline;
    min-height: 0;
    padding: 0;
    border: none;
    border-radius: 0;
    background: none;
    box-shadow: none;
    font-size: 14px;
    font-weight: 400;
    color: var(--rb3-muted);
}

.rb3-body .rb3-tiles__sub .rb3-tiles__item > a::after,
.rb3-body .rb3-tiles__sub a::after {
    content: none;
}

.rb3-body .rb3-tiles__sub a:hover {
    color: var(--rb3-blue);
}

/* --- чипы подборок ----------------------------------------------------- */
.rb3-chips-row {
    margin: -8px 0 32px;
}

.rb3-chips,
.rb3-chips li {
    list-style: none;
    margin: 0;
    padding: 0;
}

.rb3-chips {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.rb3-body .rb3-chips__item > a {
    display: inline-block;
    padding: 9px 20px;
    border: 1px solid var(--rb3-border);
    border-radius: 999px;
    background: #fff;
    color: var(--rb3-text);
    font-size: 15px;
    font-weight: 700;
}

.rb3-body .rb3-chips__item > a:hover {
    border-color: var(--rb3-blue);
    color: var(--rb3-blue);
}

.rb3-body .rb3-chips__item > a.is-active,
.rb3-body .rb3-chips__item.is-active > a {
    background: var(--rb3-blue);
    border-color: var(--rb3-blue);
    color: #fff;
}

.rb3-chips__sub {
    display: none; /* вложенные уровни в ряду чипов не показываем */
}

/* --- «почему мы» -------------------------------------------------------- */
.rb3-advantages__grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 40px var(--rb3-gap);
}

.rb3-advantage__icon {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    width: 56px;
    height: 56px;
    margin-bottom: 20px;
    border-radius: 16px;
    background: var(--rb3-blue-soft);
    color: var(--rb3-blue);
    font-size: 22px;
}

.rb3-advantage__title {
    margin-bottom: 10px;
    font-size: 19px;
    font-weight: 900;
}

.rb3-advantage__text {
    margin: 0;
    color: var(--rb3-muted);
    font-size: 16px;
}

/* --- блок заявки (CTA) -------------------------------------------------- */
.rb3-cta {
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    gap: 40px;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    padding: 48px;
    background: var(--rb3-blue-soft);
    border-radius: var(--rb3-radius-lg);
}

.rb3-cta__title {
    margin-bottom: 14px;
    font-size: 30px;
    letter-spacing: -.4px;
}

.rb3-cta__sub {
    color: var(--rb3-muted);
    font-size: 17px;
}

.rb3-cta__sub p {
    margin: 0;
}

.rb3-cta__form {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin: 0;
}

.rb3-body .rb3-cta__form input[type="text"],
.rb3-body .rb3-cta__form input[type="tel"],
.rb3-body .rb3-cta__form input.rb3-input {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
    width: 100%;
    height: 48px;
    padding: 0 16px;
    border: 1.5px solid transparent;
    border-radius: var(--rb3-radius);
    background: #fff;
    box-shadow: none;
}

.rb3-body .rb3-cta__form input[type="submit"] {
    grid-column: 1 / -1;
    height: 48px;
    border: none;
    border-radius: var(--rb3-radius);
    background: var(--rb3-blue);
    color: #fff;
    font-family: var(--rb3-font);
    font-size: 16px;
    font-weight: 700;
    text-shadow: none;
    box-shadow: none;
    cursor: pointer;
}

.rb3-body .rb3-cta__form input[type="submit"]:hover {
    background: var(--rb3-blue-dark);
}

/* ⚠ Галочка согласия и текст — в ОДНУ строку.
   `FormHelper::input()` для чекбокса печатает `<input>` и `<label>`
   СОСЕДЯМИ (label не оборачивает input), а текст согласия приходит из блока
   региона `confirmation` уже свёрстанным (`<p>…</p>`). Блочный `<p>` внутри
   строчного `<label>` переносил текст под галочку — выглядело как «чекбокс
   отдельно, подпись отдельно». Поэтому flex-строкой делается сам контейнер
   `.rb3-cta__confirm`, а блоки внутри подписи обнуляются по отступам. */
.rb3-cta__confirm {
    grid-column: 1 / -1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    flex-wrap: nowrap;
    gap: 8px;
    margin: 0;
    font-size: 13px;
    line-height: 1.45;
    color: var(--rb3-muted);
}

.rb3-cta__confirm label {
    -webkit-box-flex: 1;
        -ms-flex: 1 1 auto;
            flex: 1 1 auto;
    min-width: 0;
    display: block;
    margin: 0;
    padding: 0;
    font-weight: 400;
    line-height: 1.45;
}

/* подпись согласия почти всегда приходит из CKEditor обёрнутой в <p> */
.rb3-cta__confirm label p,
.rb3-cta__confirm label div {
    display: inline;
    margin: 0;
    font-size: inherit;
    line-height: inherit;
    color: inherit;
}

.rb3-cta__confirm input[type="checkbox"] {
    width: 16px;
    height: 16px;
    margin: 2px 0 0;
    -ms-flex-negative: 0;
        flex-shrink: 0;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
}

/* сообщение валидации Cake не должно вставать между галочкой и подписью */
.rb3-cta__confirm .error-message {
    -webkit-box-ordinal-group: 4;
        -ms-flex-order: 3;
            order: 3;
    -webkit-box-flex: 1;
        -ms-flex: 1 0 100%;
            flex: 1 0 100%;
    color: var(--rb3-red);
}

.rb3-cta__captcha {
    grid-column: 1 / -1;
}

.rb3-cta__note {
    margin: 12px 0 0;
    font-size: 13px;
    color: var(--rb3-muted);
}


/* ------------------------- 7. карточка объекта и списки объектов --------
   Карточку печатает `Elements/Realty/object_card.ctp` (её зовут и
   `advertisement_grid`, и `advertisement_row` темы).

   Обёртки, в которых она оказывается:
     .rb3-objects__list              — секция «Предложения дня» на главной
     .properties-grid                — `_list_grid.ctp` скелета (режим «плитка»)
     .properties-rows                — `_list_row.ctp` скелета (режим «список»)
     .hot-wrapper                    — «горячие предложения» (базовая главная)

   ⚠ Клирфикс Bootstrap 2 (`.row:before/.row:after { display: table }`) в
   grid-контейнере становится ДВУМЯ полноценными ячейками сетки и выталкивает
   первую карточку на второе место. Поэтому у всех чужих `.row` внутри
   grid-обёрток псевдоэлементы гасятся.

   ⚠⚠ `.rb3-objects__list` — НЕ сетка карточек, а просто столбец подборок.
   Внутрь неё `AgencyIndexSiteHelper` кладёт пары «заголовок + список»:

       div.h1.page-header  («Горячие предложения»)
       div.properties-grid  (или .properties-rows у outExclusives())
       div.h1.page-header  («Эксклюзивные предложения»)
       div.properties-rows

   Пока `.rb3-objects__list` сама была `display: grid`, эти четыре блока
   становились ЯЧЕЙКАМИ сетки: заголовок занимал первую колонку, а весь
   список объектов — вторую, шириной 280px, и карточки выстраивались в одну
   узкую колонку вместо плитки. Сетку задаём спискам внутри, а не обёртке.
   ------------------------------------------------------------------------ */
.rb3-objects__list {
    display: block;
}

.rb3-body .properties-grid,
.rb3-body .hot-wrapper .properties-grid,
.rb3-objects__list .properties-grid,
.rb3-objects__list .properties-rows {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: var(--rb3-gap);
}

/* отступ между подборками внутри секции «Предложения дня» */
.rb3-objects__list .properties-grid,
.rb3-objects__list .properties-rows {
    margin: 0 0 8px;
}

/* заголовок подборки («Горячие предложения», «Эксклюзивные предложения»):
   базовый хелпер печатает его как `div.h1.page-header > a` */
.rb3-objects__list .page-header {
    margin: 0 0 20px;
    padding: 0;
    border: none;
    font-size: 22px;
    font-weight: 900;
    line-height: 1.2;
    letter-spacing: -.2px;
}

.rb3-objects__list .properties-grid + .page-header,
.rb3-objects__list .properties-rows + .page-header {
    margin-top: 44px;
}

.rb3-body .rb3-objects__list .page-header a {
    color: var(--rb3-text);
}

.rb3-body .rb3-objects__list .page-header a:hover {
    color: var(--rb3-blue);
}

.rb3-objects__list > .row,
.rb3-body .properties-grid > .row,
.rb3-body .properties-rows > .row {
    display: contents;
}

.rb3-objects__list .row::before,
.rb3-objects__list .row::after,
.rb3-body .properties-grid .row::before,
.rb3-body .properties-grid .row::after,
.rb3-body .properties-rows .row::before,
.rb3-body .properties-rows .row::after {
    display: none !important;
    content: none !important;
}

/* bootstrap-колонки внутри списков объектов больше не нужны */
.rb3-objects__list [class*="span"],
.rb3-body .properties-grid [class*="span"],
.rb3-body .properties-rows [class*="span"] {
    float: none;
    width: auto;
    margin-left: 0;
    min-width: 0;
}

.rb3-card {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    background: #fff;
    border: 1px solid var(--rb3-border-soft);
    border-radius: var(--rb3-radius);
    overflow: hidden;
    -webkit-transition: box-shadow .18s ease, border-color .18s ease, -webkit-transform .18s ease;
            transition: box-shadow .18s ease, border-color .18s ease, transform .18s ease;
}

.rb3-card:hover {
    border-color: transparent;
    box-shadow: var(--rb3-shadow-hover);
    -webkit-transform: translateY(-2px);
            transform: translateY(-2px);
}

.rb3-card__media {
    position: relative;
    background: var(--rb3-bg-light);
}

.rb3-card__photo-link {
    display: block;
}

.rb3-card__photo {
    display: block;
    width: 100%;
    height: 200px;
    -o-object-fit: cover;
       object-fit: cover;
}

.rb3-card__badge {
    position: absolute;
    top: 12px;
    left: 12px;
    padding: 4px 11px;
    border-radius: 999px;
    background: var(--rb3-blue);
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .3px;
}

.rb3-card__badge_rent { background: var(--rb3-green); }
.rb3-card__badge_sold { background: var(--rb3-muted); }

.rb3-card__photos {
    position: absolute;
    right: 12px;
    bottom: 12px;
    padding: 3px 10px;
    border-radius: 999px;
    background: rgba(21, 34, 66, .65);
    color: #fff;
    font-size: 12px;
    font-weight: 700;
}

.rb3-card__fav {
    position: absolute;
    top: 10px;
    right: 10px;
}

.rb3-card__body {
    -webkit-box-flex: 1;
        -ms-flex: 1 1 auto;
            flex: 1 1 auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    padding: 20px;
}

.rb3-card__price {
    font-size: 22px;
    font-weight: 900;
    line-height: 1.2;
    letter-spacing: -.3px;
}

/* ⚠ `AdView->priceFormat()` возвращает цену внутри своего тега (у нас 'span');
   сбрасываем унаследованные отступы и размеры, чтобы строка не «прыгала». */
.rb3-card__price span,
.rb3-card__price p {
    margin: 0;
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
    color: inherit;
}

.rb3-card__price .old-price-item {
    margin-right: 8px;
    color: var(--rb3-muted);
    font-size: 15px;
    font-weight: 400;
    text-decoration: line-through;
}

.rb3-card__price-suffix {
    margin-left: 4px;
    color: var(--rb3-muted);
    font-size: 14px;
    font-weight: 400;
}

.rb3-card__specs {
    margin: 8px 0 0;
    color: var(--rb3-text);
    font-size: 15px;
}

.rb3-card__title {
    margin: 8px 0 0;
    font-size: 15px;
    line-height: 1.4;
}

.rb3-body .rb3-card__title a {
    color: var(--rb3-text);
}

.rb3-body .rb3-card__title a:hover {
    color: var(--rb3-blue);
}

.rb3-card__place {
    margin: 8px 0 0;
    color: var(--rb3-muted);
    font-size: 14px;
}

.rb3-card__place .fa-solid {
    margin-right: 4px;
    font-size: 12px;
}

.rb3-card__foot {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: auto;
    padding-top: 16px;
    color: var(--rb3-muted);
    font-size: 13px;
}

.rb3-card__labels {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

.rb3-card__labels > * {
    padding: 2px 8px;
    border-radius: 6px;
    background: var(--rb3-blue-soft);
    color: var(--rb3-blue);
    font-size: 12px;
    font-weight: 700;
}


/* --- 7а. фотография объекта и заглушка «нет фото» -----------------------
   `Elements/Realty/object_photo.ctp` печатает либо `<img>`, либо блок-заглушку
   `.rb3-photo__ph` (НЕ `<img>` — у блока с фоном не бывает «сломанной картинки»).
   Класс заглушки совпадает с классом картинки, поэтому все размеры ниже
   задаются один раз.
   ------------------------------------------------------------------------ */
.rb3-photo__ph {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    background: var(--rb3-bg-light) url('../img/no-photo.svg') no-repeat center 38%;
    background-size: 56px auto;
    color: var(--rb3-muted);
}

.rb3-photo__ph-cap {
    margin-top: 44px;
    font-size: 13px;
}

.rb3-card__photo.rb3-photo__ph {
    width: 100%;
    height: 200px;
}

.rb3-mini__photo.rb3-photo__ph {
    width: 100%;
    height: 150px;
    min-height: 0;
}

.rb3-mini__photo.rb3-photo__ph .rb3-photo__ph-cap,
.rb3-gallery__single.rb3-photo__ph .rb3-photo__ph-cap {
    display: none;
}

.rb3-gallery__single.rb3-photo__ph {
    width: 100%;
    height: 420px;
    border-radius: var(--rb3-radius);
}

.rb3-body .slick-sliders .main-photo.rb3-photo__ph {
    width: 100%;
    height: 440px;
}


/* --- 7б. виджеты объектов «Последние» / «Новые» / «Похожие» -------------
   Разметку печатает `Elements/Realty/object_mini_list.ctp`:

     .widget.properties.rb3-mini-list
       ├ .rb3-mini-list__head  (заголовок + «Все объекты»)
       └ .rb3-mini-list__items > .property.rb3-mini × N

   Вид — ПЛИТКА: карточка «фото сверху, цена и адрес снизу», сетка
   auto-fill. Раньше это был вертикальный список «маленькое фото слева +
   текст справа»: в регионе на всю ширину главной (`main_right_block`,
   `main`) он растягивался в длинную простыню строк. Сетка решает оба
   случая сразу — в узком сайдбаре каталога (300px) auto-fill схлопывается
   в одну колонку и плитка просто становится вертикальной карточкой.
   ------------------------------------------------------------------------ */
.rb3-mini-list {
    padding: 20px;
    background: #fff;
    border: 1px solid var(--rb3-border-soft);
    border-radius: var(--rb3-radius);
}

.rb3-mini-list__head {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    gap: 12px;
    margin-bottom: 16px;
}

.rb3-mini-list__title {
    font-size: 18px;
    font-weight: 900;
}

.rb3-body .rb3-mini-list__more {
    font-size: 14px;
    font-weight: 700;
    white-space: nowrap;
}

.rb3-mini-list__items {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(216px, 1fr));
    gap: 20px;
}

.rb3-mini {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    /* ⚠ обнуляем отступы и разделитель страховочного правила 7в:
       у `.rb3-mini` есть и класс `property` из базовых виджетов */
    padding: 0;
    border: 1px solid var(--rb3-border-soft);
    border-radius: var(--rb3-radius);
    background: #fff;
    overflow: hidden;
    -webkit-transition: box-shadow .18s ease, border-color .18s ease, -webkit-transform .18s ease;
            transition: box-shadow .18s ease, border-color .18s ease, transform .18s ease;
}

.rb3-mini:hover {
    border-color: transparent;
    box-shadow: var(--rb3-shadow-hover);
    -webkit-transform: translateY(-2px);
            transform: translateY(-2px);
}

.rb3-mini__img {
    overflow: hidden;
    background: var(--rb3-bg-light);
}

.rb3-mini__photo-link,
.rb3-mini__photo {
    display: block;
    width: 100%;
}

.rb3-mini__photo {
    height: 150px;
    -o-object-fit: cover;
       object-fit: cover;
}

.rb3-mini__body {
    -webkit-box-flex: 1;
        -ms-flex: 1 1 auto;
            flex: 1 1 auto;
    padding: 14px 16px 16px;
}

.rb3-mini__price {
    font-size: 18px;
    font-weight: 900;
    line-height: 1.2;
}

.rb3-mini__price span,
.rb3-mini__price p {
    margin: 0;
    font-size: inherit;
    font-weight: inherit;
    color: inherit;
}

.rb3-mini__price-suffix {
    color: var(--rb3-muted);
    font-size: 13px;
    font-weight: 400;
}

.rb3-mini__title {
    margin: 6px 0 0;
    font-size: 14px;
    line-height: 1.35;
}

.rb3-body .rb3-mini__title a {
    color: var(--rb3-text);
}

.rb3-body .rb3-mini__title a:hover {
    color: var(--rb3-blue);
}

.rb3-mini__type {
    margin: 4px 0 0;
    color: var(--rb3-muted);
    font-size: 13px;
}


/* --- 7в. страховка для НЕпереопределённых виджетов объектов --------------
   Регионы CMS могут приносить виджеты скелета, которых тема не переопределяла
   (`.widget.properties`, `.widget.properties-grid`, `.property`). Приводим их
   к светлому «карточному» виду, чтобы посреди оформленной страницы не
   появлялась дефолтная вёрстка CMS.
   ------------------------------------------------------------------------ */
.rb3-widgets .widget,
.rb3-section .widget:not(.rb3-mini-list) {
    float: none;
    width: auto;
    margin: 0 0 var(--rb3-gap);
    padding: 20px;
    background: #fff;
    border: 1px solid var(--rb3-border-soft);
    border-radius: var(--rb3-radius);
    box-shadow: none;
}

.rb3-section .widget .title .h2,
.rb3-section .widget .title h2 {
    font-size: 18px;
    font-weight: 900;
}

/* ⚠ `:not(.rb3-mini-list)` обязателен и здесь: плитка темы `.rb3-mini`
   несёт класс `property` из базовых виджетов, и без исключения получала бы
   разделительную линию и вертикальные отступы «списка». */
.rb3-section .widget:not(.rb3-mini-list) .property {
    padding: 12px 0;
    border-bottom: 1px solid var(--rb3-border-soft);
    overflow: hidden;
}

.rb3-section .widget:not(.rb3-mini-list) .property:last-child {
    border-bottom: none;
}

.rb3-section .widget .property .image {
    float: left;
    width: 104px;
    margin-right: 14px;
}

.rb3-section .widget .property .image img {
    width: 100%;
    height: auto;
    border-radius: 10px;
}

.rb3-section .widget .property .price {
    font-size: 17px;
    font-weight: 900;
}


/* ------------------------------------- 8. внутренние страницы ----------- */
.rb3-page {
    padding-top: 48px;
    padding-bottom: var(--rb3-section-pad);
}

.rb3-page__inner {
    max-width: 100%;
}

.rb3-article {
    max-width: 820px;
}

.rb3-article__title,
.rb3-page h1,
.rb3-page .head-title {
    font-size: 38px;
    letter-spacing: -.6px;
    margin: 10px 0 28px;
}

.rb3-article__body {
    font-size: 17px;
    line-height: 1.75;
}

.rb3-article__body h2,
.rb3-article__body h3 {
    margin: 36px 0 14px;
}

.rb3-article__body p {
    margin: 0 0 16px;
}

.rb3-article__body img {
    border-radius: var(--rb3-radius);
}

/* --- крошки ------------------------------------------------------------- */
.rb3-crumbs {
    font-size: 13px;
    color: var(--rb3-muted);
}

.rb3-crumbs__list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 8px;
}

.rb3-body .rb3-crumbs a {
    color: var(--rb3-muted);
}

.rb3-body .rb3-crumbs a:hover {
    color: var(--rb3-blue);
}

.rb3-crumbs__item.is-active {
    color: var(--rb3-text);
}

.rb3-crumbs__sep {
    color: var(--rb3-border);
}

/* --- сетка «контент + сайдбар» вместо .span9/.span3 ---------------------
   Общая для всех внутренних страниц, где базовый шаблон рисует
   `.content > .row > .span9 + .sidebar.span3` (карточка объекта, списки
   плагинов). Ширина правой колонки одна и та же, что в разделе 8в.
   ⚠ Клирфикс `.row:before/:after` обязательно гасить — в grid-контейнере
   он становится двумя ячейками и выталкивает сайдбар на вторую строку. */
.rb3-page .content > .row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: 36px;
    margin: 0;
}

.rb3-page .content > .row::before,
.rb3-page .content > .row::after {
    display: none !important;
    content: none !important;
}

.rb3-page .content > .row > .span9,
.rb3-page .content > .row > .sidebar,
.rb3-page .content > .row > .span3 {
    width: auto;
    float: none;
    margin: 0;
    min-width: 0;
}

.rb3-page .sidebar .widget,
.rb3-page .property-filter {
    background: #fff;
    border: 1px solid var(--rb3-border-soft);
    border-radius: var(--rb3-radius);
    padding: 20px;
    box-shadow: none;
}

.rb3-page .sidebar .widget + .widget {
    margin-top: 20px;
}

.rb3-page .sidebar input[type="text"],
.rb3-page .sidebar input[type="number"],
.rb3-page .sidebar select {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
    width: 100%;
    height: 44px;
    padding: 0 14px;
    border: 1.5px solid var(--rb3-border);
    border-radius: 10px;
    box-shadow: none;
}

.rb3-body .rb3-page .btn,
.rb3-body .rb3-page input[type="submit"],
.rb3-body .rb3-page button[type="submit"] {
    border: none;
    border-radius: var(--rb3-radius);
    background: var(--rb3-blue);
    color: #fff;
    padding: 13px 24px;
    font-family: var(--rb3-font);
    font-weight: 700;
    text-shadow: none;
    box-shadow: none;
}

.rb3-body .rb3-page .btn:hover,
.rb3-body .rb3-page input[type="submit"]:hover {
    background: var(--rb3-blue-dark);
    color: #fff;
}

/* --- пагинация ---------------------------------------------------------- */
.rb3-page .pagination,
.rb3-page .paginator {
    margin: 40px 0 0;
    text-align: left;
}

.rb3-page .pagination ul,
.rb3-page .paginator ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
    box-shadow: none;
    border: none;
}

/* ⚠ СТРОГО дочерние селекторы (`li > a`, `li > span`).
   Стрелки пагинации — `<a><span class="fa-solid fa-angle-right"></span></a>`,
   и при записи `li a, li span` рамку/фон/размер получает ещё и иконка ВНУТРИ
   ссылки: рядом с каждой стрелкой рисуется вторая, съехавшая по базовой линии
   «кнопка». Вес правила ниже — (0,2,3), этого достаточно, чтобы перебить
   `.pagination ul > li > a` Bootstrap 2 (0,1,3) и `li.prev > a` (0,2,2). */
.rb3-page .pagination li > a,
.rb3-page .pagination li > span,
.rb3-page .paginator > a,
.rb3-page .paginator > span {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
    min-width: 42px;
    height: 42px;
    padding: 0 12px;
    border: 1px solid var(--rb3-border);
    border-radius: 10px;
    background: #fff;
    color: var(--rb3-text);
    font-size: 15px;
    font-weight: 700;
    line-height: 1;
    float: none;
}

.rb3-page .pagination li.active > a,
.rb3-page .pagination li.active > span,
.rb3-page .pagination li > a:hover {
    background: var(--rb3-blue);
    border-color: var(--rb3-blue);
    color: #fff;
}

.rb3-page .pagination li.disabled > a,
.rb3-page .pagination li.disabled > span {
    color: var(--rb3-border);
    background: #fff;
}

.rb3-pager__counter {
    margin-top: 14px;
    color: var(--rb3-muted);
    font-size: 14px;
}


/* ------------------------------------------------ 8а. каталог -----------
   Страница `Realty/index.ctp` темы. Она рисуется в режиме pageMode = 'wide',
   поэтому обёртка каталога сама получает класс `rb3-page` (+ `rb3-page_flush`,
   снимающий верхний отступ) — так к сайдбару, полям фильтра и пагинации
   применяются уже написанные правила раздела 8, а не их копия.
   ------------------------------------------------------------------------ */
.rb3-page_flush {
    padding-top: 0;
}

.rb3-catalog-head {
    padding: 28px 0 32px;
    background: var(--rb3-bg-light);
    border-bottom: 1px solid var(--rb3-border-soft);
}

.rb3-catalog-head__row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
    gap: 18px;
    flex-wrap: wrap;
    margin-top: 14px;
}

.rb3-catalog-head__title {
    margin: 0;
    font-size: 34px;
    letter-spacing: -.5px;
}

.rb3-catalog-head__count {
    margin: 0;
    color: var(--rb3-muted);
    font-size: 16px;
}

.rb3-catalog-head__bid {
    margin-top: 12px;
    color: var(--rb3-muted);
    font-size: 15px;
}

.rb3-catalog__intro,
.rb3-catalog__seo {
    margin: 32px 0;
    color: var(--rb3-muted);
    font-size: 15px;
    line-height: 1.7;
}

.rb3-catalog__grid {
    display: grid;
    grid-template-columns: 320px minmax(0, 1fr);
    gap: 36px;
    padding-top: 36px;
}

.rb3-catalog__grid_full {
    grid-template-columns: minmax(0, 1fr);
}

.rb3-catalog__main {
    min-width: 0;
}

.rb3-catalog__filter-toggle {
    display: none;
}

/* панель сортировки */
.rb3-toolbar {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 24px;
}

.rb3-toolbar .viewtype_buttons {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 8px;
}

.rb3-body .rb3-toolbar__view {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    width: 42px;
    height: 42px;
    border: 1px solid var(--rb3-border);
    border-radius: 10px;
    background: #fff;
    color: var(--rb3-muted);
}

.rb3-body .rb3-toolbar__view:hover,
.rb3-body .rb3-toolbar__view.is-active {
    border-color: var(--rb3-blue);
    color: var(--rb3-blue);
}

/* кнопка «Показать на карте» — её печатает AgencyIndex->mapBtn() внутри
   .block-show-map; сохраняем служебные классы, меняем только оформление */
.rb3-body .rb3-toolbar .block-show-map {
    display: inline-block;
    margin: 0;
}

.rb3-body .rb3-toolbar__mapbtn {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 8px;
    height: 42px;
    padding: 0 16px;
    border: 1px solid var(--rb3-border);
    border-radius: 10px;
    background: #fff;
    color: var(--rb3-text);
    font-size: 15px;
    font-weight: 700;
}

.rb3-body .rb3-toolbar__mapbtn:hover {
    border-color: var(--rb3-blue);
    color: var(--rb3-blue);
}

.rb3-toolbar__form {
    margin: 0;
}

.rb3-toolbar__sort .filter-sort {
    margin: 0;
}

.rb3-body .rb3-toolbar__sort select {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
    width: auto;
    min-width: 230px;
    height: 42px;
    margin: 0;
    padding: 0 14px;
    border: 1px solid var(--rb3-border);
    border-radius: 10px;
    background: #fff;
    font-family: var(--rb3-font);
    font-size: 15px;
    box-shadow: none;
}

/* список каталога: «плитка» — сетка, «список» — одна колонка.
   ⚠ Правила «списка» ограничены селектором каталога: `.properties-rows`
   печатает ещё и `outExclusives()` на главной. */
.rb3-catalog__list .properties-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: var(--rb3-gap);
}

.rb3-catalog__list .properties-rows {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 18px;
}

/* в режиме «список» карточка горизонтальная */
.rb3-catalog__list .properties-rows .rb3-card {
    display: grid;
    grid-template-columns: 300px minmax(0, 1fr);
}

.rb3-catalog__list .properties-rows .rb3-card__photo,
.rb3-catalog__list .properties-rows .rb3-card__photo.rb3-photo__ph {
    height: 100%;
    min-height: 210px;
}

.rb3-catalog__list .properties-rows .rb3-card__media,
.rb3-catalog__list .properties-rows .rb3-card__photo-link {
    height: 100%;
}

.rb3-catalog__list .properties-rows .rb3-card__body {
    padding: 24px;
}

/* «ничего не найдено» */
.rb3-empty {
    padding: 64px 24px;
    text-align: center;
    background: var(--rb3-bg-light);
    border-radius: var(--rb3-radius-lg);
}

.rb3-empty__icon {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    width: 64px;
    height: 64px;
    margin-bottom: 20px;
    border-radius: 50%;
    background: #fff;
    color: var(--rb3-blue);
    font-size: 24px;
}

.rb3-empty__title {
    margin: 0 0 10px;
    font-size: 22px;
    font-weight: 900;
}

.rb3-empty__text {
    max-width: 520px;
    margin: 0 auto 24px;
    color: var(--rb3-muted);
}

.rb3-empty__actions {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    gap: 12px;
    flex-wrap: wrap;
}

/* карта каталога: контейнер и отмена сжатия тайлов (см. раздел 1) */
.rb3-catalog__main .map-wrapper,
.rb3-catalog__main #map {
    border-radius: var(--rb3-radius);
    overflow: hidden;
}


/* ------------------------------------- 8б. фильтр каталога -------------
   Левая колонка каталога. Разметку тема НЕ переопределяет — её печатают
   `Plugin/Agency/View/Elements/Filters/site_filter_block.ctp` →
   `app/View/Elements/Filters/site_filter.ctp` → `CustomSearchViewHelper`:

     .sidebar.rb3-catalog__aside                 ← классы задаёт Realty/index.ctp (classBlock)
       > .property-filter.widget#side-filter-block
         > .content.list-your-property-form
           > .advertisement.row-filter.row-filter-show
             > form
               > div.input        × N            (обычное поле: label + select|input)
               > div.input.range                 (диапазон, см. ниже)
               > div.form-actions > input.btn    (кнопки «Подобрать» / «Поиск по карте»)

   Диапазоны («Цена», «Площадь», «Комнаты») рисует
   `CustomSearchViewHelper::renderRange()`, и его разметку из шаблона не изменить:

     div.input.range > label
                     + div.range-wrapper > div.beds.control-group.<alias>-from
                                         + div.baths.control-group.<alias>-to
                     + div.clearfix
                     + div.params-slider          ← в него jQuery UI кладёт ползунок

   ⚠ Специфичность: правила раздела 8 уже описывают `.rb3-page .sidebar select`
   (0,2,1). Поэтому все селекторы ниже начинаются с
   `.rb3-page .rb3-catalog__aside` (0,3,x) — иначе они не применились бы
   (порядок в файле при разной специфичности не решает).

   ⚠ `app/View/Elements/Filters/site_filter.ctp` подключает
   `/theme/Default/css/site-filter.css`, который в `max-width: 768px` прячет
   форму (`display: none !important`) — своя кнопка «Фильтр» на телефоне
   открыла бы пустую карточку. Показ возвращается в разделе 11.
   ------------------------------------------------------------------------ */
.rb3-page .rb3-catalog__aside .property-filter,
.rb3-page .rb3-catalog__aside .widget {
    float: none;
    width: auto;
    margin: 0;
    padding: 20px;
    background: #fff;
    border: 1px solid var(--rb3-border-soft);
    border-radius: var(--rb3-radius);
    box-shadow: none;
}

/* служебные обёртки Agency — без собственного оформления */
.rb3-page .rb3-catalog__aside .content,
.rb3-page .rb3-catalog__aside .list-your-property-form,
.rb3-page .rb3-catalog__aside .row-filter {
    margin: 0;
    padding: 0;
    background: none;
    border: none;
    box-shadow: none;
    width: auto;
    float: none;
}

.rb3-page .rb3-catalog__aside form {
    margin: 0;
}

.rb3-page .rb3-catalog__aside .input,
.rb3-page .rb3-catalog__aside .input.range {
    margin: 0 0 18px;
    padding: 0;
}

.rb3-page .rb3-catalog__aside label,
.rb3-page .rb3-catalog__aside .searchLabel {
    display: block;
    float: none;
    width: auto;
    margin: 0 0 7px;
    padding: 0;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .5px;
    text-transform: uppercase;
    color: var(--rb3-muted);
    line-height: 1.2;
}

/* сам <br/> после подписи (labelOptions.after в site_filter_block.ctp) не нужен */
.rb3-page .rb3-catalog__aside label + br {
    display: none;
}

/* подпись галочки («только с фото», «новостройки») — это не заголовок поля:
   FormHelper печатает её как `.input.checkbox > input + label` */
.rb3-page .rb3-catalog__aside .checkbox label,
.rb3-page .rb3-catalog__aside .input.checkbox label {
    display: inline;
    margin: 0 0 0 7px;
    font-size: 15px;
    font-weight: 400;
    letter-spacing: 0;
    text-transform: none;
    color: var(--rb3-text);
}

.rb3-page .rb3-catalog__aside input[type="checkbox"],
.rb3-page .rb3-catalog__aside input[type="radio"] {
    width: auto;
    height: auto;
    margin: 0;
    vertical-align: middle;
}

.rb3-page .rb3-catalog__aside input[type="text"],
.rb3-page .rb3-catalog__aside input[type="number"],
.rb3-page .rb3-catalog__aside input[type="search"],
.rb3-page .rb3-catalog__aside select,
.rb3-page .rb3-catalog__aside textarea {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
    width: 100%;
    height: 44px;
    margin: 0;
    padding: 0 14px;
    border: 1.5px solid var(--rb3-border);
    border-radius: 10px;
    background: #fff;
    font-family: var(--rb3-font);
    font-size: 15px;
    color: var(--rb3-text);
    box-shadow: none;
}

.rb3-page .rb3-catalog__aside input[type="text"]:focus,
.rb3-page .rb3-catalog__aside select:focus {
    border-color: var(--rb3-blue);
    outline: none;
    box-shadow: none;
}

/* --- select2 (его вешает Agency.site_filter.js на .chosen_search_fields) ---
   ⚠ ГЛАВНАЯ ГРАБЛЯ: select2 рисует ВНУТРИ своей рамки ещё одно НАСТОЯЩЕЕ поле
   ввода — `input.select2-search__field` (тип `search`, в старых сборках `text`).
   Правило выше цепляет и его: поле получает собственную рамку, радиус и
   `width: 100%`, и у «Категории», «Населённого пункта», «Типа сделки»
   появляется «рамка в рамке». Ниже поиск внутри select2 приводится
   к невидимому вводу текста — рамка остаётся ровно одна, у контейнера.
   ⚠ `width` у этого поля трогать нельзя: select2 пересчитывает его скриптом
   на каждый введённый символ. */
.rb3-page .rb3-catalog__aside .select2-container {
    width: 100% !important;
}

.rb3-page .rb3-catalog__aside .select2-container .select2-selection--single,
.rb3-page .rb3-catalog__aside .select2-container .select2-selection--multiple {
    min-height: 44px;
    padding: 0;
    border: 1.5px solid var(--rb3-border);
    border-radius: 10px;
    background: #fff;
    box-shadow: none;
}

.rb3-page .rb3-catalog__aside .select2-container .select2-selection--single {
    height: 44px;
}

.rb3-page .rb3-catalog__aside .select2-container--default.select2-container--focus .select2-selection--multiple,
.rb3-page .rb3-catalog__aside .select2-container--open .select2-selection--single,
.rb3-page .rb3-catalog__aside .select2-container--open .select2-selection--multiple {
    border-color: var(--rb3-blue);
    outline: none;
}

.rb3-page .rb3-catalog__aside .select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 41px;
    padding-left: 13px;
}

.rb3-page .rb3-catalog__aside .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 41px;
}

.rb3-page .rb3-catalog__aside .select2-container .select2-search__field,
.rb3-page .rb3-catalog__aside .select2-container input.select2-search__field,
.rb3-page .rb3-catalog__aside .select2-search--inline .select2-search__field {
    -webkit-box-sizing: content-box;
       -moz-box-sizing: content-box;
            box-sizing: content-box;
    width: auto;
    min-width: 0;
    height: 26px;
    margin: 0;
    padding: 0 2px;
    border: none;
    border-radius: 0;
    background: none;
    box-shadow: none;
    outline: none;
    font-family: var(--rb3-font);
    font-size: 15px;
    line-height: 26px;
}

/* выпадающий список select2 живёт в отдельном контейнере в конце <body>,
   поэтому правило намеренно без префикса страницы */
.select2-container--default .select2-dropdown {
    border: 1.5px solid var(--rb3-border);
    border-radius: 10px;
    box-shadow: 0 12px 32px rgba(21, 34, 66, .10);
}

.select2-container--default .select2-search--dropdown .select2-search__field {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
    height: 38px;
    padding: 6px 10px;
    border: 1.5px solid var(--rb3-border);
    border-radius: 8px;
    box-shadow: none;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background: var(--rb3-blue);
}

/* выбранные значения множественного выбора — «чипы» темы */
.rb3-page .rb3-catalog__aside .select2-container--default .select2-selection--multiple .select2-selection__rendered {
    display: block;
    margin: 0;
    padding: 5px 8px;
    line-height: 1;
}

.rb3-page .rb3-catalog__aside .select2-container--default .select2-selection--multiple .select2-selection__choice {
    margin: 3px 4px 3px 0;
    padding: 4px 9px;
    border: none;
    border-radius: 6px;
    background: var(--rb3-blue-soft);
    color: var(--rb3-text);
    font-size: 13px;
    line-height: 1.3;
}

.rb3-page .rb3-catalog__aside .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
    margin-right: 5px;
    color: var(--rb3-blue);
}

/* --- диапазон «от / до» в фильтре -------------------------------------- */
.rb3-page .rb3-catalog__aside .range-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 8px;
}

.rb3-page .rb3-catalog__aside .range-wrapper > div,
.rb3-page .rb3-catalog__aside .range-wrapper .control-group {
    position: relative;
    -webkit-box-flex: 1;
        -ms-flex: 1 1 0px;
            flex: 1 1 0;
    min-width: 0;
    margin: 0;
    padding: 0;
}

.rb3-page .rb3-catalog__aside .range-wrapper .beds::before,
.rb3-page .rb3-catalog__aside .range-wrapper .baths::before {
    content: 'от';
    position: absolute;
    left: 12px;
    top: 50%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    font-size: 12px;
    color: var(--rb3-muted);
    pointer-events: none;
}

.rb3-page .rb3-catalog__aside .range-wrapper .baths::before {
    content: 'до';
}

.rb3-page .rb3-catalog__aside .range-wrapper input {
    width: 100%;
    padding-left: 36px;
}

.rb3-page .rb3-catalog__aside .input.range .clearfix {
    display: none;
}

/* --- ползунок (jQuery UI slider в .params-slider) ----------------------- */
.rb3-page .rb3-catalog__aside .params-slider {
    height: 4px;
    margin: 18px 8px 4px;
    background: var(--rb3-border);
    border: none;
    border-radius: 2px;
}

.rb3-page .rb3-catalog__aside .params-slider .ui-slider-range {
    background: var(--rb3-blue);
    border: none;
    border-radius: 2px;
}

.rb3-page .rb3-catalog__aside .params-slider .ui-slider-handle {
    width: 16px;
    height: 16px;
    top: -6px;
    margin-left: -8px;
    background: #fff;
    border: 2px solid var(--rb3-blue);
    border-radius: 50%;
    cursor: pointer;
    outline: none;
}

.rb3-page .rb3-catalog__aside .params-slider .ui-slider-handle:hover,
.rb3-page .rb3-catalog__aside .params-slider .ui-slider-handle.ui-state-active {
    background: var(--rb3-blue);
}

/* --- кнопки фильтра ----------------------------------------------------- */
.rb3-page .rb3-catalog__aside .form-actions {
    margin: 14px 0 0;
    padding: 0;
    background: none;
    border: none;
    box-shadow: none;
}

.rb3-body .rb3-page .rb3-catalog__aside .btn,
.rb3-body .rb3-page .rb3-catalog__aside input[type="submit"],
.rb3-body .rb3-page .rb3-catalog__aside button[type="submit"] {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
    display: block;
    width: 100%;
    height: 46px;
    padding: 0 20px;
    border: none;
    border-radius: var(--rb3-radius);
    background: var(--rb3-blue);
    color: #fff;
    font-family: var(--rb3-font);
    font-size: 16px;
    font-weight: 700;
    text-shadow: none;
    box-shadow: none;
    cursor: pointer;
}

.rb3-body .rb3-page .rb3-catalog__aside .btn:hover,
.rb3-body .rb3-page .rb3-catalog__aside input[type="submit"]:hover {
    background: var(--rb3-blue-dark);
    color: #fff;
}

/* вторая кнопка («Поиск по карте», карта метро) — второстепенная */
.rb3-body .rb3-page .rb3-catalog__aside .form-actions ~ .form-actions .btn,
.rb3-body .rb3-page .rb3-catalog__aside #searchMapButton,
.rb3-body .rb3-page .rb3-catalog__aside .interactive-metro-map-button {
    background: #fff;
    border: 1.5px solid var(--rb3-border);
    color: var(--rb3-text);
}

.rb3-body .rb3-page .rb3-catalog__aside .form-actions ~ .form-actions .btn:hover,
.rb3-body .rb3-page .rb3-catalog__aside #searchMapButton:hover,
.rb3-body .rb3-page .rb3-catalog__aside .interactive-metro-map-button:hover {
    background: #fff;
    border-color: var(--rb3-blue);
    color: var(--rb3-blue);
}

/* виджет риелтора, который site_filter_block.ctp дорисовывает под фильтром */
.rb3-page .rb3-catalog__aside .agent,
.rb3-page .rb3-catalog__aside .widget + .widget {
    margin-top: 20px;
}


/* ------------------------------------- 8в. карточка объекта ------------
   Страница `Realty/view.ctp` темы (обёртка `.rb3-object.content`).
   Внутренности печатает микроблок `Agency.realty/view` либо базовые элементы
   `Realty/Property/*` — тема их НЕ переопределяет (кроме галереи и фото агента),
   поэтому оформление строится по чужим классам.
   ------------------------------------------------------------------------ */
.rb3-object {
    padding-top: 8px;
}

.rb3-object .realty-view-hero-block {
    margin-bottom: 28px;
}

.rb3-object h1,
.rb3-object .head-title {
    font-size: 32px;
    letter-spacing: -.5px;
}

.rb3-object .price,
.rb3-object .realty-view-price {
    font-size: 28px;
    font-weight: 900;
    color: var(--rb3-text);
}

/* блоки описания/характеристик — светлые карточки с воздухом */
.rb3-object .property-detail,
.rb3-object .realty-view-block,
.rb3-object .block-params,
.rb3-object .description {
    margin-bottom: 24px;
    padding: 24px;
    background: #fff;
    border: 1px solid var(--rb3-border-soft);
    border-radius: var(--rb3-radius);
}

.rb3-object table {
    width: 100%;
    border-collapse: collapse;
}

.rb3-object table td,
.rb3-object table th {
    padding: 11px 0;
    border-bottom: 1px solid var(--rb3-border-soft);
    font-size: 15px;
    text-align: left;
    vertical-align: top;
}

.rb3-object table th {
    color: var(--rb3-muted);
    font-weight: 400;
}

/* --- виджет «Занимается объектом» --------------------------------------
   Разметку печатает `AdViewHelper::getWidgetAgents()`:
     .widget.agent__rieltor > .title > .h2
                            > .content > .image > a > img
                                       > .agent-info > .name + .post + телефоны
   Фотографию подменяет `Elements/Realty/Property/property_sidebar_rieltor.ctp`
   темы (класс `.rb3-agent__photo`), заглушка — `.rb3-agent__ph`.
   ------------------------------------------------------------------------ */
.rb3-object .sidebar .agent__rieltor .content,
.rb3-object .sidebar .agent .content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 16px;
    padding: 0;
}

.rb3-object .sidebar .image {
    -ms-flex-negative: 0;
        flex-shrink: 0;
    width: 88px;
}

.rb3-agent__photo {
    display: block;
    width: 88px;
    height: 88px;
    border-radius: 50%;
    -o-object-fit: cover;
       object-fit: cover;
}

.rb3-agent__ph {
    background: var(--rb3-bg-light) url('../img/no-avatar.svg') no-repeat center / 54px auto;
}

.rb3-object .sidebar .agent-info .name {
    font-size: 17px;
    font-weight: 900;
}

.rb3-object .sidebar .agent-info .post {
    margin-top: 2px;
    color: var(--rb3-muted);
    font-size: 14px;
}

.rb3-object .sidebar .agent-info .phone,
.rb3-object .sidebar .agent-info a {
    font-size: 16px;
    font-weight: 700;
}


/* ---------------------------- 8г. галерея фотографий объекта ------------
   Разметку печатает `Elements/Realty/Property/slider_view.ctp` темы,
   инициализацию slick — `webroot/js/rebpm3.js` (п. 9).

   ⚠ Правило `:not(.slick-initialized) .rb3-gallery__slide + …{display:none}`
   обязательно: если slick не загрузился, без него все кадры встают стопкой
   на всю высоту страницы. С ним остаётся видимым первый кадр — фотография
   на странице есть в любом случае.
   ------------------------------------------------------------------------ */
.rb3-gallery {
    margin-bottom: 24px;
}

.rb3-gallery__main {
    position: relative;
    border-radius: var(--rb3-radius);
    overflow: hidden;
    background: var(--rb3-bg-light);
}

.rb3-gallery__main:not(.slick-initialized) .rb3-gallery__slide + .rb3-gallery__slide {
    display: none;
}

.rb3-gallery__slide {
    position: relative;
}

.rb3-gallery__zoom {
    display: block;
    cursor: zoom-in;
}

.rb3-gallery__img,
.rb3-gallery__single {
    display: block;
    width: 100%;
    height: 460px;
    -o-object-fit: cover;
       object-fit: cover;
}

.rb3-gallery__tag {
    position: absolute;
    top: 14px;
    left: 14px;
    padding: 4px 11px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .94);
    color: var(--rb3-text);
    font-size: 12px;
    font-weight: 700;
}

.rb3-gallery__caption {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 14px 18px;
    background: -webkit-linear-gradient(top, rgba(21, 34, 66, 0) 0%, rgba(21, 34, 66, .75) 100%);
    background: linear-gradient(180deg, rgba(21, 34, 66, 0) 0%, rgba(21, 34, 66, .75) 100%);
    color: #fff;
    font-size: 14px;
}

.rb3-body .rb3-gallery__arrow {
    position: absolute;
    top: 50%;
    z-index: 3;
    width: 44px;
    height: 44px;
    margin-top: -22px;
    padding: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    border: none;
    border-radius: 50%;
    background: rgba(255, 255, 255, .94);
    color: var(--rb3-text);
    box-shadow: var(--rb3-shadow);
    cursor: pointer;
}

.rb3-body .rb3-gallery__arrow_prev { left: 14px; }
.rb3-body .rb3-gallery__arrow_next { right: 14px; }

.rb3-body .rb3-gallery__arrow:hover {
    background: #fff;
    color: var(--rb3-blue);
}

.rb3-gallery__thumbs {
    margin-top: 12px;
}

.rb3-gallery__thumbs:not(.slick-initialized) {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 10px;
    overflow: hidden;
}

.rb3-gallery__thumb {
    padding: 0 5px;
    cursor: pointer;
}

.rb3-gallery__thumb img {
    display: block;
    width: 100%;
    height: 78px;
    border-radius: 8px;
    -o-object-fit: cover;
       object-fit: cover;
    opacity: .72;
    -webkit-transition: opacity .15s ease;
            transition: opacity .15s ease;
}

.rb3-gallery__thumb:hover img,
.rb3-gallery__thumbs .slick-current .rb3-gallery__thumb img {
    opacity: 1;
}


/* --------------------------------------------------- 9. подвал ---------- */
/* Подвал светлый (как на cian.ru): тёмная «плита» внизу спорила бы
   с общей лёгкостью страницы. */
.rb3-footer {
    padding: 64px 0 36px;
    background: var(--rb3-bg-light);
    border-top: 1px solid var(--rb3-border-soft);
    color: var(--rb3-text);
}

.rb3-footer__top {
    display: grid;
    grid-template-columns: 1.4fr repeat(3, 1fr);
    gap: 40px var(--rb3-gap);
}

.rb3-body .rb3-logo_footer {
    margin-bottom: 18px;
}

.rb3-footer__desc {
    max-width: 320px;
    margin-bottom: 18px;
    color: var(--rb3-muted);
    font-size: 15px;
}

.rb3-footer__desc p {
    margin: 0 0 8px;
}

.rb3-footer__contacts {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    gap: 6px;
}

.rb3-body .rb3-footer__phone {
    color: var(--rb3-text);
    font-size: 19px;
    font-weight: 900;
}

.rb3-body .rb3-footer__phone:hover,
.rb3-body .rb3-footer__email:hover {
    color: var(--rb3-blue);
}

.rb3-body .rb3-footer__email {
    color: var(--rb3-blue);
    font-size: 16px;
}

.rb3-footer__address {
    color: var(--rb3-muted);
    font-size: 14px;
}

.rb3-footer__title {
    margin-bottom: 16px;
    font-size: 16px;
    font-weight: 900;
}

.rb3-footer__links,
.rb3-footer__links li,
.rb3-footer__sublinks,
.rb3-footer__sublinks li {
    list-style: none;
    margin: 0;
    padding: 0;
}

.rb3-footer__links li {
    margin-bottom: 10px;
}

.rb3-body .rb3-footer__links a {
    color: var(--rb3-muted);
    font-size: 15px;
}

.rb3-body .rb3-footer__links a:hover {
    color: var(--rb3-blue);
}

.rb3-footer__sublinks {
    margin: 8px 0 0 14px;
}

/* Соцсети. `Agency.SocialLinksHelper::render()` печатает
   `<li class="…"><a class="<ключ>" target="_blank">Vkontakte</a></li>` —
   то есть названием, а не иконкой. Подменяем текст иконкой Font Awesome
   (шрифт Brands приходит из `/libraries/fontawesome-free-6.7.0-web/css/all.min`). */
.rb3-footer__social,
.rb3-footer__social li {
    list-style: none;
    margin: 0;
    padding: 0;
}

.rb3-footer__social {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 22px;
}

.rb3-body .rb3-footer__social a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    width: 40px;
    height: 40px;
    border: 1px solid var(--rb3-border);
    border-radius: 50%;
    background: #fff;
    color: var(--rb3-text);
    /* текст ссылки прячем, иконку даёт ::before */
    font-size: 0;
    line-height: 1;
}

.rb3-body .rb3-footer__social a:hover {
    border-color: var(--rb3-blue);
    color: var(--rb3-blue);
}

.rb3-footer__social a::before {
    font-family: 'Font Awesome 6 Brands', 'Font Awesome 5 Brands';
    font-weight: 400;
    font-size: 17px;
}

.rb3-footer__social a.vkontakte::before { content: '\f189'; }
.rb3-footer__social a.telegram::before  { content: '\f2c6'; }
.rb3-footer__social a.ok::before        { content: '\f263'; }
.rb3-footer__social a.youtube::before   { content: '\f167'; }
.rb3-footer__social a.twitter::before   { content: '\f099'; }
.rb3-footer__social a.linkedin::before  { content: '\f08c'; }
.rb3-footer__social a.instagram::before { content: '\f16d'; }
.rb3-footer__social a.facebook::before  { content: '\f39e'; }

/* у «Mail.ru» и прочих без иконки бренда возвращаем подпись текстом */
.rb3-body .rb3-footer__social a.mail_ru,
.rb3-body .rb3-footer__social a.google,
.rb3-body .rb3-footer__social a.tumblr {
    width: auto;
    padding: 0 14px;
    border-radius: 999px;
    font-size: 14px;
    font-weight: 700;
}

.rb3-footer__bottom {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    margin-top: 48px;
    padding-top: 24px;
    border-top: 1px solid var(--rb3-border);
    color: var(--rb3-muted);
    font-size: 14px;
}

.rb3-footer__copy p {
    margin: 0;
}


/* ------------------------- 9а. секции перед подвалом --------------------
   Две секции приходят со СВОЕЙ сеткой Bootstrap 2, и тема обязана привести
   её к своему контейнеру:

     1. «Наши услуги» — элемент `Services.main` (или `app/View/Elements/_services.ctp`),
        разметка: `.features > .row > .item.span4 > .row > .icon.span1 + .text.span3`;
     2. регион `main_advantages` — блок с элементом `app/View/Elements/main_services.ctp`,
        разметка: `.bottom-wrapper > .bottom.container > .bottom-inner.row > .item.span4 × 3`.

   ⚠ Приводя чужой `.container` к ширине темы, `box-sizing: border-box` надо
   прописывать ПРЯМО в этом правиле: общее правило темы висит на префиксе `rb3-`
   (раздел 1), а `.container` — класс Bootstrap 2 и считается по content-box.
   Иначе `max-width` темы + padding дают контейнер шире `.rb3-container` ровно
   на удвоенный padding, и края секции не совпадают с остальной страницей.

   ⚠ `Services.main` печатает иконку как `<img src="/<preview>">` БЕЗ проверки —
   при пустом превью в вёрстку уходит `src="/"`. CSS такое не ловит, прячет
   обработчик `error` в `webroot/js/rebpm3.js` (п. 8).
   ------------------------------------------------------------------------ */
.rb3-services .container,
.rb3-cms-advantages .container,
.rb3-cms-advantages .bottom.container {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
    width: 100%;
    max-width: var(--rb3-container);
    margin: 0 auto;
    padding: 0 24px;
}

.rb3-services .features > .row,
.rb3-cms-advantages .bottom-inner.row,
.rb3-cms-advantages .row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 40px var(--rb3-gap);
    margin: 0;
}

.rb3-services .features > .row::before,
.rb3-services .features > .row::after,
.rb3-cms-advantages .row::before,
.rb3-cms-advantages .row::after {
    display: none !important;
    content: none !important;
}

.rb3-services [class*="span"],
.rb3-cms-advantages [class*="span"] {
    float: none;
    width: auto;
    margin-left: 0;
    min-width: 0;
}

.rb3-services .item,
.rb3-cms-advantages .item {
    padding: 0;
}

.rb3-services .item .row,
.rb3-cms-advantages .item .row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    gap: 16px;
}

.rb3-services .item .icon,
.rb3-cms-advantages .item .icon {
    -ms-flex-negative: 0;
        flex-shrink: 0;
    width: 56px;
}

.rb3-services .item .icon img,
.rb3-cms-advantages .item .icon img {
    width: 100%;
    height: auto;
}

.rb3-services .item h2,
.rb3-services .item h3,
.rb3-services .item .h2,
.rb3-cms-advantages .item h2,
.rb3-cms-advantages .item h3,
.rb3-cms-advantages .item .h2 {
    margin-bottom: 8px;
    font-size: 19px;
    font-weight: 900;
}

.rb3-services .item p,
.rb3-cms-advantages .item p {
    margin: 0;
    color: var(--rb3-muted);
    font-size: 16px;
}

.rb3-main-map {
    background: var(--rb3-bg-light);
}

.rb3-main-map .container {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
    max-width: var(--rb3-container);
}


/* ------------------------------------------------ 10. страница 404 ------ */
.rb3-404 {
    padding: 96px 0 var(--rb3-section-pad);
    background: -webkit-linear-gradient(top, var(--rb3-blue-soft) 0%, #fff 60%);
    background: linear-gradient(180deg, var(--rb3-blue-soft) 0%, #fff 60%);
}

.rb3-404__inner {
    max-width: 760px;
    text-align: center;
}

.rb3-404__code {
    margin: 0 0 8px;
    font-size: 104px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: -4px;
    color: var(--rb3-blue);
}

.rb3-404__title {
    margin: 0 0 18px;
    font-size: 36px;
    letter-spacing: -.6px;
}

.rb3-404__text {
    margin: 0 auto 32px;
    max-width: 580px;
    color: var(--rb3-muted);
    font-size: 17px;
}

.rb3-404__btns {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 44px;
}

.rb3-404__search {
    max-width: 480px;
    margin: 0 auto 44px;
    padding: 24px;
    background: #fff;
    border: 1px solid var(--rb3-border-soft);
    border-radius: var(--rb3-radius-lg);
    box-shadow: var(--rb3-shadow);
}

.rb3-404__search-cap {
    display: block;
    margin-bottom: 12px;
    color: var(--rb3-muted);
    font-size: 14px;
}

.rb3-404__form {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 10px;
    margin: 0;
}

.rb3-body .rb3-404__form input[type="text"] {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 1;
        -ms-flex: 1 1 auto;
            flex: 1 1 auto;
    min-width: 0;
    height: 48px;
    padding: 0 16px;
    border: 1.5px solid var(--rb3-border);
    border-radius: var(--rb3-radius);
    box-shadow: none;
}

.rb3-body .rb3-404__form input[type="submit"] {
    -ms-flex-negative: 0;
        flex-shrink: 0;
    height: 48px;
    padding: 0 24px;
    border: none;
    border-radius: var(--rb3-radius);
    background: var(--rb3-blue);
    color: #fff;
    font-family: var(--rb3-font);
    font-weight: 700;
    text-shadow: none;
    box-shadow: none;
    cursor: pointer;
}

.rb3-404__nav-title {
    margin: 0 0 16px;
    color: var(--rb3-muted);
    font-size: 14px;
    font-weight: 700;
    letter-spacing: .6px;
    text-transform: uppercase;
}

.rb3-404__links,
.rb3-404__links li,
.rb3-404__sublinks,
.rb3-404__sublinks li {
    list-style: none;
    margin: 0;
    padding: 0;
}

.rb3-404__links {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    flex-wrap: wrap;
    gap: 10px;
}

.rb3-body .rb3-404__links a {
    display: inline-block;
    padding: 9px 18px;
    border: 1px solid var(--rb3-border);
    border-radius: 999px;
    background: #fff;
    color: var(--rb3-text);
    font-size: 15px;
    font-weight: 700;
}

.rb3-body .rb3-404__links a:hover {
    border-color: var(--rb3-blue);
    color: var(--rb3-blue);
}

/* вложенные уровни меню на 404 не показываем — это навигация «одним взглядом» */
.rb3-404__sublinks {
    display: none;
}

/* системная 404 админки (ветка $isAdmin в Errors/error400.ctp) */
.rb3-body .not-found {
    padding: 64px 24px;
    text-align: center;
}


/* ---------------------------------------------------- 11. адаптив ------- */
@media (max-width: 1200px) {
    :root {
        --rb3-section-pad: 72px;
        --rb3-gap: 24px;
    }

    .rb3-hero__title { font-size: 46px; }
    .rb3-catalog__grid { grid-template-columns: 290px minmax(0, 1fr); gap: 28px; }
    .rb3-page .content > .row { grid-template-columns: minmax(0, 1fr) 300px; gap: 28px; }
}

@media (max-width: 1024px) {
    .rb3-header__inner {
        flex-wrap: wrap;
        gap: 16px;
    }

    .rb3-burger {
        display: block;
    }

    /* мобильное меню: раскрывается по бургеру (rebpm3.js, п. 1) */
    .rb3-nav {
        -webkit-box-ordinal-group: 4;
            -ms-flex-order: 3;
                order: 3;
        width: 100%;
        -webkit-box-flex: 0;
            -ms-flex: 0 0 100%;
                flex: 0 0 100%;
    }

    .rb3-nav__body {
        display: none;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: stretch;
            -ms-flex-align: stretch;
                align-items: stretch;
        gap: 18px;
        padding: 8px 0 20px;
    }

    .rb3-nav__body.is-open {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

    /* в мобильном меню пункты идут столбиком и переноса не бывает —
       снимаем `nowrap`/`overflow`, иначе список обрезался бы по высоте */
    .rb3-nav__list {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: stretch;
            -ms-flex-align: stretch;
                align-items: stretch;
        gap: 0;
        overflow: visible;
    }

    /* «Ещё» на мобильном не нужно — скрипт возвращает пункты в общий список
       (rebpm3.js, п. 11), но на всякий случай прячем и стилями */
    .rb3-nav__more {
        display: none;
    }

    .rb3-body .rb3-nav__list > li > a {
        padding: 12px 0;
        border-bottom: 1px solid var(--rb3-border-soft);
    }

    /* второй уровень на мобильном — обычным списком, без выпадения */
    .rb3-nav__sub {
        position: static;
        opacity: 1;
        visibility: visible;
        min-width: 0;
        padding: 0 0 8px 16px;
        border: none;
        box-shadow: none;
        -webkit-transform: none;
                transform: none;
    }

    .rb3-nav__right {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: stretch;
            -ms-flex-align: stretch;
                align-items: stretch;
        gap: 12px;
    }

    .rb3-body .rb3-nav__cta {
        width: 100%;
    }

    /* каталог: фильтр в выезжающую панель */
    .rb3-catalog__grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .rb3-catalog__filter-toggle {
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 10px;
        height: 46px;
        padding: 0 20px;
        border: 1.5px solid var(--rb3-border);
        border-radius: var(--rb3-radius);
        background: #fff;
        color: var(--rb3-text);
        font-family: var(--rb3-font);
        font-size: 16px;
        font-weight: 700;
        cursor: pointer;
    }

    .rb3-catalog__aside {
        display: none;
    }

    .rb3-catalog__aside.is-open {
        display: block;
    }

    /* карточка объекта: правая колонка под контент */
    .rb3-page .content > .row {
        grid-template-columns: minmax(0, 1fr);
    }

    .rb3-cta {
        grid-template-columns: minmax(0, 1fr);
        padding: 36px;
    }

    .rb3-footer__top {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 860px) {
    :root {
        --rb3-section-pad: 56px;
    }

    .rb3-hero {
        padding-top: 48px;
    }

    .rb3-hero__title { font-size: 36px; letter-spacing: -.6px; }
    .rb3-hero__subtitle { font-size: 17px; }

    .rb3-search {
        margin-top: -16px;
        padding: 20px;
    }

    .rb3-search__row {
        grid-template-columns: minmax(0, 1fr);
    }

    .rb3-section__title { font-size: 26px; }
    .rb3-catalog-head__title,
    .rb3-article__title,
    .rb3-page h1,
    .rb3-page .head-title { font-size: 28px; }

    /* в режиме «список» карточка становится вертикальной */
    .rb3-catalog__list .properties-rows .rb3-card {
        grid-template-columns: minmax(0, 1fr);
    }

    .rb3-catalog__list .properties-rows .rb3-card__photo,
    .rb3-catalog__list .properties-rows .rb3-card__photo.rb3-photo__ph {
        height: 200px;
        min-height: 0;
    }

    .rb3-catalog__list .properties-rows .rb3-card__body {
        padding: 20px;
    }

    .rb3-body .slick-sliders .main-photo,
    .rb3-body .slick-sliders .main-photo.rb3-photo__ph { height: 280px; }

    .rb3-gallery__img,
    .rb3-gallery__single,
    .rb3-gallery__single.rb3-photo__ph { height: 300px; }

    .rb3-404 { padding-top: 64px; }
    .rb3-404__code { font-size: 76px; }
    .rb3-404__title { font-size: 28px; }
}

@media (max-width: 600px) {
    .rb3-container { padding: 0 16px; }

    .rb3-body .properties-grid,
    .rb3-objects__list .properties-grid,
    .rb3-objects__list .properties-rows,
    .rb3-catalog__list .properties-grid,
    .rb3-mini-list__items {
        grid-template-columns: minmax(0, 1fr);
    }

    .rb3-logo__name { font-size: 18px; }

    .rb3-footer__top {
        grid-template-columns: minmax(0, 1fr);
        gap: 32px;
    }

    .rb3-cta { padding: 24px; }
    .rb3-cta__form { grid-template-columns: minmax(0, 1fr); }

    .rb3-404__form { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }

    .rb3-toolbar { -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; }
    .rb3-body .rb3-toolbar__sort select { width: 100%; min-width: 0; }
}

/* ⚠ `app/View/Elements/Filters/site_filter.ctp` подключает
   `/theme/Default/css/site-filter.css`, а он в `max-width: 768px` прячет форму
   фильтра правилом с `!important`. Своя кнопка «Фильтр» на телефоне открывала бы
   пустую карточку, поэтому показ возвращаем своим `!important`.
   Правило стоит последним в файле намеренно — после всех медиазапросов. */
@media (max-width: 768px) {
    .rb3-catalog__aside.is-open .row-filter,
    .rb3-catalog__aside.is-open .row-filter-show,
    .rb3-catalog__aside.is-open form,
    .rb3-catalog__aside.is-open .content {
        display: block !important;
    }
}