.product-card.mango {
  background-image: url('assets/banganapalli-mangoes.webp');
}

.product-card.spices {
  background-image: url('assets/pedda-rasalu-mangoes.webp');
}

.product-card.grain {
  background-image: url('assets/chinna-rasalu-mangoes.webp');
}

.product-card.import {
  background-image: url('assets/seasonal-mango-selection.webp');
}

.product-card {
  background-position: center;
  background-size: cover;
  transition: background-position .55s ease, transform .35s ease, box-shadow .35s ease;
}

.product-card::before {
  background: linear-gradient(0deg, rgba(5, 24, 17, .96) 0%, rgba(7, 27, 20, .72) 35%, rgba(7, 27, 20, .12) 74%),
              linear-gradient(140deg, rgba(9, 38, 27, .36), transparent 55%);
}

.product-card:hover {
  background-position: 52% 45%;
  transform: translateY(-5px);
  box-shadow: 0 18px 35px rgba(10, 36, 26, .18);
}

.product-card h3,
.product-card p,
.product-card a,
.product-card .num {
  text-shadow: 0 2px 10px rgba(0, 0, 0, .28);
}