/* ==========================================================================
   Responsive breakpoints
   Mobile: < 768px (2 product columns, stacked layout)
   Tablet: 768px – 1024px (3 product columns)
   Desktop: > 1024px (4 product columns, mega menu)
   Large Desktop: > 1440px (max-width container 1400px)
   ========================================================================== */

/* ---- Tablet and below: collapse mega menu into hamburger ---------------- */
@media (max-width: 1024px) {
    .main-nav { display: none; }
    .hamburger { display: flex; }

    .collection-grid, .product-grid { grid-template-columns: repeat(3, 1fr); }
    .carousel-item { flex: 0 0 calc(33.333% - 14px); }

    .featured-spotlight { flex-direction: column; }
    .featured-spotlight-media { min-height: 320px; }

    .shop-the-look-row { flex-direction: column; }
    .shop-the-look-media { min-height: 360px; width: 100%; }

    .product-detail { flex-direction: column; gap: 32px; }
    .product-gallery { flex-direction: column-reverse; }
    .product-thumbs { flex-direction: row; width: auto; }

    .cart-page-layout, .checkout-layout { flex-direction: column; }
    .order-summary, .checkout-summary { width: 100%; position: static; }

    .account-layout { flex-direction: column; }
    .account-sidebar { width: 100%; }

    .footer-inner { grid-template-columns: repeat(2, 1fr); }
}

/* ---- Mobile ---------------------------------------------------------------- */
@media (max-width: 767px) {
    .container { padding-left: 16px; padding-right: 16px; }

    .header-inner { height: 60px; }
    .logo-text { font-size: 17px; }

    .hero-slider { height: 420px; }
    .hero-slide-content h1 { font-size: 26px; }

    .section-header { margin: 36px 0 18px; }
    .section-header h2 { font-size: 19px; }

    .carousel-item { flex: 0 0 calc(58% - 10px); min-width: 0; }
    .carousel-arrow { display: none; }

    .category-banners { flex-direction: column; }
    .category-banner { height: 220px; }

    .collection-grid, .product-grid { grid-template-columns: repeat(2, 1fr); gap: 16px 12px; }

    .lookbook-banner { height: 260px; }
    .lookbook-banner-content h2 { font-size: 22px; }

    .newsletter-form { flex-direction: column; }

    /* Tighter footer spacing on mobile than the desktop 44px/40px. */
    .footer-logo { padding-bottom: 28px; }
    .footer-inner { grid-template-columns: 1fr; gap: 28px; padding-top: 28px; padding-bottom: 24px; }

    .collection-toolbar { flex-direction: column; align-items: flex-start; }

    .lookbook-gallery { grid-template-columns: repeat(2, 1fr); }

    .cart-table thead { display: none; }
    .cart-table, .cart-table tbody, .cart-table tr, .cart-table td { display: block; width: 100%; }
    .cart-table tr { padding: 16px 0; border-bottom: 1px solid var(--color-border); }
    .cart-table td { border-bottom: none; padding: 4px 0; }

    .checkout-form, .checkout-summary { width: 100%; }

    .mobile-nav-drawer, .cart-drawer { width: 88vw; }
}

/* ---- Large desktop ---------------------------------------------------------- */
@media (min-width: 1440px) {
    .container { max-width: var(--container-max); }
}
