/* =========================================================
   Sweet Bliss Bakery — Responsive Stylesheet
   ========================================================= */

@media (max-width: 1100px) {
  .category-grid, .why-grid { grid-template-columns: repeat(2, 1fr); }
  .product-grid { grid-template-columns: repeat(3, 1fr); }
  .testimonial-grid { grid-template-columns: repeat(2, 1fr); }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .hero-inner { grid-template-columns: 1fr; }
  .hero-image { order: -1; }
  .hero-image img { height: 380px; }
  .about-section .container { grid-template-columns: 1fr; }
  .about-image img { height: 340px; }
}

@media (max-width: 860px) {
  .main-nav { position: fixed; top: 0; right: -100%; width: 78%; max-width: 320px; height: 100vh;
    background: var(--cream); box-shadow: -6px 0 24px rgba(0,0,0,0.1);
    padding: 100px 32px 32px; transition: right 0.35s ease; z-index: 1000; }
  .main-nav.open { right: 0; }
  .main-nav ul { flex-direction: column; gap: 26px; }
  .hamburger { display: flex; z-index: 1001; }
  .header-actions .btn { display: none; }
  .product-grid { grid-template-columns: repeat(2, 1fr); }
  .testimonial-grid { grid-template-columns: 1fr; }
  .form-row { grid-template-columns: 1fr; }
  .cart-table thead { display: none; }
  .cart-row { grid-template-columns: 1fr !important; text-align: left !important; }
}

@media (max-width: 600px) {
  section { padding: 60px 0; }
  .category-grid, .why-grid, .product-grid { grid-template-columns: 1fr 1fr; gap: 16px; }
  .footer-grid { grid-template-columns: 1fr; gap: 30px; }
  .stats-row { gap: 24px; }
  .hero { min-height: auto; padding: 50px 0 40px; }
  .hero-image img { height: 280px; }
  .offer-section { margin: 0 12px; padding: 46px 22px; }
  .checkout-grid { grid-template-columns: 1fr !important; }
  .dashboard-cards { grid-template-columns: 1fr 1fr !important; }
}

@media (max-width: 420px) {
  .category-grid, .product-grid { grid-template-columns: 1fr; }
}