@media (max-width: 960px) {
    .footer__grid {
        grid-template-columns: 1fr 1fr 1fr;
    }

    .grid--4 {
        grid-template-columns: repeat(2, 1fr);
    }

    .grid--3 {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .hero {
        background-image: url("/assets/second.webp");
        background-position: center bottom;
        min-height: 100vh;
    }

    .hero__grid {
        grid-template-columns: 1fr;
    }

    .operations-gallery {
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: 17rem repeat(2, 11rem);
    }

    .operations-gallery__item--feature {
        grid-column: 1 / -1;
        grid-row: auto;
    }

    .testimonial-feature {
        grid-template-columns: 1fr;
    }

    .testimonial-feature__image {
        min-height: 18rem;
    }

    .contact-page__layout {
        grid-template-columns: 1fr;
    }

    .contact-page__form {
        padding: var(--space-3);
    }

    .nav__links {
        display: none;
    }

    .nav__toggle {
        display: block;
    }

    .footer__grid {
        grid-template-columns: 1fr 1fr;
    }

    .grid--2,
    .grid--3,
    .grid--4 {
        grid-template-columns: 1fr;
    }

    .form-row {
        grid-template-columns: 1fr;
    }

    .readout {
        grid-template-columns: 1fr 1fr;
    }

    .sticky-cta {
        display: flex;
        gap: var(--space-2);
    }

    body {
        /* padding-bottom: 4.5rem; */
    }
}

@media (max-width: 480px) {
    .footer__grid {
        grid-template-columns: 1fr;
    }

    .readout {
        grid-template-columns: 1fr;
    }

    .readout__cell:nth-child(2n) {
        border-right: 1px solid var(--line-dark);
    }
}

/* Mobile nav drawer (JS-toggled) */
.nav__links.is-open {
    display: flex;
    flex-direction: column;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: var(--navy-900);
    padding: var(--space-2) var(--space-3);
    gap: 0;
    border-top: 1px solid var(--line-dark);
}

.nav__links.is-open a {
    padding-block: var(--space-2);
    border-bottom: 1px solid var(--line-dark);
}
