/* ==========================================================================
   JAFAN — Responsive rules
   Mobile-first overrides layered on top of style.css
   ========================================================================== */

/* ---- Tablet & below (≤1024px) --------------------------------------------- */
@media (max-width: 1024px) {
  :root { --sp-7: 6rem; --sp-8: 8rem; }

  .why-grid { grid-template-columns: repeat(2, 1fr); }
  .benefits { grid-template-columns: repeat(2, 1fr); }
  .reviews-track { grid-template-columns: repeat(2, 1fr); }
  .footer-grid { grid-template-columns: 1.2fr 1fr 1fr; }
  .footer-brand { grid-column: 1 / -1; margin-bottom: var(--sp-3); }
}

/* ---- Small tablet / large phone (≤860px) ----------------------------------- */
@media (max-width: 860px) {
  .split, .split.reverse .copy,
  .product-teaser {
    grid-template-columns: 1fr;
  }
  .split.reverse .copy { order: 0; }
  .split img { aspect-ratio: 16/10; }
  .split .copy { max-width: none; }

  .product-teaser { gap: var(--sp-4); }

  .header-nav { display: none; }
  .nav-toggle { display: flex; }
  .header-grid { grid-template-columns: auto 1fr auto; }
  .header-actions span.label { display: none; }
}

/* ---- Phone (≤680px) --------------------------------------------------------- */
@media (max-width: 680px) {
  :root {
    --sp-4: 1.5rem;
    --sp-5: 2.5rem;
    --sp-6: 3.5rem;
    --sp-7: 4rem;
    --header-h: 76px;
  }

  .container { padding-inline: var(--sp-3); }

  .why-grid { grid-template-columns: 1fr; }
  .benefits { grid-template-columns: 1fr; }
  .reviews-track { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; gap: var(--sp-4); }
  .footer-bottom { flex-direction: column; gap: var(--sp-2); text-align: center; }

  .hero-content { padding-bottom: var(--sp-5); }
  .hero-content h1 { max-width: 12ch; }

  .logo { font-size: 1.25rem; letter-spacing: 0.2em; }

  .video-block { aspect-ratio: 4/5; }

  .section { padding-block: var(--sp-6); }
  .section--tight { padding-block: var(--sp-5); }

  /* sticky mobile buy bar shows only here */
  .sticky-buy-bar { display: flex; }
}

@media (min-width: 681px) {
  .sticky-buy-bar { display: none !important; }
}

/* ---- Product page responsive ------------------------------------------------- */
@media (max-width: 900px) {
  .product-layout { grid-template-columns: 1fr; }
  .product-gallery { position: static !important; }
  .compare-table { font-size: var(--fs-000); }
  .compare-table th:first-child, .compare-table td:first-child { min-width: 110px; }
}

/* ---- Cart page --------------------------------------------------------------- */
@media (max-width: 780px) {
  .cart-layout { grid-template-columns: 1fr; }
  .cart-line { grid-template-columns: 72px 1fr; }
  .cart-line .line-total { grid-column: 2; }
}