.hero-style7.sab-feature-hero-theme-enabled,
.hero-style7.sab-feature-hero-decor-enabled {
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

.hero-style7.sab-feature-hero-theme-enabled::before {
    content: "";
    position: absolute;
    z-index: 1;
    top: -10%;
    right: 0;
    left: 0;
    width: 100%;
    height: 920px;
    pointer-events: none;
}

.hero-style7.sab-feature-hero-theme-enabled[data-theme="brand"]::before {
    background-image:
        linear-gradient(180deg, #fff 0%, rgba(255, 255, 255, 0.92) 24%, rgba(255, 255, 255, 0.48) 58%, rgba(255, 255, 255, 0) 100%),
        url("/assets/images/layers/hero-layer7.png");
    background-repeat: no-repeat, no-repeat;
    background-position: center top, center top;
    background-size: 100% 240px, cover;
}

.hero-style7.sab-feature-hero-theme-enabled[data-theme="lavender"]::before {
    background: radial-gradient(ellipse at 65% 36%, rgba(218, 205, 255, 0.92) 0%, rgba(234, 227, 255, 0.62) 38%, rgba(255, 255, 255, 0) 74%);
}

.hero-style7.sab-feature-hero-theme-enabled[data-theme="mint"]::before {
    background: radial-gradient(ellipse at 65% 36%, rgba(190, 244, 229, 0.92) 0%, rgba(220, 248, 240, 0.62) 38%, rgba(255, 255, 255, 0) 74%);
}

.hero-style7.sab-feature-hero-theme-enabled[data-theme="peach"]::before {
    background: radial-gradient(ellipse at 65% 36%, rgba(255, 218, 193, 0.92) 0%, rgba(255, 236, 221, 0.64) 38%, rgba(255, 255, 255, 0) 74%);
}

.hero-style7.sab-feature-hero-theme-enabled[data-theme="none"]::before {
    background: none;
}

.hero-style7.sab-feature-hero-decor-enabled::before {
    content: "";
    position: absolute;
    z-index: 1;
    top: -10%;
    right: 0;
    left: 0;
    width: 100%;
    height: 920px;
    background-image:
        linear-gradient(
            180deg,
            #fff 0%,
            rgba(255, 255, 255, 0.92) 24%,
            rgba(255, 255, 255, 0.48) 58%,
            rgba(255, 255, 255, 0) 100%
        ),
        url("/assets/images/layers/hero-layer7.png");
    background-repeat: no-repeat, no-repeat;
    background-position: center top, center top;
    background-size: 100% 240px, cover;
    pointer-events: none;
}

.hero-style7.sab-feature-hero-theme-enabled .hero-content7,
.hero-style7.sab-feature-hero-theme-enabled .fun-fact3,
.hero-style7.sab-feature-hero-decor-enabled .hero-content7,
.hero-style7.sab-feature-hero-decor-enabled .fun-fact3 {
    z-index: 2;
}

.hero-style7.sab-feature-hero-decor-enabled .hero-content7 {
    position: relative;
}

.sab-feature-hero-decor {
    position: absolute;
    z-index: 0;
    top: -86px;
    width: 540px;
    height: 540px;
    pointer-events: none;
}

.sab-feature-hero-decor--right {
    right: -72px;
}

.sab-feature-hero-decor--left {
    left: -72px;
    transform: scaleX(-1);
}

.sab-feature-hero-decor {
    opacity: 0.42;
}

.sab-feature-hero-decor img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

@media (max-width: 1201px) {
    .hero-style7.sab-feature-hero-decor-enabled::before {
        background-size: 100% 210px, contain;
    }
}

@media (max-width: 577px) {
    .hero-style7.sab-feature-hero-decor-enabled::before {
        top: -5%;
    }
}

@media (max-width: 767px) {
    .sab-feature-hero-decor {
        top: -20px;
        width: 330px;
        height: 330px;
        opacity: 0.27;
    }

    .sab-feature-hero-decor--right {
        right: -150px;
    }

    .sab-feature-hero-decor--left {
        left: -150px;
    }

}

@media (max-width: 480px) {
    .hero-style7.sab-feature-hero-decor-enabled::before {
        top: 0;
    }
}