/* ==========================================================================
   RESPONSIVE — 1440 / 1280 / 1024 / 768 / 390 / 360
   هیچ بخشی نباید در موبایل Overflow شود.
   ========================================================================== */

/* 1440+ */
@media (min-width: 1440px) {
  :root { --container: 1320px; }
}

/* 1280 laptop */
@media (max-width: 1279px) {
  :root { --header-h: 72px; }
  .nav__link { padding-inline: 10px; }
}

/* 1024 */
@media (max-width: 1099px) {
  .nav { display: none; }
  .hero__in { gap: 32px; }
}

/* 900 — mobile shell */
@media (max-width: 899px) {
  :root { --header-h: 64px; --section-y: clamp(44px, 9vw, 68px); --grid-gap: 12px; }
  .topbar { --topbar-h: 34px; font-size: 11.5px; }
  .brand__name { font-size: 0.98rem; }
  .section-head { align-items: flex-start; flex-direction: column; gap: var(--sp-4); }
  .section-head__action { width: 100%; }
  .section-head__action .btn { flex: 1 1 auto; }
  .hero__media .media { aspect-ratio: 1 / 1; }
  .pdp__cta .btn { flex: 1 1 140px; }
  .footer__top { gap: 28px; }
  .modal__box { max-height: 92vh; border-radius: var(--r-lg); }
  .feature { border-radius: var(--r-lg); }
  .banner, .news, .ticker { border-radius: var(--r-lg); }
}

/* 768 tablet */
@media (max-width: 767px) {
  .grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cart-item { grid-template-columns: 84px 1fr; }
  .steps--h .step { min-width: 78px; }
  .step__dot { width: 26px; height: 26px; font-size: 11px; }
}

/* 480 small mobile */
@media (max-width: 479px) {
  :root { --gutter: 16px; --sp-unit: 4px; }
  .hero__cta .btn { width: 100%; }
  .hero__stats { gap: 18px; }
  .hero__stat { flex: 1 1 40%; }
  .ticker__grid { grid-template-columns: 1fr; }
  .cat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .why-grid { grid-template-columns: 1fr; }
  .news__form .input, .news__form .btn { width: 100%; flex: 1 1 100%; }
  .track-form .btn { width: 100%; }
  .coupon { flex-direction: column; }
  .gallery { grid-template-columns: 1fr; }
  .gallery__thumbs { order: 2; }
  .gthumb { width: 62px; height: 62px; }
  .compare-bar { padding-inline: 12px; }
  .drawer--end { width: 100vw; border-radius: 0; }
}

/* 390 / 360 — small phones */
@media (max-width: 390px) {
  :root { --gutter: 14px; --fs-display: clamp(1.9rem, 9vw, 2.4rem); }
  .pcard__body { padding: 10px; gap: 6px; }
  .pcard__specs { font-size: 11px; gap: 2px 8px; }
  .pcard__tool { width: 32px; height: 32px; }
  .pcard__quickadd { font-size: 11px; min-height: 36px; inset-inline: 8px; bottom: 8px; }
  .bnav { font-size: 9.5px; min-height: 54px; }
  .icon-btn { width: 38px; height: 38px; }
  .brand__mark { width: 34px; height: 34px; }
  .brand__mono { font-size: 13px; }
  .btn { min-height: 44px; padding-inline: 16px; }
  .cart-item { grid-template-columns: 70px 1fr; gap: 10px; }
  .cart-item__img { aspect-ratio: 1/1; }
  .panel { padding: 16px; }
  .review { padding: 16px; }
  .order-thumbs div { width: 44px; height: 44px; }
}

@media (max-width: 360px) {
  :root { --gutter: 13px; --grid-gap: 10px; }
  .brand__name { font-size: .92rem; }
  .hero__cta .btn { min-height: 46px; }
  .ticker__head .btn { width: 100%; }
  .pdp__cta .btn { flex: 1 1 100%; }
  .order-card__head { flex-direction: column; align-items: flex-start; }
}

@media (max-width: 359px) {
  :root { --gutter: 12px; }
  .grid--2, .grid--3, .grid--4, .cat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .pcard__name { font-size: 0.82rem; line-height: 1.5; }
  .hero__float { display: none; }
  .brand__tag { display: none; }
}

/* Touch targets ≥ 44px */
@media (pointer: coarse) {
  .icon-btn, .qty button, .pager__item, .tab, .acc__head { min-height: 44px; }
  .qty button { width: 42px; height: 44px; }
  .mini-qty button { width: 32px; height: 32px; }
  .nav__link, .dd__item { min-height: 44px; }
}

/* Landscape phones */
@media (max-height: 480px) and (orientation: landscape) {
  .hero__in { padding-block: 24px; }
  .drawer, .sheet { max-height: 100vh; }
}

/* Print */
@media print {
  .header, .footer, .bottomnav, .sticky-cta, .brand-fab, .toasts, .compare-bar { display: none !important; }
  body { background: #fff; color: #000; }
  .main { padding: 0; }
  a[href]::after { content: " (" attr(href) ")"; font-size: 10px; color: #555; }
}