/* ==========================================================================
   MSUNK — responsive.css
   Breakpoints: Desktop >1200 | Laptop 992-1200 | Tablet 768-992 | Mobile 480-768 | Small <480
   ========================================================================== */

/* ---------- Laptop (≤1200px) ---------- */
@media (max-width: 1200px){
  .nav-links{ display:none; }
  .mobile-toggle{ display:flex; }
  .navbar .container{ gap:16px; }
  .search-toggle-form.open .search-input{ width:180px; }

  .cat-grid{ grid-template-columns: repeat(3,1fr); }
  .product-grid{ grid-template-columns: repeat(3,1fr); }
  .shop-layout{ grid-template-columns: 240px 1fr; }
  .foot-grid{ grid-template-columns: 1.2fr 1fr 1fr 1fr; }
  .foot-grid .foot-col.foot-newsletter-col{ display:none; }
  .pd-layout{ grid-template-columns: 56px 1fr 1fr; }
}

/* ---------- Tablet (≤992px) ---------- */
@media (max-width: 992px){
  .hero-content{ padding-left:5vw; max-width: 90%; }
  .hero-slider{ height:78vh; }

  .cat-grid{ grid-template-columns: repeat(2,1fr); }
  .product-grid{ grid-template-columns: repeat(2,1fr); }
  .product-grid.cols-3{ grid-template-columns: repeat(2,1fr); }

  .shop-layout{ grid-template-columns: 1fr; }
  .filter-panel{ position:static; margin-bottom:24px; }

  .flash-banner{ flex-direction:column; align-items:flex-start; }

  .pd-layout{ grid-template-columns: 1fr; }
  .pd-thumbs{ flex-direction:row; order:2; overflow-x:auto; }
  .pd-main-img{ order:1; }
  .pd-info{ order:3; }

  .cart-layout, .checkout-layout, .contact-layout{ grid-template-columns:1fr; }
  .summary-box{ position:static; }

  .foot-grid{ grid-template-columns: 1fr 1fr; gap:36px 20px; }
  .stat-strip{ grid-template-columns:repeat(2,1fr); gap:36px; }

  .cart-table-head{ display:none; }
  .cart-row{ grid-template-columns:1fr; gap:12px; }
  .cart-row .cart-price, .cart-row .cart-qty, .cart-row .cart-total{ display:flex; justify-content:space-between; }
  .cart-row .cart-price::before{ content:'Price'; color:var(--steel); font-size:12px; }
  .cart-row .cart-total::before{ content:'Total'; color:var(--steel); font-size:12px; }
}

/* ---------- Mobile (≤768px) ---------- */
@media (max-width: 768px){
  .topbar-links{ display:none; }
  .section{ padding:64px 0; }

  .navbar .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .mobile-toggle {
    order: 1;
    margin: 0;
  }
  .nav-actions {
    order: 2;
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
  }
  .brand {
    order: 3;
    margin: 0;
  }
  .search-suggestions {
    right: auto;
    left: 50%;
    transform: translateX(-50%) translateY(8px);
    width: calc(100vw - 32px);
    max-width: 340px;
  }
  .search-suggestions.show {
    transform: translateX(-50%) translateY(0);
  }

  .hero-slider{ height:70vh; min-height:520px; }
  .hero-content h1{ font-size:38px; }
  .hero-content p{ font-size:15px; }

  .cat-grid{ grid-template-columns: repeat(2,1fr); gap:14px; }
  .product-grid, .product-grid.cols-3{ grid-template-columns: repeat(2,1fr); gap:14px; }

  .flash-timer{ flex-wrap:wrap; }
  .flash-timer .t-box{ width:64px; padding:10px 6px; }
  .flash-timer .t-box .num{ font-size:22px; }

  .newsletter{ padding:36px 24px; flex-direction:column; align-items:flex-start; }
  .newsletter-form{ width:100%; flex-direction:column; }
  .newsletter-form input{ width:100%; }

  .popup-box{ grid-template-columns:1fr; }
  .popup-img{ display:none; }
  .popup-content{ padding:34px 26px; }

  .foot-grid{ grid-template-columns:1fr 1fr; gap:28px 16px; padding-bottom:36px;}
  .foot-bottom{ flex-direction:column; text-align:center; }

  .form-grid{ grid-template-columns:1fr; }
  .checkout-steps .step{ font-size:10px; }

  .section-head{ align-items:flex-start; }
}

/* ---------- Small mobile (≤480px) ---------- */
@media (max-width: 480px){
  .container{ padding:0 16px; }
  .brand-tag{ display:none; }
  .hero-cta{ flex-direction:column; align-items:stretch; }
  .hero-cta .btn{ width:100%; }

  .cat-grid{ grid-template-columns: 1fr 1fr; }
  .product-grid, .product-grid.cols-3{ grid-template-columns: 1fr 1fr; gap:10px; }
  .p-body{ padding:12px; }
  .p-name{ font-size:13px; }
  .p-price{ font-size:14px; }

  .foot-grid{ grid-template-columns:1fr; }
  .stat-strip{ grid-template-columns:1fr 1fr; }

  .flash-banner{ padding:32px 22px; }
  .pd-price-block .price{ font-size:24px; }

  .back-to-top{ right:14px; bottom:14px; width:42px; height:42px; }
  .toast-stack{ right:12px; left:12px; bottom:12px; }
  .toast{ min-width:auto; }
}

/* ---------- Extra Small mobile (≤380px) ---------- */
@media (max-width: 380px) {
  .navbar .brand {
    display: none !important;
  }
  .nav-actions {
    margin-right: 42px; /* Offset the 42px hamburger menu on the left to perfectly center icons */
  }
}