/* Подключаем современный шрифт из макета (Figma Style) */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@200;400;500;600;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Oxanium:wght@400;600;700;800&display=swap');
:root {
    --bg-main: #0a0a0a;       /* Глубокий черный фон */
    --accent-green: #219653; /* Тот самый зеленый */
    --text-white: #FFFFFF;
    --text-muted: #A0A0A0;
}

* {
    box-sizing: border-box;
}

html {
    overflow-x: hidden;
}

body.home-page {
    overflow-x: hidden;
    max-width: 100%;
}

header {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    height: 160px; /* Твоя расчетная высота */
    display: flex;
    align-items: center;
    z-index: 100;
    background: transparent;
}

.header-wrap {
    width: 100%;
    max-width: 1600px; /* Ограничение по сетке */
    margin: 0 auto;
    padding: 0 40px; /* Отступы от краев на экранах меньше 1600px */
    display: flex;
    justify-content: space-between;
    align-items: center;
}



/* --- ГЛАВНЫЙ ЭКРАН (ALPHA PEGAS 2025) --- */

.section1 {
    height: 100vh;
    min-height: 800px;
    width: 100%;
    background: url('../img/main phooto.png') no-repeat center 10%,
        radial-gradient(circle at 70% 50%, #1a1a1a 0%, #050505 100%);    
    display: flex;
    align-items: center;
    position: relative;
    overflow: hidden; 
    margin-top: -160px;
    padding-top: 100px ; 
    box-sizing: border-box;
}

.sections-wrap {
    width: 100%;
    margin: 0 auto;
    z-index: 2;
    position: relative;
    min-height: 100vh; /* Обязательно на всю высоту экрана */
    display: flex;
    flex-direction: column;
    justify-content: center;
}

/* Заголовок: массивный и строгий */
.section1 h1 {
    font-family: 'Manrope', sans-serif;
    font-size: clamp(40px, 5vw, 64px);
    font-weight: 700;
    color: #FFFFFF;
    line-height: 1.1;
    margin: 0 0 20px 0;
    max-width: 700px;
    text-transform: none;
}

/* Подзаголовок: тонкий и серый */
.section1 h3 {
    font-family: 'Manrope', sans-serif;
    font-size: 18px;
    font-weight: 400;
    color: #B0B0B0; 
    line-height: 1.6;
    margin: 0 0 40px 0 ;
    max-width: 550px;
}

.section1 .button a,
.section4 .button a {    
    background-color: #033C2A; 
    background-image: linear-gradient(180deg, #045F42 0%, #033C2A 100%);
    
    /* 3. ФОРМА И БОРДЕР */
    border-radius: 8px;
    border: 1px solid #022F21;
    
    /* 4. СЛОЖНЫЕ ТЕНИ (НЕОМОРФИЗМ) */
    box-shadow: 
        /* Светлый блик сверху слева (придает объем) */
        inset 2px 2px 3px rgba(255, 255, 255, 0.1),
        /* Тень снизу справа (прижимает кнопку к фону) */
        inset -2px -2px 3px rgba(0, 0, 0, 0.3),
        /* Внешняя мягкая тень (чтобы кнопка не "висела" в воздухе) */
        0 5px 15px rgba(0, 0, 0, 0.4);
        
    /* 5. ПОДГОТОВКА К АНИМАЦИИ */
    transition: all 0.3s ease;
    cursor: pointer;
}
body:not(.home-page) .section1 .button a:hover,
.section4 .button a:hover {
    /* Меняем градиент на темно-серый, как на скрине */
    background-color: #333333; 
    background-image: linear-gradient(180deg, #3C3C3C 0%, #2A2A2A 100%);
    
    /* Обновляем тень: усиливаем блик и добавляем внешнее свечение */
    box-shadow: 
        inset 2px 2px 4px rgba(255, 255, 255, 0.2),
        inset -2px -2px 4px rgba(0, 0, 0, 0.4),
        /* Внешнее свечение при наведении */
        0 8px 25px rgba(0, 0, 0, 0.6);
        
    /* Легкое движение вверх для эффекта "приподнятости" */
    /*transform: translateY(-2px);*/
}

/* --- Эффект Pressed (Нажатие / Активное состояние) --- */
/* В макете при нажатии кнопка снова становится зеленой, 
   но как будто "вдавливается" */
body:not(.home-page) .section1 .button a:active,
.section4 .button a:active {
    /* Возвращаем зеленый цвет */
    background-color: #033C2A; 
    background-image: linear-gradient(180deg, #045F42 0%, #033C2A 100%);
    
    /* Обновляем тени для эффекта "вдавленности" */
    /* Инвертируем внутренние тени: темная тень сверху, светлая снизу */
    box-shadow: 
        inset 3px 3px 6px rgba(0, 0, 0, 0.5),
        inset -1px -1px 3px rgba(255, 255, 255, 0.1);
        
    /* Возвращаем кнопку на место или даже чуть ниже */
    transform: translateY(1px);
}













/* --- СНОСКИ (ПОЛНЫЙ ФИКС КООРДИНАТ) --- */

body .wrap .sections.section1 .spec-line {
    position: absolute;
    font-family: 'Manrope', sans-serif;
    color: transparent;
    -webkit-text-stroke: 1px rgba(255, 255, 255, 0.7);
    font-size: 38px;
    font-weight: 800;
    z-index: 10;
}

/* Подписи над цифрами */
body .wrap .sections.section1 .spec-line span {
    position: absolute;
    top: -15px;
    left: 0;
    font-size: 11px;
    font-weight: 400;
    color: #aaa !important;
    -webkit-text-stroke: 0 !important;
}

/* Общие стили линий */
.sections.section1 .spec-line::before,
.sections.section1 .spec-line::after {
    content: '';
    position: absolute;
    background: rgba(255, 255, 255, 0.4);
    z-index: -1;
}

/* --- КОНКРЕТНЫЕ ТОЧКИ --- */

/* 1. Максимальная скорость (305 км/ч) - на крышу */
.spec-line.speed {
    top: 25%;
    left: 55%;
}
.spec-line.speed::after { /* Горизонтальная */
    width: 100px;
    height: 1px;
    bottom: -5px;
    right: 0;
}
.spec-line.speed::before { /* Наклонная */
    width: 1px;
    height: 60px;
    bottom: -60px;
    right: 0;
    transform: rotate(-45deg);
    transform-origin: top;
}

/* 2. Разгон (3.5 с) - на капот */
.spec-line.acceleration {
    top: 45%;
    left: 38%;
}
.spec-line.acceleration::after {
    width: 80px;
    height: 1px;
    bottom: -5px;
    left: 0;
}
.spec-line.acceleration::before {
    width: 1px;
    height: 50px;
    bottom: -50px;
    left: 0;
    transform: rotate(45deg);
    transform-origin: top;
}

/* 3. Мощность (717 л.с.) - на переднее колесо */
.spec-line.power {
    bottom: 22%;
    left: 42%;
}
.spec-line.power::after {
    width: 120px;
    height: 1px;
    top: -5px;
    left: 0;
}
.spec-line.power::before {
    width: 1px;
    height: 70px;
    top: -75px;
    left: 0;
    transform: rotate(-30deg);
    transform-origin: bottom;
}

@media (max-width: 1650px) {
    .section1 {
        padding-left: 20px;
        padding-right: 20px;
    }
}

@media (max-width: 1650px) {
    .spec-line {
        display: none;
    }
}

@media (max-width: 768px) {
    .section1 {
        height: auto;
        min-height: 100vh;
        padding: 120px 0 60px; 
        background: url('../img/main-screen.jpg');
        background-position: 65% center; /* Смещаем авто, чтобы текст был слева или по центру */
        text-align: center;
        display: block; /* Упрощаем флекс для мобильных */
    }

    .sections-wrap {
        min-height: auto;
        padding: 0 20px;
        align-items: center; /* Центрируем контент */
    }

    .section1 h1 {
        font-size: clamp(28px, 8vw, 36px);
        max-width: 100%;
        margin: 0 auto 15px;
    }

    .section1 h3 {
        font-size: 16px;
        max-width: 100%;
        margin: 0 auto 30px;
    }

    /* Кнопка */
    body:not(.home-page) .section1 .button {
        display: flex;
        justify-content: center;
        margin-bottom: 50px;
    }

    body:not(.home-page) .section1 .button a {
        width: 100%;
        padding: 18px 0;
        font-size: 16px;
    }    
}


@media (max-width: 480px) {
    .section1 {
        background-image: linear-gradient(to bottom, rgba(5,5,5,0.7), rgba(5,5,5,0.2)), 
                          url('../img/main-screen.jpg'); /* Затемняем фон для читаемости */
        background-size: cover;
    }
    
    .section1 h1 {
        font-size: 26px;
    }

    body .wrap .sections.section1 .spec-line {
        width: 100%; /* Каждая характеристика с новой строки или по 2 в ряд */
        max-width: 150px;
    }
}


/* --- СЕКЦИЯ БРЕНДОВ (СВЕТЛАЯ, АКЦЕНТНАЯ) --- */

.sections.section2 {
    width: 100%;
    background: #DDE4EBBD; 
    padding: 45px 0; /* Увеличили отступы, так как лого стали крупнее */
    
    border-top: 1px solid rgba(0, 0, 0, 0.05);
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    overflow: hidden;
}

/* Контейнер для маскирования (без изменений, мягкое затухание по краям) */
.brands-marquee {
    display: flex;
    overflow: hidden;
    user-select: none;
    
    -webkit-mask-image: linear-gradient(to right, transparent 0%, black 15%, black 85%, transparent 100%);
    mask-image: linear-gradient(to right, transparent 0%, black 15%, black 85%, transparent 100%);
}

/* Трек с логотипами — бесшовный цикл через два .brands-set */
.brands-track {
    display: flex;
    width: max-content;
    align-items: center;
    animation: scroll-marquee 40s linear infinite;
}

.brands-set {
    display: flex;
    flex-shrink: 0;
    align-items: center;
}

/* Элемент бренда */
.items-brand {
    width: auto;
    flex-shrink: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 18px;
}

/* Настройка самих изображений логотипов (КРУПНЕЕ И ТЕМНЕЕ) */
.items-brand img {
    height: 50px; /* УВЕЛИЧИЛИ ВЫСОТУ ЛОГОТИПОВ (было ~38px) */
    width: auto;
    
    /* ДЕЛАЕМ ЛОГОТИПЫ ПОЛНОСТЬЮ ЧЕРНЫМИ */
    filter: grayscale(1) brightness(0); 
    
    /* УБРАЛИ ПРОЗРАЧНОСТЬ (делаем их максимально плотными и темными) */
    opacity: 1; 
    
    /* УБРАЛИ TRANSITION (нет надобности без ховера) */
}

/* УДАЛИЛИ ВЕСЬ БЛОК :HOVER */

@keyframes scroll-marquee {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

@keyframes scroll-marquee-seamless {
    0% { transform: translate3d(0, 0, 0); }
    100% { transform: translate3d(calc(-1 * var(--marquee-shift, 0px)), 0, 0); }
}



/* --- СЕКЦИЯ 1.5: АКЦИЯ (ДВЕ КОЛОНКИ) --- */

.sections.section1-5 {
    width: 100%;
    height: 535px; /* Твоя высота */
    position: relative;
    overflow: hidden;
    background: #121416 url('../img/promo-trax.jpg') no-repeat center center;
    background-size: cover;
    display: flex;
    align-items: center;
}

.sections.section1-5 .sections-wrap {
    width: 100%;
    margin: 0 auto;
    padding: 0 60px;
}

.promo-content {
    display: flex;
    justify-content: space-between; /* Разносим влево и вправо */
    align-items: flex-end; /* Выравниваем по нижней линии текста */
    width: 100%;
    font-family: 'Manrope', sans-serif;
}

/* ЛЕВАЯ ЧАСТЬ */
.promo-left {
    max-width: 800px;
    color: #ffffff;
}

.promo-header {
    display: flex;
    align-items: center;
    gap: 30px;
}

.promo-badge {
    color: #ECD00B;
    font-size: 64px;
    font-weight: 600;
    display: block;
}

.promo-subtitle {
    font-size: 32px;
    color: #fff;
}

.promo-main {
    display: flex;
    flex-flow: column nowrap;
    align-items: center;
    max-width: 600px;
}

.promo-discount {
    font-size: 120px;
    font-weight: 600;
    color: #FFD700;
}

.promo-car-name {
    font-size: 72px;
    font-weight: 700;
    color: transparent;
    -webkit-text-stroke: 1px rgba(255, 255, 255, 1);
}

/* ПРАВАЯ ЧАСТЬ */
.promo-right {
    max-width: 600px;
}

.promo-right p {
    font-size: 20px;
    color: #fff;
    text-transform: uppercase;
}

/* --- Ноутбуки и мониторы 1440px --- */
@media (max-width: 1440px) {
    .promo-discount {
        font-size: 100px; /* Было 120px */
    }
    .promo-car-name {
        font-size: 64px; /* Было 72px */
    }
    .promo-badge {
        font-size: 54px; /* Было 64px */
    }
}

/* --- Ноутбуки 1366px (стандарт) --- */
@media (max-width: 1366px) {
    .sections.section1-5 .sections-wrap {
        padding: 0 40px; /* Чуть сужаем поля */
    }
    .promo-discount {
        font-size: 90px;
    }
    .promo-car-name {
        font-size: 56px;
    }
    .promo-subtitle {
        font-size: 28px;
    }
    .promo-right p {
        font-size: 18px;
    }
}

/* --- Планшеты и малые экраны 1024px --- */
@media (max-width: 1024px) {
    .sections.section1-5 {
        height: 480px; /* Немного уменьшаем общую высоту секции */
    }
    
    .promo-content {
        align-items: center; /* Центрируем по вертикали для баланса */
        gap: 30px;
    }

    .promo-header {
        gap: 20px;
    }

    .promo-badge {
        font-size: 42px;
    }

    .promo-subtitle {
        font-size: 24px;
    }

    .promo-discount {
        font-size: 80px;
    }

    .promo-car-name {
        font-size: 48px;
    }

    .promo-right {
        max-width: 400px; /* Ограничиваем правую часть, чтобы не "размазывалась" */
    }

    .promo-right p {
        font-size: 16px;
    }
}

@media (max-width: 768px) {
    .sections.section1-5 {
        height: auto; /* Убираем фиксированную высоту 535px */
        min-height: 500px;
        padding: 60px 0;
        background-position: center left; /* Сдвигаем фон, чтобы машина была видна */
    }

    .sections.section1-5 .sections-wrap {
        padding: 0 20px;
    }

    .promo-content {
        flex-direction: column; /* Стек: лево над право */
        align-items: flex-start; /* Выравнивание по левому краю */
        gap: 40px;
    }

    /* ЛЕВАЯ ЧАСТЬ */
    .promo-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 5px;
        margin-bottom: 20px;
    }

    .promo-badge {
        font-size: 38px; /* Уменьшаем "АКЦИЯ" */
        line-height: 1;
    }

    .promo-subtitle {
        font-size: 18px; /* Уменьшаем пояснение */
    }

    .promo-main {
        align-items: flex-start; /* На мобилках лучше по левому краю */
    }

    .promo-discount {
        font-size: 80px; /* Уменьшаем -50% */
        line-height: 1;
    }

    .promo-target {
        font-size: 18px;
        margin-top: -10px;
        margin-bottom: 10px;
    }

    .promo-car-name {
        font-size: 42px; /* Уменьшаем название авто */
        -webkit-text-stroke: 1px rgba(255, 255, 255, 0.8);
    }

    /* ПРАВАЯ ЧАСТЬ */
    .promo-right {
        max-width: 100%;
        border-left: 3px solid #ECD00B; /* Добавим акцентную линию слева для стиля */
        padding-left: 15px;
    }

    .promo-right p {
        font-size: 14px; /* Уменьшаем дисклеймер */
        line-height: 1.4;
    }
}

@media (max-width: 480px) {
    .promo-discount {
        font-size: 64px;
    }
    
    .promo-car-name {
        font-size: 36px;
    }
}


/*==========================================*/



/* --- СЕКЦИЯ 3: КАТАЛОГ (FLEXBOX ВЕРСИЯ) --- */

.section3 {
    background: #7E838F; 
    font-family: 'Manrope', sans-serif;
}

.section3 .sections-wrap {
    margin: 0 auto;
}

/* Заголовки и фильтры */
.catalog-header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 40px;
}

.catalog-title {
    color: #FFF;
    font-size: 32px;
    font-weight: 700;
    margin: 0;
}

.catalog-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.filter-btn {
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
    color: #FFF;
    padding: 8px 16px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 14px;
    text-transform: uppercase;
    transition: all 0.3s ease;
}

.filter-btn.active, .filter-btn:hover {
    background: #FFF;
    color: #333;
}

/* Сетка каталога */
.catalog-grid {
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    gap: 20px;
    align-items: stretch;
}

.card-item {
    flex: 1 1 350px;
    max-width: 450px;
    background: #FFF;
    border-radius: 5px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: transform 0.3s ease;
}

.card-item:hover {
    transform: translateY(-5px);
}

/* Верхняя темная часть с фото */
.card-img-box {
    width: 100%;
    height: auto;
    display: block;
    aspect-ratio: 3 / 2; 
    background: #2D3139;
    overflow: hidden;
}

.card-img-box img {
    width: 100%;
    height: 100%;
    
    /* Сохраняем внутренние пропорции самого файла изображения, 
       заполняя отведенную область 3:2 без искажений */
    object-fit: cover; 
    
    /* Центрируем авто (особенно важно для широких макетов) */
    object-position: center;
    display: block;
}

/* Контентная часть */
.card-content {
    padding: 25px;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

.card-price {
    font-size: 14px;
    color: #333;
    margin-bottom: 8px;
}

.card-price span {
    font-size: 24px;
    font-weight: 800;
    color: #219653;
}

.card-name {
    font-size: 20px;
    font-weight: 700;
    margin: 0 0 12px 0;
    color: #1A1A1A;
}

.card-meta {
    font-size: 13px;
    color: #666;
    margin-bottom: 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.card-class span {
    color: #219653;
    font-weight: 600;
}

/* Кнопка */
.card-btn a {
    display: block;
    background: linear-gradient(180deg, #045F42 0%, #033C2A 100%);
    color: #FFF;
    text-align: center;
    padding: 14px;
    border-radius: 8px;
    text-decoration: none;
    font-weight: 600;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}

/* Ссылки "Смотреть все" и разделитель */
.view-all {
    display: inline-block;
    width: 100%;
    text-align: right;
    color: #FFF;
    text-decoration: none;
    margin-top: 20px;
    font-size: 15px;
}

.catalog-divider {
    border: 0;
    border-top: 1px solid rgba(255,255,255,0.2);
}

/* --- АДАПТИВНОСТЬ --- */

@media (max-width: 1024px) {
    
}

@media (max-width: 768px) {
    .catalog-header {
        flex-direction: column;
        align-items: flex-start;
    }
    
    .catalog-title {
        font-size: 26px;
    }

    .view-all {
        text-align: center;
    }
}

@media (max-width: 580px) {
    .card-item {
        max-width: 100%;
        flex: 1 1 100%; /* Одна карточка на всю ширину */
    }

    .card-content {
        padding: 15px; /* Немного компактнее на мобильных */
    }
    
    .section3 .sections-wrap {
        padding: 0 15px;
    }

    .card-img-box {
        aspect-ratio: 16 / 9;
    }
}

.section4 {
    background: #282C35;
    color: #FFF;
    font-family: 'Manrope', sans-serif;
    width: 100%;
}

.section4 .sections-wrap {

    width: 100%;
    padding: 0 20px; /* Отступы от краев экрана на малых разрешениях */
}

.title-white {
    font-size: 32px;
    font-weight: 700;
    margin-bottom: 40px;
    text-align-last: left;
}

/* ШАГИ ЗАКАЗА */
.steps-flex-container {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -15px;
}

.steps-flex-container .step-item {
    flex: 0 1 calc(50% - 30px); /* 2 колонки */
    margin: 0 15px 25px 15px;
    display: flex;
    gap: 15px;
}

.step-item span {
    background: #D9D9D9;
    color: #282C35;
    min-width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    font-size: 13px;
}

.step-item p {
    font-size: 18px;
    line-height: 1.5;
    color: #ccc;
    margin: 0;
}

.divider-dark {
    border: none;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    margin: 40px 0 60px 0;
}

/* КОНТЕНТ (УСЛОВИЯ + ФОТО) */
.content-flex-container {
    width: 100%;
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    gap: 50px;
}

.info-text-col {
    flex: 1;
}

.info-image-col {
    flex: 1;
}

.info-block {
    margin-bottom: 40px; /* Расстояние между "Условиями" и "Доставкой" */
}

.info-block h3 {
    font-size: 28px;
    margin-bottom: 20px;
}

.info-block p {
    font-size: 18px;
    color: #fff;
    line-height: 1.6;
    margin-bottom: 15px;
}

.delivery-list {
    list-style: none;
    padding: 0;
    margin-bottom: 30px;
}

.delivery-list li {
    color: #999;
    margin-bottom: 8px;
}

.green-text {
    color: #219653;
    font-weight: 700;
}

/* ОБЕРТКА ДЛЯ ИЗОБРАЖЕНИЯ */
.image-wrapper {
}

.image-wrapper img {
    width: 100%;
    max-width: 989px;
    height: auto;
    aspect-ratio: 989 / 854;
    object-fit: cover;
    border-radius: 12px;
}


/* ФУТЕР И КНОПКА */
.section-footer {
    display: flex;
    flex-flow: column nowrap;
    align-items: center;
    margin-top: 70px;
}

.section-footer p {
    font-size: 18px;
    color: #777;
    line-height: 1.6;
    margin-bottom: 30px;
    max-width: 800px;
}

.section-footer p a {
    color: #219653;
    font-weight: bold;
}
.section-footer button a {
    color: #fff;
}


/* АДАПТИВНОСТЬ */
@media (max-width: 1024px) {
    .section4 {
        padding: 60px 0;
    }

    .content-flex-container {
        flex-direction: column; /* Складываем текст и фото в одну колонку */
        gap: 40px;
        align-items: center;
    }

    .info-text-col {
        width: 100%;
    }

    .info-image-col {
        order: -1; /* Картинка будет НАД текстом на планшетах (по желанию) */        
        width: 100%;
        height: 100%;
    }

    .image-wrapper {
        min-height: 250px;
    }

    .image-wrapper img {
        width: 100%;
        height: auto;
    }
}

@media (max-width: 768px) {
    .title-white {
        font-size: 26px;
        margin-bottom: 30px;
    }

    .steps-flex-container .step-item {
        flex: 0 1 100%; /* Шаги в одну колонку */
        margin: 0 0 20px 20px;
    }

    .info-block h3 {
        font-size: 22px;
    }

    .info-block p, 
    .step-item p, 
    .section-footer p {
        font-size: 16px; /* Чуть меньше шрифт для мобильных */
    }

    .section-footer {
        margin-top: 50px;
    }

    .section4 .button a {
        width: 100%; /* Кнопка на всю ширину экрана */
        padding: 18px 0;
        text-align: center;
    }
}

@media (max-width: 768px) {

}

/* Hero-блок на главной — 650×332.98, left 105 / top 409 от края сайта */
body.home-page .section1 {
    display: block;
    padding-top: 0;
    /* min-height, а не padding-bottom: при border-box + height:100vh отступ не раздвигает секцию */
    height: auto;
    min-height: max(100vh, calc(974px + 108px));
    padding-bottom: 0;
    box-sizing: border-box;
}

body.home-page .section1 .sections-wrap {
    position: absolute;
    top: 409px;
    left: 105px;
    width: 650px;
    height: auto;
    max-width: 650px;
    margin: 0;
    min-height: 332.98px;
    padding: 0;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    overflow: visible;
    z-index: 2;
}

body.home-page .section1 h1,
body.home-page .section1 h3,
body.home-page .section1 .button {
    margin-left: 0;
}

body.home-page .section1 h1 {
    font-size: 48px;
    line-height: 1.1;
    color: #f5f0f0;
    text-shadow: 0px 4px 4px #00000040;
}

body.home-page .section1 h3 {
    font-size: 18px;
    line-height: 1.6;
    color: #ffffff;
}

/* Кнопка «Выбрать авто» — рамка на .button, заливка на a (без просвета сзади) */
body.home-page .section1 .button {
    position: relative;
    top: auto;
    left: auto;
    width: 415.38104248046875px;
    height: 74.97853088378906px;
    min-height: 74.97853088378906px;
    margin: auto 0 0;
    margin-bottom: 0;
    box-sizing: border-box;
    padding: 0.75px;
    border: none;
    border-radius: 11.25px;
    overflow: visible;
    opacity: 1;
    flex-shrink: 0;
    cursor: pointer;
    z-index: 3;
    display: flex;
    align-items: stretch;
    box-shadow: 0px 4px 4px 0px #00000040;
    /* Default: обводка 0.75px */
    background: linear-gradient(97.62deg, #76F8CC 16.37%, #11322B 76.29%);
    transition: background 0.2s ease;
}

/* Hover: обводка на самой кнопке, не за ней */
body.home-page .section1 .button:hover:not(:active) {
    background: linear-gradient(97.62deg, #FFFFFF 16.37%, #75819B 76.29%);
}

body.home-page .section1 .button a {
    position: relative;
    z-index: 1;
    width: 100%;
    height: 100%;
    min-height: 100%;
    flex: 1 1 auto;
    align-self: stretch;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    border: none;
    border-radius: 10.5px;
    background-color: transparent;
    background-image: linear-gradient(358.41deg, #12332D 0.9%, #017344 98.2%);
    box-shadow:
        0 3px 3px 0 #000000CC,
        inset -6.75px 3.75px 1px 3px #A9F89D42,
        inset -3px -3px 1px 0 #00000040;
    color: #ffffff;
    font-family: 'Manrope', sans-serif;
    font-weight: 500;
    font-style: normal;
    font-size: 26.99px;
    line-height: 100%;
    letter-spacing: 0;
    text-shadow: 0 4px 4px #00000040;
    min-width: 177px;
    text-decoration: none;
    transition: background-image 0.2s ease, box-shadow 0.2s ease;
}

body.home-page .section1 .button:hover:not(:active) a,
body.home-page .section1 .button a:hover:not(:active) {
    background-color: transparent;
    background-image: linear-gradient(358.41deg, #282C35 0.9%, #596476 98.2%);
    box-shadow:
        0 3px 3px 0 #000000CC,
        inset -6.75px 3.75px 1px 3px #848899,
        inset -3px -3px 1px 0 #282C35;
}

body.home-page .section1 .button:active {
    background: linear-gradient(97.62deg, #76F8CC 16.37%, #11322B 76.29%);
}

body.home-page .section1 .button a:active {
    background-color: transparent;
    background-image: linear-gradient(358.41deg, #017344 0.9%, #309B4D 98.2%);
    box-shadow:
        0 3px 3px 0 #000000CC,
        inset -6.75px 3.75px 1px 3px #A9F89D42,
        inset -3px -3px 1px 0 #00000040;
    filter: none;
}

/* Соцсети hero — right 106 / top 698; размеры и отступы по Figma */
body.home-page .section1 .ap-hero__social {
    position: absolute;
    top: 698px;
    right: 106px;
    bottom: auto;
    z-index: 50;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
    margin: 0;
    padding: 0;
}

body.home-page .section1 .ap-hero__social-link {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border-radius: 0;
    background: transparent;
    transition: opacity 0.2s ease;
    text-decoration: none;
    box-sizing: border-box;
}

body.home-page .section1 .ap-hero__social-link--instagram {
    width: 26px;
    height: 26px;
    margin: 0 0 25px;
}

body.home-page .section1 .ap-hero__social-link--instagram img {
    width: 26px;
    height: 26px;
}

body.home-page .section1 .ap-hero__social-link[href*="t.me"] {
    width: 29px;
    height: 29px;
    margin: 0 0 26px;
}

body.home-page .section1 .ap-hero__social-link[href*="t.me"] img {
    width: 29px;
    height: 29px;
}

body.home-page .section1 .ap-hero__social-link[href*="wa.me"] {
    width: 32px;
    height: 32px;
    margin: 0 0 24px;
}

body.home-page .section1 .ap-hero__social-link[href*="wa.me"] img {
    width: 32px;
    height: 32px;
}

body.home-page .section1 .ap-hero__social-link[href*="viber"] {
    width: 25px;
    height: 27px;
    margin: 0;
}

body.home-page .section1 .ap-hero__social-link[href*="viber"] img {
    width: 25px;
    height: 27px;
}

body.home-page .section1 .ap-hero__social-link:hover {
    opacity: 0.82;
}

body.home-page .section1 .ap-hero__social-link img {
    display: block;
    object-fit: contain;
    filter: none;
}

/* Шапка сайта — главная и внутренние страницы (Figma) */
:is(body.home-page, body.inner-page, body.inner-car-page, body.page-contacts) header {
    position: relative;
    z-index: 300;
    height: 159px;
    min-height: 159px;
}

/* Внутренние страницы — чёрная шапка (не прозрачная на сером фоне) */
:is(body.inner-page, body.inner-car-page, body.page-contacts) .wrap > header {
    background-color: #010101;
    border-bottom: none;
}

:is(body.home-page, body.inner-page, body.inner-car-page, body.page-contacts) .header-wrap {
    position: static;
    padding: 0 40px;
    justify-content: space-between;
    align-items: center;
}

/* место лого в flex, чтобы меню и телефоны не съезжали */
:is(body.home-page, body.inner-page, body.inner-car-page, body.page-contacts) .header-wrap::before {
    content: '';
    flex: 0 0 94.43px;
    width: 94.43px;
    height: 1px;
    visibility: hidden;
    pointer-events: none;
}

:is(body.home-page, body.inner-page, body.inner-car-page, body.page-contacts) .logo-wrap {
    position: absolute;
    top: 26px;
    /* 103px от левого края сайта (viewport), меню не сдвигается */
    left: 103px;
    width: 94.44px;
    height: 101px;
    z-index: 10;
    flex: none;
}

:is(body.home-page, body.inner-page, body.inner-car-page, body.page-contacts) .logo-wrap .logo,
:is(body.home-page, body.inner-page, body.inner-car-page, body.page-contacts) .logo-wrap .logo a {
    display: block;
    width: 100%;
    height: 100%;
    background: transparent !important;
}

:is(body.home-page, body.inner-page, body.inner-car-page, body.page-contacts) .logo-wrap .logo img {
    display: block;
    width: 94.44px;
    height: 101px;
    max-width: none;
    object-fit: contain;
    background: transparent !important;
}

/* Телефоны в шапке — 36px сверху, 102px справа от края сайта */
:is(body.home-page, body.inner-page, body.inner-car-page, body.page-contacts) header .cont {
    position: absolute;
    top: 36px;
    right: 102px;
    z-index: 310;
    text-align: right;
}

:is(body.home-page, body.inner-page, body.inner-car-page, body.page-contacts) header .cont .line1,
:is(body.home-page, body.inner-page, body.inner-car-page, body.page-contacts) header .cont .line2 {
    display: block;
}

/* Меню — 919×30, 323×62 от края сайта (Figma), desktop ≥1025px */
@media (min-width: 1025px) {
    :is(body.home-page, body.inner-page, body.inner-car-page, body.page-contacts) .menu--home {
        position: absolute;
        top: 62px;
        left: 323px;
        width: 919px;
        height: 30px;
        z-index: 305;
    }

    :is(body.home-page, body.inner-page, body.inner-car-page, body.page-contacts) .menu--home .main-menu {
        width: 919px;
        height: 30px;
        margin: 0;
        padding: 0;
        gap: 0;
        justify-content: space-between;
        align-items: center;
        flex-wrap: nowrap;
        font-size: 16px;
    }

    :is(body.home-page, body.inner-page, body.inner-car-page, body.page-contacts) .menu--home .main-menu > li {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 30px;
        flex: 0 0 auto;
    }

    :is(body.home-page, body.inner-page, body.inner-car-page, body.page-contacts) .menu--home .main-menu > li > a {
        line-height: 22px;
        font-size: 16px;
        text-align: center;
        border: 1px solid transparent;
        border-radius: 3px;
        background: none;
    }
}

/* === Ноутбуки и меньше: до 1024px === */
@media (max-width: 1024px) {
    :is(body.home-page, body.inner-page, body.inner-car-page, body.page-contacts) .header-wrap {
        padding-left: 40px;
    }

    :is(body.home-page, body.inner-page, body.inner-car-page, body.page-contacts) .header-wrap::before {
        display: none;
    }

    :is(body.home-page, body.inner-page, body.inner-car-page, body.page-contacts) .logo-wrap {
        position: relative;
        top: auto;
        left: auto;
        width: auto;
        height: auto;
    }

    :is(body.home-page, body.inner-page, body.inner-car-page, body.page-contacts) .logo-wrap .logo img {
        width: auto;
        height: 72px;
    }

    :is(body.home-page, body.inner-page, body.inner-car-page, body.page-contacts) .menu--home {
        position: relative;
        top: auto;
        left: auto;
        width: auto;
        height: auto;
        order: 3;
    }

    :is(body.home-page, body.inner-page, body.inner-car-page, body.page-contacts) .menu--home .main-menu {
        display: none;
        width: auto;
        height: auto;
    }

    :is(body.home-page, body.inner-page, body.inner-car-page, body.page-contacts) .menu--home > span#mm_button {
        display: block;
        cursor: pointer;
        margin-left: auto;
    }

    :is(body.home-page, body.inner-page, body.inner-car-page, body.page-contacts) .menu--home > span#mm_button img {
        width: 44px;
        height: auto;
        display: block;
    }

    :is(body.home-page, body.inner-page, body.inner-car-page, body.page-contacts) header .cont {
        position: relative;
        top: auto;
        right: auto;
        text-align: right;
    }

    body.home-page .section1 {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        height: auto;
        min-height: 0;
        padding: 120px 0 32px;
    }

    body.home-page .section1 .sections-wrap {
        position: relative;
        top: auto;
        left: auto;
        width: auto;
        height: auto;
        min-height: 0;
        max-width: 100%;
        padding: 0 20px;
        margin: 0 auto;
        flex: 0 0 auto;
    }

    body.home-page .section1 .button {
        width: 100%;
        max-width: 415.38104248046875px;
        height: auto;
        min-height: 0;
        margin: 28px 0 0;
        align-items: stretch;
    }

    body.home-page .section1 .button a {
        padding: 0;
        min-height: 44px;
        height: auto;
        font-size: 26.99px;
        line-height: 100%;
    }

    /* Соцсети — в потоке под кнопкой, без наложения на «Выбрать авто» */
    body.home-page .section1 .ap-hero__social {
        position: static;
        top: auto;
        right: auto;
        bottom: auto;
        align-self: center;
        justify-content: center;
        width: auto;
        max-width: 100%;
        margin: 20px auto 0;
        padding: 0 20px;
        flex-direction: row;
        flex-wrap: wrap;
        gap: 10px;
        z-index: 2;
    }

    body.home-page .section1 .ap-hero__social-link {
        width: 44px;
        height: 44px;
        min-width: 44px;
        min-height: 44px;
        padding: 0;
    }

    body.home-page .section1 .ap-hero__social-link--instagram {
        width: 44px;
        height: 44px;
        margin: 0;
    }

    body.home-page .section1 .ap-hero__social-link--instagram img {
        width: 26px;
        height: 26px;
    }

    body.home-page .section1 .ap-hero__social-link[href*="t.me"] {
        width: 44px;
        height: 44px;
        margin: 0;
    }

    body.home-page .section1 .ap-hero__social-link[href*="t.me"] img {
        width: 29px;
        height: 29px;
    }

    body.home-page .section1 .ap-hero__social-link[href*="wa.me"] {
        width: 44px;
        height: 44px;
        margin: 0;
    }

    body.home-page .section1 .ap-hero__social-link[href*="wa.me"] img {
        width: 32px;
        height: 32px;
    }

    body.home-page .section1 .ap-hero__social-link[href*="viber"] {
        width: 44px;
        height: 44px;
        margin: 0;
    }

    body.home-page .section1 .ap-hero__social-link[href*="viber"] img {
        width: 25px;
        height: 27px;
    }

    body.home-page .allsections-wrap {
        position: static;
    }

    body.home-page .sections.section2 {
        height: auto;
        min-height: 0;
        padding: 0;
        margin: 0;
        border: none;
        background: transparent;
        overflow: hidden;
    }

    body.home-page .section2 .brands-marquee {
        position: relative;
        top: auto;
        left: auto;
        width: 100%;
        height: auto;
        min-height: 108px;
        margin: 0;
        padding: 24px 0;
        -webkit-mask-image: linear-gradient(to right, transparent 0%, black 10%, black 90%, transparent 100%);
        mask-image: linear-gradient(to right, transparent 0%, black 10%, black 90%, transparent 100%);
    }

    body.home-page .sections.section1-5.ap-promo {
        display: block;
        height: auto;
        min-height: 500px;
        margin-top: 0;
        padding: 60px 0;
        background-position: center left;
    }

    body.home-page .ap-promo__canvas {
        position: relative;
        min-height: 0;
        padding: 0 20px;
    }

    body.home-page .ap-promo__canvas > * {
        position: static;
        width: auto;
        max-width: 100%;
    }

    body.home-page .ap-promo__badge {
        font-family: 'Manrope', sans-serif !important;
        font-weight: 800;
        font-size: 38px;
        line-height: 100%;
        letter-spacing: 0;
        text-transform: uppercase;
        margin-bottom: 5px;
    }

    body.home-page .ap-promo__subtitle {
        font-family: 'Manrope', sans-serif !important;
        font-weight: 200;
        font-size: 18px;
        line-height: 100%;
        letter-spacing: 0;
        text-align: left;
        margin-bottom: 20px;
    }

    body.home-page .ap-promo__discount {
        font-family: 'Manrope', sans-serif !important;
        font-weight: 700;
        font-size: 80px;
        line-height: 100%;
        letter-spacing: 0;
        text-transform: uppercase;
        text-shadow: 0 4px 4px #00000040;
    }

    body.home-page .ap-promo__target {
        font-family: 'Manrope', sans-serif !important;
        font-weight: 400;
        font-size: 18px;
        line-height: 100%;
        letter-spacing: 0;
        text-align: left;
        margin-top: -10px;
        margin-bottom: 10px;
    }

    body.home-page .ap-promo__car-name {
        font-size: 42px;
        -webkit-text-stroke: 1px rgba(255, 255, 255, 0.8);
        margin-bottom: 24px;
    }

    body.home-page .ap-promo__legal {
        max-width: 100%;
        border-left: 3px solid #ecd00b;
        padding-left: 15px;
    }

    body.home-page .ap-promo__legal p {
        font-size: 14px;
        line-height: 1.4;
    }
}

/* Логотипы брендов — Figma node 1-191, desktop ≥1025px */
@media (min-width: 1025px) {
    body.home-page .allsections-wrap {
        position: relative;
        --ap-brands-top: 974px;
        --ap-brands-height: 108px;
        overflow-x: clip;
        max-width: 100%;
    }

    body.home-page .sections.section2 {
        height: 0;
        min-height: 0;
        padding: 0;
        margin: 0;
        border: none;
        background: transparent;
        overflow: hidden;
    }

    body.home-page .section2 .brands-marquee {
        position: absolute;
        top: var(--ap-brands-top);
        left: -592px;
        width: 3109px;
        height: var(--ap-brands-height);
        opacity: 1;
        z-index: 4;
        box-sizing: border-box;
        display: flex;
        align-items: center;
        background: #DDE4EBBD;
        overflow: hidden;
        -webkit-mask-image: none;
        mask-image: none;
        line-height: 0;
    }

    body.home-page .section2 .brands-track {
        height: 100%;
        align-items: center;
        flex-wrap: nowrap;
        animation: none;
        will-change: transform;
        gap: 0;
        column-gap: 0;
    }

    body.home-page .section2 .brands-set {
        gap: 0;
        margin: 0;
        padding: 0;
    }

    body.home-page .section2 .items-brand {
        padding-left: 36px;
        padding-right: 36px;
    }

    body.home-page .section2 .items-brand img {
        display: block;
        height: 72px;
        max-width: 220px;
        width: auto;
    }
}

/*
 * Блок «Акция» — Figma node 1-42 (1920×535), только body.home-page
 * Координаты от края секции; badge: left 104px, top 55px (ниже ленты брендов)
 */
@media (min-width: 1025px) {
body.home-page .sections.section1-5.ap-promo {
    display: block;
    height: 535px;
    min-height: 535px;
    margin-top: calc(
        var(--ap-brands-top) + var(--ap-brands-height) -
        max(100vh, calc(var(--ap-brands-top) + var(--ap-brands-height)))
    );
    padding: 0;
    overflow: hidden;
    background: #121416 url('../img/promo-trax.jpg') no-repeat center center;
    background-size: cover;
}

body.home-page .ap-promo__canvas {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 535px;
    overflow: hidden;
    font-family: 'Oxanium', sans-serif;
}

body.home-page .ap-promo__canvas,
body.home-page .ap-promo__canvas * {
    font-family: 'Oxanium', sans-serif !important;
}

body.home-page .ap-promo__canvas > * {
    position: absolute;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    text-align: left;
}

body.home-page .ap-promo__badge {
    position: absolute;
    left: 104px !important;
    top: 55px !important;
    margin: 0;
    padding: 0;
    color: #ecd00b;
    font-family: 'Manrope', sans-serif !important;
    font-weight: 800;
    font-style: normal;
    font-size: 64px !important;
    line-height: 100%;
    letter-spacing: 0;
    text-transform: uppercase;
    white-space: nowrap;
    text-shadow: 0 4px 4px #00000040;
}

body.home-page .ap-promo__subtitle {
    left: 388px;
    top: 79px;
    max-width: 504px;
    color: #ffffff;
    font-family: 'Manrope', sans-serif !important;
    font-weight: 200;
    font-style: normal;
    font-size: 32px !important;
    line-height: 100%;
    letter-spacing: 0;
    text-align: center;
}

body.home-page .ap-promo__discount {
    left: 209px;
    top: 147px;
    color: #ffd700;
    font-family: 'Manrope', sans-serif !important;
    font-weight: 700;
    font-style: normal;
    font-size: 140.08px !important;
    line-height: 100%;
    letter-spacing: 0;
    text-transform: uppercase;
    white-space: nowrap;
    text-shadow: 0 8.76px 8.76px #00000040;
}

body.home-page .ap-promo__target {
    left: 216px;
    top: 309px;
    color: #ffffff;
    font-family: 'Manrope', sans-serif !important;
    font-weight: 400;
    font-style: normal;
    font-size: 48px !important;
    line-height: 100%;
    letter-spacing: 0;
    text-align: center;
    white-space: nowrap;
}

body.home-page .ap-promo__car-name {
    left: 154px;
    top: 407px;
    color: transparent;
    font-size: 72px;
    font-weight: 700;
    line-height: 1;
    -webkit-text-stroke: 1px #ffffff;
    white-space: nowrap;
}

body.home-page .ap-promo__legal {
    left: 1141px;
    top: 431px;
    width: 679px;
    height: 54px;
    max-width: calc(100% - 1141px - 24px);
    opacity: 1;
    box-sizing: border-box;
}

body.home-page .ap-promo__legal p {
    color: #ffffff;
    font-family: 'Manrope', sans-serif !important;
    font-weight: 700;
    font-style: normal;
    font-size: 20px;
    line-height: 100%;
    letter-spacing: 0;
    text-transform: uppercase;
    margin: 0;
}

body.home-page .ap-promo__legal p + p {
    margin-top: 8px;
}

@media (min-width: 1025px) and (max-width: 1440px) {
    body.home-page .ap-promo__car-name {
        font-size: 64px;
    }
}

@media (min-width: 1025px) and (max-width: 1366px) {
    body.home-page .ap-promo__car-name {
        font-size: 56px;
    }
}

}

/*
 * Каталог главной — Figma node 10-14 (1920×2039, 3 авто + 3 мото)
 * Figma: frame 10-14; сетка авто Group 54 — 1690×679.28, left 116, top 362 внутри секции
 */
@media (min-width: 1025px) {
body.home-page .sections.section3.ap-catalog {
    position: relative;
    display: block;
    min-height: 2039px;
    padding: 0;
    overflow: hidden;
    background: #7e838f;
    font-family: 'Manrope', sans-serif;
}

body.home-page .ap-catalog__canvas,
body.home-page .ap-catalog__canvas * {
    box-sizing: border-box;
    font-family: 'Manrope', sans-serif !important;
}

body.home-page .ap-catalog__canvas {
    width: 100%;
    max-width: 1920px;
    min-height: 2039px;
    margin: 0 auto;
    padding: 80px 114px 100px 116px;
}

body.home-page .ap-catalog__head {
    position: static;
    display: block;
    margin: 0;
    min-height: 282px;
}

/* Figma Group 41 — шапка каталога (917×55, left 97, top 66) */
body.home-page .ap-catalog__head-group {
    position: absolute;
    top: 66px;
    left: 97px;
    width: 917px;
    height: 55px;
    margin: 0;
    padding: 0;
}

body.home-page .ap-catalog__title {
    position: absolute;
    top: 0;
    left: 0;
    box-sizing: border-box;
    width: 337px;
    height: 55px;
    margin: 0 !important;
    padding: 0 !important;
    opacity: 1;
    color: #ffffff;
    font-family: 'Manrope', 'Noto Sans Display', sans-serif;
    font-size: 36px;
    font-weight: 800;
    font-style: normal;
    line-height: 36px;
    letter-spacing: 0;
    text-align: left !important;
    text-transform: none;
}

/* Figma Text: Эконом … Спорт (494×27, left 520, top 83) */
body.home-page .ap-catalog__filters {
    position: absolute;
    top: 83px;
    left: 520px;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    width: 494px;
    height: 27px;
    margin: 0;
    padding: 0;
    opacity: 1;
    font-family: 'Manrope', 'Noto Sans Display', sans-serif;
    font-size: 20px;
    font-weight: 500;
    font-style: normal;
    line-height: 20px;
    letter-spacing: 0;
    text-transform: lowercase;
}

body.home-page .ap-catalog__filter {
    position: relative;
    z-index: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    height: 27px;
    margin: 0;
    padding: 0 8px;
    border: none;
    border-radius: 0;
    background: transparent;
    color: rgba(255, 255, 255, 0.55);
    font: inherit;
    line-height: inherit;
    letter-spacing: inherit;
    text-transform: inherit;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
    transition: color 0.2s ease;
}

/* Rectangle 22 для фильтров — figma-menu-rectangle22.css */

body.home-page .ap-catalog__grid {
    display: grid;
    width: 1690px;
    max-width: 100%;
    /* колонки 550+20 как в Figma; карточка 513.48px в каждой колонке */
    grid-template-columns: repeat(3, 550px);
    gap: 20px;
    align-items: start;
    justify-content: start;
    justify-items: start;
}

body.home-page #motos {
    scroll-margin-top: 80px;
}

body.home-page .ap-catalog__motos {
    position: absolute;
    top: 1075px;
    left: 116px;
    width: 1690px;
    max-width: calc(100% - 116px);
    margin: 0;
    padding: 0;
}

/* Figma: сетка мото — top 1371 = 1075 + 55 + 241; на desktop карточки absolute (frame_layout) */
body.home-page .ap-catalog__grid--motos {
    margin: 296px 0 0;
}

@media (min-width: 1781px) {
    /* Карточки мото — координаты от #catalog, как у авто (не от .ap-catalog__motos) */
    body.home-page .ap-catalog__motos {
        position: static;
        width: auto;
        max-width: none;
    }

    body.home-page .ap-catalog__grid--motos {
        margin: 0;
    }

    /* frame_layout — карточка 513.48×545.1: фото + белый блок 513×186 (подписи на фото) */
    body.home-page .ap-catalog-card--car.ap-catalog-card--frame-layout,
    body.home-page .ap-catalog-card--moto.ap-catalog-card--frame-layout {
        width: 513.48px;
        height: 545.1px;
    }

    body.home-page .ap-catalog-card--frame-layout .ap-catalog-card__media-frame {
        flex: 0 0 calc(545.1px - 186px);
        height: calc(545.1px - 186px);
    }

    body.home-page .ap-catalog-card--frame-layout .ap-catalog-card__body {
        display: block;
        flex: 0 0 186px;
        width: 513px;
        max-width: 513px;
        height: 186px;
        margin: 0;
        padding: 0;
        background: #ffffff;
        overflow: hidden;
        border-radius: 0 0 5px 5px;
    }
}

}

/* Каталог — база секции и фильтры (все экраны) */
body.home-page .sections.section3.ap-catalog {
    background: #7e838f;
    font-family: 'Manrope', sans-serif;
}

/* Выравнивание блока мотоциклов с сеткой автомобилей */
body.home-page .ap-catalog__motos {
    width: 100%;
    max-width: calc(513.48px * 3 + 20px * 2);
    margin: 0 auto;
    padding: 0 10px;
    box-sizing: border-box;
}

body.home-page .ap-catalog__title--motos {
    margin-left: 0;
    padding-left: 0;
}

body.home-page .ap-catalog__title--motos {
    color: #ffffff;
    font-family: 'Manrope', 'Noto Sans Display', sans-serif;
    font-size: 36px;
    font-weight: 800;
    line-height: 36px;
    text-align: left !important;
    text-transform: none;
}

body.home-page .ap-catalog__filter {
    position: relative;
    z-index: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    height: 27px;
    margin: 0;
    padding: 0 8px;
    border: none;
    border-radius: 0;
    background: transparent;
    color: rgba(255, 255, 255, 0.55);
    font-family: 'Manrope', 'Noto Sans Display', sans-serif;
    font-size: 20px;
    font-weight: 500;
    line-height: 20px;
    letter-spacing: 0;
    text-transform: lowercase;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
    transition: color 0.2s ease;
}

/* Карточка каталога — база */
body.home-page .ap-catalog-card {
    display: flex;
    flex-direction: column;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
}

/* Авто и мото — карточка 513.48px; блок фото + белый текст 513×186 */
body.home-page .ap-catalog-card--car,
body.home-page .ap-catalog-card--moto {
    width: 513.48px;
    justify-self: start;
}

body.home-page .ap-catalog-card--car,
body.home-page .ap-catalog-card--moto,
body.inner-page .ap-catalog-card--car,
body.inner-car-page .ap-catalog-card--car {
    border-radius: 5px;
    box-shadow: 0px 4px 4px 0px #00000040;
    overflow: hidden;
    background: #ffffff;
}

body.home-page .ap-catalog-card--car .ap-catalog-card__media-frame,
body.home-page .ap-catalog-card--moto .ap-catalog-card__media-frame {
    position: relative;
    flex: 0 0 calc(545.1px - 186px);
    height: calc(545.1px - 186px);
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: 5px 5px 0 0;
    padding: 0;
    background: transparent;
    box-sizing: border-box;
}

body.home-page .ap-catalog-card--car .ap-catalog-card__media-frame::after,
body.home-page .ap-catalog-card--moto .ap-catalog-card__media-frame::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    box-shadow: inset 0 0 0 2px #ffffff;
    pointer-events: none;
    z-index: 2;
}

body.home-page .ap-catalog-card--car .ap-catalog-card__media,
body.home-page .ap-catalog-card--moto .ap-catalog-card__media,
body.inner-car-page .ap-catalog-card--car .ap-catalog-card__media {
    flex: 1 1 0;
    width: 100%;
    min-height: 0;
    height: 100%;
    overflow: hidden;
    border-radius: 0;
    background: #ffffff;
    isolation: isolate;
}

body.home-page .ap-catalog-card--car .ap-catalog-card__media img,
body.home-page .ap-catalog-card--moto .ap-catalog-card__media img,
body.inner-car-page .ap-catalog-card--car .ap-catalog-card__media img {
    display: block;
    width: 100%;
    height: 100%;
    margin: 0;
    border-radius: 0;
    object-fit: cover;
    object-position: center center;
}

body.home-page .ap-catalog-card--car .ap-catalog-card__body,
body.home-page .ap-catalog-card--moto .ap-catalog-card__body {
    flex: 0 0 186px;
    width: 513px;
    max-width: 100%;
    height: 186px;
    box-sizing: border-box;
    margin: 0;
    padding: 25px;
    background: #ffffff;
    overflow: hidden;
}

/* Авто с frame_layout — обёртка: карточка, название и кнопка от края #catalog */
body.home-page .ap-catalog-card-slot--frame-layout {
    position: static;
    width: 0;
    height: 0;
    margin: 0;
    padding: 0;
    overflow: visible;
    align-self: start;
    justify-self: start;
}

body.home-page .ap-catalog-card-slot--frame-layout.is-filter-hidden,
body.home-page .ap-catalog-card-slot--frame-layout[hidden] {
    display: none !important;
}

body.home-page .ap-catalog-card--frame-layout {
    overflow: visible;
}

/* Карточки по координатам Figma от края #catalog (left или right + top) */
body.home-page .ap-catalog-card--figma-pos {
    position: absolute;
    top: var(--ap-card-top);
    left: var(--ap-card-left, auto);
    right: var(--ap-card-right, auto);
    margin: 0;
    overflow: visible;
    z-index: 2;
}

/* Цена — 26.45 / 368.51 от рамки карточки (эталон Cruze 2017) */
body.home-page .ap-catalog-card--frame-layout > .ap-catalog-card__price--catalog-pos {
    position: absolute;
    top: 368.51px;
    left: 26.45px;
    width: 272.55px;
    min-height: 70.23px;
    margin: 0 !important;
    padding: 0 !important;
    opacity: 1;
    z-index: 4;
    box-sizing: border-box;
    font-family: 'Manrope', sans-serif;
    font-weight: 500;
    font-size: 26.97px;
    line-height: 1;
    letter-spacing: 0;
    color: #333333;
    white-space: nowrap;
}

body.home-page .ap-catalog-card--frame-layout > .ap-catalog-card__price--catalog-pos .ap-catalog-card__price-ot,
body.home-page .ap-catalog-card--frame-layout > .ap-catalog-card__price--catalog-pos .ap-catalog-card__price-num,
body.home-page .ap-catalog-card--frame-layout > .ap-catalog-card__price--catalog-pos .ap-catalog-card__price-unit {
    display: inline;
    font-family: 'Manrope', sans-serif;
    line-height: 1;
    letter-spacing: 0;
    vertical-align: baseline;
}

body.home-page .ap-catalog-card--frame-layout > .ap-catalog-card__price--catalog-pos .ap-catalog-card__price-ot {
    font-weight: 500;
    font-size: 26.97px;
    color: #333333;
}

body.home-page .ap-catalog-card--frame-layout > .ap-catalog-card__price--catalog-pos .ap-catalog-card__price-num {
    margin-left: 0.2em;
    font-weight: 800;
    font-size: 48px;
    color: #219653;
}

body.home-page .ap-catalog-card--frame-layout > .ap-catalog-card__price--catalog-pos .ap-catalog-card__price-unit {
    margin-left: 0.15em;
    font-weight: 500;
    font-size: 32px;
    color: #333333;
}

body.home-page .ap-catalog-card--frame-layout .ap-catalog-card__price--in-card {
    display: none;
}

/* Meta — 31.45 / 506 от рамки, 197×23 */
body.home-page .ap-catalog-card--frame-layout > .ap-catalog-card__meta-line--frame-pos {
    position: absolute;
    top: 506px;
    left: 31.45px;
    width: 197px;
    height: 23px;
    margin: 0;
    padding: 0;
    z-index: 4;
    box-sizing: border-box;
    overflow: hidden;
    color: #000000;
    font-family: 'Manrope', sans-serif;
    font-size: 16px;
    font-weight: 400;
    font-style: normal;
    line-height: 100%;
    letter-spacing: 0;
    text-transform: capitalize;
    white-space: nowrap;
}

body.home-page .ap-catalog-card--frame-layout .ap-catalog-card__meta-p--in-card {
    display: none;
}

/* Мото — длинная meta («2 цилиндра»); у авто в Figma остаётся 197px */
body.home-page .ap-catalog-card--moto.ap-catalog-card--frame-layout > .ap-catalog-card__meta-line--frame-pos {
    width: auto;
    max-width: calc(513.48px - 31.45px - 26.45px);
    min-width: 197px;
    overflow: visible;
    white-space: nowrap;
}

/* Класс — 374 / 507 от рамки, 113×22 */
body.home-page .ap-catalog-card--frame-layout > .ap-catalog-card__class--frame-pos {
    position: absolute;
    top: 507px;
    left: 374px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    width: 113px;
    height: 22px;
    margin: 0;
    padding: 0;
    z-index: 4;
    box-sizing: border-box;
    overflow: hidden;
    color: #219653;
    font-family: 'Manrope', sans-serif;
    font-size: 16px;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0;
    white-space: nowrap;
}

body.home-page .ap-catalog-card--frame-layout > .ap-catalog-card__class--frame-pos > span {
    color: #000000;
    font-weight: 400;
}

body.home-page .ap-catalog-card--frame-layout .ap-catalog-card__class--in-card {
    display: none;
    color: #219653;
    font-weight: 600;
}

body.home-page .ap-catalog-card--frame-layout .ap-catalog-card__class--in-card > span {
    color: #000000;
    font-weight: 400;
}

/* Название — от #catalog (свои координаты на каждой карточке, авто и мото) */
body.home-page .sections.section3.ap-catalog > .ap-catalog__canvas > .ap-catalog__grid--cars > .ap-catalog-card-slot--frame-layout > .ap-catalog-card__name--catalog-pos,
body.home-page .sections.section3.ap-catalog > .ap-catalog__canvas > .ap-catalog__motos > .ap-catalog__grid--motos > .ap-catalog-card-slot--frame-layout > .ap-catalog-card__name--catalog-pos {
    position: absolute;
    top: var(--name-catalog-top);
    left: var(--name-catalog-left);
    width: auto;
    max-width: calc(513.48px - 26.45px);
    min-width: 223.28px;
    height: auto;
    min-height: 38.79px;
    margin: 0 !important;
    padding: 0 !important;
    opacity: 1;
    z-index: 4;
    box-sizing: border-box;
    overflow: visible;
    font-family: 'Manrope', sans-serif;
    font-weight: 700;
    font-style: normal;
    font-size: 26px;
    line-height: 1.1;
    letter-spacing: 0;
    color: #1a1a1a;
    text-align: left !important;
    text-transform: none;
    white-space: nowrap;
}

/* Мото — длинные названия (Harley, Honda) в одну строку */
body.home-page .sections.section3.ap-catalog > .ap-catalog__canvas > .ap-catalog__motos > .ap-catalog__grid--motos > .ap-catalog-card-slot--frame-layout > .ap-catalog-card__name--catalog-pos {
    width: auto;
    max-width: calc(513.48px - 26.45px);
    min-width: 223.28px;
    height: auto;
    min-height: 38.79px;
    overflow: visible;
    white-space: nowrap;
}

body.home-page .ap-catalog-card--frame-layout .ap-catalog-card__name--in-card {
    display: none;
}

/* Иконки комплектации — главная, frame-layout (над строкой meta/класс) */
body.home-page .ap-catalog-card__equip {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 0;
}

body.home-page .ap-catalog-card__equip-item {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 6px;
    background-color: rgba(255, 255, 255, 0.92);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12);
    font-size: 18px;
    line-height: 1;
    flex-shrink: 0;
}

body.home-page .ap-catalog-card--moto .ap-catalog-card__equip {
    display: none !important;
}

/* legacy duplicate — только in-card */
body.home-page .ap-catalog-card__equip--frame-pos {
    display: none !important;
}

body.home-page .ap-catalog-card--car .ap-catalog-card__equip--in-card {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 8px;
    clear: both;
    position: relative;
    z-index: 2;
}

/* Figma desktop ≥1781: иконки в белой полосе, над строкой характеристик */
@media (min-width: 1781px) {
    body.home-page .ap-catalog-card--car.ap-catalog-card--figma-pos .ap-catalog-card__equip--in-card {
        display: flex !important;
        position: absolute;
        top: 472px;
        left: 31.45px;
        margin: 0;
        z-index: 5;
        max-width: calc(513.48px - 62px);
    }
}

/* Кнопка — от #catalog (свои координаты на каждой карточке, авто и мото) */
body.home-page .sections.section3.ap-catalog > .ap-catalog__canvas > .ap-catalog__grid--cars > .ap-catalog-card-slot--frame-layout > .ap-catalog-card__actions.button,
body.home-page .sections.section3.ap-catalog > .ap-catalog__canvas > .ap-catalog__motos > .ap-catalog__grid--motos > .ap-catalog-card-slot--frame-layout > .ap-catalog-card__actions.button {
    position: absolute;
    top: var(--catalog-btn-top);
    left: var(--catalog-btn-left);
    margin: 0;
    flex: none;
    z-index: 5;
}

body.home-page .ap-catalog-card__media-frame {
    flex-shrink: 0;
    padding: 0;
    border: none;
    border-radius: 0;
    background: transparent;
}

body.home-page .ap-catalog-card--car .ap-catalog-card__media-frame,
body.home-page .ap-catalog-card--moto .ap-catalog-card__media-frame {
    padding: 0;
    background: transparent;
    box-sizing: border-box;
}

body.home-page .ap-catalog-card__media {
    width: 100%;
    height: 367px;
    overflow: hidden;
    border-radius: 5px 5px 0 0;
    background: #2d3139;
}

body.home-page .ap-catalog-card--car .ap-catalog-card__media,
body.home-page .ap-catalog-card--moto .ap-catalog-card__media {
    height: 100%;
    border-radius: 0;
    background: #ffffff;
}

body.home-page .ap-catalog-card__media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

body.home-page .ap-catalog-card__body {
    margin: 0;
    padding: 25px;
    background: #ffffff;
    border-radius: 0;
}

body.home-page .ap-catalog-card__price {
    margin: 0 0 8px;
    color: #333333;
    font-size: 14px;
    font-weight: 400;
    line-height: 100%;
}

body.home-page .ap-catalog-card__price span {
    color: #219653;
    font-size: 24px;
    font-weight: 800;
}

body.home-page .ap-catalog-card__name {
    margin: 0 0 12px !important;
    padding: 0 !important;
    color: #1a1a1a;
    font-size: 20px;
    font-weight: 700;
    line-height: 120%;
    text-align: left !important;
    text-transform: none;
}

body.home-page .ap-catalog-card__meta {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    margin: 0;
    color: #666666;
    font-size: 13px;
    font-weight: 400;
    line-height: 140%;
}

body.home-page .ap-catalog-card__meta p {
    margin: 0;
}

body.home-page .ap-catalog-card__class span {
    color: #219653;
    font-weight: 600;
}

/* «Подробнее» — общая кнопка каталога */
body.home-page .ap-catalog-card__actions.button {
    width: 292.47px;
    max-width: 100%;
    height: 78.62px;
    margin: 12px auto 0;
    padding: 0.75px;
    border: none;
    border-radius: 11.25px;
    background: linear-gradient(97.62deg, #76f8cc 16.37%, #11322b 76.29%);
    overflow: visible;
    box-shadow: 0px 4px 4px 0px #00000040;
    box-sizing: border-box;
}

/* Figma Group 1 — кнопка авто и мото (кроме абсолютной у Cruze 2017) */
body.home-page .ap-catalog-card--car .ap-catalog-card__actions.button,
body.home-page .ap-catalog-card--moto .ap-catalog-card__actions.button {
    position: static;
    flex: 0 0 78.62px;
    min-width: 292.47px;
    max-width: 292.47px;
    min-height: 78.62px;
    margin: 12px auto 0;
}

body.home-page .ap-catalog-card__actions:hover:not(:active) {
    background: linear-gradient(97.62deg, #ffffff 16.37%, #75819b 76.29%);
}

body.home-page .ap-catalog-card__actions a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    min-height: 0;
    padding: 0 16px;
    border: none;
    border-radius: 10.5px;
    background-color: #017344;
    background-image: linear-gradient(358.41deg, #12332d 0.9%, #017344 98.2%);
    box-shadow:
        0 3px 3px 0 #000000cc,
        inset -4px 2px 1px 2px #a9f89d42,
        inset -2px -2px 1px 0 #00000040;
    color: #ffffff;
    font-size: 26px;
    font-weight: 500;
    line-height: 100%;
    letter-spacing: 0;
    text-decoration: none;
    text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
    box-sizing: border-box;
}

body.home-page .ap-catalog-card__actions:hover:not(:active) a,
body.home-page .ap-catalog-card__actions a:hover:not(:active) {
    background-image: linear-gradient(358.41deg, #282c35 0.9%, #596476 98.2%);
    box-shadow:
        0 3px 3px 0 #000000cc,
        inset -4px 2px 1px 2px #848899,
        inset -2px -2px 1px 0 #282c35;
}

body.home-page .ap-catalog-card__actions a:active {
    background-image: linear-gradient(358.41deg, #017344 0.9%, #309b4d 98.2%);
}

body.home-page .ap-catalog__view-all {
    display: flex;
    justify-content: flex-end;
    width: 1690px;
    max-width: 100%;
    margin-top: 32px;
}

/* Figma Group 18 (node 1-52): 559×36, left 1255, top 889 — текст 379×36 + Line 1 141×19, gap 39 */
body.home-page .sections.section3.ap-catalog > .ap-catalog__canvas > .ap-catalog__view-all--cars.ap-catalog__group-18 {
    position: absolute;
    top: 889px;
    left: 1255px;
    width: 559px;
    height: 36px;
    margin: 0;
    padding: 0;
    z-index: 5;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-start;
    gap: 39px;
    overflow: visible;
    box-sizing: border-box;
    pointer-events: none;
}

body.home-page .ap-catalog__view-all--cars .ap-catalog__view-all-link {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
    width: 379px;
    max-width: 379px;
    height: 36px;
    margin: 0;
    padding: 0;
    color: #ffffff;
    font-family: 'Manrope', sans-serif;
    font-size: 26px;
    font-weight: 500;
    line-height: 100%;
    letter-spacing: 0;
    text-decoration: none;
    white-space: nowrap;
    box-sizing: border-box;
    pointer-events: auto;
}

body.home-page .ap-catalog__view-all--cars .ap-catalog__view-all-link:hover,
body.home-page .ap-catalog__view-all--cars .ap-catalog__view-all-link:focus,
body.home-page .ap-catalog__view-all--cars .ap-catalog__view-all-link:focus-visible {
    text-decoration: none;
    outline: none;
    box-shadow: none;
}

body.home-page .ap-catalog__view-all--cars .ap-catalog__view-all-icon {
    flex: 0 0 141px;
    width: 141px;
    height: 19px;
    margin: 0;
    padding: 0;
    pointer-events: none;
}

body.home-page .ap-catalog__view-all--cars .ap-catalog__view-all-icon img {
    display: block;
    width: 141px;
    height: 19px;
}

/* Figma Group 18 мото (node 1-178): 641×36, left 1175, top 1929 — как у авто + line1 */
body.home-page .sections.section3.ap-catalog > .ap-catalog__canvas > .ap-catalog__view-all--motos.ap-catalog__group-18 {
    position: absolute;
    top: 1929px;
    left: 1175px;
    width: 641px;
    height: 36px;
    margin: 0;
    padding: 0;
    z-index: 5;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-start;
    gap: 39px;
    overflow: visible;
    box-sizing: border-box;
    pointer-events: none;
}

body.home-page .ap-catalog__view-all--motos .ap-catalog__view-all-link {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
    width: auto;
    max-width: calc(641px - 39px - 141px);
    height: 36px;
    margin: 0;
    padding: 0;
    color: #ffffff;
    font-family: 'Manrope', sans-serif;
    font-size: 26px;
    font-weight: 500;
    line-height: 100%;
    letter-spacing: 0;
    text-decoration: none;
    white-space: nowrap;
    box-sizing: border-box;
    pointer-events: auto;
}

body.home-page .ap-catalog__view-all--motos .ap-catalog__view-all-link:hover,
body.home-page .ap-catalog__view-all--motos .ap-catalog__view-all-link:focus,
body.home-page .ap-catalog__view-all--motos .ap-catalog__view-all-link:focus-visible {
    text-decoration: none;
    outline: none;
    box-shadow: none;
}

body.home-page .ap-catalog__view-all--motos .ap-catalog__view-all-icon {
    flex: 0 0 141px;
    width: 141px;
    height: 19px;
    margin: 0;
    padding: 0;
    pointer-events: none;
}

body.home-page .ap-catalog__view-all--motos .ap-catalog__view-all-icon img {
    display: block;
    width: 141px;
    height: 19px;
}

body.home-page .ap-catalog__view-all a {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: #ffffff;
    font-size: 18px;
    font-weight: 500;
    line-height: 100%;
    text-decoration: none;
}

body.home-page .ap-catalog__view-all-icon img {
    display: block;
    width: 150px;
    height: 19px;
}

/* Figma — разделитель авто / мото, desktop ≥1025px */
@media (min-width: 1025px) {
    body.home-page .sections.section3.ap-catalog > .ap-catalog__canvas > .ap-catalog__divider {
        position: absolute;
        top: 988px;
        left: 134px;
        width: 1640px;
        max-width: calc(100% - 134px);
        height: 0;
        margin: 0;
        padding: 0;
        border: none;
        border-top: 1px solid rgba(255, 255, 255, 0.2);
        opacity: 1;
        box-sizing: border-box;
        z-index: 3;
        pointer-events: none;
    }
}

@media (min-width: 1025px) {
    body.home-page .ap-catalog__title--motos {
        position: absolute;
        top: 0;
        left: -17px;
        box-sizing: border-box;
        width: 650px;
        height: 55px;
        margin: 0 !important;
        padding: 0 !important;
        opacity: 1;
        color: #ffffff;
        font-family: 'Manrope', 'Noto Sans Display', sans-serif;
        font-size: 36px;
        font-weight: 800;
        font-style: normal;
        line-height: 36px;
        letter-spacing: 0;
        text-align: left !important;
        text-transform: none;
    }
}

/* До Figma-desktop (<1781): карточки в потоке, без absolute-наложений */
@media (max-width: 1780px) {
    body.home-page .sections.section3.ap-catalog,
    body.home-page .ap-catalog__canvas {
        min-height: 0;
    }

    body.home-page .ap-catalog__grid {
        width: 100%;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        justify-items: start;
    }

    body.home-page .ap-catalog-card--car,
    body.home-page .ap-catalog-card--moto,
    body.home-page .ap-catalog-card--frame-layout {
        width: 513.48px;
        max-width: 100%;
    }

    body.home-page .ap-catalog-card-slot--frame-layout {
        width: auto;
        height: auto;
    }

    body.home-page .ap-catalog-card--figma-pos,
    body.home-page .ap-catalog-card--frame-layout {
        position: static;
        top: auto;
        left: auto;
    }

    body.home-page .ap-catalog-card--frame-layout > .ap-catalog-card__price--catalog-pos,
    body.home-page .ap-catalog-card--frame-layout > .ap-catalog-card__meta-line--frame-pos,
    body.home-page .ap-catalog-card--frame-layout > .ap-catalog-card__class--frame-pos,
    body.home-page .ap-catalog-card-slot--frame-layout > .ap-catalog-card__name--catalog-pos {
        display: none;
    }

    body.home-page .ap-catalog-card--frame-layout .ap-catalog-card__price--in-card,
    body.home-page .ap-catalog-card--frame-layout .ap-catalog-card__name--in-card {
        display: block;
        width: auto;
        height: auto;
    }

    body.home-page .ap-catalog-card--frame-layout .ap-catalog-card__meta-p--in-card,
    body.home-page .ap-catalog-card--frame-layout .ap-catalog-card__class--in-card {
        display: inline;
    }

    body.home-page .ap-catalog-card--frame-layout .ap-catalog-card__name--in-card {
        font-size: 26px;
        font-weight: 700;
        line-height: 1.15;
        letter-spacing: 0;
        margin: 0;
    }

    body.home-page .ap-catalog-card--frame-layout .ap-catalog-card__body {
        display: flex;
        flex-direction: column;
        gap: 6px;
        padding: 12px 16px;
        box-sizing: border-box;
        height: auto;
        overflow: visible;
    }

    body.home-page .ap-catalog-card--frame-layout .ap-catalog-card__price--in-card {
        order: 1;
        margin: 0;
    }

    body.home-page .ap-catalog-card--frame-layout .ap-catalog-card__name--in-card {
        order: 2;
    }

    body.home-page .ap-catalog-card--frame-layout .ap-catalog-card__meta {
        order: 3;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        align-items: center;
        gap: 4px 8px;
        margin: 0;
    }

    body.home-page .ap-catalog-card--frame-layout .ap-catalog-card__equip--in-card {
        display: flex !important;
        position: relative;
        top: auto;
        left: auto;
        order: 4;
        margin-top: 6px;
        width: 100%;
    }

    body.home-page .ap-catalog-card-slot--frame-layout > .ap-catalog-card__actions.button,
    body.home-page .sections.section3.ap-catalog > .ap-catalog__canvas > .ap-catalog__grid--cars > .ap-catalog-card-slot--frame-layout > .ap-catalog-card__actions.button,
    body.home-page .sections.section3.ap-catalog > .ap-catalog__canvas > .ap-catalog__motos > .ap-catalog__grid--motos > .ap-catalog-card-slot--frame-layout > .ap-catalog-card__actions.button {
        position: static !important;
        top: auto !important;
        left: auto !important;
        margin: 12px auto 0;
    }

    body.home-page .ap-catalog__grid--motos {
        margin-top: 32px;
    }

    body.home-page .ap-catalog__canvas {
        overflow-x: clip;
    }

    body.home-page .ap-catalog-card--car .ap-catalog-card__media-frame,
    body.home-page .ap-catalog-card--moto .ap-catalog-card__media-frame,
    body.home-page .ap-catalog-card--frame-layout .ap-catalog-card__media-frame {
        flex: none;
        height: auto;
        display: block;
    }

    body.home-page .ap-catalog-card--car .ap-catalog-card__media,
    body.home-page .ap-catalog-card--moto .ap-catalog-card__media,
    body.home-page .ap-catalog-card--frame-layout .ap-catalog-card__media {
        flex: none;
        height: auto;
        aspect-ratio: 3 / 2;
    }

    body.home-page .ap-catalog-card--car .ap-catalog-card__body,
    body.home-page .ap-catalog-card--moto .ap-catalog-card__body,
    body.home-page .ap-catalog-card--frame-layout .ap-catalog-card__body {
        flex: none;
        width: auto;
        height: auto;
    }
}

@media (max-width: 1440px) {
    body.home-page .ap-catalog__canvas {
        min-height: 0;
        padding: 60px 40px 80px;
    }

    body.home-page .ap-catalog__head {
        min-height: 200px;
    }

    body.home-page .sections.section3.ap-catalog {
        min-height: 0;
    }
}

@media (max-width: 1024px) {
    body.home-page .ap-catalog__canvas {
        padding: 40px 20px 60px;
    }

    body.home-page .ap-catalog__head {
        min-height: 0;
        margin-bottom: 32px;
    }

    body.home-page .ap-catalog__head-group {
        position: static;
        width: 100%;
        height: auto;
    }

    body.home-page .ap-catalog__title {
        position: static;
        width: auto;
        height: auto;
        margin: 0 0 12px !important;
    }

    body.home-page .ap-catalog__filters {
        position: static;
        width: 100%;
        height: auto;
        min-height: 27px;
        margin: 0;
        flex-wrap: wrap;
        justify-content: flex-start;
        gap: 8px 20px;
    }


    body.home-page .ap-catalog__grid,
    body.home-page .ap-catalog__grid--motos {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    body.home-page .ap-catalog-card--car,
    body.home-page .ap-catalog-card--moto {
        width: 100%;
        max-width: none;
    }

    body.home-page .ap-catalog-card--car .ap-catalog-card__actions.button {
        min-width: 0;
        max-width: 100%;
    }

    body.home-page .ap-catalog-card--figma-pos,
    body.home-page .ap-catalog-card--frame-layout {
        position: static;
        top: auto;
        left: auto;
    }

    body.home-page .ap-catalog-card-slot--frame-layout > .ap-catalog-card__actions.button,
    body.home-page .sections.section3.ap-catalog > .ap-catalog__canvas > .ap-catalog__grid--cars > .ap-catalog-card-slot--frame-layout > .ap-catalog-card__actions.button,
    body.home-page .sections.section3.ap-catalog > .ap-catalog__canvas > .ap-catalog__motos > .ap-catalog__grid--motos > .ap-catalog-card-slot--frame-layout > .ap-catalog-card__actions.button {
        position: static !important;
        top: auto !important;
        left: auto !important;
        margin: 12px auto 0;
    }

    body.home-page .ap-catalog__motos {
        position: static;
        width: 100%;
        max-width: none;
    }

    body.home-page .ap-catalog__title--motos {
        position: static;
        left: auto;
        width: auto;
        height: auto;
        margin: 0 0 24px !important;
    }

    body.home-page .ap-catalog__grid--motos {
        margin-top: 0;
    }

    body.home-page .ap-catalog__view-all {
        width: 100%;
    }

    body.home-page .sections.section3.ap-catalog > .ap-catalog__canvas > .ap-catalog__divider {
        position: static;
        left: auto;
        top: auto;
        width: 100%;
        max-width: 100%;
        margin: 56px 0 40px;
    }

    body.home-page .ap-catalog__view-all {
        justify-content: center;
    }

    body.home-page .sections.section3.ap-catalog > .ap-catalog__canvas > .ap-catalog__view-all--cars.ap-catalog__group-18,
    body.home-page .sections.section3.ap-catalog > .ap-catalog__canvas > .ap-catalog__view-all--motos.ap-catalog__group-18 {
        position: static;
        left: auto;
        top: auto;
        width: 100%;
        max-width: 100%;
        height: auto;
        margin-top: 32px;
        justify-content: center;
        flex-wrap: wrap;
        gap: 12px 39px;
    }

    body.home-page .ap-catalog__view-all--cars .ap-catalog__view-all-link,
    body.home-page .ap-catalog__view-all--motos .ap-catalog__view-all-link {
        width: auto;
        max-width: 100%;
        height: auto;
    }

    body.home-page .ap-catalog__view-all--cars .ap-catalog__view-all-icon,
    body.home-page .ap-catalog__view-all--motos .ap-catalog__view-all-icon {
        flex: 0 0 auto;
        width: 150px;
    }

    body.home-page .ap-catalog__view-all--cars .ap-catalog__view-all-icon img,
    body.home-page .ap-catalog__view-all--motos .ap-catalog__view-all-icon img {
        width: 150px;
    }
}

/* Планшеты: 481px–768px */
@media (max-width: 768px) and (min-width: 481px) {
    body.home-page .ap-catalog__title {
        font-size: 28px;
    }

    body.home-page .ap-catalog__grid,
    body.home-page .ap-catalog__grid--motos {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.home-page .ap-catalog-card__body {
        padding: 15px;
    }

    body.home-page .ap-catalog__divider {
        margin: 40px 0 28px;
    }

    body.home-page .ap-catalog__view-all-icon img {
        width: 120px;
        height: auto;
    }
}

/* Desktop: заголовок мото и карточки — координаты от #catalog (после базового top: 0) */
@media (min-width: 1781px) {
    body.home-page .ap-catalog__title--motos {
        top: 1075px;
        left: 99px;
    }
}

/* Тень на всех CTA-кнопках — как «Подробнее» */
body.home-page .ap-how-to-order__cta.button,
body.inner-page .ap-catalog--inner .ap-catalog-card-slot--inner-grid > .ap-catalog-card__actions.button,
body.inner-car-page.page-car-detail .ap-car-detail__rent-btn-wrap,
body.inner-car-page.page-car-detail .ap-car-detail__terms-cta-btn-wrap,
body.inner-car-page.page-car-detail .ap-car-detail__recommend .ap-catalog-card-slot--frame-layout > .ap-catalog-card__actions.button,
.ap-contacts__submit-wrap,
body.inner-page.page-rules .rules-container-flex .rules-footer-actions .rules-catalog-btn-wrap,
body.inner-page.page-rules .rules-container-flex .rules-footer-actions .rules-catalog-btn-wrap--select {
    box-shadow: 0px 4px 4px 0px #00000040;
    overflow: visible;
}
