/* Hero магазина — секция hero-shop (страница /shop/) */

/* overflow: visible — картинки при параллаксе могут уходить за край и рисоваться поверх следующей секции; скроллов нет (html/body overflow-x: hidden) */
.hero-shop {
  position: relative;
  z-index: 2;
  background-color: #f4eee9;
  background-image: url(/assets/images/shop/Shop_BG.png);
  background-repeat: repeat-x;
  background-position: 0 100%;
  overflow: visible;
}

.hero-shop__inner {
  position: relative;
  margin: 0 auto;
  max-width: 1200px;
  min-height: 590px;
  overflow: visible; /* картинки не обрезаются, могут уходить за край inner и за экран */
}

.hero-shop__img {
  position: absolute;
  height: auto;
  display: block;
  user-select: none;
  pointer-events: none;
}

/* Z-порядок: 1=Shop_BG (фон), 2–9=картинки, 10=заголовок */

/* Shop_back_street.png — 2 */
.hero-shop__img--shop-back-street {
  z-index: 2;
  top: 10px;
  left: -50px;
  width: 536px;
}

/* Shop_Main.png — 3 */
.hero-shop__img--shop-main {
  z-index: 3;
  top: 0;
  left: 334px;
  width: 832px;
}

/* Shop_cart.png — 4 */
.hero-shop__img--shop-cart {
  z-index: 4;
  top: 268px;
  left: 260px;
  width: 294px;
}

/* Shop_front_ground.png — 5 */
.hero-shop__img--shop-front-ground {
  z-index: 5;
  top: 435px;
  left: 290px;
  width: 661px;
}

/* FrontBG_Left_1.png — 6 */
.hero-shop__img--frontbg-left {
  z-index: 6;
  top: 10px;
  left: -490px;
  width: 922px;
}

/* FrontBG_Right_1.png — 7 */
.hero-shop__img--frontbg-right {
  z-index: 7;
  top: 0;
  left: 782px;
  width: 903px;
}

/* Stars_02.png — 8 */
.hero-shop__img--stars-02 {
  z-index: 8;
  top: 454px;
  left: 780px;
  width: 62px;
}

/* Stars_03.png — 9 */
.hero-shop__img--stars-03 {
  z-index: 9;
  top: 424px;
  left: 402px;
  width: 53px;
}

/* Заголовок (картинка Shop_text.png) — 10 */
.hero-shop__title {
  position: absolute;
  top: 480px;
  left: 463px;
  width: 316px;
  height: 40px;
  margin: 0;
  display: block;
  z-index: 10;
  user-select: none;
  pointer-events: none;
}

/* <= 1199 (Tilda 960) */
@media (max-width: 1199px) {
  .hero-shop__inner {
    max-width: 960px;
    min-height: 590px;
  }

  .hero-shop__img--shop-back-street { left: -170px; }
  .hero-shop__img--shop-main { left: 214px; }
  .hero-shop__img--shop-front-ground { left: 170px; }
  .hero-shop__img--shop-cart { left: 140px; }
  .hero-shop__img--frontbg-left { left: -610px; }
  .hero-shop__img--frontbg-right { left: 662px; }

  .hero-shop__title { left: 343px; }
  .hero-shop__img--stars-03 { left: 282px; }
  .hero-shop__img--stars-02 { left: 660px; }
}

/* <= 959 (Tilda 640) */
@media (max-width: 959px) {
  .hero-shop__inner {
    max-width: 640px;
    min-height: 590px;
  }

  .hero-shop__img--shop-back-street { left: -350px; }
  .hero-shop__img--shop-main { left: 34px; }
  .hero-shop__img--shop-front-ground { left: -10px; }
  .hero-shop__img--shop-cart { left: -40px; }
  .hero-shop__img--frontbg-left { left: -790px; }
  .hero-shop__img--frontbg-right { left: 482px; }

  .hero-shop__title { left: 163px; }
  .hero-shop__img--stars-03 { left: 102px; }
  .hero-shop__img--stars-02 { left: 480px; }
}

/* <= 639 (Tilda 480) */
@media (max-width: 639px) {
  .hero-shop__inner {
    max-width: 480px;
    min-height: 590px;
  }

  .hero-shop__img--shop-back-street { left: -420px; }
  .hero-shop__img--shop-main { left: -36px; }
  .hero-shop__img--shop-front-ground { left: -80px; }
  .hero-shop__img--shop-cart { left: -110px; }
  .hero-shop__img--frontbg-left { left: -860px; }
  .hero-shop__img--frontbg-right { left: 412px; }

  .hero-shop__title { left: 93px; }
  .hero-shop__img--stars-03 { left: -8px; }
  .hero-shop__img--stars-02 { left: 470px; }
}

/* <= 479 (Tilda 320) */
@media (max-width: 479px) {
  .hero-shop__inner {
    max-width: 320px;
    min-height: 590px;
  }

  .hero-shop__img--shop-back-street { left: -500px; }
  .hero-shop__img--shop-main { left: -116px; }
  .hero-shop__img--shop-front-ground { left: -160px; }
  .hero-shop__img--shop-cart { left: -190px; }
  .hero-shop__img--frontbg-left { left: -940px; }
  .hero-shop__img--frontbg-right { left: 332px; }

  /* Заголовок: то же смещение от shop-main, что на ПК (129px); размер 316×40 на всех экранах */
  .hero-shop__title {
    left: 13px;
  }

  .hero-shop__img--stars-03 {
    top: 504px;
    left: -30px;
  }

  .hero-shop__img--stars-02 {
    top: 443px;
    left: 310px;
    transform: rotate(5deg);
    transform-origin: 50% 50%;
  }
}