/*===========================================
        LARGE LAPTOP
===========================================*/

@media(max-width:1400px){

    .container{
    
        width:95%;
    
    }
    
    .hero-left h1{
    
        font-size:56px;
    
    }
    
    .hero-wrapper{
    
        gap:50px;
    
    }
    
    }
    
    /*===========================================
            LAPTOP
    ===========================================*/
    
    @media(max-width:1200px){
    
    .hero-left h1{
    
        font-size:48px;
    
    }
    
    .hero-left p{
    
        font-size:17px;
    
    }
    
    .clients-grid{
    
        grid-template-columns:repeat(4,1fr);
    
    }
    
    .hero-card{
    
        max-width:450px;
    
    }
    
    }
    
    /*===========================================
            TABLET
    ===========================================*/
    
    @media(max-width:992px){
    
    .nav-links{
    
        position:fixed;
    
        top:85px;
    
        left:-100%;
    
        width:100%;
    
        background:#081226;
    
        flex-direction:column;
    
        padding:40px;
    
        gap:30px;
    
        transition:.4s;
    
        border-top:1px solid rgba(255,255,255,.08);
    
    }
    
    .nav-links.active{
    
        left:0;
    
    }
    
    .menu-toggle{
    
        display:block;
    
    }
    
    .quote-btn{
    
        display:none;
    
    }
    
    .hero{
    
        padding-top:140px;
    
    }
    
    .hero-wrapper{
    
        grid-template-columns:1fr;
    
        text-align:center;
    
    }
    
    .hero-buttons{
    
        justify-content:center;
    
    }
    
    .hero-left p{
    
        margin:auto;
    
        margin-bottom:35px;
    
    }
    
    .hero-right{
    
        margin-top:50px;
    
    }
    
    .hero-card{
    
        max-width:650px;
    
    }
    
    .hero-stats{
    
        justify-content:center;
    
    }
    
    .clients-grid{
    
        grid-template-columns:repeat(3,1fr);
    
    }
    
    }
    
    /*===========================================
            MOBILE
    ===========================================*/
    
    @media(max-width:768px){
    
    .logo-text h2{
    
        font-size:20px;
    
    }
    
    .hero-left h1{
    
        font-size:38px;
    
        line-height:1.3;
    
    }
    
    .hero-left p{
    
        font-size:16px;
    
    }
    
    .hero-buttons{
    
        flex-direction:column;
    
        align-items:center;
    
    }
    
    .btn-primary,
    .btn-secondary{
    
        width:260px;
    
        text-align:center;
    
    }
    
    .hero-card{
    
        padding:25px;
    
    }
    
    .service-item{
    
        padding:15px;
    
    }
    
    .service-item i{
    
        width:50px;
    
        height:50px;
    
        font-size:20px;
    
    }
    
    .hero-stats{
    
        flex-direction:column;
    
    }
    
    .stat{
    
        width:100%;
    
    }
    
    .clients-grid{
    
        grid-template-columns:repeat(2,1fr);
    
    }
    
    .clients-grid div{
    
        font-size:16px;
    
        height:80px;
    
    }
    
    section h2{
    
        font-size:34px;
    
    }
    
    }
    
    /*===========================================
            SMALL MOBILE
    ===========================================*/
    
    @media(max-width:576px){
    
    .navbar{
    
        padding:15px 0;
    
    }
    
    .hero{
    
        padding-top:120px;
    
    }
    
    .hero-left h1{
    
        font-size:32px;
    
    }
    
    .hero-badge{
    
        font-size:12px;
    
    }
    
    .hero-left p{
    
        font-size:15px;
    
    }
    
    .hero-card{
    
        padding:20px;
    
    }
    
    .card-header{
    
        font-size:16px;
    
    }
    
    .service-item{
    
        flex-direction:column;
    
        text-align:center;
    
    }
    
    .service-item h4{
    
        font-size:17px;
    
    }
    
    .service-item small{
    
        font-size:13px;
    
    }
    
    .clients-grid{
    
        grid-template-columns:1fr;
    
    }
    
    .clients-grid div{
    
        height:70px;
    
    }
    
    .scroll-down{
    
        display:none;
    
    }
    
    }
    
    /*===========================================
            EXTRA SMALL
    ===========================================*/
    
    @media(max-width:400px){
    
    .hero-left h1{
    
        font-size:28px;
    
    }
    
    .logo-icon{
    
        width:48px;
    
        height:48px;
    
    }
    
    .logo-text h2{
    
        font-size:18px;
    
    }
    
    .hero-buttons a{
    
        width:100%;
    
    }
    
    }

    /* WHY SECTION */

@media(max-width:992px){

    .why-wrapper{
    
        grid-template-columns:1fr;
    
    }
    
    }
    
    @media(max-width:768px){
    
    .why-grid{
    
        grid-template-columns:1fr;
    
    }
    
    .why-content h2{
    
        font-size:36px;
    
    }
    
    .experience-box{
    
        flex-direction:column;
    
        text-align:center;
    
    }
    
    }

    /* ABOUT */

@media(max-width:992px){

    .about-wrapper{
    
    grid-template-columns:1fr;
    
    }
    
    .about-images{
    
    order:2;
    
    }
    
    .about-content{
    
    order:1;
    
    }
    
    }
    
    @media(max-width:768px){
    
    .about-content h2{
    
    font-size:36px;
    
    }
    
    .experience-tag{
    
    position:relative;
    
    left:0;
    
    top:0;
    
    display:inline-block;
    
    margin-bottom:20px;
    
    }
    
    .floating-card{
    
    right:20px;
    
    bottom:20px;
    
    }
    
    }