@media (max-width: 767px) {
    h1,h2{
        font-size: 18px;
        line-height: 24px;
    }
    h3,h4{
        font-size: 16px;
        line-height: 22px;
    }
    /* ============== TOPBAR ============*/
    .top-bar .col-md-12{
        display: block !important;
    }
    .top-bar p, .top-bar #clockdiv{
        font-size: 14px;
        line-height: 20px;
    }
    .top-bar #clockdiv{
        margin-top: 7px;
    }
    .top-bar .top-btn{
        font-size: 14px;
        float: right;
    }
    /* ============== MENU ============*/
    .nav-logo.logo{
        text-align: left;
        width: 75%;
    }
    .img-fluidlo{
        width: 60%;
    }
    .menu{
        top:68px;
    }
    .menu .login-btn{
        display:none;
    }
    .navbar-toggler-icon {
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='white' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
    }
    /* ============== BANNER ============*/
    .banner{
        max-height: none;
        top: -3px;
    }
    .banner p{
        font-size: 14px;
        line-height: 20px;
    }
    .banner .custom-form{
        margin-top: 20px;
    }
    .banner form input, .banner .btn-primary{
        width: 100%;
    }
    .banner .form-img {
        margin-top: 0px !important;
    }
    .banner .form-img .img {
        order: 3;
    }
    .banner .form-img .form {
        order: 1;
        margin-bottom: 20px;
    }
    .banner .form-img .img img{
        width: 100%;
    }
    /* ============== GAME PLAN ============*/
    .gameplan small, .gameplan p span{
        font-size: 14px;
        line-height: 20px;
        font-weight: normal;
    }
    .gameplan .join-button{
        margin-top: 30px !important;
        width: 100%;
    }
    .gameplan .gameplan-card-1, .gameplan .gameplan-card-2, .gameplan figure:after{
        display: none;
    }
    .gameplan figure img.d-block{
        width: 100%;
    }
    /* ========= WHY ============ */
    .why-img-fluid{
        width: 100%;
        height: auto;
    }
    /*===== Courses Offered========*/
    .course-offered .segmented-tabs{
        gap: 1rem;
    }
    .course-offered .segmented-tabs .nav-link {
        width: 20px;
        border-radius: 20px;
        padding: 0.5rem 3.25rem;
        background: #EAEAEA;
        color: #205075;
        text-align: center;
        font-weight: 500;
        min-width: 150px;
        height: 45px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .course-offered .segmented-tabs .nav-link.active{
        text-align: center;
        font-weight: 500;
        min-width: 150px;
        height: 45px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    /*============ GAME CHANGER ============*/
    .game-changer .other-box-2{
        margin-top: 20px;
    }
    .game-changer .other-box .join-button, .game-changer .other-box-2 .join-button{
        width: 100%;
    }
    .game-changer .other-box i.fa-ban{
        font-size: 2em;
    }
    .game-changer .other-box-2 img{
        width:45px;
    }

    /*====== SUCCESS =========*/
    .success .other-box-2{
        margin-top: 20px;
    }
    .success .other-box i.fa-ban{
        font-size: 2em;
    }
    .success .other-box-2 img{
        width:45px;
    }
    .success .other-box p, .success .other-box-2 p, .publish .other-box p, .publish .other-box-2 p {
        font-size: 14px;
        line-height: 20px;
    }
    /*============ pulish =========*/
    .publish .other-box-2{
        margin-top: 20px;
    }
    .publish .other-box i.fa-ban{
        font-size: 2em;
    }
    .publish .other-box-2 img{
        width:45px;
    }
    .publish .other-box p, .success .other-box-2 p, .publish .other-box p, .publish .other-box-2 p {
        font-size: 14px;
        line-height: 20px;
    }
    .publish .card-image-desktop,.card-btn-desktop {
        display: none;
    }
    .publish .card-image-mobile {
        display: block;
    }
    .publish .card-btn-mobile{
        display: inline-block;
    }
    /*============= review =============*/
    .review .other-box-2{
        margin-top: 20px;
    }
    .review .other-box i.fa-ban{
        font-size: 2em;
    }
    .review .other-box-2 img{
        width:45px;
    }
    .review .other-box p, .success .other-box-2 p, .review .other-box p, .publish .other-box-2 p {
        font-size: 14px;
        line-height: 20px;
    }

    /*============= guarantee ============*/
    .guarantee .other-box-2{
        margin-top: 20px;
    }
    .guarantee .other-box i.fa-ban{
        font-size: 2em;
    }
    .guarantee .other-box-2 img{
        width:45px;
    }
    .guarantee .other-box p, .success .other-box-2 p, .guarantee .other-box p, .publish .other-box-2 p {
        font-size: 14px;
        line-height: 20px;
    }
    /*=========== trusted ===========*/
    .trusted .other-box-2{
        margin-top: 20px;
    }
    .trusted .other-box i.fa-ban{
        font-size: 2em;
    }
    .trusted .other-box-2 img{
        width:45px;
    }
    .trusted .other-box p, .success .other-box-2 p, .trusted .other-box p, .publish .other-box-2 p {
        font-size: 14px;
        line-height: 20px;
    }
    /*========= endorsed =======*/
    .endorsed .other-box-2{
        margin-top: 20px;
    }
    .endorsed .other-box i.fa-ban{
        font-size: 2em;
    }
    .endorsed .other-box-2 img{
        width:45px;
    }
    .endorsed .other-box p, .success .other-box-2 p, .endorsed .other-box p, .publish .other-box-2 p {
        font-size: 14px;
        line-height: 20px;
    }
    /*========= Founder ===========*/
    .founder .founder-box{
        margin-top:20px;
    }
    /*======= Switching =======*/
    .switching table thead th{
        font-size: 16px;
        line-height: 22px;
    }
    .switching table{
        font-size: 14px;
        line-height: 20px;
    }
    .switching .table-container{
        overflow-x: auto;
    }
    /*======= Problem =========*/
    .problem .problem-box p{
        font-size: 14px;
        line-height: 20px;
    }
    /*===== Join =========*/
    .join .join-bullet p{
        font-size: 14px;
        line-height: 20px;
    }
    /*===== Footer =======*/
    .footer-links{
        margin-top: 30px;
        text-align: center;
    }
    .footer .footer-form-control, .footer .footer-btn-primary{
        width: 100%;
    }
    .copy-right .d-flex{
        display: block !important;
    }
    .copy-right .d-flex .copy-right-text, .copy-right .d-flex .links {
        width: 100%;
        display: block;
        text-align: center;
    }
    /* =========== Top Courses ============*/
    .top-courses .btns{
        text-align: center !important;
    }
    .top-courses .join-button{
        padding-left: 15px;
        padding-right: 15px;
    }
    .top-courses .join-yello-button{
        padding-left: 20px;
        padding-right: 20px;
    }
    /*Testimonials*/
    .slider-container {
        flex-direction: column; /* Stack columns on mobile */
        height: 800px; /* Increased height for stacked layout */
        gap: 0.5rem;
    }

    .slider-column {
        flex: none;
        height: 50%; /* Each column takes half height on mobile */
    }

    .slider-content {
        gap: 0.5rem; /* Smaller gap on mobile */
    }

    .slider-column img {
        border-radius: 6px;
    }
    /* ========== You May Seen ===========*/.
    .video iframe{
        width: 100%;
        height: auto;
    }
}
@media (max-width: 420px) {
    .menu{
        top:88px;
    }
    /*Testimonials*/
    .slider-container {
        height: 700px;
    }

    .slider-column {
        height: 45%;
    }
}