/**
 * Next.js: .body-bg с z-index:-1 внутри #__next не виден.
 * Повторяем index_new через body::before — те же числа, что .scale-80 .body-bg + .body-bg--new.
 */
html.embedded-new-main-shell,
html.embedded-new-main-shell body {
  background-color: #141414 !important;
}

html.embedded-new-main-shell body {
  position: relative;
}

html.embedded-new-main-shell #__next,
html.embedded-new-main-shell #__next > div {
  background-color: transparent !important;
  position: relative;
  z-index: 1;
}

html.embedded-new-main-shell .embedded-new-main-shell-landing-root {
  background-color: transparent !important;
}

html.embedded-new-main-shell.embedded-landing-bg-index-new
  .embedded-new-main-shell-landing-root > picture,
html.embedded-new-main-shell.embedded-landing-bg-legacy
  .embedded-new-main-shell-landing-root > picture,
html.embedded-new-main-shell.embedded-landing-bg-legacy
  .embedded-new-main-shell-landing-root > img.body-bg {
  display: none !important;
}

/* .scale-80 .body-bg */
html.embedded-new-main-shell.embedded-landing-bg-index-new body::before {
  content: '';
  position: absolute;
  top: -160px;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  height: 100%;
  min-height: calc(100% + 160px);
  background-image: url('/new-main/img/new/main-bg-new.webp');
  background-size: cover;
  background-position: top center;
  background-repeat: no-repeat;
  mix-blend-mode: hard-light;
  z-index: 0;
  pointer-events: none;
}

/* .scale-80 .body-bg--new (min-width: 1101px) — transform не сбрасывается */
@media screen and (min-width: 1101px) {
  html.embedded-new-main-shell.embedded-landing-bg-index-new body::before {
    top: -320px;
    left: 43%;
    width: 114%;
    max-width: none;
  }
}

/* .scale-80 .body-bg @media max-width 1100px + picture mob source */
@media screen and (max-width: 1100px) {
  html.embedded-new-main-shell.embedded-landing-bg-index-new body::before {
    top: 0;
    left: 50%;
    width: 100%;
    height: 100%;
    min-height: unset;
    transform: translateX(-50%);
    background-image: url('/new-main/img/new/main-bg-new-mob.png');
  }
}

html.embedded-new-main-shell.embedded-landing-bg-legacy body::before {
  content: '';
  position: absolute;
  top: -160px;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  height: 100%;
  min-height: calc(100% + 160px);
  background-image: url('/new-main/img/main-bg.webp');
  background-size: cover;
  background-position: top center;
  background-repeat: no-repeat;
  mix-blend-mode: hard-light;
  z-index: 0;
  pointer-events: none;
}

@media screen and (max-width: 1100px) {
  html.embedded-new-main-shell.embedded-landing-bg-legacy body::before {
    top: 0;
    min-height: unset;
  }
}
