@layer pages {
  /* Ownership: Shop landing-page presentation only.
     Masthead layout, typography and breadcrumbs are shared by every
     pillar/series/season landing page in pillar-landing-masthead.css.
     This file only needs the one value that differs here (image
     saturation) plus this pillar's own below-the-fold section styles. */
  body.peach.shop-editorial {
    --masthead-image-saturate: 0.56;
  }

  .shop-page { padding-top: clamp(2.25rem, 5vw, 4rem); padding-bottom: clamp(1.25rem, 3vw, 2rem); }
  .shop-page:has(> .landing-pitch) { padding-top: 0; }
  .shop-section__header { max-width: 72rem; margin-bottom: clamp(1.25rem, 2.6vw, 2rem); }
  .shop-section__eyebrow { margin: 0 0 0.6rem; color: var(--text-accent); font-family: var(--font-ui); font-size: var(--type-eyebrow-size); font-weight: var(--type-weight-bold, 700); letter-spacing: var(--type-tracking-eyebrow, 0.12em); line-height: var(--type-eyebrow-line, 1.35); text-transform: uppercase; }
  .shop-section__header .section-heading { margin: 0 0 0.75rem; padding: 0; border: 0; font-size: var(--type-section-heading-size, clamp(1.8rem, 3vw, 2.7rem)); }
  .shop-section__header .lead { max-width: 68ch; margin: 0; }

  @media (max-width: 767px) {
    .shop-page { padding-top: 2rem; }
    .shop-page:has(> .landing-pitch) { padding-top: 0; }
    .shop-section__header .section-heading { font-size: clamp(1.55rem, 7vw, 2rem); }
  }
}