/* W2: keep the shop useful above the fold while preserving the shared card system. */
.shop-page > .section:first-child {
  padding: clamp(2rem, 4vw, 3.5rem) 0 1rem;
}

.shop-page > .flagship-shop {
  padding: 1rem 0 1.75rem;
}

.shop-page > .heels-landing {
  padding: 1.25rem 0;
}

.shop-page > .heels-landing .section-head {
  margin-bottom: 0;
}

.shop-page > .section:nth-of-type(4) {
  padding-top: 1.5rem;
}

.shop-page .shop-controls {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(10rem, 13rem);
  gap: .6rem;
  margin-bottom: .7rem;
}

.shop-page .shop-controls .field {
  width: 100%;
  min-height: 2.75rem;
}

.shop-page .chips {
  flex-wrap: nowrap;
  gap: .45rem;
  overflow-x: auto;
  padding: .15rem 0 .65rem;
  scrollbar-width: thin;
}

.shop-page .chips .chip {
  flex: 0 0 auto;
  white-space: nowrap;
}

.shop-page [data-shop-grid] {
  grid-auto-flow: dense;
  align-items: stretch;
  gap: clamp(.75rem, 1.5vw, 1.15rem);
}

@media (max-width: 700px) {
  .shop-page > .flagship-shop {
    padding-bottom: 1rem;
  }

  .shop-page > .heels-landing {
    padding: 1rem 0;
  }

  .shop-page .shop-controls {
    grid-template-columns: minmax(0, 1fr) minmax(8.5rem, 10rem);
  }
}

@media (max-width: 420px) {
  .shop-page > .section:first-child {
    padding-top: 1.5rem;
  }

  .shop-page .shop-controls {
    grid-template-columns: 1fr;
  }

  .shop-page > .section:nth-of-type(4) {
    padding-top: 1rem;
  }
}