/* ===== CTA Map Block (баннер с картой зоны выезда и кнопкой заявки) ===== */

.cta-map{
    padding: var(--spacing-20);
    background: var(--color-neutral-0)
}
@media (min-width: 768px) and (max-width: 1023px){.cta-map{
        padding: var(--spacing-10)
    }}
@media (max-width: 767px){.cta-map{
        padding: var(--spacing-10) var(--spacing-4)
    }}
.cta-map__inner{
    max-width: var(--container-large);
    margin-inline: auto
}
.cta-map__banner{
    position: relative;
    display: flex;
    align-items: center;
    min-height: 420px;
    border-radius: var(--radius-xl);
    background: var(--color-brand-800);
    box-shadow: var(--shadow-light);
    overflow: hidden;
    isolation: isolate
}
/* Мягкое бирюзовое свечение за текстом */
.cta-map__banner::before{
    content: "";
    position: absolute;
    top: -30%;
    left: -10%;
    width: 60%;
    height: 120%;
    background: radial-gradient(closest-side, var(--color-transparent-brand-30), transparent);
    z-index: -1;
    pointer-events: none
}
@media (max-width: 767px){.cta-map__banner{
        flex-direction: column;
        align-items: stretch;
        min-height: 0
    }}
/* Карта справа, левый край растворяется в фоне баннера */
.cta-map__map{
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 68%;
    z-index: -1;
    -webkit-mask-image: linear-gradient(to right, transparent 0, #000 35%);
    mask-image: linear-gradient(to right, transparent 0, #000 35%)
}
@media (max-width: 767px){.cta-map__map{
        position: relative;
        order: 2;
        width: 100%;
        height: 260px;
        -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 30%);
        mask-image: linear-gradient(to bottom, transparent 0, #000 30%)
    }}
.cta-map__map img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    /* Подписи городов справа: при обрезке по ширине сохраняем правый край */
    object-position: right center;
    display: block
}
.cta-map__content{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--spacing-6);
    max-width: 640px;
    padding: var(--spacing-20)
}
@media (min-width: 768px) and (max-width: 1023px){.cta-map__content{
        max-width: 440px;
        padding: var(--spacing-10)
    }}
@media (max-width: 767px){.cta-map__content{
        max-width: none;
        padding: var(--spacing-8) var(--spacing-6) 0
    }}
.cta-map__title{
    font-family: var(--font-heading);
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    line-height: var(--line-height-xl);
    color: var(--color-neutral-0);
    margin: 0
}
@media (min-width: 768px) and (max-width: 1023px){.cta-map__title{
        font-size: var(--font-size-h2);
        line-height: 40px
    }}
@media (max-width: 767px){.cta-map__title{
        font-size: 28px;
        line-height: 36px
    }}
.cta-map__desc{
    font-family: var(--font-base);
    font-size: var(--font-size-m);
    font-weight: var(--font-weight-regular);
    line-height: 28px;
    color: rgba(255, 255, 255, .8);
    margin: 0
}
@media (max-width: 767px){.cta-map__desc{
        font-size: var(--font-size-s);
        line-height: var(--line-height-s)
    }}
.cta-map__btn.aq-btn{
    display: inline-flex;
    align-items: center;
    gap: var(--spacing-3);
    margin-top: var(--spacing-2);
    padding: 1rem 2rem;
    background: var(--color-neutral-0);
    color: var(--color-brand-800);
    text-transform: none;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .18)
}
.cta-map__btn.aq-btn:hover{
    background: var(--color-brand-50);
    color: var(--color-brand-800)
}
.cta-map__btn svg{
    color: var(--color-brand-500);
    transition: transform var(--transition-fast)
}
.cta-map__btn:hover svg{
    transform: translateX(3px)
}
@media (max-width: 767px){.cta-map__btn.aq-btn{
        width: 100%;
        justify-content: center
    }}

/* Перебиваем глобальные стили h1/h2 сайта */
.cta-map__title{
    text-align: left;
    padding: 0
}