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


@media(max-width:1100px){



    .container{
    
        max-width:100%;
    
    }
    
    
    
    
    
    /* HEADER */
    
    
    .desktop-nav{
    
        display:none;
    
    }
    
    
    
    .header-actions{
    
        display:none;
    
    }
    
    
    
    .mobile-toggle{
    
        display:block;
    
    }
    
    
    
    
    
    
    /* HERO */
    
    
    .hero-container{
    
        grid-template-columns:1fr;
    
        text-align:center;
    
    }
    
    
    
    .hero-left p{
    
        margin-left:auto;
    
        margin-right:auto;
    
    }
    
    
    
    .hero-buttons{
    
        justify-content:center;
    
    }
    
    
    
    .hero-stats{
    
        justify-content:center;
    
    }
    
    
    
    .hero-right{
    
        height:550px;
    
        margin-top:30px;
    
    }
    
    
    
    .hero-technician{
    
        width:70%;
    
        right:15%;
    
    }
    
    
    
    .card-top{
    
        left:10%;
    
    }
    
    
    
    .card-middle{
    
        right:5%;
    
    }
    
    
    
    .card-bottom{
    
        left:15%;
    
    }
    
    
    
    
    
    
    /* QUICK SERVICE */
    
    
    .quick-wrapper{
    
        grid-template-columns:1fr;
    
    }
    
    
    
    .quick-content{
    
        text-align:center;
    
    }
    
    
    
    .quick-features{
    
        align-items:center;
    
    }
    
    
    
    .quick-form-box{
    
        max-width:550px;
    
        margin:auto;
    
    }
    
    
    
    
    
    
    /* SERVICES */
    
    
    .services-grid{
    
        grid-template-columns:
        repeat(2,1fr);
    
    }
    
    
    
    
    
    
    /* WHY */
    
    
    .why-wrapper{
    
        grid-template-columns:1fr;
    
    }
    
    
    
    .why-left{
    
        text-align:center;
    
    }
    
    
    
    .why-button{
    
        justify-content:center;
    
    }
    
    
    
    
    
    
    /* ABOUT */
    
    
    .about-wrapper{
    
        grid-template-columns:1fr;
    
    }
    
    
    
    .about-image{
    
        max-width:700px;
    
        margin:auto;
    
    }
    
    
    
    .about-content{
    
        text-align:center;
    
    }
    
    
    
    .about-list{
    
        max-width:500px;
    
        margin:30px auto;
    
    }
    
    
    
    
    
    
    /* CONTACT */
    
    
    .contact-wrapper{
    
        grid-template-columns:1fr;
    
    }
    
    
    
    
    
    
    /* FOOTER */
    
    
    .footer-grid{
    
        grid-template-columns:
        repeat(2,1fr);
    
    }
    
    
    
    }
    

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


@media(max-width:768px){



    .container{
    
        padding-left:15px;
    
        padding-right:15px;
    
    }
    
    
    
    
    
    /* HEADER */
    
    
    .header-container{
    
        height:75px;
    
    }
    
    
    
    .logo img{
    
        width:150px;
    
    }
    
    
    
    
    
    /* HERO */
    
    
    .hero{
    
        min-height:auto;
    
    }
    
    
    
    .hero-container{
    
        padding-top:30px;
    
        padding-bottom:40px;
    
    }
    
    
    
    .hero-left h1{
    
        font-size:38px;
    
        letter-spacing:-.5px;
    
    }
    
    
    
    .hero-left p{
    
        font-size:16px;
    
    }
    
    
    
    .hero-buttons{
    
        flex-direction:column;
    
        width:100%;
    
    }
    
    
    
    .hero-call,
    .hero-outline{
    
        width:100%;
    
    }
    
    
    
    .hero-stats{
    
        flex-direction:column;
    
        gap:20px;
    
    }
    
    
    
    .stat strong{
    
        font-size:25px;
    
    }
    
    
    
    
    
    
    .hero-right{
    
        height:420px;
    
    }
    
    
    
    .hero-technician{
    
        width:100%;
    
        right:0;
    
    }
    
    
    
    .glass-card{
    
        padding:12px 15px;
    
    }
    
    
    
    .glass-card h4{
    
        font-size:13px;
    
    }
    
    
    
    .glass-card p{
    
        font-size:11px;
    
    }
    
    
    
    .card-top{
    
        top:10px;
    
        left:0;
    
    }
    
    
    
    .card-middle{
    
        top:160px;
    
        right:0;
    
    }
    
    
    
    .card-bottom{
    
        bottom:20px;
    
        left:0;
    
    }
    
    
    
    
    
    
    /* SECTION HEADINGS */
    
    
    .quick-content h2,
    .section-header h2,
    .why-left h2,
    .about-content h2,
    .contact-info h2{
    
        font-size:32px;
    
    }
    
    
    
    
    
    
    /* QUICK FORM */
    
    
    .quick-service,
    .services,
    .brands,
    .why-us,
    .about,
    .testimonials,
    .contact{
    
        padding:60px 0;
    
    }
    
    
    
    .quick-form-box{
    
        padding:25px 20px;
    
    }
    
    
    
    
    
    
    /* SERVICES */
    
    
    .services-grid{
    
        grid-template-columns:1fr;
    
    }
    
    
    
    .service-card{
    
        padding:25px;
    
    }
    
    
    
    
    
    
    
    /* BRANDS */
    
    
    .brands-grid{
    
        grid-template-columns:
        repeat(2,1fr);
    
        gap:15px;
    
    }
    
    
    
    .brand-box{
    
        height:90px;
    
        padding:15px;
    
    }
    
    
    
    .brand-box img{
    
        max-width:100px;
    
    }
    
    
    
    
    
    
    /* STATS */
    
    
    .stats-section{
    
        padding:50px 0;
    
    }
    
    
    
    .stats-box{
    
        grid-template-columns:1fr;
    
        padding:35px 20px;
    
    }
    
    
    
    .counter strong{
    
        font-size:36px;
    
    }
    
    
    
    
    
    
    /* ABOUT */
    
    
    .about-image img{
    
        height:350px;
    
    }
    
    
    
    .about-experience{
    
        right:15px;
    
        bottom:15px;
    
        padding:15px 20px;
    
    }
    
    
    
    .about-experience strong{
    
        font-size:32px;
    
    }
    
    
    
    .about-list{
    
        grid-template-columns:1fr;
    
        text-align:left;
    
    }
    
    
    
    
    
    
    /* TESTIMONIAL */
    
    
    .testimonial-grid{
    
        grid-template-columns:1fr;
    
    }
    
    
    
    .testimonial-card{
    
        padding:25px;
    
    }
    
    
    
    
    
    
    
    /* CONTACT */
    
    
    .form-row{
    
        grid-template-columns:1fr;
    
    }
    
    
    
    .contact-form-box{
    
        padding:25px 20px;
    
    }
    
    
    
    .contact-form-box h3{
    
        font-size:22px;
    
    }
    
    
    
    
    
    
    /* FOOTER */
    
    
    .footer{
    
        padding-top:60px;
    
    }
    
    
    
    .footer-grid{
    
        grid-template-columns:1fr;
    
        text-align:center;
    
    }
    
    
    
    .footer-social{
    
        justify-content:center;
    
    }
    
    
    
    
    
    /* FLOATING BUTTON */
    
    
    .floating-call,
    .floating-whatsapp{
    
        width:55px;
    
        height:55px;
    
        right:15px;
    
    }
    
    
    
    .floating-call{
    
        bottom:85px;
    
    }
    
    
    
    .floating-whatsapp{
    
        bottom:20px;
    
    }
    
    
    
    #scrollTop{
    
        display:none;
    
    }
    
    
    
    }
    

/* ========================================
   SMALL MOBILE DEVICES
======================================== */


@media(max-width:480px){



    .container{
    
        padding-left:12px;
    
        padding-right:12px;
    
    }
    
    
    
    
    /* HEADER */
    
    
    .logo img{
    
        width:135px;
    
    }
    
    
    
    .mobile-toggle{
    
        width:40px;
    
    }
    
    
    
    
    
    
    /* HERO */
    
    
    .hero-left h1{
    
        font-size:32px;
    
    }
    
    
    
    .hero-badge{
    
        font-size:12px;
    
        padding:8px 14px;
    
    }
    
    
    
    .hero-left p{
    
        font-size:15px;
    
    }
    
    
    
    .hero-right{
    
        height:360px;
    
    }
    
    
    
    
    
    .glass-card{
    
        transform:scale(.85);
    
    }
    
    
    
    .card-top{
    
        left:-20px;
    
    }
    
    
    
    .card-middle{
    
        right:-25px;
    
    }
    
    
    
    .card-bottom{
    
        left:-20px;
    
    }
    
    
    
    
    
    
    /* QUICK FEATURES */
    
    
    .quick-feature{
    
        text-align:left;
    
    }
    
    
    
    .quick-feature i{
    
        width:45px;
    
        height:45px;
    
        font-size:18px;
    
    }
    
    
    
    
    
    
    /* FORM */
    
    
    .input-icon input,
    .input-icon select{
    
        height:48px;
    
    }
    
    
    
    .form-submit{
    
        height:50px;
    
    }
    
    
    
    
    
    
    
    /* SERVICES */
    
    
    .service-icon{
    
        width:60px;
    
        height:60px;
    
        font-size:24px;
    
    }
    
    
    
    .service-card h3{
    
        font-size:20px;
    
    }
    
    
    
    
    
    
    /* BRANDS */
    
    
    .brands-grid{
    
        grid-template-columns:1fr;
    
    }
    
    
    
    .brand-box{
    
        height:100px;
    
    }
    
    
    
    
    
    
    /* STATS */
    
    
    .stats-box{
    
        border-radius:20px;
    
    }
    
    
    
    .counter strong{
    
        font-size:32px;
    
    }
    
    
    
    .counter span{
    
        font-size:28px;
    
    }
    
    
    
    
    
    
    /* ABOUT */
    
    
    .about-image img{
    
        height:280px;
    
    }
    
    
    
    .about-experience{
    
        width:170px;
    
    }
    
    
    
    .about-experience span{
    
        font-size:13px;
    
    }
    
    
    
    
    
    
    /* CONTACT */
    
    
    .contact-item{
    
        align-items:flex-start;
    
    }
    
    
    
    .contact-icon{
    
        width:50px;
    
        height:50px;
    
    }
    
    
    
    .contact-item a,
    .contact-item strong{
    
        font-size:16px;
    
    }
    
    
    
    
    
    
    /* FLOAT BUTTONS */
    
    
    .floating-call,
    .floating-whatsapp{
    
        width:52px;
    
        height:52px;
    
        font-size:22px;
    
    }
    
    
    
    }