css
/* ===== MOBILE RESPONSIVE HERO BANNER ===== */

selector{
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    position: relative;
    overflow: hidden;
    width: 100%;
}

/* TEXT CONTAINER */
selector .elementor-container{
    align-items: center;
    z-index: 2;
    width: 100%;
    max-width: 100%;
}

/* OVERLAY */
selector::before{
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0.45);
    z-index: 1;
}

/* CONTENT */
selector .elementor-widget-wrap{
    position: relative;
    z-index: 2;
}

/* BLOG IMAGES FIX */
selector img{
    max-width: 100%;
    height: auto;
    display: block;
}

/* BLOG CONTENT FIX */
selector .elementor-posts-container,
selector .elementor-post{
    width: 100% !important;
}

/* ===== MOBILE VIEW ===== */

@media(max-width:768px){

/* HERO SECTION */
selector{
    min-height: 90vh;
    padding: 60px 20px;
    background-size: cover;
    background-position: center top;
    justify-content: center;
    width: 100%;
}

/* CONTAINER */
selector .elementor-container{
    flex-direction: column;
    width: 100%;
}

/* HEADING */
selector h1{
    font-size: 34px !important;
    line-height: 1.15em !important;
    width: 100%;
    word-break: break-word;
    margin-bottom: 15px;
}

/* SUB HEADING */
selector h2{
    font-size: 22px !important;
    line-height: 1.3em !important;
}

/* PARAGRAPH */
selector p{
    font-size: 15px !important;
    line-height: 1.6em !important;
    width: 100%;
}

/* BUTTON */
selector .elementor-button{
    font-size: 14px !important;
    padding: 12px 22px !important;
    width: auto;
}

/* COLUMN FULL WIDTH */
selector .elementor-column{
    width: 100% !important;
    max-width: 100% !important;
}

/* TEXT ALIGN */
selector .elementor-widget-wrap{
    text-align: left;
    padding: 10px;
}

/* BLOGS MOBILE FIX */
selector .elementor-posts-container{
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 20px;
}

/* BLOG CARD */
selector .elementor-post{
    width: 100% !important;
    overflow: hidden;
}

/* BLOG IMAGE */
selector .elementor-post img{
    width: 100%;
    height: auto;
    object-fit: cover;
}

/* FIX OVERFLOW ISSUE */
body,
html{
    overflow-x: hidden;
    width: 100%;
}

}