.title_with_text_section {
    background-color: #F6F9FF;
    &.after_text {
        & .section_inner {
            flex-direction: row-reverse;
        }
    }

    & .section_inner {
        width: 100%;
        display: flex;
        flex-direction: row; 
        justify-content: space-between;
        flex-wrap: wrap;
        @media (max-width: 1024px) {
            flex-direction: column;
        }
        & .sub_title { 
            margin-bottom: 3rem;
            font-size: 16px;
            color: var(--secondary);
            text-transform: uppercase; 
        }

        & .button_wrapper {
            display: flex;
        }

        & .button_wrapper.hidden {
            display: none!important;
        }
       
        @media (max-width: 991px) {
            text-align: center;
        }

        & .left_side {
            width: 26%;
            overflow: hidden;

            @media (max-width: 1024px) {
                width: 100%!important;
                margin-bottom: 3rem;
            }
    
            & h2, & h3, & h4, & h5 {
                margin: 0;
                font-size: 40px;
                & span {
                    color: var(--primary);
                    font-size: inherit;
                    font-weight: inherit;
                }
            }

            & .image_area_left {
                margin-top: 3rem;
            }

            

            & .button_wrapper {
                display: flex;
                margin-top: 3rem;
                @media (max-width: 991px) {
                    justify-content: center;
                }
                &  a.button.button-primary {
                    color: var(--white) !important;
                    background: var(--secondary) !important;
                    font-weight: bold;
                    font-size: 14px;
                    border:none;
                    box-shadow: none;
                    margin-top: 20px;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    margin: 0!important;
                    &:hover {   
                        background: var(--primary) !important;
                    }
                    .phone_icon {
                        margin-right: 1rem;
                    }
                    span {
                        font-size: 14px;
                        font-weight: bold;
                        color: var(--white) !important;
                        @media (max-width: 400px) {
                            font-size: 12px!important;
                        }
                    }
                }
                & .white_button {
                   @media (max-width: 1024px) {
                    margin-top: 3rem;
                   }
                }
            }
        }

        & .right_side {
            width: 66%;
            display: flex;
            flex-direction: column;

            @media (max-width: 1024px) {
                width: 100%!important;
            }


            & .button_wrapper {
                display: flex;
                margin-top: 3rem;
                @media (max-width: 991px) {
                    justify-content: center;
                }
                &  a.button.button-primary {
                    color: var(--white) !important;
                    background: var(--secondary) !important;
                    font-weight: bold;
                    font-size: 14px;
                    border:none;
                    box-shadow: none;
                    margin-top: 20px;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    margin: 0!important;
                    &:hover {   
                        background: var(--primary) !important;
                    }
                    .phone_icon {
                        margin-right: 1rem;
                    }
                    span {
                        font-size: 14px;
                        font-weight: bold;
                        color: var(--white) !important;
                        @media (max-width: 400px) {
                            font-size: 12px!important;
                        } 
                    }
                }
            }

            & .text_area {
                & h2, & h3, & h4, & h5 {
                    margin: 0 0 3rem;

                    & span {
                        color: var(--primary);
                        font-size: inherit;
                        font-weight: inherit;
                    }
                }

                & p {
                    margin: 0 0 1rem;
                    &:last-child {
                        margin: 0;
                    }
                }
            }

            & .listed_items {
                margin-top: 3rem;
                & .listed_item {
                    display: flex;
                    align-items: center;
                    margin-bottom: 1.5rem;
                    text-align: left!important;
                }
                & .listed_item_icon {
                    margin-right: 1rem;
                }
                & .listed_item_text {
                    font-size: 18px;
                    color: #00007C;
                    font-weight: bold;
                    line-height: 1.3;
                }
            }
        }
    }

    & .image_area {
        position: relative;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        margin-top: 6rem;

        & img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            object-position: center;
        } 
    }
    & .video_wrapper {
        width: 100%;
        max-width: 100%;
        margin: 0 auto;
        margin-bottom: 6rem;
    }
    
    & .video-container {
        position: relative;
        width: 100%;
        padding-bottom: 56.25%; /* 16:9 aspect ratio */
        height: 0;
        overflow: hidden;
    }
    
    & .video-container iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        border: 0;
    }
    
}

