#hero-banner {
    position: relative;
    min-height: 579px;
    background: #744c29;
    overflow: hidden;
    margin-bottom: 75px;
    .banner-bgimg {
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        right: 0;
        width: 100%;
        height: 100%;
    }
    .banner-bg-blur {
        width: 685px;
        flex-shrink: 0;
        background: linear-gradient(
            92deg,
            #e4eef6 1.62%,
            rgba(228, 238, 246, 0.97) 40.09%,
            rgba(228, 238, 246, 0.9) 71.05%,
            rgba(228, 238, 246, 0.5) 84.72%,
            rgba(169, 213, 249, 0) 98.38%
        );
        opacity: 0.98;
        filter: blur(10px);
        position: absolute;
        left: 0;
        top: -10px;
        bottom: -10px;
        z-index: 1;
    }
    .banner-conten {
        position: relative;
        z-index: 2;
        height: 100%;
        min-height: 579px;
        display: flex;
        align-items: center;
    }
    .conten-left {
        width: 525px;
        margin: auto 0;
        .conten-left-heading {
            width: 424px;
            color: #115c9a;
            font-size: 44px;
            font-style: normal;
            font-weight: 700;
            line-height: 1.31; /* 131.818% */
            letter-spacing: -0.44px;
            text-transform: uppercase;
            margin-bottom: 16px;
        }
        .conten-left-desc {
            color: #115c9a;
            text-align: justify;
            font-size: 20px;
            font-style: italic;
            font-weight: 400;
            line-height: 1.4; /* 140% */
            margin-bottom: 33px;
        }
    }
    .img-deco {
        position: absolute;
        right: 0;
        bottom: 0;
        width: 316px;
        height: 584px;
        z-index: 3;
    }
    .banner-sale {
        position: absolute;
        right: 0;
        bottom: 0;
        z-index: 5;
        display: flex;
        padding: 12px 25px 10px 25px;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 6px;
        border-radius: 70px;
        background: linear-gradient(85deg, #2592eb 8.23%, #2382d1 97.08%);
        box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.12);
        p {
            color: #fff;
            font-size: 18px;
            font-style: italic;
            font-weight: 400;
            line-height: 1.55; /* 155.556% */
            letter-spacing: -0.18px;
            margin-bottom: 0;
        }
        strong {
            color: #fff;
            font-size: 36px;
            font-style: normal;
            font-weight: 700;
            line-height: 0.77; /* 77.778% */
            letter-spacing: -0.36px;
        }
    }
}

@media screen and (max-width: 849px) {
    #hero-banner {
        .banner-conten {
            flex-direction: column;
            padding-bottom: 130px;
        }
        .conten-left {
            width: 100%;
            .conten-left-heading {
                width: 100%;
                font-size: 36px;
                margin-top: 16px;
            }
            .flex {
                flex-direction: column;
            }
        }
        .conten-right {
            margin: 0;
            margin-top: 32px;
            width: 100%;
            padding: 10px;
            .wpcf7 {
                width: 100%;
                .form-booklich {
                    div:last-of-type .flex {
                        flex-direction: column;
                        .banner-form-select {
                            width: 100%;
                        }
                    }
                }
            }
        }
        .img-deco {
            display: none;
        }
    }
}