/* Grid styling for categories */
ul.products {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
padding: 0;
}
ul.products li.product-category {
width: 22%; /* For 4 columns on desktop */
margin-bottom: 20px;
list-style: none;
text-align: center;
}
/* Mobile view: 2 categories per row */
@media (max-width: 768px) {
ul.products li.product-category {
width: 48%; /* For 2 columns on mobile */
margin-bottom: 15px;
}
}
/* Extra small screens: 1 category per row */
@media (max-width: 480px) {
ul.products li.product-category {
width: 100%; /* For 1 column */
margin-bottom: 20px;
}
}