@media only screen and (max-width: 1600px) {}

@media only screen and (max-width: 1340px) {

    .header-nav ul {
        display: flex;
        gap: 25px;
    }

}

@media only screen and (max-width: 1200px) {}


@media only screen and (max-width: 1024px) {}


@media only screen and (max-width: 991px) {}

@media only screen and (max-width: 768px) {}

@media only screen and (max-width: 767px) {

    .about-bento-grid {
        grid-template-columns: 1fr;
    }

    .bento-text-block,
    .bento-stat-projects,
    .bento-stat-clients,
    .bento-stat-satisfaction {
        grid-column: span 1;
        padding: 40px 30px;
    }

    .bento-item.bento-text-block {
        padding: 0;
        border-radius: 0;
    }

    .isometric-image {
        max-width: 100%;
    }

    .about-cinematic-section {
        padding: 50px 0;
    }

    .about-accolades-section {
        padding: 50px 0;
    }

    .about-mission-vision {
        padding: 50px 0 0 !important;
    }

    .mv-block {
        margin-bottom: 50px;
        flex-direction: column;
    }


    .bento-stat-satisfaction .flex {
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
    }

    .intro-title {
        font-size: 2.5rem;
    }

    .modern-hero {
        padding: 150px 0 50px;
    }

    .modern-hero::before {
        right: 0%;
        width: 100%;
    }

    .pr-title {
        font-size: 54px;
    }

    .pr-wrapper {
        gap: 20px;
    }

}

@media only screen and (max-width: 650px) {}

@media only screen and (max-width: 550px) {}


@media only screen and (max-width: 400px) {}


@media only screen and (max-width: 360px) {}

@media only screen and (max-width: 991px) {
    .contact-grid {
        flex-direction: column !important;
        gap: 40px !important;
    }

    .contact-info-wrapper,
    .contact-form-wrapper {
        width: 100% !important;
        flex: none !important;
    }
}

@media only screen and (max-width: 767px) {
    .contact-page-section {
        padding: 60px 0;
    }

    .form-card {
        padding: 30px 20px;
    }
}

@media only screen and (max-width: 991px) {

    .c-top-grid,
    .c-cta-grid,
    .c-office-grid {
        flex-direction: column;
        gap: 40px;
    }

    .engineer-img {
        margin-top: 0;
        max-width: 100%;
    }

    .c-office-cards {
        flex-direction: column;
    }
}

@media only screen and (max-width: 767px) {
    .c-info-grid-2x2 {
        grid-template-columns: 1fr;
    }

    .c-heading,
    .c-cta-content h2 {
        font-size: 34px;
    }

    .c-section-top,
    .c-cta-banner,
    .c-office-section {
        padding: 60px 0;
    }

    .c-form-wrapper {
        padding: 25px;
    }
}