/* Тема lime (#398) — перенос структуры и дизайна макета Figma
   (файл «Перенести--Copy», десктоп 1350 / планшет 960 / мобайл 380).
   Оверрайды поверх общих стилей витрины (site_base → theme.css).
   Палитра макета: текст #141f38, серый #7f7f86, акцент #0752dd,
   цена #0e4cc0, подложки #f5f7fb, линии #d6d6e5/#d0d0e1,
   градиенты #0752dd→#16459c и #0e4cc0→#1d3156, футер #032462→#0044c3. */

/* ─── Токены темы ────────────────────────────────────────────────── */
body.theme-lime {
    --lime-primary: #0752dd;
    --lime-accent: #0e4cc0;
    --lime-dark: #141f38;
    --lime-muted: #7f7f86;
    --lime-line: #d6d6e5;
    --lime-border: #d0d0e1;
    --lime-bg-soft: #f5f7fb;
    --lime-radius: 8px;
}

body.theme-lime {
    color: var(--lime-dark);
    /* Фон страницы (#414, прожарка №4 п.7): макет — белое полотно от
       формы поиска до подвала; серые — только панели-карточки
       (marks-grid, #414 п.8). Прежний #f5f7fb по всему полотну (#401)
       съедал панель марок и затенял карточки. */
    background: #fff;
}

body.theme-lime a {
    color: var(--lime-primary);
    text-decoration: none;
}

body.theme-lime a:hover {
    color: var(--lime-accent);
}

body.theme-lime .wrap {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 15px;
    padding-right: 15px;
}

/* Фоны секций — от края до края (#419, макет 9:2/9:84): легаси header
   и main имеют боковые поля (padding: 0 .875rem в general.css) — фон
   topline/шапки/hero/формы не доходил до краёв (белые полосы 12px).
   Контентные поля остаются у .wrap (padding 15px выше). */
body.theme-lime header,
body.theme-lime main {
    padding-left: 0;
    padding-right: 0;
}

/* Контентные контейнеры секций: боковые поля даёт легаси main padding
   (.875rem), на десктопе .wrap (max 1200px) центрирован сам — контент
   1200 без внутренних полей макетен (#419: сохранить геометрию 1440;
   планшет ≤990 — поля 15px в MQ ниже, там .wrap упирается в края). */
body.theme-lime .wrap.container {
    padding-left: 0;
    padding-right: 0;
}

/* Контейнеры секций — колонкой (канон avenu #199, приёмка #408 пп. 3/5/7):
   легаси ui.css задаёт .container { display: flex } — заголовок и сетка
   секции вставали в одну строку («Лучший выбор», отзывы, «Нужна
   помощь?»). Флекс-раскладки, где они макетные (marks-choice), заданы
   явно своими правилами ниже. */
body.theme-lime .wrap.container {
    display: block;
}

/* Форма поиска — белая карточка на всю ширину, контент с полями 20px
   (макет 9:85: панель 920, контент формы от x=20; на мобилке те же
   20px — правило общее, легаси MQ-дубль ниже убран). */
body.theme-lime .search-panel .wrap.container {
    padding-left: 20px;
    padding-right: 20px;
}

/* Подвал: боковые поля (#414 п.14, макет 320: контент не прижат к
   краям) — .container обнуляет паддинги .wrap, подвал возвращаем
   к полям контента страницы (specifity выше .container). */
body.theme-lime .footer .wrap.container {
    padding-left: 15px;
    padding-right: 15px;
}

/* Кнопки темы: синяя таблетка 8px, вторичная — рамка. */
body.theme-lime .btn-primary,
body.theme-lime .hero-btn,
body.theme-lime .find-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--lime-primary);
    color: #fff;
    border-radius: var(--lime-radius);
    padding: 17px 30px;
    font: 600 16px/1.2 "Inter", system-ui, sans-serif;
    border: 0;
    cursor: pointer;
    min-height: 44px;
    /* Сброс легаси виджет-кнопки (#412): margin-top: 10px растягивал
       flex-строку с кнопками до 64px (вторичная «раздувалась»), тень
       кнопок движка — конфликт с плоским макетом. */
    margin-top: 0;
    box-shadow: none;
}

body.theme-lime .btn-primary:hover {
    background: var(--lime-accent);
    color: #fff;
}

body.theme-lime .hero-btn-secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    color: var(--lime-dark);
    border: 1px solid #cbcbde;
    border-radius: var(--lime-radius);
    padding: 16px 30px;
    font: 600 16px/1.2 "Inter", system-ui, sans-serif;
    min-height: 44px;
}

body.theme-lime .hero-btn-secondary:hover {
    border-color: #9d9ec4;
    color: var(--lime-dark);
}

/* Кнопки hero — единая высота (макет 9:653: обе 340×53; приёмка #408
   п.2): разный padding давал 44 vs 54px на пустой/заполненной кнопке. */
body.theme-lime .hero-btn,
body.theme-lime .hero-btn-secondary {
    min-height: 54px;
}

body.theme-lime .section-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 40px;
}

body.theme-lime .section-head h2 {
    font: 700 32px/1.1 "Inter", system-ui, sans-serif;
    color: var(--lime-dark);
    margin: 0;
}

body.theme-lime .section-link {
    font: 600 16px/1 "Inter", system-ui, sans-serif;
    color: var(--lime-primary);
    padding: 10px;
    white-space: nowrap;
}

/* ─── Шапка ──────────────────────────────────────────────────────── */
body.theme-lime .header {
    background: #fff;
    box-shadow: 0 0 2.5px rgba(25, 32, 47, 0.07);
    position: relative;
    z-index: 20;
}

body.theme-lime .topline {
    background: #0e4cc0;
}

body.theme-lime .topline-nav {
    display: flex;
    justify-content: center;
    gap: 40px;
    flex-wrap: wrap;
    padding: 5px 20px;
    font: 400 14px/1 "Inter", system-ui, sans-serif;
    color: #fff;
    /* Контент topline — по центру на десктопе (макет: шапка 1200,
       фон на всю ширину; легаси-шапка была 1500–полной ширины). */
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

body.theme-lime .topline-nav a {
    color: #fff;
    /* Боковые padding убраны (#419): 8 пунктов с gap 40 не влезали
       в одну строку на планшете (макет: topline 37px, одна строка).
       white-space: nowrap — без переноса текста внутри пункта
       (flex-сжатие при переполнении давало 2 строки в «Подбор авто»). */
    padding: 5px 0;
    border-radius: 41px;
    white-space: nowrap;
    flex-shrink: 0;
}

body.theme-lime .topline-nav a:hover {
    background: rgba(255, 255, 255, 0.14);
    color: #fff;
}

body.theme-lime .header-main {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 10px 20px;
    /* Контент шапки — по центру на десктопе (фон header на всю
       ширину; #419). */
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

body.theme-lime .header-marks {
    display: flex;
    align-items: center;
    gap: 20px;
}

/* Марки шапки (#419, макет 9:25/9:30): строка ссылок по образцу
   шторки .nav-marks (uppercase 14px, акцент-цвет на hover). */
body.theme-lime .header-marks-list {
    display: flex;
    align-items: center;
    gap: 14px;
    font: 600 14px/1 "Inter", system-ui, sans-serif;
    color: var(--lime-dark);
    text-transform: uppercase;
    letter-spacing: .02em;
}

body.theme-lime .header-marks-list a {
    color: var(--lime-dark);
    white-space: nowrap;
}

body.theme-lime .header-marks-list a:hover {
    color: var(--lime-primary);
}

body.theme-lime .header-marks-list .header-marks-more {
    color: var(--lime-muted);
}

body.theme-lime .logo-plate {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--lime-primary);
    color: #fff !important;
    border-radius: 8px;
    padding: 5px 10px;
    font: 700 20px/1 "Inter", system-ui, sans-serif;
    text-transform: uppercase;
    letter-spacing: .02em;
    min-height: 34px;
}

body.theme-lime .header-city {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font: 400 12px/1 "Inter", system-ui, sans-serif;
    color: var(--lime-dark);
    white-space: nowrap;
}

body.theme-lime .header-search-link {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: var(--lime-bg-soft);
    border-radius: 8px;
    padding: 10px 20px 10px 15px;
    font: 400 16px/1.2 "Inter", system-ui, sans-serif;
    color: var(--lime-muted);
    white-space: nowrap;
}

body.theme-lime .header-search-link:hover {
    color: var(--lime-dark);
}

body.theme-lime .header-contacts {
    display: flex;
    align-items: center;
    gap: 15px;
}

/* Телефон и иконки не сжимаются (#419, макет Frame 219 328×51):
   при впритык-шапке планшета номер переносился на 2 строки
   (внутренний whitespace: normal). */
body.theme-lime .header-contacts .phone {
    color: var(--lime-dark);
    display: inline-flex;
    white-space: nowrap;
    flex-shrink: 0;
}

body.theme-lime .phone-number {
    font: 600 16px/1.2 "Inter", system-ui, sans-serif;
}

body.theme-lime .phone-tip {
    display: block;
    font: 400 10px/1.2 "Inter", system-ui, sans-serif;
    color: var(--lime-muted);
}

body.theme-lime .header-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    /* Общая подложка блока иконок (#419, макет Frame 10): фон/радиус
       перенесены на .header-icons, у иконок — прозрачные. */
    background: transparent;
    border: 0;
    border-radius: 0;
    cursor: pointer;
    padding: 0;
}

body.theme-lime .header-icon img {
    width: 24px;
    height: 24px;
}

/* Иконки телефон/чат — одним блоком вплотную, общая подложка
   (макет Frame 10, 80×51; #419): без зазора, «слитные», высота 51 —
   в ритм телефонному блоку Frame 219 (51px) шапки планшета.
   flex-shrink 0 — подложка не сжимается при впритык-шапке. */
body.theme-lime .header-icons {
    display: flex;
    align-items: center;
    height: 51px;
    background: var(--lime-bg-soft);
    border-radius: 8px;
    overflow: hidden;
    flex-shrink: 0;
}

body.theme-lime .header-icons .header-icon {
    width: 40px;
    height: 40px;
}

/* Кнопка-бургер (#401): видна только на мобайле (≤760px);
   плоская — без рамки/тени/скругления (легаси-тень кнопок general.css
   давала «рамку»; приёмка #408 п.1), цвет — акцент темы (9:636). */
body.theme-lime .burger {
    display: none;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    padding: 0;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    background: none;
    color: var(--lime-accent);
    cursor: pointer;
}

body.theme-lime .burger svg {
    width: 32px;
    height: 32px;
}

/* Шторка-меню (#401, макет «Mobile menu» 25:77; канон ADR-0052):
   фиксированная панель под топбаром, верх — на высоте шапки
   (--drawer-top ставит menu.js), мобильная версия. */
body.theme-lime .mobile-nav {
    display: none;
}

body.theme-lime .mobile-nav.open {
    display: block;
    position: fixed;
    top: var(--drawer-top, 50px);
    left: 0;
    right: 0;
    z-index: 90;
    max-height: calc(100vh - var(--drawer-top, 50px));
    overflow-y: auto;
    background: #fff;
    border-radius: 0 0 16px 16px;
    box-shadow: 0 16px 32px rgba(25, 32, 47, 0.12);
    /* Ритм анимации шторок — канонные переменные (general.css :root,
       ADR-0052): --drawer-duration / --drawer-easing, как у avenu. */
    animation: lime-nav-in var(--drawer-duration, .24s)
        var(--drawer-easing, ease-out);
}

@keyframes lime-nav-in {
    from {
        opacity: 0;
        transform: translateY(-12px);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

/* Блокировка скролла вьюпорта при открытой шторке (#401): класс ставит
   только мобильный menu.js и снимается при закрытии и на resize; на
   десктопе бургер/шторка скрыты CSS — класс безвреден (канон avenu). */
html.nav-open {
    overflow: hidden;
}

body.theme-lime .nav-wrap {
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 18px;
}

/* Марки (макет: LADA HAVAL KIA ЕЩЁ) — ссылки каталога марок. */
body.theme-lime .nav-marks {
    display: flex;
    align-items: center;
    gap: 12px;
    font: 600 14px/1 "Inter", system-ui, sans-serif;
    color: var(--lime-dark);
    text-transform: uppercase;
    letter-spacing: .02em;
}

body.theme-lime .nav-marks a {
    color: var(--lime-dark);
}

body.theme-lime .nav-marks .nav-marks-more {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: var(--lime-muted);
}

body.theme-lime .nav-marks img {
    width: 12px;
    height: 12px;
}

/* Поиск (макет 340×40): поле-ссылка на панель поиска главной. */
body.theme-lime .nav-search a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    background: var(--lime-bg-soft);
    border-radius: 8px;
    padding: 10px 14px;
    font: 400 16px/1.2 "Inter", system-ui, sans-serif;
    color: var(--lime-muted);
}

/* «Избранное» / «Кредитный калькулятор» — строки с иконкой в подложке. */
body.theme-lime .nav-quick {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

body.theme-lime .nav-quick a {
    display: flex;
    align-items: center;
    gap: 10px;
    font: 600 16px/1 "Inter", system-ui, sans-serif;
    color: var(--lime-dark);
    padding: 4px 0;
}

body.theme-lime .nav-quick img {
    width: 40px;
    height: 40px;
    padding: 8px;
    box-sizing: border-box;
    background: var(--lime-bg-soft);
    border-radius: 50%;
    color: var(--lime-accent);
}

/* Навигация колонкой (Главная, Каталог + menu_items). */
body.theme-lime .nav-links {
    display: flex;
    flex-direction: column;
}

body.theme-lime .nav-links a {
    font: 400 16px/1.2 "Inter", system-ui, sans-serif;
    color: var(--lime-dark);
    padding: 8.5px 0;
    border-bottom: 1px solid var(--lime-line);
}

/* Контакты шторки: телефон + иконки звонка/чата (макет Frame 11). */
body.theme-lime .nav-contacts {
    display: flex;
    align-items: center;
    gap: 15px;
    padding-top: 14px;
    border-top: 1px solid var(--lime-line);
    margin-top: 2px;
}

body.theme-lime .nav-contacts .phone-meta {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

body.theme-lime .nav-contact-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background: var(--lime-bg-soft);
    border: 0;
    border-radius: 50%;
    cursor: pointer;
    padding: 0;
}

body.theme-lime .nav-contact-icon img {
    width: 24px;
    height: 24px;
}

/* ─── Хиро ───────────────────────────────────────────────────────── */
body.theme-lime .hero {
    /* Фон светло-серый (#415 п.5, макет 9:585): серый идёт сверху
       (шапка+hero) и уходит под верхнюю ~1/3 белой формы поиска;
       ниже полотно белое. Глубину серого под верхом формы задаёт
       наезд .search-panel (margin-top: −70px) — серый виден на
       70px под верхом карточки (~1/3 её высоты на десктопе). */
    background: var(--lime-bg-soft);
    padding: 60px 0 120px;
}

body.theme-lime .hero-inner {
    display: flex;
    flex-direction: column;
    gap: 44px;
}

body.theme-lime .hero-text {
    max-width: 640px;
    display: flex;
    flex-direction: column;
    gap: 22px;
}

body.theme-lime .hero-kicker {
    font: 700 23px/1 "Inter", system-ui, sans-serif;
    text-transform: uppercase;
    color: var(--lime-muted);
    margin: 0;
}

body.theme-lime .hero h1 {
    font: 700 59px/1.07 "Inter", system-ui, sans-serif;
    color: var(--lime-dark);
    margin: 0;
}

body.theme-lime .hero-discount {
    color: #0553e9;
}

/* Подзаголовок из канального герой-баннера (рыба-контент #398). */
body.theme-lime .hero-note {
    display: block;
    margin-top: 16px;
    font: 400 16px/1.4 "Inter", system-ui, sans-serif;
    color: var(--lime-muted);
}

body.theme-lime .hero-subtitle {
    font: 400 16px/1.4 "Inter", system-ui, sans-serif;
    color: var(--lime-muted);
    margin: 0;
}

body.theme-lime .hero-cta {
    display: flex;
    gap: 22px;
    flex-wrap: wrap;
    /* Кнопки одной высоты по центру ряда (#412): без align-items кнопки
       растягиваются по самой высокой строке flex-контейнера (64px). */
    align-items: center;
}

/* Равная ширина кнопок героя (макет 9:653: обе 340×53) — легаси давал
   кнопки по контенту 228/170px «вразнобой» (#412): flex-доли делят
   строку поровну, max-width держит предел макета. */
body.theme-lime .hero-cta .hero-btn,
body.theme-lime .hero-cta .hero-btn-secondary {
    flex: 1 1 0;
    max-width: 340px;
    white-space: nowrap;
}

body.theme-lime .hero-trust {
    display: flex;
    gap: 40px;
    flex-wrap: wrap;
    /* Воздух под кнопками (#412): .wrap.container display:block (фикс
       #408) отключает gap .hero-inner — отступ переносится сюда (макет:
       ~40–45px между кнопками и траст-строкой). */
    margin-top: 44px;
}

body.theme-lime .hero-trust-item {
    display: flex;
    gap: 10px;
    align-items: center;
    min-width: 200px;
}

body.theme-lime .hero-trust-item img {
    width: 36px;
    height: 36px;
}

body.theme-lime .hero-trust-item b {
    display: block;
    font: 700 16px/1.4 "Inter", system-ui, sans-serif;
    color: var(--lime-dark);
}

body.theme-lime .hero-trust-item span {
    font: 400 16px/1.4 "Inter", system-ui, sans-serif;
    color: var(--lime-muted);
}

/* ─── Панель поиска и фильтров ───────────────────────────────────── */
body.theme-lime .search-panel {
    /* Форма наезжает на серый hero на −70px (#415 п.5): серый фон
       виден по бокам её верхней ~1/3, ниже полотно белое. */
    margin-top: -70px;
    position: relative;
    z-index: 5;
}

body.theme-lime .search-panel-form {
    background: #fff;
    border-radius: 20px;
    padding: 40px;
    box-shadow: 0 0 5.45px rgba(25, 32, 47, 0.09);
    display: flex;
    flex-direction: column;
    gap: 28px;
}

body.theme-lime .search-panel-row {
    display: flex;
    gap: 40px;
    align-items: center;
    flex-wrap: wrap;
}

body.theme-lime .search-field {
    display: flex;
    align-items: center;
    gap: 15px;
}

body.theme-lime .search-field>span:first-child,
body.theme-lime .range-cap {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font: 400 16px/1.4 "Inter", system-ui, sans-serif;
    color: var(--lime-muted);
    white-space: nowrap;
}

body.theme-lime .search-query input,
body.theme-lime .search-range input {
    border: 0;
    border-bottom: 1px solid var(--lime-line);
    border-radius: 3px;
    padding: 8px;
    font: 400 16px/1.4 "Inter", system-ui, sans-serif;
    color: var(--lime-dark);
    background: transparent;
    width: 128px;
}

body.theme-lime .search-range .range-pair {
    position: relative;
    display: flex;
    gap: 7px;
    align-items: center;
}

body.theme-lime .search-range input[name="price_min"],
body.theme-lime .search-range input[name="price_max"],
body.theme-lime .search-range input[name="year_min"],
body.theme-lime .search-range input[name="year_max"] {
    width: 62px;
}

body.theme-lime .search-range .range-pair i {
    font-style: normal;
    position: absolute;
    right: 8px;
    font-size: 14px;
    color: var(--lime-dark);
}

body.theme-lime .range-select {
    border: 1px solid var(--lime-border);
    border-radius: 8px;
    padding: 5px 15px;
    font: 400 16px/1.4 "Inter", system-ui, sans-serif;
    color: var(--lime-dark);
    background: #fff;
    min-height: 34px;
}

body.theme-lime .search-panel-filters {
    align-items: flex-end;
    justify-content: space-between;
}

body.theme-lime .select-field {
    display: flex;
    flex-direction: column;
    gap: 10px;
    position: relative;
    min-width: 128px;
}

body.theme-lime .select-field>span {
    font: 400 16px/1.4 "Inter", system-ui, sans-serif;
    color: var(--lime-muted);
    /* Подпись-лейбл над полем (макет 9:123–9:141, #419): селекты
       без видимых подписей не совпадали с макетом. */
}

body.theme-lime .select-field select {
    appearance: none;
    -webkit-appearance: none;
    border: 1px solid var(--lime-border);
    border-radius: 8px;
    padding: 5px 30px 5px 15px;
    min-height: 34px;
    font: 400 16px/1.4 "Inter", system-ui, sans-serif;
    color: var(--lime-dark);
    background: #fff;
    cursor: pointer;
    width: 100%;
}

body.theme-lime .select-field img {
    position: absolute;
    right: 12px;
    bottom: 8px;
    width: 18px;
    height: 18px;
    pointer-events: none;
}

body.theme-lime .search-panel-actions {
    display: flex;
    align-items: center;
    gap: 20px;
    /* Кнопки — отдельной строкой слева под селектами (макет 9:148:
       Frame 61 x=0 под рядом селектов; #419) — без прижатия вправо. */
    margin-left: 0;
}

body.theme-lime .filters-link {
    font: 600 16px/1 "Inter", system-ui, sans-serif;
    color: var(--lime-primary);
    /* Компактная ссылка (макет 125×36): убран широкий padding 10px;
       контент «Все фильтры» ~108px + боковые 8px = 124 ≈ 125. */
    padding: 10px 8px;
}

/* Кнопка «Найти» — в размер с макетом (129×40, #419): легаси
   btn-primary давал «раздутый» вид (53px из-за padding 17px 40px);
   padding 8px 40px даёт ~128×40 (текст «Найти» 48px + 80px). */
body.theme-lime .find-btn {
    min-height: 40px;
    padding: 8px 40px;
    border-radius: 8px;
}

/* Селектор цвета с образцами (#419, макет 9:142–9:145): кастомный
   dropdown (js/color-select.js), поле в стиле .select-field select;
   «Любой» — градиент зелёный→лиловый (макет). */
body.theme-lime .color-field {
    min-width: 149px;
}

body.theme-lime .color-select {
    position: relative;
}

body.theme-lime .color-select-trigger {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-height: 34px;
    border: 1px solid var(--lime-border);
    border-radius: 8px;
    padding: 5px 30px 5px 15px;
    background: #fff;
    font: 400 16px/1.4 "Inter", system-ui, sans-serif;
    color: var(--lime-dark);
    cursor: pointer;
    text-align: left;
}

body.theme-lime .color-select-trigger img {
    position: absolute;
    right: 12px;
    top: 8px;
    width: 18px;
    height: 18px;
    pointer-events: none;
}

body.theme-lime .color-select-value {
    flex: 1 1 auto;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.theme-lime .color-swatch {
    flex: 0 0 14px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #9aa0a6;
    display: inline-block;
}

body.theme-lime .color-swatch.swatch-any {
    background: linear-gradient(135deg, #16a34a, #7c3aed);
}

body.theme-lime .color-select-list {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    z-index: 30;
    margin: 0;
    padding: 6px;
    list-style: none;
    background: #fff;
    border: 1px solid var(--lime-border);
    border-radius: 8px;
    box-shadow: 0 12px 24px rgba(25, 32, 47, 0.12);
    max-height: 240px;
    overflow-y: auto;
}

body.theme-lime .color-option {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 10px;
    border-radius: 6px;
    font: 400 16px/1.4 "Inter", system-ui, sans-serif;
    color: var(--lime-dark);
    cursor: pointer;
}

body.theme-lime .color-option:hover {
    background: var(--lime-bg-soft);
}

body.theme-lime .color-option[aria-selected="true"] {
    font-weight: 600;
}

/* Нативный select цвета — только источник значения для GET
   (скрыт визуально, но остаётся в форме: JS синхронизирует выбор). */
body.theme-lime .color-select-native {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    border: 0;
    clip: rect(0 0 0 0);
    overflow: hidden;
    white-space: nowrap;
}

/* ─── «Лучший выбор» ─────────────────────────────────────────────── */
body.theme-lime .best-choice {
    padding: 60px 0 0;
}

body.theme-lime .best-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
}

body.theme-lime .best-card {
    position: relative;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 0 2.5px rgba(25, 32, 47, 0.07);
    color: var(--lime-dark);
}

body.theme-lime .best-card:hover {
    box-shadow: 0 4px 14px rgba(25, 32, 47, 0.14);
    color: var(--lime-dark);
}

body.theme-lime .best-card-media {
    height: 182px;
    background: #eef0f4;
}

body.theme-lime .best-card-media img {
    width: 100%;
    height: 182px;
    object-fit: cover;
    display: block;
}

body.theme-lime .best-card .heartadd {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 36px;
    height: 36px;
    background: var(--lime-bg-soft);
    border-radius: 8px;
    padding: 8px;
    cursor: pointer;
}

body.theme-lime .best-card .heartadd svg {
    width: 20px;
    height: 20px;
    display: block;
}

body.theme-lime .best-card .heartadd svg path {
    stroke: var(--lime-dark);
}

body.theme-lime .best-card .heartadd.favorite svg path {
    fill: var(--lime-primary);
    stroke: var(--lime-primary);
}

body.theme-lime .best-card-body {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 15px;
}

body.theme-lime .best-card h3 {
    font: 700 20px/1.25 "Inter", system-ui, sans-serif;
    margin: 0;
    color: var(--lime-dark);
}

body.theme-lime .best-card-comp {
    font: 400 12px/1.4 "Inter", system-ui, sans-serif;
    color: var(--lime-muted);
}

body.theme-lime .best-card-price {
    margin: 0;
    font: 700 20px/1.4 "Inter", system-ui, sans-serif;
    color: #0e4cc0;
}

body.theme-lime .best-card-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 7px 20px;
}

body.theme-lime .best-card-chips span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font: 400 12px/1.4 "Inter", system-ui, sans-serif;
    color: var(--lime-muted);
    white-space: nowrap;
}

body.theme-lime .best-card-chips img {
    width: 18px;
    height: 18px;
}

/* Легаси-слайдер #products на каталоге/детальной (ревью #421 проход 2):
   фикс-ширина на 21px шире своей колонки .catalog-main (3 карточки +
   амортизация gap) — при edge-to-edge main на планшете давал
   горизонтальный скролл 6px (secR 926 при vw 920). Вписываем
   в колонку: 191×3 + 2×21 = 615 ≤ 100% — раскладка 3 в ряд
   сохраняется и на 920, и на 1440. */
body.theme-lime #products {
    max-width: 100%;
}

/* ─── Марки + «Избранный поиск» ──────────────────────────────────── */
/* Макет: карточка марок слева, синий блок «Избранный поиск» справа.
   Родитель — flex (#419, 1440: легаси display:block не применял
   flex-basis панелей 46% — панели стояли друг под другом на всю
   ширину; макет 1:105/1:330/1:367 — две карточки рядом). */
body.theme-lime .marks-choice {
    display: flex;
    gap: 20px;
    align-items: stretch;
    flex-wrap: wrap;
    padding: 60px 0 0;
}

/* Панели «Выбор по маркам» / «Избранный поиск» — колонки ряда на
   десктопе/планшете (#419, макет 1:105/1:330/1:367 — две карточки
   рядом); на мобайле — столбик (flex-wrap + basis 100% в MQ 760).
   margin авто и max-width из .wrap внутри flex-строки отключаем;
   боковые поля контейнера панели — 0 (поля внутри карточек свои:
   .marks-grid/.search-strip, #414 п.9). */
body.theme-lime .marks-choice > .wrap.container {
    flex: 1 1 46%;
    min-width: 0;
    padding-left: 0;
    padding-right: 0;
    /* margin: auto из легаси .wrap в flex-строке даёт margin-top: auto
       (панель 2 уезжала вниз на 24px) — обнуляем все марджины. */
    margin: 0;
    max-width: none;
    display: block;
}

body.theme-lime .marks-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 22px 30px;
    background: var(--lime-bg-soft);
    border-radius: 15px;
    padding: 40px;
    justify-content: space-between;
    height: 100%;
    align-content: flex-start;
}

/* Заголовок и ссылка «Все марки» — ВНУТРИ серой панели (#415 п.4,
   макет 9:1129): колонка «заголовок → ссылка», затем марки. */
body.theme-lime .marks-head {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    width: 100%;
    margin-bottom: 30px;
}

body.theme-lime .marks-head h2 {
    font: 700 32px/1.1 "Inter", system-ui, sans-serif;
    color: var(--lime-dark);
    margin: 0;
}

body.theme-lime .marks-head .section-link {
    padding: 0;
}

body.theme-lime .mark-btn {
    display: flex;
    flex-direction: column;
    gap: 5px;
    align-items: center;
    width: 75px;
    color: var(--lime-dark);
    font: 600 16px/1.4 "Inter", system-ui, sans-serif;
}

body.theme-lime .mark-btn:hover {
    color: var(--lime-primary);
}

body.theme-lime .mark-btn img,
body.theme-lime .mark-placeholder {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 0 5px rgba(25, 32, 47, 0.07);
    display: flex;
    align-items: center;
    justify-content: center;
    font: 700 20px/1 "Inter", system-ui, sans-serif;
    color: var(--lime-primary);
    object-fit: contain;
}

body.theme-lime .search-strip {
    background: linear-gradient(180deg, #0752dd, #16459c);
    border-radius: 15px;
    padding: 40px;
    height: 100%;
}

body.theme-lime .search-strip .section-head {
    margin-bottom: 20px;
}

body.theme-lime .search-strip .section-head h2 {
    color: #fff;
}

/* «Все автомобили» на синей панели — белым (приёмка #408 п.4:
   цвет ссылки по умолчанию #0752dd — синий на синем, нечитаемо). */
body.theme-lime .search-strip .section-link {
    color: #fff;
}

body.theme-lime .search-strip-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
}

body.theme-lime .strip-chip {
    border: 1px solid #fff;
    border-radius: 50px;
    color: #fff;
    padding: 8px 20px;
    font: 600 16px/1.4 "Inter", system-ui, sans-serif;
}

body.theme-lime .strip-chip:hover {
    background: #fff;
    color: var(--lime-primary);
}

/* ─── Преимущества ───────────────────────────────────────────────── */
body.theme-lime .features {
    padding: 60px 0 0;
}

body.theme-lime .features-row {
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
    justify-content: space-between;
}

body.theme-lime .feature-item {
    display: flex;
    gap: 15px;
    align-items: center;
    min-width: 195px;
}

body.theme-lime .feature-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--lime-bg-soft);
    border-radius: 50%;
    padding: 13px;
}

body.theme-lime .feature-icon img {
    width: 40px;
    height: 40px;
}

body.theme-lime .feature-item b {
    display: block;
    font: 700 16px/1.4 "Inter", system-ui, sans-serif;
    color: var(--lime-dark);
}

body.theme-lime .feature-item span {
    font: 400 16px/1.4 "Inter", system-ui, sans-serif;
    color: var(--lime-muted);
}

/* ─── «О компании» + услуги ──────────────────────────────────────── */
body.theme-lime .about-block {
    padding: 60px 0 0;
}

body.theme-lime .about-block-inner {
    /* Фото-фон по макету (#415 п.2): фото ВО ВЕСЬ блок (cover) +
       поверх полупрозрачный тёмно-синий оверлей — фото приглушено,
       контент читаем. Ассет cta-interior.webp — из rawImages Figma. */
    background:
        linear-gradient(0deg, rgba(9, 32, 74, 0.58) 0%, rgba(9, 32, 74, 0.58) 100%),
        url("../img/cta-interior.webp") center / cover no-repeat;
    background-color: #0e4cc0;
    border-radius: 15px;
    padding: 50px 60px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
    flex-wrap: wrap;
    color: #fff;
}

body.theme-lime .about-block-text {
    max-width: 480px;
}

body.theme-lime .about-block-text h2 {
    font: 700 32px/1.1 "Inter", system-ui, sans-serif;
    margin: 0 0 15px;
    color: #fff;
}

body.theme-lime .about-block-text p {
    font: 400 16px/1.4 "Inter", system-ui, sans-serif;
    margin: 0;
    color: #fff;
}

body.theme-lime .about-block-btn {
    background: #fff;
    color: var(--lime-primary);
    border: 0;
    border-radius: 8px;
    padding: 17px 40px;
    font: 600 16px/1.2 "Inter", system-ui, sans-serif;
    cursor: pointer;
    min-height: 44px;
}

body.theme-lime .about-block-btn:hover {
    color: var(--lime-accent);
}

body.theme-lime .services-row {
    padding: 24px 0 0;
}

body.theme-lime .services-list {
    border-top: 1px solid var(--lime-line);
}

body.theme-lime .service-line {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    border-bottom: 1px solid var(--lime-line);
    padding: 15px 0;
    color: var(--lime-dark);
}

body.theme-lime .service-line:hover {
    color: var(--lime-primary);
}

body.theme-lime .service-line-text b {
    display: block;
    font: 700 16px/1.4 "Inter", system-ui, sans-serif;
}

body.theme-lime .service-line-text span {
    font: 400 16px/1.4 "Inter", system-ui, sans-serif;
    color: var(--lime-muted);
}

body.theme-lime .service-line img {
    width: 24px;
    height: 24px;
}

/* ─── Отзывы ─────────────────────────────────────────────────────── */
body.theme-lime .reviews-line {
    padding: 60px 0 0;
}

body.theme-lime .reviews-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
}

body.theme-lime .review-card {
    display: flex;
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 0 2.5px rgba(25, 32, 47, 0.07);
}

body.theme-lime .review-photo {
    flex: 0 0 140px;
    background: #eef0f4;
}

body.theme-lime .review-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

body.theme-lime .review-body {
    display: flex;
    flex-direction: column;
    gap: 15px;
    padding: 30px;
}

body.theme-lime .review-text {
    margin: 0;
    font: 400 16px/1.5 "Inter", system-ui, sans-serif;
    color: var(--lime-dark);
}

body.theme-lime .review-author {
    margin: 0;
    font: 700 17px/1.5 "Inter", system-ui, sans-serif;
    color: #272a2e;
}

/* ─── CTA ────────────────────────────────────────────────────────── */
body.theme-lime .cta-block {
    padding: 60px 0 0;
}

body.theme-lime .cta-block-inner {
    /* Фото-фон по макету (#415 п.2): фото во весь блок (cover) +
       тёмно-синий оверлей (приглушение). cta-suv.webp — rawImages. */
    background:
        linear-gradient(0deg, rgba(9, 32, 74, 0.58) 0%, rgba(9, 32, 74, 0.58) 100%),
        url("../img/cta-suv.webp") center / cover no-repeat;
    background-color: #0e4cc0;
    border-radius: 15px;
    padding: 50px 60px;
    display: flex;
    flex-direction: column;
    gap: 30px;
    color: #fff;
    align-items: flex-start;
}

body.theme-lime .cta-block-text h2 {
    font: 700 32px/1.1 "Inter", system-ui, sans-serif;
    margin: 0 0 15px;
    color: #fff;
    max-width: 480px;
}

body.theme-lime .cta-block-list {
    margin: 0;
    padding-left: 24px;
}

body.theme-lime .cta-block-list li {
    font: 400 16px/1.4 "Inter", system-ui, sans-serif;
    color: #fff;
}

body.theme-lime .cta-block-btn {
    background: #fff;
    color: var(--lime-primary);
    border: 0;
    border-radius: 8px;
    padding: 17px 40px;
    font: 600 16px/1.2 "Inter", system-ui, sans-serif;
    cursor: pointer;
    min-height: 44px;
}

body.theme-lime .cta-block-btn:hover {
    color: var(--lime-accent);
}

/* ─── «Нужна помощь?» ────────────────────────────────────────────── */
body.theme-lime .help-row {
    padding: 60px 0;
}

body.theme-lime .help-head {
    display: flex;
    align-items: flex-end;
    gap: 40px;
    flex-wrap: wrap;
    margin-bottom: 20px;
}

body.theme-lime .help-head h2 {
    font: 700 32px/1.1 "Inter", system-ui, sans-serif;
    margin: 0;
    color: var(--lime-dark);
}

body.theme-lime .help-head p {
    font: 400 16px/1.4 "Inter", system-ui, sans-serif;
    color: var(--lime-muted);
    margin: 0 0 4px;
    max-width: 339px;
}

body.theme-lime .help-contacts {
    display: flex;
    align-items: center;
    gap: 9px;
    flex-wrap: wrap;
}

body.theme-lime .help-contact {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 0 15px;
    min-width: 200px;
    border-right: 1px solid var(--lime-line);
}

body.theme-lime .help-contact:last-child {
    border-right: 0;
}

body.theme-lime .help-contact img {
    width: 36px;
    height: 36px;
}

body.theme-lime .help-contact b {
    display: block;
    font: 700 16px/1.4 "Inter", system-ui, sans-serif;
    color: var(--lime-dark);
}

body.theme-lime .help-contact span {
    font: 400 16px/1.4 "Inter", system-ui, sans-serif;
    color: var(--lime-muted);
}

body.theme-lime .help-contact a {
    color: var(--lime-dark);
}

body.theme-lime .help-link {
    border: 0;
    background: none;
    padding: 0;
    font: 400 16px/1.4 "Inter", system-ui, sans-serif;
    color: var(--lime-primary);
    cursor: pointer;
    /* Плоская ссылка «заказать звонок» (#412): легаси-тень кнопок
       движка (0 2px 6px ...) давала объём, макет — плоская ссылка. */
    box-shadow: none;
}

/* ─── Футер ──────────────────────────────────────────────────────── */
body.theme-lime .footer {
    background: linear-gradient(0deg, #032462 60%, #0044c3);
    color: #d6d6e5;
    padding: 40px 0;
}

body.theme-lime .footer-top {
    display: flex;
    justify-content: space-between;
    gap: 40px;
    flex-wrap: wrap;
    margin-bottom: 30px;
}

body.theme-lime .footer-brand {
    max-width: 339px;
}

body.theme-lime .footer-logo {
    display: inline-flex;
    align-items: center;
    background: #fff;
    color: var(--lime-primary);
    border-radius: 8px;
    padding: 9px 14px;
    font: 700 22px/1 "Inter", system-ui, sans-serif;
    text-transform: uppercase;
    letter-spacing: .02em;
}

body.theme-lime .footer-slogan {
    font: 400 16px/1.4 "Inter", system-ui, sans-serif;
    color: #d6d6e5;
    margin: 15px 0 0;
}

body.theme-lime .footer-cols {
    display: flex;
    gap: 40px;
    flex-wrap: wrap;
}

body.theme-lime .footer-col b {
    display: block;
    color: #fff;
    font: 700 16px/1.4 "Inter", system-ui, sans-serif;
    margin-bottom: 15px;
}

body.theme-lime .footer-col ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

/* Чёрные буллеты (#412): легаси ui.css вешает list-style-type: disc и
   margin-bottom на li, сброс на ul их не перебивает — сбрасываем li. */
body.theme-lime .footer-col ul li {
    list-style: none;
    margin-bottom: 0;
}

body.theme-lime .footer-col a {
    color: #d6d6e5;
    font: 400 16px/1.4 "Inter", system-ui, sans-serif;
}

body.theme-lime .footer-col a:hover {
    color: #fff;
}

body.theme-lime .footer-legal {
    border-top: 1px solid rgba(255, 255, 255, 0.18);
    margin-top: 10px;
    padding-top: 10px;
}

body.theme-lime .footer-legal p {
    margin: 0 0 20px;
    font: 400 14px/1.4 "Inter", system-ui, sans-serif;
    color: #d6d6e5;
}

body.theme-lime .footer-disclaimer {
    font: 400 14px/1.4 "Inter", system-ui, sans-serif;
    color: #d6d6e5;
    margin: 0 0 20px;
}

body.theme-lime .footer-policy {
    font: 400 14px/1.4 "Inter", system-ui, sans-serif;
    margin: 0;
}

body.theme-lime .footer-policy a {
    color: #2770f8;
}

body.theme-lime .footer-policy span {
    color: #d6d6e5;
}

/* ─── Каталог (движок, макет 35:2280) ────────────────────────────── */
/* Заголовок «Каталог доступных автомобилей» + город. */
body.theme-lime .catalog-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    flex-wrap: wrap;
    margin-bottom: 24px;
}

body.theme-lime .catalog-head h1 {
    font: 700 32px/1.1 "Inter", system-ui, sans-serif;
    color: var(--lime-dark);
    margin: 0;
}

body.theme-lime .catalog-city {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font: 600 16px/1.4 "Inter", system-ui, sans-serif;
    color: var(--lime-dark);
    padding: 10px 0;
}

body.theme-lime .catalog-city img {
    width: 24px;
    height: 24px;
}

/* Строка марок-кругов (как на главной, marks-facet каталога). */
body.theme-lime .marks-strip {
    display: flex;
    flex-wrap: wrap;
    gap: 22px 30px;
    justify-content: space-between;
    background: var(--lime-bg-soft);
    border-radius: 15px;
    padding: 24px 40px;
    margin-bottom: 40px;
}

body.theme-lime .popular-tags {
    margin: 0 0 40px;
}

body.theme-lime .popular-tags h3 {
    font: 700 24px/1.1 "Inter", system-ui, sans-serif;
    color: var(--lime-dark);
    margin: 0 0 20px;
}

body.theme-lime .facet-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
}

body.theme-lime .facet-chip.preset {
    border: 1px solid var(--lime-primary);
    border-radius: 50px;
    color: var(--lime-primary);
    background: #fff;
    padding: 8px 20px;
    font: 600 16px/1.4 "Inter", system-ui, sans-serif;
}

body.theme-lime .facet-chip.preset:hover {
    background: var(--lime-primary);
    color: #fff;
}

/* Панель фильтров — белая карточка макета (единый контур движка). */
body.theme-lime .facet-panel {
    background: #fff;
    border-radius: 20px;
    padding: 32px;
    box-shadow: 0 0 5.45px rgba(25, 32, 47, 0.09);
    font-family: "Inter", system-ui, sans-serif;
}

body.theme-lime .facet-panel .facet-group-title {
    font-weight: 600;
}

body.theme-lime .facet-panel .facet-chip {
    border: 1px solid var(--lime-border);
    border-radius: 8px;
    color: var(--lime-dark);
    background: #fff;
    padding: .4rem 1rem;
    font-size: .88rem;
}

body.theme-lime .facet-panel .facet-chip:hover {
    border-color: var(--lime-primary);
    background: var(--lime-bg-soft);
}

body.theme-lime .facet-panel .facet-chip.active {
    background: var(--lime-primary);
    border-color: var(--lime-primary);
    color: #fff;
}

body.theme-lime .facet-panel input[type="number"],
body.theme-lime .facet-panel select {
    border: 1px solid var(--lime-border);
    border-radius: 8px;
    padding: .35rem .75rem;
    font: 400 16px/1.4 "Inter", system-ui, sans-serif;
    color: var(--lime-dark);
}

/* Пагинация и «показать ещё» — в палитре темы. */
body.theme-lime .pagination-controls button {
    border: 1px solid var(--lime-border);
    border-radius: 8px;
    background: #fff;
    color: var(--lime-dark);
}

body.theme-lime .pagination-controls button:disabled {
    color: var(--lime-muted);
}

body.theme-lime p#pageInfo input {
    border: 1px solid var(--lime-border);
    border-radius: 8px;
    color: var(--lime-dark);
}

body.theme-lime .btn-secondary {
    border: 1px solid var(--lime-primary);
    color: var(--lime-primary);
    border-radius: 8px;
    background: #fff;
    font: 600 16px/1.2 "Inter", system-ui, sans-serif;
    padding: 12px 28px;
}

body.theme-lime .btn-secondary:hover {
    background: var(--lime-primary);
    color: #fff;
}

/* ─── Карточка товара (движок, макет 1:587) ─────────────────────── */
body.theme-lime #product.card,
body.theme-lime .card {
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 0 2.5px rgba(25, 32, 47, 0.07);
}

body.theme-lime .breadcrumbs {
    font: 400 14px/1.4 "Inter", system-ui, sans-serif;
    color: var(--lime-muted);
}

body.theme-lime .breadcrumbs a {
    color: var(--lime-muted);
}

body.theme-lime .breadcrumbs a:hover {
    color: var(--lime-primary);
}

body.theme-lime #product h1,
body.theme-lime .pname,
body.theme-lime .product-name {
    font: 700 28px/1.2 "Inter", system-ui, sans-serif;
    color: var(--lime-dark);
}

body.theme-lime .price_now,
body.theme-lime .price,
body.theme-lime .product-price {
    color: var(--lime-accent);
    font-weight: 700;
}

body.theme-lime .buy-list .btn-primary,
body.theme-lime .product-cta,
body.theme-lime .order-btn {
    border-radius: var(--lime-radius);
}

body.theme-lime table.detail-specs,
body.theme-lime .chars-table {
    font: 400 16px/1.4 "Inter", system-ui, sans-serif;
    color: var(--lime-dark);
}

body.theme-lime table.detail-specs td:first-child,
body.theme-lime .chars-table td:first-child {
    color: var(--lime-muted);
}

/* ─── Детальная: макетная сетка (макет 1:587) ───────────────────── */
body.theme-lime .detail-grid {
    display: grid;
    grid-template-columns: 700px minmax(0, 1fr);
    gap: 40px;
    align-items: start;
    padding: 30px;
}

/* Галерея: большое фото + миниатюры (700×525, 100×75). */
body.theme-lime .detail-gallery .cn.screen .cn-slide img {
    width: 700px;
    height: 525px;
    object-fit: cover;
    border-radius: 10px;
}

body.theme-lime .detail-gallery .cn.thumbs {
    margin-top: 20px;
}

body.theme-lime .detail-gallery .cn.thumbs .cn-slide img {
    width: 100px;
    height: 75px;
    object-fit: cover;
    border-radius: 10px;
}

/* Правая колонка. */
body.theme-lime .detail-info h1 {
    font: 700 32px/1.2 "Inter", system-ui, sans-serif;
    color: var(--lime-dark);
    margin: 0 0 6px;
}

body.theme-lime .detail-complectation {
    font: 400 16px/1.4 "Inter", system-ui, sans-serif;
    color: var(--lime-muted);
    margin: 0 0 18px;
}

body.theme-lime .detail-metrics {
    display: flex;
    gap: 30px;
    flex-wrap: wrap;
    margin-bottom: 22px;
}

body.theme-lime .detail-metric {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font: 400 16px/1.4 "Inter", system-ui, sans-serif;
    color: var(--lime-muted);
}

body.theme-lime .detail-metric i {
    font-style: normal;
}

body.theme-lime .detail-metric b {
    font-weight: 600;
    color: var(--lime-dark);
}

body.theme-lime .detail-price {
    margin-bottom: 22px;
}

body.theme-lime .price-now {
    display: flex;
    align-items: baseline;
    gap: 10px;
    font: 700 32px/1.2 "Inter", system-ui, sans-serif;
    color: var(--lime-accent);
}

body.theme-lime .price-now i {
    font-style: normal;
    font: 400 20px/1.2 "Inter", system-ui, sans-serif;
    color: var(--lime-muted);
    text-decoration: line-through;
}

body.theme-lime .price-monthly {
    font: 400 16px/1.4 "Inter", system-ui, sans-serif;
    color: var(--lime-muted);
    margin-top: 6px;
}

body.theme-lime .detail-cta {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 24px;
}

body.theme-lime .detail-cta .btn-primary,
body.theme-lime .detail-cta .btn-secondary,
body.theme-lime .detail-calc {
    width: 100%;
}

body.theme-lime .detail-cta .btn-secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    color: var(--lime-primary);
    border: 1px solid var(--lime-line);
    border-radius: var(--lime-radius);
    padding: 17px 30px;
    font: 600 16px/1.2 "Inter", system-ui, sans-serif;
    min-height: 44px;
    cursor: pointer;
}

body.theme-lime .detail-cta .btn-secondary:hover {
    background: var(--lime-bg-soft);
}

body.theme-lime .detail-calc {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    background: none;
    border: 0;
    color: var(--lime-accent);
    font: 600 16px/1 "Inter", system-ui, sans-serif;
    padding: 16px 0;
    cursor: pointer;
}

body.theme-lime .detail-specs-short dl {
    margin: 0;
    border-top: 1px solid var(--lime-line);
}

body.theme-lime .detail-specs-short dl>div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 6px 0;
    border-bottom: 1px solid var(--lime-line);
    font: 400 16px/1.4 "Inter", system-ui, sans-serif;
}

body.theme-lime .detail-specs-short dt {
    color: var(--lime-muted);
}

body.theme-lime .detail-specs-short dd {
    margin: 0;
    font-weight: 600;
    color: var(--lime-dark);
}

body.theme-lime a.detail-specs-all {
    display: inline-block;
    margin-top: 14px;
    font: 400 16px/1.4 "Inter", system-ui, sans-serif;
    color: var(--lime-primary);
}

body.theme-lime a.detail-specs-all:hover {
    color: var(--lime-accent);
}

/* Карусели детальной (products/поиска/поступлений) — карточки движка. */
body.theme-lime #products h2,
body.theme-lime .catalog-section h2 {
    font: 700 32px/1.1 "Inter", system-ui, sans-serif;
    color: var(--lime-dark);
}

/* ─── Адаптив: планшет/мобайл (макет 960/380) ────────────────────── */
@media (max-width: 990px) {
    body.theme-lime .hero h1 {
        font-size: 42px;
    }

    body.theme-lime .best-grid {
        /* 4 карточки «Лучшего выбора» (#414) в один ряд планшета —
           сетка 3 давала «сироту» 3+1. */
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    body.theme-lime .reviews-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.theme-lime .search-panel-form {
        padding: 24px;
    }

    body.theme-lime .search-panel-actions {
        margin-left: 0;
    }

    /* Контентные контейнеры на планшете — с боковыми полями 15px
       (#419): .wrap упирается в края (≤990), легаси main-поля
       обнулены для edge-to-edge фонов — секции не должны липнуть
       к краям. На десктопе (1200 по центру) поля не нужны. */
    body.theme-lime .wrap.container {
        padding-left: 15px;
        padding-right: 15px;
    }

    body.theme-lime .detail-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    body.theme-lime .detail-gallery .cn.screen .cn-slide img {
        width: 100%;
        height: auto;
        aspect-ratio: 700 / 525;
    }

    /* Навигация topline на планшете — в ОДНУ строку (#419, макет 9:4
       высота 37px): без переноса; gap 28 на планшете (макетные 40 с
       фактической шириной пунктов темы не влезают в 920: 908+40 контента
       против 880 доступных при полях 20px; на 960 — запас 12px, на
       920 — минус 28px, конец «Контакты» резался бы скрытым скроллом;
       запас десктопа 1200px позволяет макетные 40 там). Узкие планшеты
       (≤891) — одна строка с горизонтальной прокруткой (без скроллбара;
       тексты не переносятся и не сжимаются). */
    body.theme-lime .topline-nav {
        flex-wrap: nowrap;
        gap: 28px;
        overflow-x: auto;
        scrollbar-width: none;
    }

    body.theme-lime .topline-nav::-webkit-scrollbar {
        display: none;
    }

    /* Планшет (макет 9:3/9:35–9:38): поиск-ссылка — компактная иконка
       40×40 (текст-поле «Найти автомобиль ...» скрыт в макете
       планшета hidden=true; десктоп ≥991 — полное поле с текстом).
       Иконка-кнопка освобождает шапке место под телефон (макет
       Frame 219 328×51) — иначе блок контактов сжимался и номер
       переносился на 2 строки (#419). */
    body.theme-lime .header-search-link span {
        display: none;
    }

    body.theme-lime .header-search-link {
        width: 40px;
        height: 40px;
        padding: 0;
        justify-content: center;
    }

    /* Подвал на планшете (#412): колонки компактнее — 30px вместо 40,
       чтобы при 761–990px ряд бренд + 3 колонки не переносился. */
    body.theme-lime .footer-cols {
        gap: 30px;
    }
}

/* Навигация topline 991–1024px (#419): MQ 990 кончился, базовый gap 40
   требует ≥1009px видимой ширины — на 991–1008 пункты переносились
   на вторую строку. Держим одну строку с планшетным gap 28 и тем же
   скрытым скроллбаром (ревью #421: без него на 991–1024 появлялся
   системный скроллбар — рассинхрон с планшетным MQ). */
@media (min-width: 991px) and (max-width: 1024px) {
    body.theme-lime .topline-nav {
        flex-wrap: nowrap;
        gap: 28px;
        overflow-x: auto;
        scrollbar-width: none;
    }

    body.theme-lime .topline-nav::-webkit-scrollbar {
        display: none;
    }
}

@media (max-width: 760px) {
    body.theme-lime .topline {
        display: none;
    }

    /* Мобильная шапка 380×50 (макет 9:636 Frame 237): лого + подпись
       города слева, бургер справа; поиск/телефон/иконки скрыты. */
    body.theme-lime .header-main {
        flex-wrap: nowrap;
        gap: 10px;
        padding: 5px 16px;
        min-height: 50px;
    }

    body.theme-lime .header-marks {
        flex: 1 1 auto;
        gap: 8px;
        min-width: 0;
    }

    body.theme-lime .header-city {
        display: inline-flex;
        font-size: 11px;
    }

    body.theme-lime .header-search,
    body.theme-lime .header-contacts,
    body.theme-lime .header-marks-list {
        display: none;
    }

    body.theme-lime .burger {
        display: inline-flex;
    }

    body.theme-lime .hero {
        /* Серый идёт под верхнюю ~1/3 формы (#415 п.5, макет 9:585).
           Глубина серого под верхом белой карточки = наезд формы
           (margin-top: −130px ниже) — ~130px из ~380px высоты формы. */
        padding: 40px 0 200px;
    }

    body.theme-lime .hero h1 {
        font-size: 32px;
    }

    body.theme-lime .hero-kicker {
        font-size: 18px;
    }

    /* Вертикальный ритм героя (#414 п.1, п.2, макет 320): зазор
       kicker→заголовок 12px (было 22), заголовок→«Более 300…» 24px
       (было 16 — в макете подзаголовок дальше от заголовка). */
    body.theme-lime .hero-text {
        gap: 12px;
    }

    body.theme-lime .hero-note {
        margin-top: 24px;
    }

    body.theme-lime .hero-trust {
        gap: 20px;
    }

    /* Кнопки героя в столбик на всю ширину (макет 9:653: 340×53) —
       легаси не растягивал их: 235/175px вразнобой (#412). */
    body.theme-lime .hero-cta {
        flex-direction: column;
        align-items: stretch;
    }

    body.theme-lime .hero-cta .hero-btn,
    body.theme-lime .hero-cta .hero-btn-secondary {
        width: 100%;
    }

    /* Мобильная форма поиска (макет 9:678): строки «лейбл + контрол»
       по 44px (9:713), Цена/Год/Цвет скрыты, кнопки на всю ширину. */
    body.theme-lime .search-panel-row {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
    }

    body.theme-lime .search-field,
    body.theme-lime .select-field {
        width: 100%;
        min-width: 0;
        min-height: 44px;
    }

    body.theme-lime .select-field {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 10px;
    }

    /* Селекты формы на мобайле — воздушнее (макет, #414 п.4):
       больше внутренних полей по вертикали (44px высоты контрола). */
    body.theme-lime .select-field select,
    body.theme-lime .range-select {
        padding: 12px 14px;
        min-height: 44px;
    }

    body.theme-lime .search-query input,
    body.theme-lime .search-range input {
        padding: 10px;
    }

    body.theme-lime .select-field select {
        flex: 1 1 auto;
        width: auto;
    }

    /* Цена/Год на мобильной главной скрыты (в макете hidden; доступны
       в каталоге через «Все фильтры»); Цвет — тоже скрыт (макет 9:733). */
    body.theme-lime .search-range,
    body.theme-lime .select-field[title="Цвет"] {
        display: none;
    }

    body.theme-lime .search-panel-actions {
        flex-direction: column;
        gap: 10px;
        width: 100%;
    }

    body.theme-lime .search-panel-actions .filters-link,
    body.theme-lime .search-panel-actions .find-btn {
        width: 100%;
        justify-content: center;
    }

    /* Заголовки секций на мобайле: «Все автомобили»/«Все марки» —
       под заголовком (макеты 9:747/9:1131). */
    body.theme-lime .section-head {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }

    body.theme-lime .section-head .section-link {
        align-self: flex-start;
    }

    /* «Лучший выбор» на мобайле (#415 п.1, макет 9:747): горизонтальная
       карусель — первая карточка полноразмерная (~77% контейнера,
       макет 263/340), вторая частично видна за правым краем экрана;
       скролл свайпом. Сетка 2×2 (было #414 п.6) — не макетна.
       (#416 приёмка:) полоса прокрутки скрыта — свайп сохраняется,
       скроллбар не виден даже в тач-эмуляции. */
    body.theme-lime .best-grid {
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        gap: 20px;
        margin: 0;
        padding: 2px 0 8px;
        scroll-snap-type: x proximity;
        scrollbar-width: none;
        -ms-overflow-style: none;
    }

    body.theme-lime .best-grid::-webkit-scrollbar {
        display: none;
    }

    body.theme-lime .best-card {
        flex: 0 0 77%;
        width: auto;
        scroll-snap-align: start;
    }

    /* Отзывы на мобайле — сеткой, без горизонтального скролла (#412:
       лента с полосой прокрутки не задумана макетом 9:1245). */
    body.theme-lime .reviews-grid {
        display: grid;
        grid-template-columns: 1fr;
        overflow-x: visible;
        gap: 20px;
        margin: 0;
        padding: 0 0 8px;
    }

    body.theme-lime .review-card {
        flex: none;
        scroll-snap-align: none;
    }

    /* Отзывы на мобайле (#414 п.12, макет 320): фото-обложка сверху
       на всю ширину карточки, описание под ней (не колонка-аватар). */
    body.theme-lime .review-card {
        flex-direction: column;
    }

    body.theme-lime .review-photo {
        flex: none;
        height: 200px;
    }

    /* Мобильная форма поиска (макет 9:678): карточка 340 (поля контейнера
       20px), внутренние поля 12px — контент ≈ макетным 280. */

    /* Поле «Поиск авто» не вылезает за панель (#410: легаси width: 128px +
       flex без min-width давали right 403 при вьюпорте 380). */
    body.theme-lime .search-query input {
        flex: 1 1 auto;
        min-width: 0;
        max-width: 100%;
        width: 100%;
    }

    /* Поля формы 20px — общее правило выше (макет 9:678/9:85). */

    /* Наезд формы на серый hero на мобайле — глубже (#415 п.5):
       форма ~390px высотой, наезд −150px даёт серый под её верхом
       ~1/3 высоты (как серый до 1/3 формы в макете 9:585). */
    body.theme-lime .search-panel {
        margin-top: -150px;
    }

    body.theme-lime .search-panel-form {
        padding: 12px;
    }

    /* Кнопки лид-панелей на всю ширину контента (макет: «Получить
       консультацию»). */
    body.theme-lime .about-block-btn,
    body.theme-lime .cta-block-btn {
        width: 100%;
    }

    body.theme-lime .marks-choice > .wrap.container {
        flex-basis: 100%;
        margin-bottom: 20px;
    }

    body.theme-lime .marks-grid {
        padding: 24px;
    }

    /* Заголовок панели марок на мобайле — 30px (макет 9:1131). */
    body.theme-lime .marks-head h2 {
        font-size: 30px;
    }

    body.theme-lime .mark-btn {
        width: 60px;
    }

    /* «Избранный поиск» (#414 п.9, макет 320): панель и чипы
       компактнее — больше пилюль в строке (3 против 2 до волны). */
    body.theme-lime .search-strip {
        padding: 24px;
    }

    body.theme-lime .search-strip-chips {
        gap: 8px;
    }

    body.theme-lime .strip-chip {
        padding: 5px 12px;
        font-size: 13px;
    }

    body.theme-lime .features-row {
        gap: 24px;
    }

    /* Преимущества (#414 п.10): воздух сверху меньше, чем 60px
       (макет 320: блок компактнее между панелями). */
    body.theme-lime .features {
        padding-top: 36px;
    }

    body.theme-lime .features + .about-block {
        padding-top: 36px;
    }

    /* CTA «Lime Auto» на мобайле (#414 п.11, макет 320): панель выше
       контента, текст сверху, кнопка прижата к нижнему краю. */
    body.theme-lime .about-block-inner {
        flex-direction: column;
        justify-content: space-between;
        align-items: flex-start;
        gap: 24px;
        min-height: 300px;
        padding: 30px 24px;
    }

    body.theme-lime .cta-block-inner {
        padding: 30px 24px;
    }

    body.theme-lime .help-contacts {
        flex-direction: column;
        align-items: stretch;
        gap: 0;
    }

    /* CTA-подвал «Нужна помощь?» (макет 9:1281): строки списком
       с горизонтальной чертой-разделителем (приёмка #408 п.7). */
    body.theme-lime .help-contact {
        border-right: 0;
        border-bottom: 1px solid var(--lime-line);
        padding: 14px 0;
    }

    body.theme-lime .help-contact:last-child {
        border-bottom: 0;
    }

    /* Колонки навигации подвала (макет 9:1306): 2 колонки по 150px,
       третья — строкой ниже; без flex-сжатия (приёмка #408 п.8).
       #412: жёсткие 150+150+40=340 не влезали в контейнер 320 (у
       подвала wrap без паддингов) — колонки гибкие от 130px. */
    body.theme-lime .footer-cols {
        display: grid;
        grid-template-columns: repeat(2, minmax(130px, 1fr));
        gap: 40px;
    }

    /* Отступы подвала на мобайле (#412): компактнее вертикальный ритм
       бренд-блок → колонки и между пунктами. */
    body.theme-lime .footer-top {
        gap: 36px;
    }

    body.theme-lime .footer-col ul {
        gap: 12px;
    }

    body.theme-lime .footer-col b {
        margin-bottom: 12px;
    }

    /* «Информация» — на всю ширину второй строки сетки (#414 п.14,
       макет 320: две колонки в ряду без пустого места справа). */
    body.theme-lime .footer-col:nth-child(3) {
        grid-column: 1 / -1;
    }

    /* Каталог на мобайле (#412, макет 35:2280): компактные марки-круги,
       чипы и панель фильтров без вылетов за 380px. */
    body.theme-lime .marks-strip {
        padding: 16px 20px;
        gap: 14px 20px;
        margin-bottom: 24px;
    }

    /* Селектор сужен до каталога (ревью #413): без этого MQ-правило
       переопределяло секцию марок главной (60px → 52px). */
    body.theme-lime .marks-strip .mark-btn {
        width: 52px;
    }

    body.theme-lime .marks-strip .mark-btn img,
    body.theme-lime .marks-strip .mark-placeholder {
        width: 48px;
        height: 48px;
    }

    /* Чипы фильтров компактнее (п.8 прожарки #412, макет 35:2280):
       панель фильтров без вылетов за пределы каталога. */
    body.theme-lime .facet-chips .facet-chip {
        padding: .4rem .8rem;
    }

    body.theme-lime .catalog-head h1 {
        font-size: 26px;
    }

    body.theme-lime .catalog-city {
        font-size: 14px;
    }

    body.theme-lime .popular-tags h3 {
        font-size: 20px;
        margin-bottom: 14px;
    }

    body.theme-lime .facet-panel {
        padding: 20px 16px;
    }

    /* Детальная на мобайле (#412): карточка впритык к краям, текст
       и кнопки читаемы. */
    body.theme-lime .detail-grid {
        padding: 16px;
        gap: 24px;
    }

    body.theme-lime .detail-info h1 {
        font-size: 26px;
    }

    body.theme-lime .detail-cta .btn-primary,
    body.theme-lime .detail-cta .btn-secondary {
        padding: 15px 20px;
    }
}

@media (max-width: 480px) {
    body.theme-lime .search-field {
        width: 100%;
    }

    body.theme-lime .search-query input {
        flex: 1 1 auto;
        width: auto;
    }
}