/* =========================================================
   JONCORP MARKET — Responsive (mobile-first overrides)
   Breakpoints : 320 · 375 · 425 · 768 · 1024 · 1440 · 1920
   ========================================================= */

.jm-menu-btn { display: none; }

.mobile-drawer { position: fixed; inset: 0; background: rgba(15,23,42,.5); z-index: 250; opacity: 0; pointer-events: none; transition: opacity .25s; }
.mobile-drawer.open { opacity: 1; pointer-events: auto; }
.mobile-drawer .panel { position: absolute; top: 0; bottom: 0; left: 0; width: 82%; max-width: 320px; background: #fff; padding: var(--sp-6); overflow-y: auto; transform: translateX(-100%); transition: transform .3s ease; }
.mobile-drawer.open .panel { transform: translateX(0); }
.mobile-drawer a { display: block; padding: 12px 0; border-bottom: 1px solid var(--c-border); font-weight: 500; }

@media (max-width: 1024px) { .jm-footer-grid { grid-template-columns: 1fr 1fr; } }

@media (max-width: 900px) {
  .jm-hero .container { grid-template-columns: 1fr; }
  .jm-hero-visual { transform: none; }
  .jm-hero-visual img:nth-child(2) { transform: none; }
  .promo-band { grid-template-columns: 1fr; }
}

@media (max-width: 768px) {
  :root { --header-h: 60px; }
  .jm-search { display: none; }
  .jm-menu-btn { display: grid; }
  .section { padding: var(--sp-8) 0; }
  .prod-grid { grid-template-columns: repeat(2, 1fr); gap: var(--sp-3); }
  .cat-grid { grid-template-columns: repeat(3, 1fr); gap: var(--sp-3); }
  .form-row { grid-template-columns: 1fr; }
  .jm-footer-grid { grid-template-columns: 1fr; gap: var(--sp-6); }
  .jm-logo-img { height: 32px; max-width: 130px; }
}

@media (max-width: 425px) {
  h1 { font-size: 1.75rem; }
  h2 { font-size: 1.25rem; }
  .jm-hero { padding: var(--sp-8) 0; }
  .jm-hero-cta .btn { flex: 1; }
  .prod-grid { grid-template-columns: repeat(2, 1fr); }
  .product-body { padding: 10px; }
  .product-name { font-size: 12px; min-height: 32px; }
  .product-price .now { font-size: var(--fs-base); }
  .toast-stack { top: 68px; right: 8px; left: 8px; }
  .toast { max-width: none; min-width: 0; }
  .jm-logo-img { height: 30px; max-width: 110px; }
}

@media (min-width: 1440px) {
  :root { --container: 1360px; }
  .prod-grid { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
}

@media (min-width: 1920px) {
  :root { --container: 1480px; --fs-4xl: 3rem; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}