/* ============================================================
   EMYJAY — Responsive rules
   Mobile-first business; breakpoints at 1080px, 1024px, 768px, 560px
   ============================================================ */

@media (max-width: 1080px) {
  .product-grid { grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
  .benefits-grid { grid-template-columns: repeat(2, 1fr); }
  .steps-row { grid-template-columns: repeat(2, 1fr); }
  .footer-grid { grid-template-columns: 1.2fr 1fr 1fr; }
  .footer-grid .footer-col:last-child { grid-column: 1 / -1; }
}

@media (max-width: 1024px) {
  .main-nav { display: none; }
  .nav-toggle { display: inline-flex; align-items: center; justify-content: center; }

  .hero { grid-template-columns: 1fr; }
  .hero-visual { order: -1; aspect-ratio: 16/10; }

  .product-detail { grid-template-columns: 1fr; }
  .cart-layout { grid-template-columns: 1fr; }
  .summary-box { position: static; }
  .checkout-layout { grid-template-columns: 1fr; }
  .contact-layout { grid-template-columns: 1fr; }
  .two-col { grid-template-columns: 1fr; }
  .trust-band .container { grid-template-columns: 1fr; }
  .wa-band .container { justify-content: flex-start; }
}

@media (max-width: 768px) {
  section { padding-block: clamp(2.25rem, 8vw, 3.5rem); }

  .product-grid { grid-template-columns: repeat(2, 1fr); gap: 1.1rem; }
  .benefits-grid { grid-template-columns: 1fr 1fr; gap: 1.4rem; }
  .steps-row { grid-template-columns: 1fr 1fr; gap: 1.4rem; }
  .value-grid { grid-template-columns: 1fr; gap: 1.4rem; }

  .footer-grid { grid-template-columns: 1fr 1fr; gap: 1.75rem; }
  .footer-grid .footer-brand { grid-column: 1 / -1; }

  .shop-toolbar { flex-direction: column; align-items: stretch; }
  .search-field input { min-width: 0; width: 100%; }

  .cart-line { grid-template-columns: 66px 1fr; grid-template-areas: "thumb info" "thumb qty" "thumb price"; row-gap: 0.6rem; }
  .cart-line .thumb { grid-area: thumb; width: 66px; height: 66px; }
  .cart-line > div:nth-of-type(2) { grid-area: info; }
  .cart-line .qty-stepper { grid-area: qty; }
  .cart-line .line-price { grid-area: price; text-align: left; }

  .form-row { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
  html { -webkit-text-size-adjust: 100%; }
  .container { padding-inline: 1.05rem; }

  h1 { font-size: var(--step3); }
  h2 { font-size: var(--step2); }

  .site-header .container { padding-block: 0.8rem; }
  .logo { font-size: 1.1rem; }
  .header-actions { gap: 0.55rem; }
  /* Header is crowded here (currency, wishlist, cart, menu): the search icon
     is redundant because Products is in the menu. */
  .header-actions > a[aria-label="Search products"] { display: none; }
  .header-actions .currency-select { margin-right: 0 !important; padding: 0.25rem 0.3rem !important; font-size: 0.75em !important; }
  .header-actions .icon-btn { width: 2rem; height: 2rem; }

  .hero-cta { flex-direction: column; align-items: stretch; }
  .hero-cta .btn { width: 100%; }

  .product-grid { grid-template-columns: 1fr; gap: 1.25rem; }
  .product-card h3 { font-size: 0.98rem; }
  .product-card .card-actions { flex-direction: column; }

  .benefits-grid { grid-template-columns: 1fr; }
  .steps-row { grid-template-columns: 1fr; }

  .footer-grid { grid-template-columns: 1fr; gap: 1.75rem; }
  .footer-bottom { flex-direction: column; text-align: center; }

  .buy-actions { flex-direction: column; }
  .buy-actions .btn { min-width: 0; }
  .qty-row { flex-wrap: wrap; }

  .checkout-steps { font-size: 0.72rem; }
  .checkout-steps .step span.label { display: none; }

  .mobile-nav a { font-size: 1.4rem; }
  .cart-drawer { width: 100vw; }

  .wa-float { width: 3rem; height: 3rem; bottom: 1.1rem; right: 1.1rem; }
  .wa-float svg { width: 24px; height: 24px; }
}

img, table, pre, .thumb-row { max-width: 100%; }
body { overflow-x: hidden; }