.card {
    max-width: unset;
    height: auto;
}

.card:hover {
    transform: translateY(-5px); /* Slight lift on hover */
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1); /* Shadow effect */
}

/* Overflow Scroll for Small Screens */
@media (max-width: 576px) {
    .product-category {
      display: flex;
      overflow-x: scroll; /* Enable horizontal scrolling */
      gap: 1rem; /* Add space between cards */
      flex-wrap: nowrap;
    }
  
    .product-category .col-lg-3,
    .product-category .col-md-6 {
      flex: 0 0 auto; /* Prevent shrinking and allow horizontal scrolling */
      width: 70%; /* Set a fixed width for cards in the scrollable view */
    }
}