@media screen and (max-width: 1320px) {
    .banner-container { padding: 0 60px; }
    .socials { left: 20px; }

    .indeco-sm-page { 
        padding: 0 60px 30px;
        height: unset;
    }

    .indeco-sm-page .socials {
        bottom: unset;
        top: 400px;
    }
}

@media screen and (max-width: 1230px) {
    .current-project-preview { padding-right: 20px; }
    .gallery-image { width: 330px !important; }
}

@media screen and (max-width: 1023px) {
    .menu-toggle { display: block; }
    .menu { display: none; }
    .language-btns { margin-left: auto; }
    .project-slide:nth-child(even) .project-intro { padding-left: 20px; }
    .project-slide:nth-child(odd) .project-name { right: 20px; }
    .project-name { min-width: unset !important; }

    .indeco-sm-page-content > img {
        width: 300px;
        height: 300px;
    }
}

@media screen and (max-width: 900px) {
    .banner-swiper { height: 500px; }
    .banner-swiper .swiper-pagination { left: 20px !important;}
    .banner-text { left: 20px; right: 20px; }

    .banner-name > p {
        font-size: 30px;
        line-height: 33px;
    }

    .banner-name > p:nth-child(2) {
        font-size: 16px;
        line-height: 21px;
    }

    .project-prev {
        font-size: 12px;
        line-height: 16px;
        margin-bottom: 50px;
    }

    .about-us-container .content1 { padding: 0; }
    .about-us-content { gap: 20px; }
    footer { padding: 30px 20px !important; }
    .footer-content { 
        flex-direction: column;
        gap: 30px;
        padding: 40px 30px;
    }

    .footer-bottom { flex-direction: column; }
    .footer-socials { 
        order: 1; 
        margin-bottom: 30px;
        padding-left: 20px;
    }
    .copyright { order: 2; }
    .creator { order: 3; }

    .projects-swiper { 
        padding: 50px 0 0;
        height: unset; 
    }

    .project-name { 
        font-size: 14px;
        line-height: 18px;
        text-align: center;
        position: unset; 
        margin-bottom: 20px;
        height: 60px;
    }

    .project-slide {
        gap: 20px;
        margin-bottom: 40px;
    }
    .project-slide:nth-last-child(2) { margin-bottom: 100px !important; }
    .project-slide:nth-child(odd) .project-intro { padding: 0 20px 0 0; }
    .project-slide:nth-child(even) .project-intro { padding: 0 0 0 20px; }

    .project-image { height: 300px; }

    .project-desc {
        font-size: 16px;
        line-height: 20px;
        height: 120px;
        margin: 0 0 10px 0;
    }

    .current-project { 
        flex-direction: column-reverse;
        padding: 50px 20px 0;
        gap: 30px;
    }

    .current-project-preview {
        padding: 0;
        width: 100%;
    }

    .go-back { margin-bottom: 30px; }
    .current-project .project-desc { 
        margin: 0; 
        max-width: unset;
        height: unset;
    }

    .current-project > img:first-child {
        width: 100%;
        height: 350px;
    }
    
    .project-text-container { padding: 30px 20px; }

    .indeco-sm-page-content {
        flex-direction: column;
    }
}

@media screen and (max-width: 767px) {
    .projects-preview { padding: 35px 20px; }
    .projects-preview .title {
        font-size: 25px;
        line-height: 30px;
        margin-bottom: 20px;
    }

    .projects-preview-content img { height: 250px; }

    .projects-preview-content p {
        font-size: 16px;
        line-height: 20px;
    }
    
    .project-slide { 
        flex-direction: column-reverse !important;
        padding: 0 20px;
    }

    .project-image, .project-intro {
        width: 100%;
    }

    .project-intro { padding: 0 !important; }
    .project-desc {
        max-width: unset;
        height: unset;
        margin-bottom: 30px;
    }

    .contact-container1 { padding: 0 20px 30px; }
    .contact-content { gap: 30px; }
    .contact-form, .contact-details { width: calc(50% - 30px); }
}

@media screen and (max-width: 630px) {
    .pdfComponent {
        grid-template-columns: 1fr;
        gap: 0;
    }

    .pdfComponent p {
        border-radius: 10px 10px 0 0;
        padding: 10px 15px;
        margin-bottom: 0;
        font-size: 12px;
    }

    .pdfComponent figure {
        border-radius: 0 0 10px 10px;
        width: unset;
    }
}

@media screen and (max-width: 600px) {
    .banner-container { padding: 0 40px 0 60px; }
    .project-prev { display: none; }
    .banner-swiper { height: 350px; }
    .banner-swiper .swiper-pagination { bottom: 40px !important; }
    
    .socials { 
        bottom: 70px;
        gap: 30px;
    }

    .socials a {
        font-size: 12px;
        line-height: 16px;
    }

    .about-us-content, .projects-preview-content { flex-direction: column; }
    .about-us-content p, .projects-preview-content > div { width: 100%; }
    .about-us-content div, .contact-content > div:nth-child(2) {
        width: 100%;
        height: 2px;
    }

    .project-text, .project-text * {
        font-size: 14px !important;
        line-height: 18px !important;
    }

    .contact-content { flex-direction: column; }
    .contact-form, .contact-details { width: 100%; }
}

@media screen and (max-width: 500px) {
    .socials { display: none; }
    .banner-container { padding: 0 20px; }
    .banner-swiper { height: 270px; }
    
    .banner-name > p {
        font-size: 18px;
        line-height: 24px;
    }

    .banner-name > p:nth-child(2),
    .about-us-content {
        font-size: 14px;
        line-height: 18px;
    }

    .explore {
        padding-left: 20px;
        width: 130px;
        height: 40px;
    }

    .about-us-container { padding: 50px 20px; }
    .project-image { height: 250px; }

    .indeco-sm-page { padding: 0 20px 50px; }
    .indeco-sm-page-content { gap: 20px; }
    .indeco-sm-page-content > img {
        width: 100%;
        height: 100%;
    }
}

@media screen and (max-width: 450px) {
    .subscribe { width: 100%; }

    .footer-socials { 
        flex-direction: column;
        gap: 5px; 
    }

    .gallery-image { width: 200px !important; }
    .gallery-image img { height: 150px; }
    .prev-img, .next-img {
        border-radius: 5px;
        font-size: 10px;
        width: 30px;
        height: 30px;
    }
    
    .prev-img { left: 10px; }
    .next-img { right: 10px; }

    .go-back-cont .go-back { margin-right: 0; }
    .go-back-cont .go-back div { position: unset; }
    .go-back-cont .go-back span { opacity: 1; }

    .contact-heading { height: 200px; }
    .contact-heading img { height: 200px; }
    .contact-heading p {
        font-size: 20px;
        line-height: 25px;
        left: 50%;
        transform: translate(-50%, -50%);
        min-width: unset;
    }

    .current-project > img:first-child { height: 250px; }
}