@media (min-width: 768px) {
    .brands__list,
    .products {
        grid-template-columns : repeat(3, 1fr);
        grid-gap              : 20px;
    }
}
@media (min-width: 1024px) {
    .brands__list,
    .products {
        grid-template-columns : repeat(4, 1fr);
    }
}
@media (min-width: 1200px) {
    .brands__list,
    .products {
        grid-template-columns : repeat(5, 1fr);
    }
}
@media (min-width: 1500px) {
    .brands__list,
    .products {
        grid-template-columns : repeat(6, 1fr);
    }
}