.landing-section-photo {
  margin: 0;
  overflow: hidden;
  border: 1px solid #ffffffd8;
  border-radius: 30px;
  background: #ffffffb8;
  box-shadow: var(--editorial-shadow);
}

.landing-section-photo img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

/* Editorial photos are intentionally portrait-oriented. Most source artwork is
   page-like, so a 4:5 frame shows it naturally instead of cropping it into banners. */
.landing-section-photo-wide {
  width: min(100%, 420px);
  aspect-ratio: 4 / 5;
  margin: 0 auto clamp(26px, 4vw, 46px);
}

.landing-section-photo-side {
  width: min(100%, 420px);
  min-height: 0;
  aspect-ratio: 4 / 5;
  justify-self: center;
}

.landing-section-photo-paper {
  width: min(100%, 420px);
  aspect-ratio: 4 / 5;
}

.landing-section-photo-binding {
  width: min(100%, 380px);
  aspect-ratio: 4 / 5;
  margin-inline: auto;
}

.coloring-hero-photo {
  min-height: 0;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  border: 1px solid #ffffffdf;
  border-radius: 34px;
  background: #ffffffba;
  box-shadow: 0 30px 90px #4d347442;
  transform: rotate(1.2deg);
}

.coloring-hero-photo img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.coloring-item-photo {
  width: min(100%, 320px);
  aspect-ratio: 4 / 5;
  margin: 0 auto 18px;
  overflow: hidden;
  border: 1px solid #ffffffdd;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 12px 30px #513b7520;
}

.coloring-item-photo img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.craft-flow article.has-item-photo > span {
  margin-bottom: 16px;
}

.scheme-step-photo {
  max-width: 230px;
  margin: 0 auto 20px;
}

.material-card .coloring-item-photo {
  margin-bottom: 14px;
  border-radius: 14px;
}

.material-card .coloring-item-photo + span {
  margin-bottom: 16px;
}

.kit-grid .coloring-item-photo {
  margin-bottom: 16px;
}

.landing-store-return {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 9px 12px;
  border: 1px solid #8b65ff42;
  border-radius: 13px;
  color: #6849d7;
  background: #ffffffbd;
  font-weight: 900;
  text-decoration: none;
  white-space: nowrap;
}

@media (max-width: 960px) {
  .landing-store-return {
    margin-left: auto;
    min-height: 38px;
    padding: 8px 9px;
    font-size: 12px;
  }

  .editorial-cart {
    margin-left: 0;
  }
}

@media (max-width: 620px) {
  .landing-section-photo-wide,
  .landing-section-photo-side,
  .landing-section-photo-paper,
  .landing-section-photo-binding {
    width: min(100%, 360px);
    min-height: 0;
    aspect-ratio: 4 / 5;
    margin-inline: auto;
    border-radius: 22px;
  }

  .coloring-hero-photo {
    width: min(100%, 380px);
    justify-self: center;
    aspect-ratio: 4 / 5;
    border-radius: 24px;
    transform: none;
  }

  .coloring-item-photo,
  .scheme-step-photo {
    width: min(100%, 320px);
    max-width: 320px;
    aspect-ratio: 4 / 5;
    margin-inline: auto;
    border-radius: 14px;
  }
}