@media (max-width: 960px) {

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

    .footer-brand {
        grid-column: 1 / -1;
        margin-bottom: 12px;
    }

}

@media (max-width: 760px) {

    .header {
        gap: 16px;
        height: auto;
        flex-wrap: wrap;
        padding-block: 14px;
    }

    .header .search {
        order: 3;
        max-width: none;
        flex-basis: 100%;
    }

    .menu {
        display: none;
    }

    section[id] {
        scroll-margin-top: 120px;
    }

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

    .products-grid {
        grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
        gap: 18px;
    }

}

@media (max-width: 480px) {

    :root {
        --container-padding: 18px;
    }

    .offers-track .offer-card {
        flex-basis: 240px;
    }

}