/* Responsive — 1440 / 768 / 390 */

@media (max-width: 1200px) {
  .rr-design-home__cat-grid {
    grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
  }
  .rr-design-home__product-grid {
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  }
  /* Footer grids live in footer.css (trust 4→2, nav 4→2). */
  .rr-design-header__menu {
    gap: 4px 12px;
  }
  .rr-design-header__menu a {
    font-size: 13px;
  }
}

/* U9: util bar overlaps ~800px — wrap + drop secondary util lines before mobile collapse */
@media (max-width: 1024px) {
  .rr-design-header__util-inner {
    flex-wrap: wrap;
    row-gap: 6px;
  }
  .rr-design-header__util-left {
    flex: 1 1 auto;
    min-width: 0;
  }
  .rr-design-header__util-right {
    flex: 0 0 auto;
    margin-left: auto;
  }
  .rr-design-header__util-left li:nth-child(n + 3) {
    display: none;
  }
}

@media (max-width: 900px) {
  .rr-design-header__util-left li:nth-child(n + 2) {
    display: none;
  }
}

@media (max-width: 1024px) {
  .rr-design-header__action span:not(.rr-design-header__badge):not(.rr-design-header__cart-price) {
    display: none;
  }
  .rr-design-header__cart-price {
    display: none;
  }
  .rr-design-home__hero {
    grid-template-columns: 1fr;
  }
  .rr-design-home__hero-main,
  .rr-design-home__hero-copy {
    min-height: 360px;
  }
  .rr-design-home__hero-copy {
    padding: 28px 24px;
    max-width: none;
  }
  .rr-design-home__hero-side {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-template-rows: none;
  }
  .rr-design-home__services {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .rr-design-header__cat-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px) {
  .rr-design-header__util,
  .rr-design-header__main,
  .rr-design-header__nav {
    display: none;
  }
  .rr-design-header__mobile,
  .rr-design-header__mobile-search {
    display: flex;
  }
  .rr-design-header__mobile-search {
    display: block;
  }
  .rr-design-header__mobile-search .rr-design-header__search {
    width: 100%;
  }

  .rr-design-home__hero-side {
    grid-template-columns: 1fr;
  }
  .rr-design-home__hero-tile {
    min-height: 112px;
  }
  .rr-design-home__section-head {
    flex-direction: column;
    align-items: flex-start;
  }
  .rr-design-home__cat-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }
  .rr-design-home__product-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }
  /* Product more-cards stay off below tablet; category more may show in ≤600 scroll track */
  .rr-design-home__product-grid .rr-design-home__more {
    display: none !important;
  }
  .rr-design-home__product {
    min-width: 0;
  }
  .rr-design-home__product-foot {
    gap: 8px;
  }
  .rr-design-home__price {
    font-size: 13px;
  }
  .rr-design-home__seasonal-copy {
    padding: 28px 22px;
  }
  .rr-design-home__services {
    grid-template-columns: 1fr;
  }
  .rr-design-home__newsletter-inner {
    flex-direction: column;
    align-items: flex-start;
  }
  .rr-design-home__newsletter-form {
    width: 100%;
  }
  .rr-design-home__newsletter-form input {
    min-width: 0;
    flex: 1;
    width: 100%;
  }
  /* Footer mobile layout: footer.css @media (max-width: 600px) */
}

/* HOME categories: single-row horizontal scroll (≤600px). PC / tablet unchanged. */
@media (max-width: 600px) {
  .rr-design-home__cats,
  .rr-design-home__cats .rr-design-wrap {
    min-width: 0;
    max-width: 100%;
  }

  .rr-design-home__cat-grid {
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-start;
    gap: 10px;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    scroll-snap-type: x proximity;
    min-width: 0;
    max-width: 100%;
    width: 100%;
    grid-template-columns: none;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  .rr-design-home__cat-grid::-webkit-scrollbar {
    display: none;
    width: 0;
    height: 0;
  }

  .rr-design-home__cat-card,
  .rr-design-home__cat-grid > .rr-design-home__more--cat {
    flex: 0 0 80px;
    width: 80px;
    max-width: 80px;
    min-width: 80px;
    scroll-snap-align: start;
    box-sizing: border-box;
  }

  .rr-design-home__cat-card figure,
  .rr-design-home__cat-grid > .rr-design-home__more--cat .rr-design-home__more-figure {
    width: 80px;
    height: 80px;
    max-width: 80px;
    max-height: 80px;
    aspect-ratio: 1 / 1;
    margin: 0 0 6px;
    border-radius: 12px;
  }

  .rr-design-home__cat-card img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 6px;
  }

  .rr-design-home__cat-card > span,
  .rr-design-home__cat-grid > .rr-design-home__more--cat .rr-design-home__more-label {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.25;
    width: 80px;
    max-width: 80px;
    word-break: break-word;
    overflow-wrap: anywhere;
    text-align: center;
    color: var(--rr-design-ink, var(--rr-design-ink));
  }

  /* Same DOM more-card as PC fill — force visible in scroll track when JS activates it */
  .rr-design-home__cat-grid > .rr-design-home__more--cat.is-active,
  .rr-design-home__cat-grid > .rr-design-home__more--cat:not([hidden]) {
    display: block !important;
  }
}

@media (max-width: 430px) {
  .rr-design-wrap {
    width: min(100% - 24px, var(--rr-design-max));
  }
  .rr-design-home__hero-copy {
    padding: 28px 22px;
    min-height: 360px;
  }
  .rr-design-home__hero-main {
    min-height: 360px;
  }
  .rr-design-header__logo,
  .rr-design-header__mobile .rr-design-header__logo {
    font-size: 24px;
  }
}

/* Prevent horizontal overflow */
.rr-design-body,
.rr-design-header,
.rr-design-home,
.rr-design-footer {
  max-width: 100vw;
  overflow-x: clip;
}
