/* Mobile commerce details: keep long translated text and controls usable on
   narrow screens without changing the reference design's colours or rhythm. */
@media (max-width: 760px) {
  .header-left .icon-button,
  .header-right .icon-button { min-width: 44px; min-height: 44px; }
  .hero-copy h1 { font-size: clamp(25px, 6.4vw, 30px); overflow-wrap: anywhere; }
  .hero-copy p { overflow-wrap: anywhere; }
  .hero-controls { gap: 15px; }
  .hero-dot::after { inset: -12px; }

  .product-tabs,
  .category-links,
  .woocommerce-MyAccount-navigation ul {
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
  }
  .product-tabs [role=tab] { flex: 0 0 auto; }
  .woocommerce ul.products li.product .button { min-height: 40px; line-height: 1.35; }
  .woocommerce-loop-product__title { overflow-wrap: anywhere; }

  .woocommerce-tabs ul.tabs {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
  }
  .woocommerce-tabs ul.tabs li { flex: 0 0 auto; }
  .woocommerce-tabs .panel { overflow-wrap: anywhere; }
  .woocommerce div.product form.cart .single_add_to_cart_button { min-width: 0; }

  .woocommerce-cart-form .product-name,
  .woocommerce-cart-form .product-subtotal,
  .woocommerce-checkout-review-order-table td { overflow-wrap: anywhere; }
  .woocommerce-cart-form .coupon input { min-width: 0; }
  .woocommerce-checkout #customer_details,
  .woocommerce-checkout #order_review { min-width: 0; }
  .woocommerce-checkout .select2-container { max-width: 100%; }
  .woocommerce-checkout-review-order-table { table-layout: fixed; }
  .woocommerce-checkout-review-order-table th:last-child,
  .woocommerce-checkout-review-order-table td:last-child { width: 38%; }
}

@media (hover: none) {
  .woocommerce ul.products li.product:hover .product-hover { opacity: 0; }
}

@media (max-width: 400px) {
  .header-inner { padding-inline: 8px; grid-template-columns: 1fr 68px 1fr; }
  .header-left { gap: 0; }
  .hero-copy { padding-inline: 18px; }
  .woocommerce form .form-row-first,
  .woocommerce form .form-row-last { float: none; width: 100%; clear: both; }
  .woocommerce-cart-form table.shop_table { table-layout: fixed; }
  .woocommerce-cart-form .product-remove { width: 30px; }
  .woocommerce-cart-form .product-quantity { width: 62px; }
  .woocommerce-cart-form .product-subtotal { width: 65px; }
  .woocommerce-cart-form .quantity input { max-width: 100%; }
}