/*
 * EUROSPACE mobile hero background v3.2
 * Только мобильная версия. Desktop не изменяется.
 */

@media (max-width: 768px) {
    .es-render-hero {
        position: relative !important;
        isolation: isolate !important;
        overflow: hidden !important;
        background: #f8f2ec !important;
    }

    .es-render-hero::before {
        content: "" !important;
        position: absolute !important;
        z-index: 0 !important;
        inset: 0 !important;
        pointer-events: none !important;

        background-image:
            var(--hero-bg),
            var(--hero-bg) !important;

        background-repeat:
            no-repeat,
            no-repeat !important;

        background-size:
            215% auto,
            215% auto !important;

        background-position:
            left bottom,
            right bottom !important;

        opacity: .76 !important;

        filter:
            saturate(.90)
            contrast(.95)
            brightness(1.04) !important;
    }

    .es-render-hero::after {
        content: "" !important;
        position: absolute !important;
        z-index: 1 !important;
        inset: 0 !important;
        pointer-events: none !important;

        background:
            radial-gradient(
                ellipse 78% 46% at 50% 18%,
                rgba(255, 253, 250, .98) 0%,
                rgba(255, 253, 250, .94) 38%,
                rgba(255, 253, 250, .72) 68%,
                rgba(255, 253, 250, .22) 100%
            ),
            linear-gradient(
                180deg,
                rgba(255, 253, 250, .20) 0%,
                rgba(255, 253, 250, .04) 48%,
                rgba(255, 253, 250, .20) 100%
            ) !important;
    }

    .es-render-hero > .container {
        position: relative !important;
        z-index: 2 !important;
    }

    .es-render-hero--ekb::before {
        background-size:
            220% auto,
            220% auto !important;

        background-position:
            -4% bottom,
            104% bottom !important;
    }

    .es-render-hero--msk::before {
        background-size:
            235% auto,
            235% auto !important;

        background-position:
            -7% bottom,
            107% bottom !important;
    }

    .es-render-hero .es-demo-facts > div,
    .es-render-hero .es-demo-offices__summary,
    .es-render-hero .es-demo-offices__content {
        background: rgba(255, 255, 255, .91) !important;
        backdrop-filter: blur(3px) !important;
        -webkit-backdrop-filter: blur(3px) !important;
    }
}

@media (max-width: 430px) {
    .es-render-hero--ekb::before {
        background-size:
            205% auto,
            205% auto !important;

        background-position:
            -2% bottom,
            102% bottom !important;
    }

    .es-render-hero--msk::before {
        background-size:
            220% auto,
            220% auto !important;

        background-position:
            -5% bottom,
            105% bottom !important;
    }

    .es-render-hero::before {
        opacity: .72 !important;
    }
}
