/* ========== Banner Swiper ========== */
.banner { position: relative; margin: 8px 12px; border-radius: 8px; overflow: hidden; }
.banner-track {
  display: flex; transition: transform .4s ease;
}
.banner-item {
  min-width: 100%; aspect-ratio: 16/7;
  background: linear-gradient(135deg, #ff4757, #ff6b81);
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-size: 20px; font-weight: 600;
}
.banner-dots {
  position: absolute; bottom: 8px; left: 50%;
  transform: translateX(-50%);
  display: flex; gap: 6px;
}
.banner-dot {
  width: 6px; height: 6px; border-radius: 3px;
  background: rgba(255,255,255,.5);
  transition: all .3s;
}
.banner-dot.active { width: 16px; background: #fff; }

/* ========== Category Grid ========== */
.category-grid {
  background: #fff; margin: 8px 12px; border-radius: 8px;
  padding: 16px 8px;
  display: grid; grid-template-columns: repeat(5, 1fr);
  gap: 12px 0;
}
.category-item {
  display: flex; flex-direction: column;
  align-items: center; gap: 6px;
}
.category-icon {
  width: 44px; height: 44px; border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  font-size: 22px;
}
.category-name { font-size: 11px; color: #666; }

/* ========== Section Title ========== */
.section-title {
  padding: 16px 12px 8px;
  font-size: 16px; font-weight: 600; color: #333;
  display: flex; align-items: center; justify-content: space-between;
}
.section-more { font-size: 12px; color: #999; font-weight: 400; }

/* ========== Product Grid ========== */
.product-grid {
  display: grid; grid-template-columns: repeat(2, 1fr);
  gap: 8px; padding: 0 12px 12px;
}
.product-card {
  background: #fff; border-radius: 8px;
  overflow: hidden; transition: transform .2s;
}
.product-card:active { transform: scale(.98); }
.product-img {
  width: 100%; aspect-ratio: 1; object-fit: cover;
  background: #f0f0f0;
}
.product-info { padding: 8px 10px 10px; }
.product-name {
  font-size: 13px; color: #333;
  line-height: 1.4; height: 36px;
}
.product-meta {
  display: flex; align-items: baseline;
  justify-content: space-between; margin-top: 6px;
}
.product-sales { font-size: 11px; color: #999; }