@media (max-width: 1500px) {

    /* homepage start */

    .hero-section .slide-1 h1{

        width: 100%;

    }

    /* .hero-section img{

        width: 600px;

    } */

   

    .long-slide .left-section{

        gap: 40px;

    }

    .maintenance-section .image-conatiner{

        width: 500px;

    }
    
    .projects-three-cards .project-card .project-category{
        padding: 2px;
        width: 80px;
        font-size: 12px;
    }
    .projects-three-cards .project-card .project-categories a{
        color: white;
        display:flex;
        gap:10px;
        font-size:12px;
        align-items: center;
    }
    .projects-three-cards .project-card .project-categories a img{
        height:11px;
        width:11px;
    }


}

@media (max-width: 1400px) {

    .projects-three-cards .project-card .project-title{
        font-size: 24px;
    }
    
}

@media (max-width: 1300px) {

    /* .hero-section .image-container{

        width: 800px;

    } */



    .homepage .projects .intro{

        padding: 0 100px;

    }
    .maintenance-section .image-conatiner{
        width: 400px;
    }


}



   

@media (max-width: 1200px) {
     .homepage h2{
        font-size: 56px;
    }
    .homepage .about-section{
        padding-inline:50px;
    }
    .homepage p.l-text{
        font-size: 20px;
    }
    .homepage .about-section .logo-shaped-images .image-container,
    .homepage .about-section .logo-shaped-images .image-container:nth-child(4){
        width:200px;
    }
  
}
@media (max-width: 1100px) {

    header .menu{

        display: none;

    }
    
   .projects-three-cards-container{
        gap:50px;
    }
    .projects-three-cards{
        flex-wrap: wrap;
        align-items:center;
        justify-content: space-evenly;
        gap:40px;
    }
    
    .projects-three-cards .project-card {
        width:350px;
    }
    
    .projects-three-cards .project-card .project-title{
        font-size: 20px;
    }

 .container{

    padding: 100px 10% 100px 10%;

    margin-inline:auto;

  }



  .hero-section .image-container{

    width: 600px;

    right: 10px;

  }



  .hero-section{

    padding: 100px 50px;

    height: calc(100vh - 125px) ;

    min-height: unset;

  }

  .projects-main-container .projects-grid{

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

    }

    
    .maintenance-section .image-conatiner{
        width: 300px;
    }
    .interior-exterior-section .image-conatiner {
        width: 350px;
    }
}


@media (max-width: 1000px) {

    .container{

        padding-top: 50px;

    }
    .language-switcher{
        margin-inline: 50px;
    }
   

    .title{
        
        margin-bottom: 50px;
        
    }
    .about-main-container .title{
        margin: 0;
    }

    ::-webkit-scrollbar {

        display: none;

    }

    .only-desktop{

        display: none;

    }


    header .btn{

        display: none;

    }

    .hamburger{

        display: flex;

    }

    .mobile-menu{

        display: flex;

    }

    .only-mobile{

        display: block;

    }

    

    .flex{

        flex-direction: column;

        align-items: start;

        gap: 20px;

    }





     /* homepage about section start */

     .homepage .about-section .logo-shaped-images{

        grid-template-columns: repeat(2, 165px);

    }

    .homepage .about-section .logo-shaped-images .image-container {

        width: 100%;

    }

    .homepage .about-section .logo-shaped-images .image-container:nth-child(4){

        width: 100%;

    }

    .homepage .about-section .text-container{

        width: 100%;

    }

    .homepage .about-section .section-content .logo-shaped-images{

        margin-bottom: 40px;

    }

    .homepage .about-section .text-container p{

        margin-bottom: 50px;

    }

    /* homepage about section start */

    .homepage .projects .intro{

        padding-top: 50px;

    }





    /* about page start */

    .long-slide .right-section .starting-image{

        width: 250px;

    }

    .long-slide .right-section .starting-image .background{

        border-top-right-radius: 100px;

        right: -10px;

        top: -10px;

    }

    .long-slide .right-section .flex.align-center{

        align-items: center;



    }

    .long-slide .right-section .image-container.long-slide-1{

        width: 140px;

    }

    .long-slide .right-section .image-container.long-slide-2{

        width: 140px;

    }

    /* about page end */

}





/* tablets */

@media (min-width: 769px) and (max-width: 1024px) {

    .mobile-only{

        display: block;

    }

    /***** homepage start *****/

    /* hero */

    .hero-section{

        height: 90vh;

        padding: 50px 50px;

    }

    .hero-section .image-container{

        top: 28vh;

        width: 550px;

    }

    .hero-section .hero-text-container{

        height: 75vh;

    }



    /* sliding text section start */

    .homepage .sliding-text{

        padding-top: 10vh;

    }
    /* about section start */

    .homepage .projects .intro{

        padding: 50px;

    }
    .homepage .projects h2{
        
        font-size: 24px;
    }
    .homepage .about-section{

        padding: 50px;

    }

    .homepage .about-section .section-content {

        flex-direction: row;

        gap: 40px;

    }

    .homepage .about-section .section-content .logo-shaped-images{

        width: 50%;

    }

    .homepage .about-section .text-container {

        width: 50%;

    }

    .homepage .about-section .text-container p {

        margin-bottom: 40%;

    }

    

    /* about section end */

    /* services section start */

    .homepage .services-section{

        height: fit-content;

        padding: 100px;

    }

    /* services section end */

    /* small paralax section start */

    .small-parallax{

        height: 200px;

    }

    /* small paralax section end*/

    /* contact us section start*/

    .div-button-wrapper {

        flex-direction: column;

        gap: 40px;

        align-items: flex-start;

    }

    /* contact us section end*/

    /***** homepage end *****/

    /***** About US Start *****/

    .about-main-container .flex{

        flex-direction: row;

    }

    .about-main-container .container{

        padding: 100px 5%;

    }

    /* long slide section start */

   

    .long-slide .left-section p.l-text{

        font-size: 12px;

    }

    .long-slide .right-section p.m-text{

        font-size: 12px;

    }

    .long-slide .right-section .starting-image{

        width: 250px;

    }

    .long-slide .right-section .starting-image .background{

        border-top-right-radius: 100px;

        right: -10px;

        top: -10px;

    }

    .long-slide .right-section .flex.align-center{

        align-items: center;



    }

    .long-slide .right-section .image-container.long-slide-1{

        width: 115px;

    }

    .long-slide .right-section .image-container.long-slide-2{

        width: 140px;

    }

    .long-slide .right-section .flex-column{

        padding: 0 0 0 20px;

    }

    .process-section p.m-text{

        font-size: 18px;

    }

    /***** About US End *****/



}

@media (max-width: 768px) {
    
    .projects-three-cards-container{
        padding-inline:5%;
    }
    .projects-three-cards .project-card .project-categories a p{
        display: none;
    }
    .w-50{

        width: 100%;

    }

    .container{

        padding: 50px 5%;

    }

    .p-100{

        padding: 100px 5%;

    }

    /* homepage start */

    

    .hero-section{

        padding: 50px 5%;

        margin-inline:auto;

        justify-content: flex-start;

        height: fit-content;
    }

    .hero-section .hero-text-container{

        max-width: 100%;

    }

    .hero-section h1{

        margin-bottom: 0;

    }

    

    .hero-section .image-container{

        position: relative;

        width: 100%;

        right: unset;

        top: unset;

    }

    /* sliding text section */
    .homepage .sliding-text .background{
        top: -50px;
    }
    .homepage .sliding-text{

        padding: 0 5%;

    }

    /* about section */

    .homepage .about-section{

        padding: 50px 5%;

        height: fit-content;

    }

    .homepage .about-section .title-text{

    }

    .homepage .about-section .section-content{

        align-items: start;

    }
    .homepage .about-section h2{
        font-size: 40px;
    }
    .homepage .about-section .logo-shaped-images {

        grid-template-columns: repeat(2, minmax(125px, 175px));

        align-self: center;

    }

    /* services section start */

    .homepage .services-section{

        padding:100px 5% 0 ;

        height: fit-content;

    }
    .homepage .services-section .services-content h3:hover{
        font-size: 24px;
        }
    /* sliding text start */
    .homepage .sliding-text{
        height: 60vh;
    }
    .homepage .sliding-text .pon{
        height: 150px;
    }
    .homepage .sliding-text .xl-text{
        width: 320px;
        text-align: center;
        margin-inline:auto;
    }
    .homepage .sliding-text .background{
        /* bottom: 50%;
        right: 50%;
        transform: translate(-50%, -50%); */
        width: 100%;
        height: 100%;
    }
    /* small paralax section */

    .homepage .smart-homes .small-parallax{

        height: 100px;

    }
    /* smart homes  */
    .homepage .smart-homes p{
        max-width: 100%;
    }
    .smart-homes .container{
        padding-inline: 0 ;
    }
    .homepage .smart-homes .section-background{
        padding-inline: 5%;
    }
    /* faqs section start*/

    .faqs .btn{

        margin:50px 0;

    }

    .faqs .faq-content.opened{

        padding: 10px;

    }

    /* contact us section */

    .div-button-wrapper{

        flex-direction: column;

    }

    .contact-section input[type="checkbox"] + label{

        font-size: 16px;

        width: 160px;

    }

    .service-choices{

        gap: 10px;

    }

    .contact-section .btn{

        

    }

    /********** Homepage End **********/

    /********** About Start **********/
    .about-main-container .our-specialties h2{
        font-size: 56px;
    }
    .about-main-container .long-slide .left-section{

        margin-bottom: 50px ;

    }
    .long-slide .max-1900.pt-100{
        padding-top: 0;
    }
    .long-slide .right-section .title-line{

        padding: 0;

    }

    .long-slide .right-section .flex-column{

        padding: 10px;

    }

    .about-main-container .left-section,.about-main-container .right-section{

        width: 100%;

    }

    .long-slide .p-container, html[lang="ar"] .long-slide .p-container{

        padding: 0;

        border: none;

    }

    .long-slide .right-section .starting-image{

        width: 250px;

    }

    .long-slide .right-section .starting-image .background{

        border-top-right-radius: 120px;

        top: -10px;

        right: -10px;

    }

    .long-slide .right-section .process-section{

        gap: 50px;

    }

    .long-slide .right-section .process-section p{

        max-width: 250px;

        text-align: center;

    }

    .long-slide .right-section .process-section .flex:nth-child(2){

        flex-direction: column-reverse;

    }

    .our-specialties .images-container {

        width: 250px;

        align-self: center;

    }

    .about-main-container .our-specialties .flex-column.gap-100{

        gap: 40px;

        padding-top: 0;

    } 

    /********** About End **********/

    /********** Services Start **********/

    .services-main-container .header{

        padding-bottom: 0;

    }
    .services-main-container .interior-exterior-section .gallery .image-container{
        width: 90%;
        margin-inline: auto;
    }
    .services-main-container .maintenance-section .image-conatiner{
        width: 100%;
    }

    /********** Services End **********/

    .services-main-container .cards-grid{

        grid-template-columns: repeat(1, minmax(320PX, 380PX));

    }

    .services-main-container .cards-grid{
        overflow-x: hidden;
    }

    .interior-exterior-section .image-conatiner{

        width: 100%;

    }

    .interior-exterior-section .number-text h2{

        font-size: 56px;

    }

    .design-buttons-container p{

        padding: 25px;

    }
    .design-buttons-container{
        width: 100%;
    }
    .maintenance-section .number-text h2{

        font-size: 40px;

    }

    .maintenance-subs{

        gap: 15px;

    }



    /********** single project start**********/

    .stats {

        grid-template-columns: 1fr; /* 1 column */

        grid-template-rows: repeat(4, auto); /* 4 rows */

    }

    .prject-images{

        padding: 100px 5%;

    }

    .columns-grid-2{

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

    }

    .single-project-main-container .project-details .project-text{
        width: 100%;
    }
    .single-project-main-container .project-details .stats{
        padding: 0;
        gap: 40px;
        margin-top: 40px;
    }
    /* single project end*/

    /* prtojects start */

    .projects-main-container .projects-grid{

        grid-template-columns: repeat(1, minmax(90%, 1fr));

    }
    .projects-main-container .projects-header{
        padding: 50px 5%;
    }
    .projects-main-container .projects-header .flex-column.gap-100{
        gap: 40px;
    }
    .projects-main-container .projects-header p{
        text-align: left;
    }
    .projects-main-container .project-card h6{
        opacity: 1;
    }
    .projects-main-container .project-card .overlay{
        opacity: 0.4;
    }
    .projects-main-container .project-card{

        min-width: unset;

    }

    /* projects end */
    /* single project start */
    .single-project-main-container .header{
        padding-bottom: 50px;
    }
    
    .single-project-main-container .header .image-container{
        border-bottom-left-radius: 69px;
    }
    /* single project end */
    /* contact us start*/

    .contact-main-container .header{

        padding: 50px 5%;

        display: flex;

        justify-content: center;

        align-items: center;

        height: unset;

    }

    .contact-main-container .header h1{

        text-align: center;

    }

    .contact-main-container form{

        padding: 70px 5%;

    }

    .contact-main-container input[type="checkbox"] + label{

        font-size: 18px;

        width: 150px;

    }

    /* contact us end*/

    /* footer start */

    .footer-column {

        flex: 1 1 100%;

        margin-right: 0;

        margin-bottom: 20px;

      }

      .footer-column:nth-child(1) img{

        width: 200px;

      }

      .footer-column:nth-child(2) li{

        text-align: left;

      }

    /* footer end */



}

@media (max-width: 480px){

    .maintenance-section .maintenance-subs .xs-text{
        font-size: 12px;
    }
    
}