:root{
  --radius-xl: 1.25rem;
}

.hero{
  background: radial-gradient(1000px 600px at 10% 10%, rgba(0,0,0,.08), transparent 60%),
              radial-gradient(900px 500px at 90% 20%, rgba(0,0,0,.06), transparent 55%),
              linear-gradient(180deg, #ffffff 0%, #f7f7f7 100%);
}

.rounded-4{
  border-radius: var(--radius-xl) !important;
}

.mini-card{
  transition: transform .12s ease, box-shadow .12s ease;
}
.mini-card:hover{
  transform: translateY(-2px);
  box-shadow: 0 10px 30px rgba(0,0,0,.06);
}

.product-card{
  transition: transform .12s ease, box-shadow .12s ease;
  cursor: pointer;
}
.product-card:hover{
  transform: translateY(-2px);
  box-shadow: 0 12px 32px rgba(0,0,0,.08);
}

.object-fit-cover{ object-fit: cover; }