.product {
  position: relative;
}
.product img {
  width: 100%;
  height: 100%;
  object-fit: fill;
  display: block;
  transition: opacity 0.3s ease;
}

.hover-zones {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
}

.zone {
  flex: 1;
  height: 100%;
  cursor: pointer;
}