/*
 * EUROSPACE hero render compact v3.1
 * Только геометрия/компоновка поверх hero-render-site-v3.css.
 * Фон и HTML не меняются.
 */

@media (min-width: 769px) {
    .es-render-hero {
        min-height: 0 !important;
        padding: 24px 0 28px !important;
    }

    /* Центральную композицию немного сужаем. */
    .es-render-hero .es-demo-hero__content {
        max-width: 1080px !important;
    }

    /* H1 чуть меньше и заметно ближе к остальному контенту. */
    .es-render-hero h1 {
        max-width: 1040px !important;
        margin: 0 auto 18px !important;
        font-size: clamp(48px, 3.8vw, 66px) !important;
        line-height: 1.00 !important;
    }

    .es-render-hero h1::after {
        margin-top: 15px !important;
        font-size: 10px !important;
        letter-spacing: 4px !important;
    }

    /* Текст — уже и компактнее по вертикали. */
    .es-render-hero .es-demo-lead {
        max-width: 980px !important;
        margin: 0 auto 18px !important;
        font-size: clamp(16px, 1.05vw, 19px) !important;
        line-height: 1.48 !important;
    }

    /* Кнопки ближе к тексту и карточкам. */
    .es-render-hero .es-demo-actions {
        gap: 18px !important;
        margin: 0 auto 20px !important;
    }

    .es-render-hero .es-demo-actions .main-btn,
    .es-render-hero .es-demo-secondary-btn {
        min-width: 245px !important;
        min-height: 52px !important;
        padding: 0 26px !important;
        font-size: 16px !important;
    }

    /* Инфо-карточки. */
    .es-render-hero .es-demo-facts.es-demo-facts--two {
        width: min(100%, 920px) !important;
        gap: 14px !important;
        margin: 0 auto 12px !important;
    }

    .es-render-hero .es-demo-facts > div {
        min-height: 68px !important;
        padding: 11px 18px !important;
        border-radius: 9px !important;
    }

    .es-render-hero .es-demo-facts strong {
        font-size: 17px !important;
    }

    .es-render-hero .es-demo-facts span {
        margin-top: 2px !important;
        font-size: 13px !important;
    }

    /* Список офисов такой же ширины, но строки ниже. */
    .es-render-hero .es-demo-offices {
        width: min(100%, 920px) !important;
    }

    .es-render-hero .es-demo-offices__group {
        margin: 0 0 8px !important;
    }

    .es-render-hero .es-demo-offices__summary {
        min-height: 54px !important;
        padding: 0 18px !important;
        border-radius: 8px !important;
        font-size: 17px !important;
    }

    .es-render-hero .es-demo-offices__summary-icon {
        font-size: 24px !important;
    }

    .es-render-hero .es-demo-offices__content {
        margin-top: 6px !important;
        padding: 12px !important;
    }
}

/* Большой desktop: не даём старому media-query снова растянуть hero. */
@media (min-width: 1500px) {
    .es-render-hero {
        min-height: 0 !important;
        padding: 26px 0 30px !important;
    }

    .es-render-hero .es-demo-hero__content {
        max-width: 1120px !important;
    }

    .es-render-hero .es-demo-facts.es-demo-facts--two,
    .es-render-hero .es-demo-offices {
        width: 940px !important;
    }
}

/* Типичный desktop / ноутбук. */
@media (min-width: 769px) and (max-width: 1199px) {
    .es-render-hero {
        min-height: 0 !important;
        padding: 22px 0 26px !important;
    }

    .es-render-hero h1 {
        max-width: 860px !important;
        margin-bottom: 16px !important;
        font-size: clamp(44px, 5vw, 58px) !important;
    }

    .es-render-hero h1::after {
        margin-top: 13px !important;
    }

    .es-render-hero .es-demo-lead {
        max-width: 860px !important;
        margin-bottom: 16px !important;
    }

    .es-render-hero .es-demo-actions {
        margin-bottom: 18px !important;
    }

    .es-render-hero .es-demo-facts.es-demo-facts--two,
    .es-render-hero .es-demo-offices {
        width: min(100%, 860px) !important;
    }
}

/* Mobile слегка уплотняем, но сохраняем текущую адаптивную схему. */
@media (max-width: 768px) {
    .es-render-hero {
        padding: 22px 0 28px !important;
    }

    .es-render-hero h1 {
        margin-bottom: 18px !important;
    }

    .es-render-hero h1::after {
        margin-top: 13px !important;
    }

    .es-render-hero .es-demo-lead {
        margin-bottom: 18px !important;
    }

    .es-render-hero .es-demo-actions {
        margin-bottom: 18px !important;
    }

    .es-render-hero .es-demo-facts.es-demo-facts--two {
        gap: 8px !important;
        margin-bottom: 10px !important;
    }

    .es-render-hero .es-demo-offices__group {
        margin-bottom: 7px !important;
    }
}