.advanced-product-grid { display: grid; grid-template-columns: repeat(var(--desktop-columns), 1fr); gap: 20px; } .product-item { border: 1px solid #ddd; padding: 15px; text-align: center; background-color: #f9f9f9; border-radius: 8px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); } .product-item img { max-width: 100%; height: auto; margin-bottom: 10px; } .product-item h3 { font-size: 18px; margin: 10px 0; } .product-categories { font-size: 14px; color: #0073aa; margin-bottom: 10px; } .product-item .button { display: inline-block; padding: 8px 12px; background-color: #e74c3c; color: #fff; text-decoration: none; border-radius: 5px; font-weight: bold; } @media (max-width: 768px) { .advanced-product-grid { grid-template-columns: repeat(var(--mobile-columns), 1fr); } }