@media (max-width: 991px) {
  .hero-section h1 { font-size: 2.2rem; }
  .search-input { min-width: 100%; margin-bottom: 10px; }
  .hero-section { padding: 50px 0; text-align: center; }
  .hero-img { margin-top: 30px; }
}

@media (max-width: 767px) {
  .section-title { font-size: 1.5rem; }
  .gallery-main { height: 280px; }
  .auth-card { padding: 24px; margin: 30px 16px; }
  .cart-item-row .row > div { margin-bottom: 8px; }
}

@media (max-width: 575px) {
  .hero-section h1 { font-size: 1.8rem; }
  .product-card .card-body { padding: 12px; }
  .category-card { height: 160px; }
}