/* ============================== Responsive ============================== */
@media (max-width: 1024px) {
  .jt-reco__grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 920px) {
  :root { --gutter: 22px; }
  .jt-nav__links { gap: 18px; }
  .jt-nav__links a:not(.jt-nav__cta), .jt-nav__div { display: none; }
  .jt-nav__toggle {
    display: inline-flex; align-items: center; justify-content: center;
    width: 42px; height: 42px; border-radius: 999px; border: 1px solid var(--line);
    background: #fff; cursor: pointer; font-size: 18px; color: var(--ink);
  }
  .jt-nav.is-open .jt-nav__links {
    position: absolute; top: 100%; left: 0; right: 0;
    flex-direction: column; align-items: flex-start; gap: 4px;
    background: var(--bg); border-bottom: 1px solid var(--line); padding: 14px var(--gutter) 20px;
  }
  .jt-nav.is-open .jt-nav__links a:not(.jt-nav__cta) { display: block; font-size: 16px; padding: 8px 0; }

  .jt-hero__grid { grid-template-columns: 1fr; gap: 30px; }
  .jt-hero { padding: 40px var(--gutter) 64px; }
  .jt-flipwrap { order: -1; }

  .jt-frow { grid-template-columns: 1fr !important; gap: 24px; margin-bottom: 56px; }
  .jt-frow__media { order: -1 !important; }

  .jt-story__grid { grid-template-columns: 1fr; gap: 34px; }
  .jt-product__grid { grid-template-columns: 1fr; gap: 32px; }
  .jt-why__grid { grid-template-columns: 1fr; }
  .jt-fulldesc { grid-template-columns: 1fr; gap: 28px; padding: 36px clamp(24px, 5vw, 44px); }
  .jt-catgrid { grid-template-columns: repeat(2, 1fr); }
  .jt-reco__grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 560px) {
  .jt-drawer__panel { width: 100%; }
  .jt-footer__top { grid-template-columns: 1fr; gap: 32px; }
  .jt-footer__cols { grid-template-columns: repeat(2, 1fr); gap: 22px 18px; }
  .jt-features, .jt-faq, .jt-story { padding-left: var(--gutter); padding-right: var(--gutter); }
  .jt-features { padding-top: 64px; padding-bottom: 64px; }
  .jt-faq { padding-top: 64px; padding-bottom: 64px; }
  .jt-catgrid { grid-template-columns: repeat(2, 1fr); gap: 14px; }
  .jt-reco__grid { grid-template-columns: repeat(2, 1fr); gap: 14px; }
  .jt-gallery__thumbs { grid-template-columns: repeat(4, 1fr); }
  .jt-card__name, .jt-pcard__name { font-size: 15px; }
  .jt-card__price, .jt-pcard__price { font-size: 15px; }
  .jt-card__cat { display: none; }
  .jt-toolbar { gap: 14px; }
  .jt-fnum b { font-size: 48px; }
  .jt-hero__title { font-size: clamp(40px, 11vw, 56px); }
}