/* Shared case imagery: homepage cards, catalog cards and case hero visuals. */
.section--cases .case-card,
.catalog-case[data-case-slug] {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.section--cases .case-card:nth-child(1),
.catalog-case[data-case-slug="sezonnaya-mebel"] {
  background-image:
    linear-gradient(90deg, rgba(247, 252, 226, .98) 0%, rgba(247, 252, 226, .92) 46%, rgba(247, 252, 226, .28) 78%, rgba(247, 252, 226, .08) 100%),
    url("/assets/case-visuals/seasonal-furniture.webp");
}

.section--cases .case-card:nth-child(2),
.catalog-case[data-case-slug="zagorodnyy-otel"] {
  background-image:
    linear-gradient(90deg, rgba(248, 245, 255, .98) 0%, rgba(248, 245, 255, .92) 48%, rgba(248, 245, 255, .24) 80%, rgba(248, 245, 255, .06) 100%),
    url("/assets/case-visuals/country-hotel.webp");
}

.section--cases .case-card:nth-child(3),
.catalog-case[data-case-slug="magazin-na-ozon"] {
  background-image:
    linear-gradient(90deg, rgba(239, 247, 255, .98) 0%, rgba(239, 247, 255, .94) 48%, rgba(239, 247, 255, .32) 80%, rgba(239, 247, 255, .08) 100%),
    url("/assets/case-visuals/marketplace-ozon.webp");
}

.section--cases .case-card:nth-child(4),
.catalog-case[data-case-slug="proizvoditel-igrovogo-oborudovaniya"] {
  background-image:
    linear-gradient(90deg, rgba(247, 251, 220, .98) 0%, rgba(247, 251, 220, .93) 48%, rgba(247, 251, 220, .25) 80%, rgba(247, 251, 220, .06) 100%),
    url("/assets/case-visuals/playground-equipment.webp");
}

.section--cases .case-card:nth-child(5),
.catalog-case[data-case-slug="yuridicheskie-uslugi"] {
  background-image:
    linear-gradient(90deg, rgba(18, 20, 18, .98) 0%, rgba(18, 20, 18, .93) 48%, rgba(18, 20, 18, .42) 80%, rgba(18, 20, 18, .1) 100%),
    url("/assets/case-visuals/legal-services.webp");
}

.catalog-case[data-case-slug="b2b-servis"] {
  background-image:
    linear-gradient(90deg, rgba(237, 245, 255, .98) 0%, rgba(237, 245, 255, .93) 48%, rgba(237, 245, 255, .26) 80%, rgba(237, 245, 255, .06) 100%),
    url("/assets/case-visuals/b2b-service.webp");
}

.catalog-case[data-case-slug="postavshchik-pilomaterialov"] {
  background-image:
    linear-gradient(90deg, rgba(247, 249, 221, .98) 0%, rgba(247, 249, 221, .93) 48%, rgba(247, 249, 221, .24) 80%, rgba(247, 249, 221, .06) 100%),
    url("/assets/case-visuals/lumber-supplier.webp");
}

.section--cases .case-card .case-scene,
.catalog-case[data-case-slug] .catalog-case__scene {
  display: none;
}

.fc-hero__visual,
.hc-hero__visual,
.oc-hero__visual,
.ec-hero__visual,
.lc-hero__visual,
.bsc-hero__visual,
.lsc-hero__visual {
  background-position: right center;
  background-repeat: no-repeat;
  background-size: cover;
}

.fc-hero__visual { background-image: url("/assets/case-visuals/seasonal-furniture.webp"); }
.hc-hero__visual { background-image: url("/assets/case-visuals/country-hotel.webp"); }
.oc-hero__visual { background-image: url("/assets/case-visuals/marketplace-ozon.webp"); }
.ec-hero__visual { background-image: url("/assets/case-visuals/playground-equipment.webp"); }
.lc-hero__visual { background-image: url("/assets/case-visuals/legal-services.webp"); }
.bsc-hero__visual { background-image: url("/assets/case-visuals/b2b-service.webp"); }
.lsc-hero__visual { background-image: url("/assets/case-visuals/lumber-supplier.webp"); }

.fc-hero__visual > *,
.hc-hero__visual > *,
.oc-hero__visual > *,
.ec-hero__visual > *,
.lc-hero__visual > *,
.bsc-hero__visual > *,
.lsc-hero__visual > * {
  visibility: hidden;
}

.fc-hero__visual::before,
.fc-hero__visual::after,
.hc-hero__visual::before,
.hc-hero__visual::after,
.oc-hero__visual::before,
.oc-hero__visual::after,
.ec-hero__visual::before,
.ec-hero__visual::after,
.lc-hero__visual::before,
.lc-hero__visual::after,
.bsc-hero__visual::before,
.bsc-hero__visual::after,
.lsc-hero__visual::before,
.lsc-hero__visual::after {
  opacity: 0;
}

@media (max-width: 640px) {
  .section--cases .case-card,
  .catalog-case[data-case-slug] {
    background-position: 64% center;
  }

  .fc-hero__visual,
  .hc-hero__visual,
  .oc-hero__visual,
  .ec-hero__visual,
  .lc-hero__visual,
  .bsc-hero__visual,
  .lsc-hero__visual {
    background-position: 68% center;
  }
}