body.walytiq-shared-decor {
  --walytiq-decor-shell-width: 1340px;
  --walytiq-decor-width: 310px;
  --walytiq-decor-before-width: var(--walytiq-decor-width);
  --walytiq-decor-after-width: var(--walytiq-decor-width);
  --walytiq-decor-top: clamp(132px, 18vh, 232px);
  --walytiq-decor-left-offset: 124px;
  --walytiq-decor-after-start: 156px;
  --walytiq-decor-screen-gutter: 24px;
  --walytiq-decor-right-opacity: 0;
  --walytiq-decor-left-opacity: 0;
  --walytiq-decor-before-image: url('../imgs/left-bg.pilot.webp');
  --walytiq-decor-after-image: url('../imgs/bg.pilot.webp');
  --walytiq-decor-before-aspect-ratio: 310 / 696;
  --walytiq-decor-after-aspect-ratio: 310 / 696;
  position: relative;
  isolation: isolate;
}

body.walytiq-shared-decor::before,
body.walytiq-shared-decor::after {
  content: "";
  position: fixed;
  top: var(--walytiq-decor-top);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  pointer-events: none;
  z-index: 0;
  will-change: transform, opacity;
}

body.walytiq-shared-decor::before {
  width: var(--walytiq-decor-before-width);
  aspect-ratio: var(--walytiq-decor-before-aspect-ratio);
  left: max(
    calc(var(--walytiq-decor-screen-gutter) * -0.35),
    calc(50% - (var(--walytiq-decor-shell-width) / 2) - var(--walytiq-decor-left-offset))
  );
  background-image: var(--walytiq-decor-before-image);
  opacity: var(--walytiq-decor-left-opacity);
}

body.walytiq-shared-decor::after {
  width: var(--walytiq-decor-after-width);
  aspect-ratio: var(--walytiq-decor-after-aspect-ratio);
  left: min(
    calc(50% + (var(--walytiq-decor-shell-width) / 2) - var(--walytiq-decor-after-start)),
    calc(100vw - var(--walytiq-decor-after-width) - var(--walytiq-decor-screen-gutter))
  );
  background-image: var(--walytiq-decor-after-image);
  background-position: right center;
  opacity: var(--walytiq-decor-right-opacity);
}

body.walytiq-shared-decor #site {
  position: relative;
  z-index: 1;
}

body.walytiq-shared-decor .hero-info__bg,
body.walytiq-shared-decor .left__bg,
body.walytiq-shared-decor .right__bg {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

body.walytiq-shared-decor--page-both,
body.walytiq-shared-decor--editorial {
  --walytiq-decor-shell-width: 1340px;
  --walytiq-decor-left-opacity: 0.54;
  --walytiq-decor-right-opacity: 0.68;
}

body.walytiq-shared-decor--page-both-soft {
  --walytiq-decor-shell-width: 1200px;
  --walytiq-decor-left-opacity: 0.34;
  --walytiq-decor-right-opacity: 0.48;
}

body.walytiq-shared-decor--page-right {
  --walytiq-decor-shell-width: 1200px;
  --walytiq-decor-left-opacity: 0;
  --walytiq-decor-right-opacity: 0.56;
}

body.walytiq-shared-decor--commerce {
  --walytiq-decor-shell-width: 1340px;
  --walytiq-decor-left-opacity: 0;
  --walytiq-decor-right-opacity: 0.3;
}

body.walytiq-shared-decor--tutor-dashboard {
  --walytiq-decor-shell-width: 1340px;
  --walytiq-decor-left-opacity: 0;
  --walytiq-decor-right-opacity: 0.24;
}

body.walytiq-shared-decor--tutor-archive,
body.walytiq-shared-decor--tutor-course,
body.walytiq-shared-decor--tutor-bundle,
body.walytiq-shared-decor--tutor-learning {
  --walytiq-decor-shell-width: 1340px;
  --walytiq-decor-top: clamp(144px, 20vh, 248px);
  --walytiq-decor-left-opacity: 0;
  --walytiq-decor-after-aspect-ratio: 1920 / 1200;
  --walytiq-decor-after-image: url('../imgs/course-bg.pilot.webp');
}

body.walytiq-shared-decor--tutor-archive {
  --walytiq-decor-right-opacity: 0.16;
  --walytiq-decor-after-width: 310px;
  --walytiq-decor-after-aspect-ratio: 310 / 696;
  --walytiq-decor-after-image: url('../imgs/bg.pilot.webp');
}

body.walytiq-shared-decor--tutor-course,
body.walytiq-shared-decor--tutor-bundle {
  --walytiq-decor-right-opacity: 0;
  --walytiq-decor-after-width: 560px;
}

body.walytiq-shared-decor--tutor-learning {
  --walytiq-decor-right-opacity: 0;
  --walytiq-decor-after-width: 460px;
}

@media (max-width: 1199px) {
  body.walytiq-shared-decor {
    --walytiq-decor-shell-width: 1120px;
    --walytiq-decor-width: 248px;
    --walytiq-decor-left-offset: 92px;
    --walytiq-decor-after-width: 248px;
  }

  body.walytiq-shared-decor--tutor-archive {
    --walytiq-decor-after-width: 320px;
  }

  body.walytiq-shared-decor--tutor-course,
  body.walytiq-shared-decor--tutor-bundle {
    --walytiq-decor-after-width: 380px;
  }

  body.walytiq-shared-decor--tutor-learning {
    --walytiq-decor-after-width: 340px;
  }
}

@media (max-width: 1050px) {
  body.walytiq-shared-decor {
    --walytiq-decor-shell-width: 980px;
  }
}

@media (max-width: 991px) {
  body.walytiq-shared-decor::before,
  body.walytiq-shared-decor::after {
    display: none;
  }
}