/*==================================================
    RESPONSIVE CSS
    RENDUS Technologies
==================================================*/

/*==================================================
    LARGE DESKTOP
    1400px and Above
==================================================*/

@media (min-width:1400px){
    .container{
        max-width:1320px;
    }
}

/*==================================================
    LAPTOP
    992px - 1399px
==================================================*/

@media (max-width:1399px){
    .container{
        width:min(94%,1200px);
    }
    .hero-grid{
        grid-template-columns:55% 45%;
        gap:40px;
    }
    .hero h1{
        font-size:3.3rem;
    }
    .hero-card{
        width:420px;
    }
}

/*==================================================
    TABLET
    768px - 991px
==================================================*/

@media (max-width:991px){
    /*-------------------------
        Header
    --------------------------*/
    .menu-btn{
        display:block;
    }
    .nav-links{
        display:none;
        position:absolute;
        top:80px;
        left:0;
        width:100%;
        background:white;
        flex-direction:column;
        padding:25px;
        box-shadow:
            0 12px 30px rgba(0,0,0,.08);
    }
    .nav-links.active{
        display:flex;
    }
    /*-------------------------
        Hero
    --------------------------*/
    .hero{
        padding-top:120px;
    }
    .hero-grid{
        grid-template-columns:1fr;
        text-align:center;
        gap:60px;
    }
    .hero-content{
        align-items:center;
        text-align:center;
    }
    .hero-art{
        order:2;
    }
    .hero-card{
        width:100%;
        max-width:480px;
        min-height:auto;
        margin:auto;
    }
    .hero h1{
        font-size:3rem;
    }
    .hero p{
        max-width:700px;
    }
    .hero-buttons{
        justify-content:center;
    }
    .hero-stats{
        grid-template-columns:repeat(2,1fr);
    }
    /*-------------------------
        Courses
    --------------------------*/
    .courses{
        padding:110px 30px;
    }
    .course-grid{
        grid-template-columns:repeat(2,1fr);
        gap:25px;
    }
    .course-card{
        min-height:auto;
    }
}

/*==================================================
    MOBILE
    Below 768px
==================================================*/

@media (max-width:767px){
    /*-------------------------
        Header
    --------------------------*/
        .logo img{
        height:48px;
    }
    .menu-btn{
        font-size:2rem;
    }
    /*-------------------------
        Hero
    --------------------------*/
    .hero{
        padding-top:100px;
        min-height:auto;
    }
    .hero-grid{
        gap:40px;
    }
    .badge{
        font-size:.78rem;
        padding:10px 18px;
        white-space:normal;
        text-align:center;
        max-width:100%;
    }
    .hero h1{
        font-size:2.2rem;
        line-height:1.25;
    }
    .hero p{
        font-size:1rem;
        line-height:1.8;
    }
    .hero-buttons{
        flex-direction:column;
        width:100%;
        gap:15px;
    }
    .hero-buttons a{
        width:100%;
        text-align:center;
    }
    .hero-card{
        max-width:100%;
        padding:24px;
        border-radius:24px;
    }
        .hero-features{
        gap:10px;
    }
    .hero-features span{
        font-size:.85rem;
    }
    .hero-stats{
        grid-template-columns:repeat(2,1fr);
        gap:18px;
    }
    .stat h3{
        font-size:1.8rem;
    }
    .scroll-indicator{
        display:none;
    }
    /*-------------------------
        Courses
    --------------------------*/
    .courses{
        padding:90px 20px;
        border-radius:30px 30px 0 0;
    }
    .section-title{
        margin-bottom:50px;
    }
    .section-title h2{
        font-size:2rem;
        line-height:1.3;
    }
    .section-title p{
        font-size:1rem;
    }
    .course-grid{
        grid-template-columns:1fr;
        gap:24px;
    }
    .course-card{
        min-height:auto;
        padding:24px 20px;
    }
    .course-icon{
        width:72px;
        height:72px;
    }
    .course-icon img{
        width:56px;
        height:56px;
    }
    .course-meta{
        flex-direction:column;
        align-items:flex-start;
        gap:10px;
    }
    .tech-list{
        gap:8px;
    }
    .career-chip{
        font-size:.75rem;
    }
}
/*==================================================
    WHY RENDUS
    TABLET
==================================================*/

@media (max-width:991px){
    .why-rendus{
        padding:100px 0;
    }
    .why-rendus-grid{
        grid-template-columns:1fr;
        gap:60px;
    }
    .why-image{
        order:1;
    }
    .why-image img{
        max-width:520px;
        width:85%;
    }
    .why-features{
        order:2;
        gap:28px;
    }
    .feature-item{
        gap:18px;
        padding-bottom:24px;
    }
    .feature-item h3{
        font-size:1.25rem;
    }
    .feature-item p{
        font-size:.98rem;
        line-height:1.8;
    }
}
/*==================================================
    WHY RENDUS
==================================================*/

.why-rendus{
    padding:100px 0;
}

.why-rendus-grid{
    grid-template-columns:1fr;
    gap:60px;
}

.why-image{
    order:1;
    padding:20px;
}

.why-image::before{
    width:360px;
    height:360px;
}

.why-image img{
    max-width:420px;
    padding:34px;
}

.why-features{
    order:2;
    gap:24px;
}

.feature-item{
    padding:24px;
}

.feature-item img{
    width:68px;
    height:68px;
}

.feature-item h3{
    font-size:1.18rem;
}

.feature-item p{
    font-size:.96rem;
}
/*==================================================
    WHY RENDUS
    MOBILE
==================================================*/

@media (max-width:767px){
    .why-rendus{
        padding:80px 0;
    }
    .why-rendus::before{
        font-size:120px;
        top:40px;
        left:-10px;
    }
    .why-rendus-grid{
        grid-template-columns:1fr;
        gap:45px;
        margin-top:40px;
    }
    .why-image{
        text-align:center;
    }
    .why-image img{
        width:95%;
        max-width:340px;
    }
    .why-features{
        gap:22px;
    }
    .feature-item{
        gap:16px;
        padding-bottom:22px;
    }
    .feature-item img{
        width:56px;
        height:56px;
        padding:10px;
        border-radius:16px;
        flex-shrink:0;
    }
    .feature-item h3{
        font-size:1.08rem;
        margin-bottom:8px;
        line-height:1.35;
    }
    .feature-item p{
        font-size:.94rem;
        line-height:1.7;
        margin:0;
    }
    /*==================================================
    WHY RENDUS
==================================================*/
.why-rendus{
    padding:80px 0;
}
.why-rendus::before{
    font-size:120px;
    top:35px;
    left:-15px;
}
.why-rendus-grid{
    grid-template-columns:1fr;
    gap:40px;
    margin-top:40px;
}
.why-image{
    padding:10px;
}
.why-image::before{
    width:280px;
    height:280px;
}
.why-image img{
    width:100%;
    max-width:320px;
    padding:24px;
    border-radius:24px;
}
.why-features{
    gap:18px;
}
.feature-item{
    flex-direction:column;
    align-items:center;
    text-align:center;
    gap:18px;
    padding:22px;
    border-radius:22px;
}
.feature-item img{
    width:72px;
    height:72px;
}
.feature-item h3{
    font-size:1.08rem;
    margin-bottom:8px;
}
.feature-item p{
    margin:0;
    font-size:.92rem;
    line-height:1.7;
}
}

/*==================================================
    CORPORATE TRAINING
    TABLET
==================================================*/

@media (max-width:991px){
    .corporate-training{
        padding:100px 0;
    }
    .corporate-grid{
        grid-template-columns:1fr;
        gap:60px;
        margin-top:60px;
    }
    .corporate-image{
        order:1;
        text-align:center;
    }
    .corporate-image img{
        width:85%;
        max-width:500px;
    }
    .corporate-content{
        order:2;
    }
}

@media (max-width:991px){
    .corporate-stats{
        display:grid;
        grid-template-columns:repeat(2,1fr);
        gap:25px;
        padding:35px;
    }
    .divider{
        display:none;
    }
    .stat-column{
        padding:20px;
    }
}

@media (max-width:991px){
    .corporate-cta{
        flex-direction:column;
        text-align:center;
        padding:55px 40px;
        gap:35px;
    }
    .cta-content p{
        max-width:650px;
        margin:auto;
    }
}

@media (max-width:991px){
    .corporate-item{
        padding-left:34px;
    }
    .corporate-item h3{
        font-size:1.25rem;
    }
}
/*==================================================
    CORPORATE TRAINING
    MOBILE
==================================================*/

@media (max-width:768px){
    .corporate-training{
        padding:80px 0;
    }
    .corporate-grid{
        grid-template-columns:1fr;
        gap:45px;
        margin-top:45px;
    }
    .corporate-image{
        text-align:center;
    }
    .corporate-image img{
        width:100%;
        max-width:320px;
        padding:28px;
        border-radius:28px;
    }
}
@media (max-width:768px){
    .corporate-content{
        gap:28px;
    }
    .corporate-content::before{
        left:7px;
    }
    .corporate-item{
        padding-left:30px;
    }
    .corporate-item::before{
        width:16px;
        height:16px;
        border:3px solid #2563eb;
    }
    .corporate-item h3{
        font-size:1.15rem;
        margin-bottom:8px;
    }
    .corporate-item p{
        font-size:.95rem;
        line-height:1.7;
    }
}
@media (max-width:768px){
    .corporate-stats{
        display:flex;
        flex-direction:column;
        gap:30px;
        padding:35px 25px;
        margin-top:60px;
    }
    .divider{
        display:none;
    }
    .stat-column{
        padding:0;
    }
    .stat-column h3{
        font-size:2.2rem;
    }
    .stat-column span{
        font-size:.95rem;
    }
}
@media (max-width:768px){
    .corporate-cta{
        flex-direction:column;
        text-align:center;
        gap:30px;
        padding:45px 25px;
        border-radius:24px;
    }
    .cta-content h3{
        font-size:1.8rem;
        line-height:1.3;
    }
    .cta-content p{
        font-size:1rem;
        margin-top:12px;
    }
    .corporate-cta .btn{
        width:100%;
        max-width:300px;
        margin:auto;
        padding:18px 28px;
    }
}
@media (max-width:480px){
    .corporate-training{
        padding:65px 0;
    }
    .corporate-image img{
        max-width:260px;
        padding:22px;
    }
    .corporate-item{
        padding-left:26px;
    }
    .corporate-item h3{
        font-size:1.05rem;
    }
    .corporate-item p{
        font-size:.9rem;
    }
    .stat-column h3{
        font-size:2rem;
    }
    .cta-content h3{
        font-size:1.5rem;
    }
    .corporate-cta{
        padding:40px 20px;
    }
}

.alumni-banner{
    padding:40px 25px;
}

.banner-title h2{
    font-size:1.6rem;
}

.banner-title p{
    font-size:.95rem;
}

.company-list{
    gap:12px;
}

.company-list span{
    font-size:.9rem;
}

.role-list{
    gap:10px;
}

.success-cta{
    padding:55px 25px;
}

.success-cta h2{
    font-size:2rem;
}

.cta-buttons{
    flex-direction:column;
}

.cta-buttons .btn{
    width:100%;
}

/*=====================================
    SUCCESS STORIES - TABLET
======================================*/

@media (max-width:992px){
    .testimonial-wall{
        grid-template-columns:1fr 1fr;
        gap:25px;
    }
    .quote,
    .journey,
    .standard,
    .featured:last-child{
        margin-top:0;
    }
    .testimonial-card{
        min-height:auto;
    }
    .featured{
        min-height:420px;
    }
    .journey{
        min-height:520px;
    }
}

/*=====================================
    SUCCESS STORIES - MOBILE
======================================*/

@media (max-width:768px){
    .success-stories{
        padding:80px 0;
    }
    .testimonial-wall{
        grid-template-columns:1fr;
        gap:25px;
    }
    .testimonial-card{
        margin-top:0 !important;
        min-height:auto;
        padding:30px;
    }
}
@media (max-width:768px){
    .alumni-banner{
        padding:40px 25px;
        border-radius:24px;
    }
    .banner-title h2{
        font-size:1.7rem;
    }
    .banner-title p{
        font-size:.95rem;
    }
    .company-list{
        gap:10px;
    }
    .company-list span{
        font-size:.85rem;
        padding:8px 14px;
    }
    .role-list{
        gap:10px;
    }
    .role-list span{
        font-size:.82rem;
        padding:7px 14px;
    }
}
@media (max-width:768px){
    .success-cta{
        padding:50px 25px;
        border-radius:24px;
    }
    .success-cta h2{
        font-size:2rem;
        line-height:1.3;
    }
    .success-cta p{
        font-size:.95rem;
    }
    .cta-buttons{
        flex-direction:column;
        gap:15px;
    }
    .cta-buttons .btn{
        width:100%;
    }
}
/*=====================================
    SUCCESS STORIES - SMALL MOBILE
======================================*/

@media (max-width:480px){
    .success-stories{
        padding:70px 0;
    }
    .testimonial-card{
        padding:25px;
    }
    .alumni-avatar{
        width:55px;
        height:55px;
        font-size:1rem;
    }
    .quote-icon{
        font-size:4rem;
    }
    .journey-title{
        font-size:1.2rem;
    }
    .step-icon{
        width:55px;
        height:55px;
        font-size:1.4rem;
    }
    .banner-title h2{
        font-size:1.5rem;
    }
    .success-cta h2{
        font-size:1.8rem;
    }
}

/* =====================================================
   CONTACT
===================================================== */

@media (max-width:992px){
    .contact-wrapper{
        grid-template-columns:1fr;
        gap:30px;
    }
    .contact-card{
        padding:34px;
    }
}

@media (max-width:768px){
    .contact{
        padding:90px 0;
    }
    .contact-wrapper{
        margin-top:50px;
    }
    .contact-card{
        padding:28px;
        border-radius:24px;
    }
    .contact-card h3{
        font-size:1.4rem;
    }
    .contact-item{
        gap:16px;
    }
    .contact-icon{
        width:54px;
        height:54px;
    }
    .contact-icon img{
        width:24px;
        height:24px;
    }
}

@media (max-width:576px){
    .contact-card{
        padding:24px;
    }
    .contact-item{
        align-items:center;
    }
}

/*==================================================
    PREMIUM FOOTER
    TABLET
==================================================*/

@media (max-width:991px){
    .footer{
        margin-top:90px;
    }
    .footer .container{
        padding:70px 0 35px;
    }
    .footer-grid{
        grid-template-columns:repeat(2,1fr);
        gap:45px;
        padding-bottom:45px;
    }
    .footer-brand{
        grid-column:1/-1;
        text-align:center;
    }
    .footer-brand img{
        margin:auto auto 20px;
    }
    .footer-brand p{
        max-width:650px;
        margin:auto;
    }
    .footer-column{
        text-align:left;
    }
    .footer-social{
        padding:40px 0;
    }
    .social-icons{
        gap:16px;
    }
    .footer-trust{
        grid-template-columns:repeat(2,1fr);
        gap:18px;
        padding:40px 0;
    }
    .footer-bottom{
        flex-direction:column;
        text-align:center;
        gap:18px;
    }
    .footer-policy{
        justify-content:center;
        flex-wrap:wrap;
        gap:18px;
    }
}

/*==================================================
    PREMIUM FOOTER
    MOBILE
==================================================*/

@media (max-width:767px){
    .footer{
        margin-top:70px;
    }
    .footer .container{
        padding:60px 0 30px;
    }
    .footer-grid{
        grid-template-columns:1fr;
        gap:40px;
        padding-bottom:35px;
    }
    .footer-brand{
        text-align:center;
    }
    .footer-brand img{
        height:50px;
        margin:auto auto 18px;
    }
    .footer-tagline{
        font-size:1.05rem;
    }
    .footer-brand p{
        font-size:.95rem;
        line-height:1.8;
    }
    .footer-column{
        text-align:center;
    }
    .footer-column h3{
        margin-bottom:24px;
    }
    .footer-column h3::after{
        left:50%;
        transform:translateX(-50%);
    }
    .footer-column ul{
        padding:0;
    }
    .footer-column li{
        margin-bottom:14px;
    }
    .footer-column a{
        justify-content:center;
    }
    .footer-contact li{
        justify-content:center;
        text-align:center;
        flex-direction:column;
        align-items:center;
        gap:8px;
    }
    .footer-contact span{
        width:auto;
        font-size:1.3rem;
    }
    .footer-social{
        padding:35px 0;
    }
    .social-icons{
        gap:14px;
    }
    .social-icons a{
        width:48px;
        height:48px;
    }
    .social-icons img{
        width:22px;
        height:22px;
    }
    .footer-trust{
        grid-template-columns:1fr;
        gap:15px;
        padding:35px 0;
    }
    .footer-trust div{
        padding:16px;
        font-size:.92rem;
    }
    .footer-bottom{
        flex-direction:column;
        gap:16px;
        text-align:center;
        font-size:.85rem;
        padding-top:28px;
    }
    .footer-policy{
        flex-direction:column;
        gap:12px;
    }
}

/*==================================================
    EXTRA SMALL DEVICES
==================================================*/

@media (max-width:480px){
    .footer .container{
        width:92%;
    }
    .footer-grid{
        gap:34px;
    }
    .footer-brand img{
        height:46px;
    }
    .footer-tagline{
        font-size:1rem;
    }
    .footer-brand p{
        font-size:.9rem;
    }
    .footer-column h3{
        font-size:1.05rem;
    }
    .footer-column li{
        font-size:.92rem;
    }
    .social-icons{
        gap:12px;
    }
    .social-icons a{
        width:44px;
        height:44px;
    }
    .social-icons img{
        width:20px;
        height:20px;
    }
    .footer-trust div{
        font-size:.88rem;
        padding:14px;
    }
}

@media(max-width:767px){
    .back-to-top{
        width:50px;
        height:50px;
        right:18px;
        bottom:82px;
    }
}

/* ===========================
   404 PAGE
=========================== */

@media(max-width:768px){

.error-container{

    grid-template-columns:1fr;

    text-align:center;

    gap:40px;

}

.error-content p{

    margin:auto;

}

.error-buttons{

    justify-content:center;

}

.error-code{

    font-size:6rem;

}

.error-content h1{

    font-size:2.2rem;

}

.error-illustration{

    order:-1;

}

}