/* Homepage-only fallbacks for Safari/iOS 14. No layout or navigation changes elsewhere.
   Use classic media syntax: old Safari discards range-based width queries. */
@media (max-width: 768px) {
  html.gsfc-store-layout .h5-home .oz-banner { margin-bottom: 0; }
  html.gsfc-store-layout .h5-home .oz-banner__inner { gap: 0; }
  html.gsfc-store-layout .h5-home .oz-banner__main,
  html.gsfc-store-layout .h5-home .oz-banner__img { border-radius: 0; }
  html.gsfc-store-layout .h5-home .oz-banner__side { display: none; }
  html.gsfc-store-layout .h5-home .oz-banner__inner,
  html.gsfc-store-layout .h5-home .oz-banner__swiper,
  html.gsfc-store-layout .h5-home .oz-banner__swiper .swiper-slide,
  html.gsfc-store-layout .h5-home .oz-banner__img {
    height: clamp(132px, 44vw, 280px);
  }
  html.gsfc-store-layout .h5-home .main-classification {
    box-shadow: none; background: transparent; border-radius: 0; padding: 0;
  }
  html.gsfc-store-layout .h5-home .main-daily,
  html.gsfc-store-layout .h5-home .main-stroe {
    box-shadow: none; background: transparent; border-radius: 0;
    margin-bottom: 12px; padding: 0;
  }
  html.gsfc-store-layout .h5-home .main-daily-content {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px;
  }
  html.gsfc-store-layout .h5-home .main-stroe-stores {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px;
  }
  html.gsfc-store-layout .h5-home .mobile-recommend-content {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  html.gsfc-store-layout .h5-home .pro-container { min-width: 0; max-width: 100%; }
  html.gsfc-store-layout .h5-home .section-head {
    margin-bottom: 14px; padding: 0; gap: 8px;
  }
  html.gsfc-store-layout .h5-home .section-head__left { min-width: 0; flex: 1 1 auto; }
  html.gsfc-store-layout .h5-home .section-head__bar { height: 16px; }
  html.gsfc-store-layout .h5-home .section-head h1 {
    min-width: 0; font-size: 17px; white-space: normal; word-wrap: break-word;
  }
  html.gsfc-store-layout .h5-home .section-head__more {
    flex: 0 0 auto; font-size: 13px; white-space: nowrap;
  }
  html.gsfc-store-layout .h5-home .oz-card__fav {
    width: 28px; height: 28px; top: 6px; right: 6px; font-size: 14px;
    border: none; color: #fff; background: rgba(0, 0, 0, .25);
  }
  html.gsfc-store-layout .h5-home .oz-card__badge {
    padding: 2px 6px; font-size: 10px; top: 8px; left: 8px;
  }
  html.gsfc-store-layout .h5-home .oz-card:hover { transform: none; }
  /* aspect-ratio arrived after iOS 14. Preserve square images without JS sizing. */
  @supports not (aspect-ratio: 1 / 1) {
    html.gsfc-store-layout .h5-home .oz-card__image-wrap { height: auto; position: relative; }
    html.gsfc-store-layout .h5-home .oz-card__image-wrap::before {
      content: ""; display: block; padding-top: 100%;
    }
    html.gsfc-store-layout .h5-home .oz-card__image-wrap > .oz-card__img {
      position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: contain;
    }
  }
}