/* ═══════════════════════════════════════════════════════════
   MH-USA — Global Mobile Stylesheet
   Loaded on every page via partials/header.ejs
═══════════════════════════════════════════════════════════ */

/* ── Page wrapper padding ── */
@media(max-width:900px){
  .page-wrap{ padding-left:20px !important; padding-right:20px !important; }
}
@media(max-width:640px){
  .page-wrap{ padding:16px 14px 32px !important; }
  .breadcrumb{ padding:10px 14px; font-size:12px; }
}

/* ── Section padding ── */
@media(max-width:900px){
  .hs{ padding:28px 20px !important; }
}
@media(max-width:640px){
  .hs{ padding:20px 14px !important; }
  .hs h2{ font-size:19px !important; }
}

/* ── Hero carousel ── */
@media(max-width:480px){
  .hero-carousel{ height:240px !important; }
  .hero-slide-content{ padding:0 40px 0 18px !important; }
  .hero-slide-content h1{ font-size:19px !important; line-height:1.2; }
  .hero-slide-content p{ font-size:13px !important; margin-bottom:16px !important; }
  .hero-cta{ padding:10px 20px; font-size:13px; }
}

/* ── Category cards grid ── */
@media(max-width:480px){
  .cat-cards-grid{ grid-template-columns:repeat(2,1fr) !important; gap:10px !important; }
}

/* ── Value props strip ── */
@media(max-width:640px){
  .value-props-strip{ grid-template-columns:repeat(2,1fr) !important; }
  .vp{ padding:22px 14px !important; }
  .vp:nth-child(even){ border-right:none !important; }
  .vp:nth-child(odd){ border-right:1px solid var(--border) !important; }
}
@media(max-width:380px){
  .value-props-strip{ grid-template-columns:1fr !important; }
  .vp{ border-right:none !important; border-bottom:1px solid var(--border) !important; }
}

/* ── Corrugated / promo banners ── */
@media(max-width:600px){
  .corr-banner{ flex-direction:column; text-align:center; padding:22px 18px !important; gap:14px !important; }
  .corr-banner-cta{ align-self:center; }
  .mid-promo{ flex-direction:column; padding:18px 16px !important; gap:12px !important; }
  .mid-promo-cta{ text-align:center; width:100%; padding:11px; }
}

/* ── Industry grid ── */
@media(max-width:640px){
  .industry-grid{ grid-template-columns:repeat(3,1fr) !important; }
}
@media(max-width:480px){
  .industry-grid{ grid-template-columns:repeat(2,1fr) !important; }
  .industry-tile .ind-img{ height:120px !important; }
}

/* ── Newsletter form ── */
@media(max-width:480px){
  .hnl-form{ flex-direction:column !important; }
  .hnl-form input{ border-radius:4px !important; }
  .hnl-form button{ border-radius:4px !important; }
  .nl-form{ flex-direction:column !important; }
  .nl-form input{ border-radius:6px 6px 0 0 !important; }
  .nl-form button{ border-radius:0 0 6px 6px !important; height:44px; }
}

/* ── Global product card grid ── */
@media(max-width:480px){
  .prod-card-grid{ grid-template-columns:repeat(2,1fr) !important; gap:10px !important; }
  .prod-card{ padding:10px; }
  .prod-card .prod-img{ height:110px; }
  .prod-card .prod-name{ font-size:12px; }
}

/* ── Cart page ── */
@media(max-width:480px){
  .cart-wrap{ padding:14px 12px 40px !important; }
  .ci-price, .ci-total{ text-align:left !important; }
  .cart-qty-input{ width:46px; }
}

/* ── Checkout page ── */
@media(max-width:480px){
  .co-wrap{ padding:14px 12px 40px !important; }
  .review-item{ grid-template-columns:56px 1fr !important; gap:10px !important; }
  .review-item .ri-price{ grid-column:2; }
  .co-form-grid{ grid-template-columns:1fr !important; }
  .co-form-grid .full{ grid-column:1 !important; }
}

/* ── Account page ── */
@media(max-width:640px){
  .page-wrap{ padding:20px 14px 36px !important; }
}

/* ── Sign-in page ── */
@media(max-width:480px){
  .signin-wrap{ padding:20px 14px 36px !important; }
}

/* ── Category listing (L1/L2/Leaf) ── */
@media(max-width:480px){
  .cat-sidebar.l1, .cat-sidebar.l2{ margin:0 12px 16px !important; width:calc(100% - 24px) !important; }
  .cat-main{ padding:0 12px 32px !important; }
  h1.cat-h1{ margin:8px 12px 14px !important; font-size:20px !important; }
}

/* ── Product listing table (leaf) ── */
@media(max-width:640px){
  .prod-table{ font-size:12px; }
  .prod-table .pt-img{ display:none; }
}

/* ── Brand detail page ── */
@media(max-width:640px){
  .bp-hero{ height:auto !important; min-height:200px !important; }
}

/* ── Brands grid ── */
@media(max-width:480px){
  .brands-grid{ grid-template-columns:repeat(2,1fr) !important; }
}

/* ── Image overflow safety net ── */
img{ max-width:100%; height:auto; }
table{ max-width:100%; }
