@media (min-width: 1400px) {
    .header .header__content{margin-bottom: 200px;}
}

@media (max-width: 992px) {
    nav.navbar{
        position: absolute;
        z-index: 9999;
        width: 100%;
        border: 0;
        background-color: transparent;
    }
    .navbar-collapse.show ~ nav,
    .navbar:has(.navbar-collapse.show) {
        background-color: #fff;
        box-shadow: 0 0 4px #00000085;
    }
    nav.navbar .collapse ul.navbar-nav li a{font-size: 16px;}
    .navbar-collapse {
        opacity: 0;
        transform: translateY(-10px);
        pointer-events: none; /* Prevent clicks until it's visible */
    }
    .navbar:has(.navbar-collapse.show) { background-color: #fff;}
    .navbar:has(.navbar-collapse.show) .navbar-collapse {
        opacity: 1;
        transform: translateY(0);
        pointer-events: auto;
    }
    .navbar:has(.navbar-collapse.show) .navbar-toggler-icon{filter: invert(0);}

    .other_pages .navbar{background: #282828;}
    .other_pages .navbar .navbar-brand img{width: 30px;}
    .other_pages .navbar .navbar-brand{display: flex; align-items: center;}
    .other_pages .navbar .navbar-brand h4{font-family: Amman_Sans_Pro, sans-serif;}
    .other_pages .navbar:has(.navbar-collapse.show){background-color: #282828;}
    .other_pages .navbar:has(.navbar-collapse.show) .navbar-toggler-icon{filter: invert(1);}
    .other_pages .navbar .collapse ul.navbar-nav li a{color: #fff;}

    /* =============== header section =================== */
    .header .header__img{position: relative;}
    .header__img img{position: relative;}
    .header .header__content{margin-top: 100px;}
    .header .header__content h1{font-size: 60px;}
    nav.navbar .navbar-brand img{width: 35px;}
    .header img.sub_nav {bottom: 80px; top: auto;}
    .header .hero-bg{z-index: 1;}




     /* ================= features =================== */
    .features{background: transparent;padding: 0 !important;margin: 0;}
    .features .overlay{background: transparent;}
    .features .box{
        background-size: 100%;
        background-repeat: no-repeat;
        background-position: 50%;
        background-size: cover;
        margin: 40px 0 0 !important;
        position: relative;
        border-radius: 4px;
    }
    .features .box .overlay{
        position: absolute;
        z-index: 0;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        border-radius: 4px;
        background: linear-gradient(0deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),
        linear-gradient(0deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),
        linear-gradient(0deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),
        linear-gradient(0deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
    }
    .features .data{z-index: 1;}
    .features .data p{font-size: 14px;}
    .features .card__article{margin-left: 13px !important;}
    .features .swiper .card__content{overflow: visible;}

    /* =============== download_app =================== */
    .download_app .app-content{margin: 65px 0 190px;}
    .download_app .app-content h2{font-size: 24px;}
    .download_app .app-content p{font-size: 14px;}
    .download_app .get_app{bottom: 100px;bottom: 70px;}

    .about-page .certificates .image {
        z-index: 0 !important;
        margin: 5px 0 !important;
        max-width: 100%;
        cursor: auto;
    }
    .about-page .certificates .image:hover, .about-page .certificates .image.active {
        transform: scale(1);
        box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.3);
    }

    .footer .footer_bottom_text{font-size: 30px;}
}

@media (max-width: 768px) {
    .header .header__content h2{font-size: 20px;line-height: 25px;}
    .header .header__content p{line-height: 25px !important;font-size: 14px;}
    .header img.sub_nav{bottom: 40px;}
    .header .hero-bg{padding: 0;}

    .app_release .spacing{padding-left: 0; padding-right: 0;}
    .app_release{margin: 0 !important;}
    .app_release .app_release_box h2{margin: 0 0 21px !important;}
    .app_release .student_app{padding: 0 !important;}
    .app_release .iframeBox{order:0}
    .app_release .app_release_content{order:1}
    .app_release .iframeBox{min-height: 400px;}


    .app_release .steps{margin: 50px 2px;}
    .app_release .steps p{font-size: 15px;}
    .app_release .steps .number{
        top: -35px;
        right: -5px;
        font-size: 66px;
        font-family: Amman_Sans_Pro_bold, sans-serif;
    }
    .app_release .steps:nth-of-type(1) .number{top: -27px;}
    .app_release .steps:nth-of-type(2) .number{top: -26px;}

    .blogs{margin-top: 0 !important;}

    /* =============== download_app =================== */
    .download_app{ background: #FFF2EB;border: 0;padding-bottom: 100px;}
    .download_app .app-content{margin:65px 0 0;}
    .download_app .app-content h2{ margin: 0 0 60px !important;font-size: 26px;}
    .download_app .app-content p{ font-size: 16px;}
    .download_app .get_app{bottom: 33px;}
    .download_app .get_app p{font-size: 20px;}

    /* =============== about =================== */
    .about-page .header_section{padding: 90px 10px 0 10px !important;}
    .about-page h2{color: #000;}
    .about-page .header_section p{line-height: 36px;color: #000;}
    .about-page .header_section h2 span{color: #F15A25;}
    .about-page .content_section{padding: 40px 10px !important;}
    .about-page .about-card {background: #FBFBFB;padding: 30px 20px 5px;}
    .about-page .about-card h5{font-size: 22px;}
    .about-page .about-card ul {list-style: none;padding: 0 !important;}
    .about-page .about-card ul li{line-height: 37px;font-size: 14px;}
    .about-page .about-card ul :is(li,span){color: #707372 !important;}

    /* =============== contact =================== */
    .contact-page{margin-bottom: -70px;}
    .contact-page .header_section{padding: 90px 10px 0 10px !important;}
    .contact-page form .submit_btn{width: 100%;}
    .contact-page form input::placeholder,
    .contact-page form textarea::placeholder{color: #515152;}

    .questions-page .questions_section_column{position: relative !important;}
    .questions-page .answer-box{height: auto;margin-bottom: 20px;}
    .questions-page .answer-box h2{display: none;}
    .questions-page .spacing{padding-left: 0 !important; padding-right: 0 !important;}

    .footer .social{display: flex;justify-content: center;margin: 55px 0 0px;}
    .footer .logo img{width: 50px;}
    .footer .desc{margin: 10px 0 !important;}
    .footer .logo_section{order: 1;}
    .footer .links_section{order: 0;margin-top: 20px;}
    .footer .links_section a{color: #615D5E !important}
    .footer .copyright{text-align: center;margin-top: 5px !important;}
    .footer .footer_bottom_text{width: 100%; text-align: center;}
}

@media (max-width: 576px) {
    .app_release .box{padding: 5px 0;width: 120px;}
    .features .content{padding: 0 15px;}

    .blogs{background: none;}
    .blogs h2{color: #000; font-weight: 700; font-size: 18px; line-height: 24px;}
    .blogs .article img{width: 100%;border-radius: 0 !important;}
    .blogs .article-content h5{ font-weight: 400; font-size: 22px; line-height: 140%;}
    .blogs .article-content p{ font-weight: 400; font-size: 13px; line-height: 150%; margin-bottom: 30px;}
    .all_blogs{padding-left: 0 !important; padding-right: 0 !important;}
    /* =============== download_app =================== */
    .download_app .app-content h2{margin: 0 0 35px !important;font-size: 18px;}
    .download_app .app-content p{font-size: 12px;margin-bottom: 30px;}
    .download_app .get_app{bottom: 20px;}
    .download_app .get_app p{font-size: 20px;}
    .download_app .app_section{height: 270px !important;}

    .contact-page .contact-info{padding: 30px !important;}
    .contact-page .contact-info a{font-size: 14px;}
    .contact-page .contact-info .img-box {width: 85px;height: 85px;}
    .contact-page .contact-info .img-box img {left: 39px; bottom: 49px; width: 100px;}

    .blogs-show-page .social-icons h5{ font-size: 16px;margin-top: 38px;}

    .footer{padding: 20px 0 !important;}
    .footer .box{padding: 0 16px !important;}

    .arrow-top{left: 20px;}
}

@media (max-width: 400px) {
    .header .header__content h2{font-size: 18px;}
}


@media (max-width: 350px) {
    .download_app .app_section{height: 350px !important;}
    .market-btn {
        margin: 2px 0;
        width: 156px;
    }
    .market-btn .market-button-title{float: inline-end;}
}