/*=========================================================
                    HEADER RESPONSIVE
=========================================================*/

/*==========================
        1400px
==========================*/
@media (max-width:1399px){

    .container{
        max-width:1140px;
    }

    .navbar-brand img{
        height:105px;
    }

    .main-header.fixed .navbar-brand img{
        height:95px;
    }

    .navbar-nav{
        gap:18px;
    }

    .nav-link{
        font-size:15px;
    }

    .btn-register{
        padding:0 26px;
    }

}


/*==========================
        1200px
==========================*/
@media (max-width:1199px){

    .navbar{

        height:85px;
        position:relative;

    }

    .main-header.fixed .navbar{

        height:75px;

    }

    .navbar-brand{

        margin-right:0;

    }

    .navbar-brand img{

        height:90px;

    }

    .main-header.fixed .navbar-brand img{

        height:82px;

    }

    /* Toggle */

    .navbar-toggler{

        width:48px;
        height:48px;

        display:flex;
        justify-content:center;
        align-items:center;

        background:#2563EB;

        border-radius:14px;

        border:none;

        box-shadow:none;

    }

    .navbar-toggler:focus{

        box-shadow:none;

    }

    .navbar-toggler-icon{

        background-image:none;

        width:24px;
        height:2px;

        background:#fff;

        position:relative;

    }

    .navbar-toggler-icon::before,
    .navbar-toggler-icon::after{

        content:"";

        position:absolute;

        left:0;

        width:24px;
        height:2px;

        background:#fff;

    }

    .navbar-toggler-icon::before{

        top:-7px;

    }

    .navbar-toggler-icon::after{

        top:7px;

    }

    /* Mobile Menu */

    .navbar-collapse{

        position:fixed;

        top:90px;
        left:15px;
        right:15px;

        background:#fff;

        border-radius:22px;

        padding:22px;

        box-shadow:0 25px 60px rgba(0,0,0,.12);

        display:block !important;

        max-height:calc(100vh - 110px);

        overflow-y:auto;

        opacity:0;
        visibility:hidden;

        transform:translateY(-15px);

        transition:.35s ease;

        z-index:99999;

    }

    .navbar-collapse.show{

        opacity:1;
        visibility:visible;

        transform:translateY(0);

    }

    .navbar-collapse::-webkit-scrollbar{

        width:6px;

    }

    .navbar-collapse::-webkit-scrollbar-thumb{

        background:#2563EB;

        border-radius:20px;

    }

    .navbar-nav{

        display:flex;

        flex-direction:column;

        align-items:stretch;

        gap:0;

        margin-bottom:22px;

    }

    .nav-item{

        width:100%;

    }

    .nav-link{

        display:block;

        width:100%;

        padding:16px 0 !important;

        border-bottom:1px solid #edf1f6;

        font-size:16px;

    }

    .nav-link::after{

        display:none;

    }

    .nav-action{

        display:flex;

        flex-direction:column;

        gap:12px;

        width:100%;

        margin:0;

    }

    .btn-login,
    .btn-register{

        width:100%;

        height:52px;

        flex:none;

        justify-content:center;

    }

}


/*==========================
        991px
==========================*/
@media (max-width:991px){

    .navbar{

        height:80px;

    }

    .navbar-brand img{

        height:80px;

    }

    .main-header.fixed .navbar-brand img{

        height:72px;

    }

    .navbar-collapse{

        top:85px;

        left:12px;
        right:12px;

        padding:20px;

        max-height:calc(100vh - 100px);

    }

}


/*==========================
        767px
==========================*/
@media (max-width:767px){

    .navbar{

        height:72px;

    }

    .main-header.fixed .navbar{

        height:68px;

    }

    .navbar-brand img{

        height:68px;

    }

    .main-header.fixed .navbar-brand img{

        height:62px;

    }

    .navbar-toggler{

        width:42px;
        height:42px;

    }

    .navbar-collapse{

        top:78px;

        left:10px;
        right:10px;

        padding:18px;

        border-radius:18px;

        max-height:calc(100vh - 90px);

    }

    .btn-login,
    .btn-register{

        height:48px;

        font-size:14px;

    }

}


/*==========================
        480px
==========================*/
@media (max-width:480px){

    .navbar-brand img{

        height:60px;

    }

    .main-header.fixed .navbar-brand img{

        height:55px;

    }

    .navbar-collapse{

        top:74px;

        left:8px;
        right:8px;

        padding:16px;

        border-radius:16px;

    }

}


/*=========================================================
                CAREER BANNER RESPONSIVE
=========================================================*/

/*==========================
        1400px
==========================*/
@media (max-width:1399px){

    .career-banner{

        grid-template-columns:
        120px
        1fr
        220px
        240px;

        gap:20px;

        padding:22px 24px 50px;

    }

    .career-megaphone img{
        width:150px;
    }

    .career-title h2{
        font-size:58px;
    }

    .career-title p{
        font-size:17px;
    }

    .vacancy-card h1{
        font-size:75px;
    }

    .vacancy-card span{
        font-size:24px;
    }

    .career-location{

        grid-column:2 / 5;

        border-left:none;

        border-top:1px solid rgba(255,255,255,.15);

        padding:20px 0 0;

        display:flex;

        justify-content:center;

        gap:40px;

        align-items:center;

    }

    .career-location ul{

        display:flex;

        gap:25px;

    }

}


/*==========================
        1200px
==========================*/
@media (max-width:1199px){

    .career-banner{

        margin-top:95px;

        grid-template-columns:1fr 1fr;

        gap:25px;

        padding:30px 30px 90px;

        min-height:auto;

    }

    .career-megaphone{

        display:none;

    }

    .career-title{

        grid-column:1 / 3;

        text-align:center;

    }

    .career-title h2{

        font-size:54px;

    }

    .vacancy-card{

        max-width:260px;

        margin:auto;

    }

    .career-details{

        text-align:center;

    }

    .career-location{

        border:none;

        padding:0;

        text-align:center;

    }

    .career-location ul{

        display:flex;

        justify-content:center;

        gap:20px;

        flex-wrap:wrap;

    }

    .career-btn{

        min-width:320px;

        height:54px;

        bottom:18px;

    }

}


/*==========================
        991px
==========================*/
@media (max-width:991px){

    .career-banner{

        grid-template-columns:1fr;

        text-align:center;

        padding:30px 22px 90px;

        gap:24px;

    }

    .career-title{

        grid-column:auto;

    }

    .career-title h2{

        font-size:44px;

    }

    .career-title p{

        font-size:16px;

    }

    .vacancy-card{

        width:240px;

        margin:auto;

    }

    .career-details{

        text-align:center;

    }

    .career-location{

        border:none;

        padding:0;

    }

    .career-location ul{

        justify-content:center;

        display:flex;

        gap:16px;

        flex-wrap:wrap;

    }

    .career-btn{

        width:90%;

        min-width:auto;

        font-size:15px;

    }

}


/*==========================
        767px
==========================*/
@media (max-width:767px){

    .career-banner{

        min-height:auto !important;
        height:auto !important;

        padding:20px 15px 20px !important;

        gap:20px;

        display:flex;
        flex-direction:column;
        align-items:center;

    }

    .career-banner::before{

        inset:8px;

    }

    .career-megaphone{

        display:none;

    }

    .career-title{

        width:100%;
        text-align:center;

    }

    .career-title h2{

        font-size:34px;
        line-height:1;

    }

    .career-title p{

        margin-top:12px;
        font-size:15px;

    }

    .vacancy-card{

        width:220px;
        margin:0 auto;

    }

    .vacancy-card h1{

        font-size:60px;

    }

    .vacancy-card span{

        font-size:18px;

    }

    .career-details{

        width:100%;
        text-align:center;

    }

    .freshers-pill{

        margin:auto auto 15px;

    }

    .career-location{

        width:100%;

        display:flex;

        flex-direction:column;

        align-items:center;

        justify-content:center;

        text-align:center;

        border:none;

        padding:0;

        gap:18px;

    }

    .career-location h5{

        margin:0;

        font-size:22px;

        line-height:1.2;

    }

    .career-location ul{

        display:flex;

        flex-direction:column;

        align-items:center;

        justify-content:center;

        gap:10px;

        margin:0;

        padding:0;

        width:100%;

    }

    .career-location li{

        margin:0;

        font-size:18px;

        line-height:1.4;

    }

    .career-btn{

        position:static;

        display:flex;

        justify-content:center;
        align-items:center;

        width:100%;
        max-width:320px;

        height:52px;

        margin:20px auto 0;

        padding:0 20px;

        border-radius:50px;

        left:auto;
        right:auto;
        top:auto;
        bottom:auto;

        transform:none !important;

        font-size:14px;
        font-weight:700;

        text-align:center;

        white-space:normal;

        gap:10px;

    }

    .career-btn:hover{

        transform:none !important;

    }

}

/*==========================
        480px
==========================*/
@media (max-width:480px){

    .career-banner{

        margin:80px 10px 20px;

        padding:20px 12px 78px;

    }

    .career-title h2{

        font-size:28px;

    }

    .career-title p{

        font-size:14px;

    }

    .vacancy-card{

        width:200px;

    }

    .vacancy-card h1{

        font-size:46px;

    }

    .vacancy-card span{

        font-size:16px;

    }

    .career-btn{

        font-size:12px;

        height:45px;

    }

}


/*=========================================================
                    HERO RESPONSIVE
=========================================================*/

/*==========================
        1400px
==========================*/
@media (max-width:1399px){

    .hero-content{
        margin-left:0;
        max-width:100%;
    }

    .hero-content h1{
        font-size:58px;
    }

    .hero-subtitle{
        font-size:28px;
    }

    .hero-right{
        margin-right:0;
        min-height:620px;
    }

    .hero-art{
        width:100%;
        margin-left:0;
    }

    .hero-ai-box{
        width:220px;
        right:10px;
    }

}


/*==========================
        1200px
==========================*/
@media (max-width:1199px){

    .hero-section{
        padding:60px 0 80px;
    }

    .hero-content{
        text-align:center;
        max-width:850px;
        margin:0 auto 50px;
    }

    .hero-content p{
        margin:auto auto 35px;
    }

    .hero-buttons{
        justify-content:center;
    }

    .hero-right{
        min-height:auto;
    }

    .hero-art{
        width:90%;
        max-width:700px;
        margin:auto;
    }

    .hero-ai-box{
        top:40px;
        right:20px;
    }

}


/*==========================
        991px
==========================*/
@media (max-width:991px){

    .hero-section{
        padding:40px 0 70px;
    }

    .hero-content h1{
        font-size:48px;
    }

    .hero-subtitle{
        font-size:24px;
    }

    .hero-content p{
        font-size:17px;
    }

    .hero-right::after{
        display:none;
    }

    .hero-right::before{
        width:420px;
        height:420px;
    }

    .hero-art{
        width:100%;
        max-width:600px;
    }

    .hero-ai-box{
        position:relative;
        top:auto;
        right:auto;
        margin:30px auto 0;
        width:320px;
        border-radius:25px;
    }

}


/*==========================
        767px
==========================*/
@media (max-width:767px){

    .hero-section{
        padding:30px 0 50px;
    }

    /* Left */

    .hero-content{
        text-align:center;
        margin:0;
        max-width:100%;
    }

    .hero-badge{
        font-size:13px;
        padding:10px 18px;
    }

    .hero-content h1{
        font-size:38px;
        line-height:1.15;
        letter-spacing:0;
    }

    .hero-subtitle{
        font-size:20px;
    }

    .hero-content p{
        font-size:15px;
        line-height:1.8;
    }

    .hero-buttons{
        flex-direction:column;
        gap:15px;
    }

    .theme-btn,
    .btn-yellow,
    .hero-video-btn{
        width:100%;
        justify-content:center;
    }

    /* Right */

    .hero-right{

        display:flex;
        flex-direction:column;
        align-items:center;

        min-height:auto !important;

        margin:40px 0 0 !important;
        padding:0;

    }

    .hero-right::before,
    .hero-right::after{
        display:none;
    }

    .hero-art{

        width:100% !important;
        max-width:340px !important;

        margin:0 !important;

        animation:none;

    }

    .hero-ai-box{

        position:relative !important;

        top:0 !important;
        right:0 !important;
        left:0 !important;

        width:100%;
        max-width:330px;

        margin:25px auto 0;

        border-radius:20px;

        padding:22px;

    }

}

/*==========================
        480px
==========================*/
@media (max-width:480px){

    .hero-content h1{
        font-size:30px;
    }

    .hero-subtitle{
        font-size:18px;
    }

    .hero-content p{
        font-size:14px;
    }

    .hero-badge{
        font-size:12px;
    }

    .video-icon{
        width:52px;
        height:52px;
    }

    .video-content span{
        font-size:16px;
    }

    .video-content small{
        font-size:12px;
    }

    .hero-ai-box{
        max-width:100%;
    }

}

/*=========================================================
                HERO FEATURE STRIP RESPONSIVE
=========================================================*/

/*==========================
        1400px
==========================*/
@media (max-width:1399px){

    .hero-feature-strip{

        padding:18px;

        gap:15px;

    }

    .feature-item{

        gap:12px;

    }

    .feature-item strong{

        font-size:14px;

    }

    .feature-item span{

        font-size:13px;

    }

}


/*==========================
        1200px
==========================*/
@media (max-width:1199px){

    .hero-feature-strip{

        display:grid;

        grid-template-columns:repeat(3,1fr);

        margin-top:50px;

        padding:25px;

        gap:20px;

    }

    .feature-item{

        border:none !important;

        padding:0 !important;

    }

}


/*==========================
        991px
==========================*/
@media (max-width:991px){

    .hero-feature-strip{

        grid-template-columns:repeat(2,1fr);

        gap:20px;

    }

    .feature-item{

        justify-content:flex-start;

        padding:15px;

        border-radius:15px;

        background:#F8FAFC;

    }

}


/*==========================
        767px
==========================*/
@media (max-width:767px){

    .hero-feature-strip{

        display:grid;

        grid-template-columns:1fr;

        margin-top:40px;

        padding:18px;

        gap:15px;

        border-radius:18px;

    }

    .feature-item{

        display:flex;

        align-items:center;

        gap:15px;

        padding:15px;

        border:none !important;

        background:#F8FAFC;

        border-radius:14px;

    }

    .feature-item img{

        width:42px;

        height:42px;

    }

    .feature-item strong{

        font-size:15px;

    }

    .feature-item span{

        font-size:13px;

    }

}


/*==========================
        480px
==========================*/
@media (max-width:480px){

    .hero-feature-strip{

        padding:15px;

    }

    .feature-item{

        padding:12px;

    }

    .feature-item img{

        width:36px;

        height:36px;

    }

    .feature-item strong{

        font-size:14px;

    }

    .feature-item span{

        font-size:12px;

    }

}

/*=========================================================
                STATS RESPONSIVE
=========================================================*/

@media(max-width:1199px){

    .stats-wrapper{

        display:grid;

        grid-template-columns:repeat(3,1fr);

        gap:30px;

    }

    .stat-item::after{

        display:none;

    }

}

@media(max-width:767px){

    .stats-strip{

        padding:40px 0;

    }

    .stats-wrapper{

        grid-template-columns:1fr;

        gap:25px;

    }

    .stat-item{

        justify-content:flex-start;

    }

    .stat-icon{

        width:55px;
        height:55px;

        font-size:22px;

    }

    .stat-content h3{

        font-size:25px;

    }

    .stat-content p{

        font-size:15px;

    }

}


/*=========================================
        COURSES RESPONSIVE
=========================================*/
/*==========================
        1400px
==========================*/

@media (max-width:1399px){

    .courses-wrapper{
        grid-template-columns:380px 1fr;
        padding:55px;
    }

    .courses-content h2{
        font-size:44px;
    }

}

/*==========================
        1200px
==========================*/

@media (max-width:1199px){

    .courses-wrapper{

        grid-template-columns:1fr;
        text-align:center;
        padding:50px;

    }

    .courses-content{

        max-width:760px;
        margin:auto;

    }

    .courses-content p{

        max-width:650px;
        margin:auto 0 30px;

    }

    .courses-grid{

        grid-template-columns:repeat(3,1fr);

    }

}

/*==========================
        992px
==========================*/

@media (max-width:991px){

    .courses-wrapper{

        padding:40px;

    }

    .courses-content h2{

        font-size:38px;

    }

    .courses-grid{

        grid-template-columns:repeat(2,1fr);

    }

}

/*==========================
        768px
==========================*/

@media (max-width:767px){

    .courses-wrapper{

        padding:30px 20px;
        border-radius:24px;
        gap:35px;

    }

    .courses-content h2{

        font-size:30px;

    }

    .courses-content p{

        font-size:15px;

    }

    .courses-grid{

        grid-template-columns:1fr;
        gap:16px;

    }

    .course-item{

        min-height:auto;
        padding:18px;

    }

    .course-item i{

        width:50px;
        height:50px;
        font-size:20px;

    }

    .course-item span{

        font-size:15px;

    }

    .courses-content .theme-btn{

        width:100%;
        justify-content:center;

    }

}

/*==========================
        480px
==========================*/

@media (max-width:480px){

    .courses-wrapper{

        padding:22px 15px;

    }

    .courses-content h2{

        font-size:26px;

    }

    .courses-content p{

        font-size:14px;

    }

}


/*=========================================
        Final CTA
=========================================*/ 

/*==========================
        1400px
==========================*/

@media(max-width:1399px){

    .cta-content h2{

        font-size:48px;

    }

}

/*==========================
        1200px
==========================*/

@media(max-width:1199px){

    .final-cta{

        grid-template-columns:1fr;
        text-align:center;

        padding:55px;

    }

    .cta-content{

        max-width:760px;
        margin:auto;

    }

    .cta-content p{

        margin:0 auto 35px;

    }

    .cta-buttons{

        justify-content:center;

    }

}

/*==========================
        992px
==========================*/

@media(max-width:991px){

    .cta-content h2{

        font-size:42px;

    }

    .cta-right{

        max-width:500px;
        margin:auto;

    }

}

/*==========================
        768px
==========================*/

@media(max-width:767px){

    .final-cta-section{

        padding:70px 0;

    }

    .final-cta{

        padding:35px 22px;

        border-radius:24px;

    }

    .cta-content h2{

        font-size:32px;

    }

    .cta-content p{

        font-size:15px;

    }

    .cta-buttons{

        justify-content:center;

    }

    .theme-btn{

        width:100%;
        justify-content:center;

    }

    .contact-box{

        flex-direction:column;
        text-align:center;

    }

}

/*==========================
        480px
==========================*/

@media(max-width:480px){

    .cta-content h2{

        font-size:28px;

    }

    .cta-content p{

        font-size:14px;

    }

    .contact-box,
    .download-box{

        padding:20px;

    }

    .contact-box h4{

        font-size:22px;

    }

    .store-btn{

        padding:14px;

    }

}

/*=========================================
        AI TALENT TEST RESPONSIVE
=========================================*/

/*==============================
        1400px
==============================*/

@media (max-width:1399px){

    .ai-test-content h2{

        font-size:48px;

    }

    .process-item{

        padding:22px;

    }

}

/*==============================
        1200px
==============================*/

@media (max-width:1199px){

    .ai-test-content{

        text-align:center;

        max-width:750px;

        margin:0 auto 50px;

    }

    .ai-test-content p{

        max-width:650px;

        margin:0 auto;

    }

    .ai-test-btn{

        text-align:center;

    }

    .ai-process{

        max-width:700px;

        margin:0 auto;

    }

}

/*==============================
        991px
==============================*/

@media (max-width:991px){

    .ai-test-section{

        padding:80px 0;

    }

    .ai-test-content{

        text-align:center;

        margin-bottom:50px;

    }

    .ai-test-content h2{

        font-size:42px;

    }

    .ai-test-content p{

        font-size:17px;

        max-width:100%;

    }

    .ai-test-btn{

        text-align:center;

    }

    .ai-process{

        max-width:100%;

    }

    .process-item{

        padding:22px;

    }

    .process-number{

        width:58px;

        height:58px;

        font-size:20px;

    }

    .process-item h5{

        font-size:20px;

    }

}

/*==============================
        767px
==============================*/

@media (max-width:767px){

    .ai-test-section{

        padding:70px 0;

    }

    .ai-test-content{

        text-align:center;

    }

    .ai-test-content h2{

        font-size:34px;

        line-height:1.2;

    }

    .ai-test-content p{

        font-size:15px;

        line-height:1.8;

    }

    .ai-process::before{

        left:25px;

    }

    .process-item{

        gap:16px;

        padding:18px;

        border-radius:18px;

    }

    .process-number{

        width:50px;

        height:50px;

        font-size:18px;

    }

    .process-item h5{

        font-size:18px;

        margin-bottom:6px;

    }

    .process-item p{

        font-size:14px;

        line-height:1.7;

    }

    .ai-test-btn{

        text-align:center;

    }

    .ai-btn{

        width:100%;

        max-width:280px;

        min-width:auto;

        height:52px;

        padding:0 24px;

        font-size:15px;

    }

}

/*==============================
        480px
==============================*/

@media (max-width:480px){

    .ai-test-content h2{

        font-size:30px;

    }

    .ai-test-content p{

        font-size:14px;

    }

    .process-item{

        flex-direction:column;

        align-items:center;

        text-align:center;

        padding:20px 16px;

    }

    .process-item h5{

        font-size:17px;

    }

    .process-item p{

        font-size:13px;

    }

    .ai-process::before{

        display:none;

    }

    .process-number{

        margin-bottom:8px;

    }

    .ai-btn{

        width:100%;

        max-width:250px;

        height:50px;

        font-size:14px;

        padding:0 20px;

    }

}


/*=========================================
        ABOUT SECTION RESPONSIVE
=========================================*/

/*=========================================
        RESPONSIVE
=========================================*/

/* Large Laptop */
@media (max-width:1400px){

    .about-section h2{
        font-size:44px;
    }

    .card-one{
        left:-20px;
    }

    .card-three{
        right:-20px;
    }

}


/* Laptop */
@media (max-width:1200px){

    .about-section{
        padding:90px 0;
    }

    .about-section h2{
        font-size:40px;
    }

    .about-text,
    .about-feature p{
        font-size:17px;
    }

    .about-card{
        width:220px;
        padding:16px 18px;
    }

    .about-card strong{
        font-size:16px;
    }

    .about-card span{
        font-size:13px;
    }

    .about-card i{
        width:50px;
        height:50px;
        font-size:20px;
    }

    .card-one{
        left:0;
        top:58%;
    }

    .card-two{
        left:20px;
        bottom:-10px;
    }

    .card-three{
        right:0;
        top:18%;
    }

}


/* Tablet */
@media (max-width:991px){

    .about-section{
        padding:80px 0;
    }

    .about-image-wrapper{
        max-width:500px;
        margin:0 auto 60px;
    }

    .about-card{
        width:200px;
        padding:14px 16px;
    }

    .about-card strong{
        font-size:15px;
    }

    .about-card span{
        font-size:12px;
    }

    .about-card i{
        width:44px;
        height:44px;
        font-size:18px;
    }

    .card-one{
        left:-10px;
        top:56%;
    }

    .card-two{
        left:10px;
        bottom:-10px;
    }

    .card-three{
        right:-10px;
        top:14%;
    }

    .about-section h2{
        font-size:36px;
        text-align:center;
    }

    .about-text{
        text-align:center;
    }

    .about-section .section-subtitle{
        display:flex;
        justify-content:center;
    }

    .hero-buttons{
        display:flex;
        justify-content:center;
    }

}


/* Mobile */
@media (max-width:767px){

    .about-section{
        padding:70px 0;
    }

    .about-image-wrapper{
        max-width:360px;
        margin:auto;
    }

    .about-card{
        width:150px;
        padding:10px;
        gap:8px;
        border-radius:14px;
    }

    .about-card i{
        width:34px;
        height:34px;
        font-size:15px;
        border-radius:10px;
    }

    .about-card strong{
        font-size:11px;
        line-height:1.2;
    }

    .about-card span{
        font-size:9px;
        line-height:1.2;
    }

    .card-one{
        left:-8px;
        top:55%;
    }

    .card-two{
        left:10px;
        bottom:-8px;
    }

    .card-three{
        right:-8px;
        top:12%;
    }

    .about-section h2{
        font-size:30px;
        text-align:center;
    }

    .about-text{
        font-size:16px;
        text-align:center;
    }

}


/* Small Mobile */
@media (max-width:575px){

    .about-section{
        padding:60px 0;
    }

    .about-image-wrapper{
        max-width:300px;
        margin:auto;
    }

    .about-card{
        position:absolute;      /* KEEP FLOATING */
        width:135px;
        padding:8px;
        gap:6px;
        border-radius:12px;
    }

    .about-card i{
        width:30px;
        height:30px;
        font-size:13px;
        border-radius:8px;
    }

    .about-card strong{
        font-size:10px;
        line-height:1.2;
    }

    .about-card span{
        font-size:8px;
        line-height:1.2;
    }

    .card-one{
        left:-10px;
        top:-18%;
    }

    .card-two{
        left:8px;
        bottom:-5px;
    }

    .card-three{
        right:-10px;
        top:10%;
    }

    .about-section h2{
        font-size:26px;
        text-align:center;
    }

    .about-text{
        font-size:15px;
        text-align:center;
    }

    .about-feature{
        gap:12px;
    }

    .about-feature i{
        width:42px;
        height:42px;
        font-size:16px;
    }

    .about-feature h3{
        font-size:16px;
    }

    .about-feature p{
        font-size:14px;
    }

    .hero-buttons{
        display:flex;
        justify-content:center;
    }

}
/*=========================================
        TABLET
=========================================*/

@media(max-width:991px){

    .why-us-wrapper{
        grid-template-columns:repeat(2,1fr);
    }

    .why-us-section .section-title h2{
        font-size:42px;
    }

    .section-heading{
        font-size:22px;
    }

}

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

@media(max-width:767px){

    .why-us-section{
        padding:70px 0;
    }

    .why-us-wrapper{
        grid-template-columns:1fr;
        gap:20px;
    }

    .why-us-section .section-title h2{
        font-size:34px;
    }

    .section-heading{
        font-size:20px;
    }

    .why-us-section .section-title p{
        font-size:16px;
    }

    .why-box{
        padding:30px 20px;
    }

    .why-box h5{
        font-size:19px;
    }

}


/*programs-section Responsive */
/*=========================================
        RESPONSIVE
=========================================*/

@media(max-width:991px){

    .programs-section .section-title h2{

        font-size:42px;

    }

    .program-content h3{

        font-size:24px;

    }

}

@media(max-width:767px){

    .programs-section{

        padding:70px 0;

    }

    .programs-section .section-title h2{

        font-size:34px;

    }

    .section-heading{

        font-size:20px;

    }

    .program-image{

        height:220px;

    }

    .program-content{

        padding:24px;

    }

    .program-content h3{

        font-size:22px;

    }

}

@media(max-width:991px){

.review-card{

flex-direction:column;

text-align:center;

}

.review-left{

margin:auto;

}

.review-stars{

justify-content:center;

}

}


@media(max-width:768px){

    .whatsapp-float{

        width:55px;

        height:55px;

        right:18px;

        bottom:18px;

        font-size:30px;

    }

}

/*=========================================
        FOOTER MOBILE
=========================================*/
/*=========================================
        FOOTER MOBILE
=========================================*/
/*=========================================
        1200px
=========================================*/

@media (max-width:1199px){

    .footer-about{
        max-width:100%;
        margin-bottom:20px;
    }

    .footer-widget{
        margin-bottom:20px;
    }

}


/*=========================================
        991px
=========================================*/

@media (max-width:991px){

    .footer-section{
        padding:70px 0 0;
    }

    .footer-about{
        text-align:center;
    }

    .footer-logo img{
        margin:auto;
    }

    .logo-tagline{
        justify-content:center;
    }

    .footer-about p{
        margin:0 auto 30px;
        max-width:600px;
    }

    .footer-social{
        justify-content:center;
        margin-bottom:20px;
    }

    .footer-widget{
        text-align:center;
    }

    .footer-contact li{
        justify-content:center;
    }

    .newsletter-text{
        max-width:500px;
        margin:0 auto 20px;
    }

}


/*=========================================
        767px
=========================================*/

@media (max-width:767px){

    .footer-section{

        padding:60px 0 0;

    }

    .footer-about{

        text-align:center;

    }

    .footer-logo img{

        width:220px;
        margin:auto;

    }

    .logo-tagline{

        justify-content:center;
        font-size:18px;

    }

    .footer-about p{

        font-size:15px;
        line-height:1.8;
        margin-bottom:25px;

    }

    .footer-social{

        justify-content:center;

    }

    .footer-social a{

        width:44px;
        height:44px;

    }

    .footer-widget{

        text-align:center;
        margin-top:15px;

    }

    .footer-widget h4{

        font-size:22px;

    }

    .footer-widget ul li{

        margin-bottom:12px;

    }

    .footer-contact li{

        justify-content:center;
        align-items:flex-start;

    }

    .newsletter-form{

        gap:15px;

    }

    .newsletter-form input{

        height:54px;

    }

    .newsletter-form button{

        height:54px;

    }

    .footer-bottom{

        margin-top:50px;

    }

    .footer-bottom-wrapper{

        flex-direction:column;
        gap:12px;
        text-align:center;

    }

    .footer-policy{

        justify-content:center;
        flex-wrap:wrap;

    }

}


/*=========================================
        575px
=========================================*/

@media (max-width:575px){

    .footer-section{

        text-align:center;

    }

    .footer-logo img{

        width:190px;

    }

    .logo-tagline{

        font-size:17px;

    }

    .footer-about p{

        font-size:14px;

    }

    .footer-widget h4{

        font-size:20px;

    }

    .footer-widget ul li a{

        font-size:15px;

    }

    .footer-contact span,
    .footer-contact a{

        font-size:15px;

    }

    .newsletter-text{

        font-size:14px;

    }

    .newsletter-form input{

        height:50px;
        font-size:14px;

    }

    .newsletter-form button{

        height:50px;
        font-size:15px;

    }

    .copyright{

        font-size:14px;

    }

    .footer-policy{

        gap:8px;

    }

    .footer-policy a{

        font-size:14px;

    }

}

@media(max-width:991px){

    .download-box{

        text-align:center;

    }

    .app-download-links{

        justify-content:center;

    }

}

/* ##############------------- About Page ----########### */
/*==========================
        1400px
==========================*/

@media(max-width:1399px){

    .about-hero-content h1{

        font-size:56px;

    }

}

/*==========================
        1200px
==========================*/

@media(max-width:1199px){

    .about-hero{

        padding:150px 0 90px;

    }

    .about-hero-content h1{

        font-size:50px;

    }

}

/*==========================
        991px
==========================*/

@media(max-width:991px){

    .about-hero{

        padding:130px 0 70px;

    }

    .about-hero-content{

        text-align:center;

        margin-bottom:50px;

    }

    .about-hero-content h1{

        font-size:42px;

    }

    .about-hero-content p{

        max-width:100%;

        margin:0 auto 35px;

    }

    .about-hero-image img{

        width:80%;

    }

}

/*==========================
        767px
==========================*/

@media(max-width:767px){

    .about-hero{

        padding:110px 0 60px;

    }

    .about-hero-content h1{

        font-size:32px;

        line-height:1.25;

    }

    .about-hero-content p{

        font-size:15px;

        line-height:1.8;

    }

    .about-hero-image img{

        width:100%;

        max-width:360px;

    }

}

/*==========================
        480px
==========================*/

@media(max-width:480px){

    .about-hero-content h1{

        font-size:28px;

    }

    .about-hero-content p{

        font-size:14px;

    }

}

/*=========================================
            OUR STORY
=========================================*/

/*==========================
        991px
==========================*/

@media(max-width:991px){

    .story-content{

        text-align:center;

    }

    .story-content h2{

        font-size:42px;

    }

    .story-highlight{

        text-align:left;

    }

}

/*==========================
        767px
==========================*/

@media(max-width:767px){

    .story-content h2{

        font-size:32px;

    }

    .story-content p{

        font-size:15px;

    }

    .story-highlight{

        flex-direction:column;

        text-align:center;

        align-items:center;

        padding:22px;

    }

}

/*==========================
        480px
==========================*/

@media(max-width:480px){

    .story-content h2{

        font-size:28px;

    }

    .story-content p{

        font-size:14px;

    }

}

/*=========================
        Tablet
=========================*/

@media(max-width:991px){

    .journey-wrapper{

        grid-template-columns:repeat(2,1fr);

        gap:35px;

    }

    .journey-line{

        display:none;

    }

    .journey-card{

        min-height:300px;

    }

}

/*=========================
        Mobile
=========================*/

@media(max-width:767px){

    .journey-wrapper{

        grid-template-columns:1fr;

        gap:25px;

    }

    .journey-card{

        min-height:auto;

        padding:30px 25px;

    }

    .journey-card h4{

        font-size:24px;

        min-height:auto;

    }

    .journey-card p{

        font-size:16px;

    }

}


/*=========================================
        MISSION & VISION
=========================================*/
/*==========================
        1400px
==========================*/

@media(max-width:1399px){

    .mv-box{

        padding:40px;

    }

}

/*==========================
        1200px
==========================*/

@media(max-width:1199px){

    .mv-wrapper{

        gap:25px;

    }

    .mv-box h3{

        font-size:26px;

    }

}

/*==========================
        991px
==========================*/

@media(max-width:991px){

    .mv-wrapper{

        grid-template-columns:1fr;

        gap:30px;

    }

    .mv-divider{

        display:none;

    }

    .mv-box{

        text-align:center;

    }

    .mv-icon{

        margin:0 auto 25px;

    }

}

/*==========================
        767px
==========================*/

@media(max-width:767px){

    .mv-wrapper{

        margin-top:40px;

    }

    .mv-box{

        padding:30px 25px;

    }

    .mv-icon{

        width:70px;

        height:70px;

        font-size:28px;

    }

    .mv-box h3{

        font-size:24px;

    }

    .mv-box p{

        font-size:15px;

        line-height:1.8;

    }

}

/*==========================
        480px
==========================*/

@media(max-width:480px){

    .mv-box{

        padding:25px 20px;

    }

    .mv-box h3{

        font-size:21px;

    }

    .mv-box p{

        font-size:14px;

    }

}

/* --------------------- */

/* Responsive */

@media(max-width:991px){

    .mv-card{

        padding:35px 30px;

    }

}

@media(max-width:767px){

    .mv-card{

        text-align:center;

    }

    .mv-card h3{

        font-size:28px;

    }

    .mv-card p{

        font-size:16px;

    }

}


/*=========================================
            OUR VALUES
=========================================*/


/*==========================
        1400px
==========================*/

@media (max-width:1399px){

    .value-box{

        padding:32px;

    }

    .value-box h3{

        font-size:24px;

    }

    .value-box p{

        font-size:15px;

    }

}


/*==========================
        1200px
==========================*/

@media (max-width:1199px){

    .value-box{

        padding:30px 28px;

    }

    .value-icon{

        width:70px;

        height:70px;

        font-size:28px;

    }

    .value-box h3{

        font-size:22px;

    }

}


/*==========================
        991px
==========================*/

@media (max-width:991px){

    .values-section{

        padding:80px 0;

    }

    .value-box{

        padding:28px 24px;

    }

    .value-icon{

        width:66px;

        height:66px;

        font-size:26px;

        margin-bottom:18px;

    }

    .value-box h3{

        font-size:21px;

        margin-bottom:14px;

    }

    .value-box p{

        font-size:15px;

        line-height:1.8;

    }

}


/*==========================
        767px
==========================*/

@media (max-width:767px){

    .values-section{

        padding:70px 0;

    }

    .value-box{

        padding:25px 20px;

        border-radius:18px;

    }

    .value-icon{

        width:60px;

        height:60px;

        font-size:24px;

        border-radius:16px;

        margin-bottom:18px;

    }

    .value-box h3{

        font-size:20px;

        margin-bottom:12px;

    }

    .value-box p{

        font-size:14px;

        line-height:1.8;

    }

}


/*==========================
        575px
==========================*/

@media (max-width:575px){

    .value-box{

        padding:22px 18px;

    }

    .value-icon{

        width:56px;

        height:56px;

        font-size:22px;

    }

    .value-box h3{

        font-size:18px;

        line-height:1.4;

    }

    .value-box p{

        font-size:13px;

        line-height:1.7;

    }

}


/*==========================
        480px
==========================*/

@media (max-width:480px){

    .values-section{

        padding:60px 0;

    }

    .value-box{

        padding:20px 16px;

    }

    .value-icon{

        width:52px;

        height:52px;

        font-size:20px;

        margin-bottom:16px;

    }

    .value-box h3{

        font-size:17px;

    }

    .value-box p{

        font-size:13px;

        line-height:1.7;

    }

}

@media(max-width:991px){

    .parents-content{

        text-align:center;

    }

    .parents-item{

        text-align:left;

    }

}

/*==============================
        TABLET
==============================*/

@media (max-width:991px){

    .cta-wrapper{
        padding:50px 35px;
        text-align:center;
        border-radius:28px;
    }

    .cta-content h2{
        font-size:40px;
    }

    .cta-content p{
        font-size:17px;
        margin:0 auto 30px;
    }

    .cta-buttons{
        justify-content:center;
        margin-bottom:35px;
    }

    .cta-badge{
        font-size:14px;
        padding:10px 18px;
    }

}

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

@media (max-width:767px){

    .cta-section{
        padding:15px 0;
    }

    .cta-wrapper{
        padding:30px 20px;
        border-radius:22px;
    }

    .cta-badge{
        width:100%;
        max-width:270px;
        margin:0 auto 20px;
        padding:10px 16px;
        font-size:13px;
        line-height:1.5;
        text-align:center;
    }

    .cta-content h2{
        font-size:28px;
        line-height:1.3;
        margin-bottom:18px;
    }

    .cta-content p{
        font-size:15px;
        line-height:1.7;
        margin-bottom:25px;
    }

    .cta-buttons{
        flex-direction:column;
        gap:12px;
        width:100%;
    }

    .theme-btn,
    .theme-btn-outline{
        width:100%;
        padding:14px 20px;
        text-align:center;
    }

    .cta-image{
        margin-top:30px;
    }

    .cta-image img{
        max-width:280px;
        width:100%;
    }

}

/* ###################------ Program Page --------############### */

/*=========================================
        Responsive
=========================================*/
/*==========================
        1400px
==========================*/

@media(max-width:1399px){

    .program-hero h1{

        font-size:58px;

    }

}


/*==========================
        1200px
==========================*/

@media(max-width:1199px){

    .program-hero{

        padding:150px 0 80px;

    }

    .program-hero h1{

        font-size:52px;

    }

}


/*==========================
        991px
==========================*/

@media(max-width:991px){

    .program-hero{

        padding:130px 0 70px;

        text-align:center;

    }

    .program-hero-content p{

        max-width:100%;

        margin:0 auto 35px;

    }

    .program-hero h1{

        font-size:44px;

    }

    .program-hero-buttons{

        justify-content:center;

    }

    .hero-mini-info{

        justify-content:center;

        gap:18px;

        margin-top:40px;

    }

    .hero-stat{

        min-width:170px;

    }

    .program-hero-image{

        margin-top:50px;

    }

}


/*==========================
        767px
==========================*/

@media(max-width:767px){

    .program-hero{

        padding:110px 0 60px;

    }

    .program-hero h1{

        font-size:34px;

        line-height:1.2;

    }

    .program-hero p{

        font-size:15px;

    }

    .program-hero-buttons{

        flex-direction:column;

        gap:15px;

    }

    .program-hero-buttons a{

        width:100%;

        justify-content:center;

    }

    .hero-mini-info{

        flex-direction:column;

        align-items:center;

        gap:15px;

    }

    .hero-stat{

        width:100%;

        max-width:260px;

        min-width:auto;

    }

}


/*==========================
        480px
==========================*/

@media(max-width:480px){

    .program-hero{

        padding:100px 0 55px;

    }

    .hero-tag{

        font-size:13px;

        padding:10px 18px;

    }

    .program-hero h1{

        font-size:29px;

    }

    .program-hero p{

        font-size:14px;

    }

    .hero-stat{

        padding:18px;

    }

    .hero-stat strong{

        font-size:28px;

    }

    .hero-stat span{

        font-size:14px;

    }

}

/*==========================
        991px
==========================*/

@media(max-width:991px){

    .journey-box{

        padding:28px 24px;

    }

}

/*==========================
        767px
==========================*/

@media(max-width:767px){

    .learning-path-section{

        padding:70px 0;

    }

    .journey-box{

        padding:25px 20px;

    }

    .journey-icon{

        width:60px;

        height:60px;

        font-size:24px;

    }

    .journey-box h3{

        font-size:24px;

    }

    .journey-box h4{

        font-size:17px;

    }

    .journey-box p{

        font-size:14px;

    }

    .program-features li{

        font-size:14px;

    }

}

/*==========================
        480px
==========================*/

@media(max-width:480px){

    .journey-box{

        padding:22px 18px;

    }

    .journey-box h3{

        font-size:22px;

    }

    .journey-box h4{

        font-size:16px;

    }

}

/* #################----- Parents Page ------ ############# */
/*=========================================
        1400px
=========================================*/

@media(max-width:1399px){

    .parents-content h1{

        font-size:56px;

    }

    .parents-image img{

        max-width:560px;

    }

}

/*=========================================
        1200px
=========================================*/

@media(max-width:1199px){

    .parents-hero{

        padding:150px 0 80px;

    }

    .parents-content{

        text-align:center;

        max-width:760px;

        margin:0 auto 50px;

    }

    .parents-content p{

        max-width:650px;

        margin:0 auto 35px;

    }

    .hero-buttons{

        justify-content:center;

    }

    .parent-features{

        max-width:720px;

        margin:40px auto 0;

    }

    .parents-image{

        text-align:center;

    }

    .floating-card{

        position:relative;

        display:inline-flex;

        margin:10px;

        left:auto !important;

        right:auto !important;

        top:auto !important;

        bottom:auto !important;

    }

}

/*=========================================
        991px
=========================================*/

@media(max-width:991px){

    .parents-hero{

        padding:130px 0 70px;

    }

    .parents-content{

        text-align:center;

        margin-bottom:50px;

    }

    .parents-content h1{

        font-size:46px;

    }

    .parents-content p{

        font-size:17px;

    }

    .hero-buttons{

        justify-content:center;

    }

    .parent-features{

        grid-template-columns:repeat(2,1fr);

        gap:16px;

    }

    .parent-features div{

        padding:16px 18px;

    }

    .parents-image img{

        max-width:550px;

    }

}

/*=========================================
        767px
=========================================*/

@media(max-width:767px){

    .parents-hero{

        padding:110px 0 60px;

    }

    .parents-content{

        text-align:center;

    }

    .parents-content h1{

        font-size:34px;

        line-height:1.2;

    }

    .parents-content p{

        font-size:15px;

        line-height:1.8;

    }

    .hero-buttons{

        flex-direction:column;

        gap:15px;

    }

    .hero-buttons .theme-btn,

    .hero-buttons .btn-yellow{

        width:100%;

        justify-content:center;

    }

    .parent-features{

        grid-template-columns:1fr;

        gap:15px;

        margin-top:35px;

    }

    .parent-features div{

        justify-content:flex-start;

    }

    .parents-image{

        margin-top:40px;

    }

    .parents-image img{

        max-width:340px;

    }

    .floating-card{

        width:100%;

        max-width:320px;

        margin:12px auto;

    }

}

/*=========================================
        480px
=========================================*/

@media(max-width:480px){

    .parents-content h1{

        font-size:28px;

    }

    .parents-content p{

        font-size:14px;

    }

    .hero-tag{

        font-size:13px;

        padding:10px 18px;

    }

    .parent-features div{

        padding:14px 16px;

        font-size:14px;

    }

    .parent-features i{

        width:38px;

        height:38px;

        font-size:16px;

    }

    .floating-card{

        padding:15px;

        gap:12px;

    }

    .floating-card i{

        width:45px;

        height:45px;

        font-size:18px;

    }

    .floating-card strong{

        font-size:15px;

    }

    .floating-card span{

        font-size:13px;

    }

}


/*=========================================
        991px
=========================================*/

@media(max-width:991px){

    .parent-program-card{

        padding:30px;

    }

    .parent-program-card h3{

        font-size:24px;

    }

}

/*=========================================
        767px
=========================================*/

@media(max-width:767px){

    .parent-programs{

        padding:70px 0;

    }

    .parent-program-card{

        text-align:center;

        padding:28px 22px;

    }

    .program-icon{

        margin:0 auto 20px;

    }

    .parent-program-card h3{

        font-size:22px;

    }

    .parent-program-card p{

        font-size:15px;

    }

}

/*=========================================
        480px
=========================================*/

@media(max-width:480px){

    .parent-program-card{

        padding:24px 18px;

        border-radius:20px;

    }

    .program-icon{

        width:65px;

        height:65px;

        font-size:26px;

    }

    .parent-program-card h3{

        font-size:20px;

    }

    .program-age{

        font-size:13px;

    }

}

@media(max-width:767px){

    .parent-programs .theme-btn{

        width:auto;

        min-width:220px;

    }

}

/*=========================================
        991px
=========================================*/

@media(max-width:991px){

    .feature-image{

        margin-bottom:50px;

    }

    .feature-list{

        padding-left:0;

    }

    .feature-list::before{

        display:none;

    }

}

/*=========================================
        767px
=========================================*/

@media(max-width:767px){

    .parent-features-section{

        padding:70px 0;

    }

    .feature-item{

        flex-direction:column;

        text-align:center;

        align-items:center;

        padding:22px;

    }

    .feature-item:hover{

        transform:translateY(-5px);

    }

    .feature-item h3{

        font-size:21px;

    }

    .feature-item p{

        font-size:15px;

    }

    .feature-image img{

        max-width:320px;

    }

}

/*=========================================
        480px
=========================================*/

@media(max-width:480px){

    .feature-item{

        padding:18px;

    }

    .parent-feature-icon{

        width:48px;

        height:48px;

        font-size:18px;

    }

    .feature-item h3{

        font-size:18px;

    }

    .feature-item p{

        font-size:14px;

    }

}


/* ###################------------------Student Page-------########### */
/*=========================================
        STUDENT PAGE RESPONSIVE
=========================================*/
/*=========================================
        1199px
=========================================*/

@media (max-width:1199px){

    .student-hero{

        padding:150px 0 80px;

    }

    .student-content{

        text-align:center;

        max-width:760px;

        margin:0 auto 60px;

    }

    .student-content p{

        margin:0 auto 40px;

    }

    .student-features{

        max-width:700px;

        margin:45px auto 0;

    }

    .student-image{

        max-width:600px;

        margin:auto;

    }

}

/*=========================================
        991px
=========================================*/

@media(max-width:991px){

    .student-hero{

        padding:130px 0 70px;

    }

    .student-content{

        text-align:center;

        margin-bottom:60px;

    }

    .student-content h1{

        font-size:48px;

    }

    .student-content p{

        font-size:17px;

        max-width:650px;

        margin:auto auto 35px;

    }

    .hero-buttons{

        justify-content:center;

    }

    .student-features{

        max-width:650px;

        margin:40px auto 0;

    }

    .student-image{

        max-width:520px;

        margin:auto;

    }

    .student-card{

        transform:scale(.9);

    }

    .student-program-card{

        padding:35px 30px;

    }

    .student-program-card h3{

        font-size:26px;

    }

    .student-program-card h4{

        font-size:20px;

    }

    .student-feature-card{

        padding:30px 25px;

    }

}

/*=========================================
        767px
=========================================*/

@media(max-width:767px){

    .student-hero{

        padding:110px 0 60px;

    }

    .student-content h1{

        font-size:36px;

        line-height:1.2;

    }

    .student-content p{

        font-size:16px;

        line-height:1.8;

    }

    .hero-buttons{

        flex-direction:column;

        gap:15px;

    }

    .hero-buttons .theme-btn,

    .hero-buttons .btn-yellow{

        width:100%;

        justify-content:center;

    }

    .student-features{

        grid-template-columns:1fr;

        gap:15px;

        margin-top:35px;

    }

    .student-features div{

        padding:16px 18px;

    }

    .student-image{

        margin-top:45px;

    }

    .student-image img{

        max-width:320px;

    }

    .student-card{

        position:relative;

        left:auto !important;

        right:auto !important;

        top:auto !important;

        bottom:auto !important;

        width:100%;

        max-width:320px;

        margin:18px auto 0;

        transform:none;

    }

    .student-program-card{

        padding:30px 25px;

    }

    .program-icon{

        width:70px;

        height:70px;

        font-size:28px;

        margin-bottom:22px;

    }

    .student-program-card h3{

        font-size:24px;

    }

    .student-program-card h4{

        font-size:19px;

    }

    .program-main-btn{

        width:100%;

        max-width:320px;

        height:55px;

        font-size:16px;

    }

    .student-feature-card{

        padding:28px 22px;

    }

    .feature-icon{

        width:65px;

        height:65px;

        font-size:26px;

    }

    .student-feature-card h3{

        font-size:22px;

    }

    .student-feature-card p{

        font-size:15px;

    }

}

/*=========================================
        480px
=========================================*/

@media(max-width:480px){

    .student-hero{

        padding:95px 0 50px;

    }

    .student-content h1{

        font-size:30px;

    }

    .student-content p{

        font-size:15px;

    }

    .student-features div{

        font-size:14px;

        padding:14px 16px;

    }

    .student-features i{

        width:40px;

        height:40px;

        font-size:16px;

    }

    .student-image img{

        max-width:260px;

    }

    .student-card{

        max-width:100%;

        padding:14px 16px;

    }

    .student-card i{

        width:46px;

        height:46px;

        font-size:18px;

    }

    .student-card strong{

        font-size:16px;

    }

    .student-card span{

        font-size:13px;

    }

    .student-program-card{

        padding:25px 20px;

    }

    .student-program-card h3{

        font-size:22px;

    }

    .student-program-card h4{

        font-size:18px;

    }

    .grade{

        font-size:13px;

    }

    .program-main-btn{

        max-width:280px;

        font-size:15px;

    }

    .student-feature-card{

        padding:25px 20px;

    }

    .feature-icon{

        width:60px;

        height:60px;

        font-size:24px;

    }

    .student-feature-card h3{

        font-size:20px;

    }

    .student-feature-card p{

        font-size:14px;

    }

}

/* ################----- Career Page-----------------################## */

/*=========================================
        CAREER HERO RESPONSIVE
=========================================*/

/*==============================
        1400px
==============================*/

@media (max-width:1399px){

    .career-hero{

        padding:150px 0 80px;

    }

    .career-hero-content h1{

        font-size:60px;

    }

    .career-hero-image img{

        max-width:500px;

    }

    .card-one{

        width:160px;

    }

    .card-one h2{

        font-size:46px;

    }

}

/*==============================
        1200px
==============================*/

@media (max-width:1199px){

    .career-hero{

        padding:140px 0 70px;

    }

    .career-hero-content{

        text-align:center;

        max-width:760px;

        margin:0 auto 60px;

    }

    .career-hero-content p{

        max-width:650px;

        margin:auto;

    }

    .career-features{

        justify-content:center;

    }

    .hero-buttons{

        justify-content:center;

    }

    .career-location-strip{

        justify-content:center;

    }

    .career-hero-image{

        max-width:600px;

        margin:auto;

    }

    .career-hero-image img{

        max-width:520px;

    }

}

/*==============================
        991px
==============================*/

@media (max-width:991px){

    .career-hero{

        padding:130px 0 60px;

    }

    .career-hero-content{

        text-align:center;

        margin-bottom:50px;

    }

    .career-hero-content h1{

        font-size:48px;

    }

    .career-subtitle{

        font-size:22px;

    }

    .career-hero-content p{

        font-size:17px;

    }

    .career-features{

        grid-template-columns:repeat(2,1fr);

    }

    .career-location-strip{

        justify-content:center;

    }

    .floating-card{

        transform:scale(.9);

    }

}

/*==============================
        767px
==============================*/

@media (max-width:767px){

    .career-hero{

        padding:110px 0 50px;

    }

    .career-badge{

        font-size:13px;

        padding:10px 18px;

    }

    .career-hero-content{

        text-align:center;

    }

    .career-hero-content h1{

        font-size:36px;

        line-height:1.15;

    }

    .career-subtitle{

        font-size:18px;

    }

    .career-hero-content p{

        font-size:15px;

        line-height:1.8;

    }

    .career-features{

        grid-template-columns:1fr;

        gap:14px;

        margin:30px 0;

    }

    .career-features div{

        justify-content:center;

    }

    .hero-buttons{

        flex-direction:column;

        gap:15px;

    }

    .hero-buttons .theme-btn,

    .hero-buttons .btn-yellow{

        width:100%;

        justify-content:center;

    }

    .career-location-strip{

        justify-content:center;

        gap:10px;

    }

    .career-location-strip div{

        font-size:14px;

        padding:10px 14px;

    }

    .career-hero-image{

        margin-top:40px;

    }

    .career-hero-image img{

        max-width:320px;

    }

    .floating-card{

        position:relative;

        left:auto !important;

        right:auto !important;

        top:auto !important;

        bottom:auto !important;

        width:100%;

        max-width:320px;

        margin:18px auto 0;

        display:flex;

        align-items:center;

        justify-content:center;

        gap:15px;

        transform:none;

    }

    .card-one{

        display:block;

        text-align:center;

    }

    .card-one h2{

        font-size:42px;

    }

}

/*==============================
        480px
==============================*/

@media (max-width:480px){

    .career-hero{

        padding:95px 0 45px;

    }

    .career-badge{

        font-size:12px;

    }

    .career-hero-content h1{

        font-size:30px;

    }

    .career-subtitle{

        font-size:16px;

    }

    .career-hero-content p{

        font-size:14px;

    }

    .career-location-strip{

        display:grid;

        grid-template-columns:1fr 1fr;

        gap:10px;

    }

    .career-location-strip div{

        width:100%;

        text-align:center;

        font-size:13px;

        padding:10px;

    }

    .career-hero-image img{

        max-width:260px;

    }

    .floating-card{

        max-width:100%;

        padding:16px;

    }

    .card-one h2{

        font-size:36px;

    }

    .card-two i,

    .card-three i{

        width:45px;

        height:45px;

        font-size:18px;

    }

}

/*=========================================
        WHY JOIN RESPONSIVE
=========================================*/

@media(max-width:991px){

    .career-card{

        padding:35px 25px;

    }

}

@media(max-width:767px){

    .career-card{

        padding:30px 20px;

    }

    .career-icon{

        width:75px;

        height:75px;

        font-size:28px;

        margin-bottom:20px;

    }

    .career-card h4{

        font-size:20px;

    }

    .career-card p{

        font-size:15px;

    }

}


/*=========================================
        SELECTION RESPONSIVE
=========================================*/

@media(max-width:991px){

    .selection-wrapper{

        grid-template-columns:repeat(2,1fr);

    }

    .selection-line{

        display:none;

    }

}

@media(max-width:767px){

    .selection-wrapper{

        grid-template-columns:1fr;

        gap:20px;

    }

    .selection-card{

        padding:30px 20px;

    }

    .step-icon{

        width:75px;

        height:75px;

        font-size:28px;

    }

    .selection-card h4{

        font-size:20px;

    }

    .selection-card p{

        font-size:15px;

    }

}


/* Tablet */
@media (max-width:991px){

    .selection-action .theme-btn{

        min-width:300px;
        padding:0 28px;
        font-size:16px;

    }

}

/* Mobile */
@media (max-width:767px){

    .selection-action{

        margin-top:40px;
        padding:0 15px;

    }

    .selection-action .theme-btn{

        width:100%;
        max-width:340px;
        min-width:unset;

        height:54px;

        padding:0 20px;

        font-size:15px;

        white-space:nowrap;
    }

}

/* Small Mobile */
@media (max-width:480px){

    .selection-action .theme-btn{

        max-width:300px;

        font-size:14px;

        padding:0 16px;

        gap:8px;

    }

}

/* ################----- Contact Page-----------------################## */
/*=========================================
        RESPONSIVE
=========================================*/

@media(max-width:991px){

    .contact-hero{

        padding:140px 0 70px;

    }

    .contact-hero-content h1{

        font-size:54px;

        letter-spacing:-1px;

    }

    .contact-hero-content p{

        font-size:18px;

    }

    .contact-info,

    .contact-form-box{

        padding:40px;

    }

}

@media(max-width:767px){

    .contact-hero{

        padding:120px 0 60px;

    }

    .contact-hero-content h1{

        font-size:42px;

        letter-spacing:0;

    }

    .contact-hero-content p{

        font-size:16px;

        line-height:1.8;

    }

    .hero-divider{

        width:70px;

        height:4px;

        margin-bottom:22px;

    }

    .contact-info,

    .contact-form-box{

        padding:30px 25px;

        border-radius:22px;

    }

    .contact-info h3,

    .contact-form-box h3{

        font-size:28px;

    }

    .contact-item{

        gap:15px;

        padding:18px 0;

    }

    .contact-icon{

        width:60px;

        height:60px;

        font-size:20px;

        border-radius:16px;

    }

    .contact-item h5{

        font-size:17px;

    }

    .contact-form-box .form-control{

        height:54px;

    }

    .contact-form-box textarea.form-control{

        height:160px;

    }

    .contact-form-box .theme-btn{

        height:56px;

        font-size:16px;

    }

}

@media(max-width:480px){

    .contact-hero{

        padding:105px 0 50px;

    }

    .contact-hero-content h1{

        font-size:34px;

    }

    .contact-info,

    .contact-form-box{

        padding:25px 20px;

    }

    .contact-info h3,

    .contact-form-box h3{

        font-size:24px;

    }

}




/* ====================== Program Detail Page ====================== */

/*==========================
        991px
==========================*/

@media(max-width:991px){

    .program-detail-hero{

        padding:130px 0 70px;

    }

    .program-detail-content{

        text-align:center;

        margin-bottom:50px;

    }

    .program-detail-content h1{

        font-size:46px;

    }

    .program-detail-content p{

        margin:0 auto 35px;

    }

    .hero-buttons{

        justify-content:center;

    }

    .program-info-card{

        position:relative;

        right:auto;

        bottom:auto;

        margin:30px auto 0;

    }

}

/*==========================
        767px
==========================*/

@media(max-width:767px){

    .program-detail-hero{

        padding:110px 0 60px;

    }

    .program-detail-content h1{

        font-size:34px;

    }

    .program-detail-content p{

        font-size:15px;

    }

    .hero-buttons{

        flex-direction:column;

    }

    .hero-buttons a{

        width:100%;

        justify-content:center;

    }

    .program-info-card{

        width:100%;

        max-width:320px;

    }

}

/*==========================
        480px
==========================*/

@media(max-width:480px){

    .program-detail-content h1{

        font-size:28px;

    }

    .program-detail-content p{

        font-size:14px;

    }

}


/*==============================
        991px
==============================*/

@media(max-width:991px){

    .feature-card{

        padding:30px;

    }

    .feature-card h3{

        font-size:24px;

    }

}

/*==============================
        767px
==============================*/

@media(max-width:767px){

    .program-features-section{

        padding:70px 0;

    }

    .feature-card{

        padding:25px;

        text-align:center;

    }

    .feature-icon{

        margin:0 auto 20px;

    }

    .feature-card h3{

        font-size:22px;

    }

    .feature-card p{

        font-size:15px;

    }

}

/*==============================
        480px
==============================*/

@media(max-width:480px){

    .feature-card{

        padding:22px 18px;

    }

    .feature-icon{

        width:60px;

        height:60px;

        font-size:24px;

    }

    .feature-card h3{

        font-size:20px;

    }

    .feature-card p{

        font-size:14px;

    }

}


/* =============== Register ================== */
@media(max-width:768px){

    .register-modal .modal-header,
    .register-modal .modal-body{
        padding:20px;
    }

    .register-modal h3{
        font-size:26px;
    }

}


/* =================== Comming Soon =================== */


@media(max-width:768px){

.coming-modal .modal-body{

padding:35px 20px;

}

.coming-modal h2{

font-size:34px;

}

.countdown{

grid-template-columns:repeat(2,1fr);

}

.launch-date{

font-size:15px;

padding:12px 18px;

}

}