.er-systems {
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 42%, rgba(255, 255, 255, .72), transparent 54%),
    #e8e5df;
}

.er-showcase-heading {
  position: relative;
  z-index: 2;
  max-width: 820px;
  margin: 0 auto 32px;
  padding: 28px 34px 30px;
  border: 1px solid rgba(216, 255, 67, .2);
  border-radius: 24px;
  background: linear-gradient(135deg, #0b110e, #17231b);
  box-shadow: 0 18px 50px rgba(14, 22, 17, .18);
  text-align: center;
}

.er-showcase-heading h2 {
  margin: 8px 0 0;
  color: #fff;
  text-shadow: 0 2px 18px rgba(0, 0, 0, .2);
}

.er-showcase-heading .eyebrow {
  color: #d8ff43;
}

.er-showcase-image {
  position: relative;
  overflow: hidden;
  margin: 0;
  background: transparent;
  -webkit-mask-image: radial-gradient(ellipse 94% 91% at center, #000 70%, transparent 100%);
  mask-image: radial-gradient(ellipse 94% 91% at center, #000 70%, transparent 100%);
}

.er-showcase-image img {
  display: block;
  width: 100%;
  height: auto;
}

.catalog-item .product-photo img[src*="roleta-elewacyjna-kafelek"] {
  object-position: center top !important;
}

.catalog-item .product-photo img[src*="roleta-wneka-bez-logo"] {
  object-position: center top !important;
}

.catalog-item .product-photo:has(img[src*="roleta-podtynkowa-przekroj"]) {
  height: 260px;
  background: #f2f2f0;
}

.catalog-item .product-photo img[src*="roleta-podtynkowa-przekroj"] {
  object-fit: contain !important;
  object-position: center !important;
  padding: 8px;
  box-sizing: border-box;
}

.catalog-item .product-photo:has(img[src*="roleta-nadstawna-expert-xtop"]) {
  height: 260px;
  background: radial-gradient(circle at 50% 35%, #303632, #111512 72%);
}

.catalog-item .product-photo img[src*="roleta-nadstawna-expert-xtop"] {
  object-fit: contain !important;
  object-position: center !important;
  padding: 8px;
  box-sizing: border-box;
}

@media (max-width: 560px) {
  .er-showcase-heading {
    margin-bottom: 22px;
    padding: 22px 18px 24px;
    border-radius: 18px;
  }

  .er-showcase-heading h2 {
    font-size: clamp(1.75rem, 9vw, 2.35rem);
  }

  .er-showcase-image {
    margin-inline: -12px;
    -webkit-mask-image: radial-gradient(ellipse 98% 94% at center, #000 76%, transparent 100%);
    mask-image: radial-gradient(ellipse 98% 94% at center, #000 76%, transparent 100%);
  }
}
