:root {
  --brand1: #0d6efd;
  --brand2: #6610f2;
}

.hero {
  background: linear-gradient(135deg, var(--brand1) 0%, var(--brand2) 100%);
  color: #fff;
}
.hero-img {
  border-radius: 1.25rem;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.25);
}
.product-card img {
  height: 220px;
  object-fit: cover;
}
.badge-hot {
  position: absolute;
  top: 12px;
  left: 12px;
}
.category-card {
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.category-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
}
.footer a {
  text-decoration: none;
}
.shadow-soft {
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);
}
.rounded-4 {
  border-radius: 1rem !important;
}