/**
 * Swiper 6.7.0
 * Most modern mobile touch slider and framework with hardware accelerated transitions
 * https://swiperjs.com
 *
 * Copyright 2014-2021 Vladimir Kharlampidi
 *
 * Released under the MIT License
 *
 * Released on: May 31, 2021
 */
@font-face {
  font-family: swiper-icons;
  src: url("data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA") format("woff");
  font-weight: 400;
  font-style: normal;
}
:root {
  --swiper-theme-color:#007aff;
}

.swiper-container {
  margin-left: auto;
  margin-right: auto;
  position: relative;
  overflow: hidden;
  list-style: none;
  padding: 0;
  z-index: 1;
}

.swiper-container-vertical > .swiper-wrapper {
  flex-direction: column;
}

.swiper-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 1;
  display: flex;
  transition-property: transform;
  box-sizing: content-box;
}

.swiper-container-android .swiper-slide, .swiper-wrapper {
  transform: translate3d(0px, 0, 0);
}

.swiper-container-multirow > .swiper-wrapper {
  flex-wrap: wrap;
}

.swiper-container-multirow-column > .swiper-wrapper {
  flex-wrap: wrap;
  flex-direction: column;
}

.swiper-container-free-mode > .swiper-wrapper {
  transition-timing-function: ease-out;
  margin: 0 auto;
}

.swiper-container-pointer-events {
  touch-action: pan-y;
}

.swiper-container-pointer-events.swiper-container-vertical {
  touch-action: pan-x;
}

.swiper-slide {
  flex-shrink: 0;
  width: 100%;
  height: 100%;
  position: relative;
  transition-property: transform;
}

.swiper-slide-invisible-blank {
  visibility: hidden;
}

.swiper-container-autoheight, .swiper-container-autoheight .swiper-slide {
  height: auto;
}

.swiper-container-autoheight .swiper-wrapper {
  align-items: flex-start;
  transition-property: transform, height;
}

.swiper-container-3d {
  perspective: 1200px;
}

.swiper-container-3d .swiper-cube-shadow, .swiper-container-3d .swiper-slide, .swiper-container-3d .swiper-slide-shadow-bottom, .swiper-container-3d .swiper-slide-shadow-left, .swiper-container-3d .swiper-slide-shadow-right, .swiper-container-3d .swiper-slide-shadow-top, .swiper-container-3d .swiper-wrapper {
  transform-style: preserve-3d;
}

.swiper-container-3d .swiper-slide-shadow-bottom, .swiper-container-3d .swiper-slide-shadow-left, .swiper-container-3d .swiper-slide-shadow-right, .swiper-container-3d .swiper-slide-shadow-top {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 10;
}

.swiper-container-3d .swiper-slide-shadow-left {
  background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}

.swiper-container-3d .swiper-slide-shadow-right {
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}

.swiper-container-3d .swiper-slide-shadow-top {
  background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}

.swiper-container-3d .swiper-slide-shadow-bottom {
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}

.swiper-container-css-mode > .swiper-wrapper {
  overflow: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.swiper-container-css-mode > .swiper-wrapper::-webkit-scrollbar {
  display: none;
}

.swiper-container-css-mode > .swiper-wrapper > .swiper-slide {
  scroll-snap-align: start start;
}

.swiper-container-horizontal.swiper-container-css-mode > .swiper-wrapper {
  scroll-snap-type: x mandatory;
}

.swiper-container-vertical.swiper-container-css-mode > .swiper-wrapper {
  scroll-snap-type: y mandatory;
}

:root {
  --swiper-navigation-size:44px;
}

.swiper-button-next, .swiper-button-prev {
  position: absolute;
  top: 50%;
  width: calc(var(--swiper-navigation-size) / 44 * 27);
  height: var(--swiper-navigation-size);
  margin-top: calc(0px - var(--swiper-navigation-size) / 2);
  z-index: 10;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--swiper-navigation-color, var(--swiper-theme-color));
}

.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled {
  opacity: 0.35;
  cursor: auto;
  pointer-events: none;
}

.swiper-button-next:after, .swiper-button-prev:after {
  font-family: swiper-icons;
  font-size: var(--swiper-navigation-size);
  text-transform: none !important;
  letter-spacing: 0;
  text-transform: none;
  font-variant: initial;
  line-height: 1;
}

.swiper-button-prev, .swiper-container-rtl .swiper-button-next {
  left: 10px;
  right: auto;
}

.swiper-button-prev:after, .swiper-container-rtl .swiper-button-next:after {
  content: "prev";
}

.swiper-button-next, .swiper-container-rtl .swiper-button-prev {
  right: 10px;
  left: auto;
}

.swiper-button-next:after, .swiper-container-rtl .swiper-button-prev:after {
  content: "next";
}

.swiper-button-next.swiper-button-white, .swiper-button-prev.swiper-button-white {
  --swiper-navigation-color:#ffffff;
}

.swiper-button-next.swiper-button-black, .swiper-button-prev.swiper-button-black {
  --swiper-navigation-color:#000000;
}

.swiper-button-lock {
  display: none;
}

.swiper-pagination {
  position: absolute;
  text-align: center;
  transition: 0.3s opacity;
  transform: translate3d(0, 0, 0);
  z-index: 10;
}

.swiper-pagination.swiper-pagination-hidden {
  opacity: 0;
}

.swiper-container-horizontal > .swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction {
  bottom: 10px;
  left: 0;
  width: 100%;
}

.swiper-pagination-bullets-dynamic {
  overflow: hidden;
  font-size: 0;
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  transform: scale(0.33);
  position: relative;
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active {
  transform: scale(1);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main {
  transform: scale(1);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
  transform: scale(0.66);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
  transform: scale(0.33);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
  transform: scale(0.66);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
  transform: scale(0.33);
}

.swiper-pagination-bullet {
  width: 8px;
  height: 8px;
  display: inline-block;
  border-radius: 50%;
  background: #000;
  opacity: 0.2;
}

button.swiper-pagination-bullet {
  border: none;
  margin: 0;
  padding: 0;
  box-shadow: none;
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
}

.swiper-pagination-clickable .swiper-pagination-bullet {
  cursor: pointer;
}

.swiper-pagination-bullet-active {
  opacity: 1;
  background: var(--swiper-pagination-color, var(--swiper-theme-color));
}

.swiper-container-vertical > .swiper-pagination-bullets {
  right: 10px;
  top: 50%;
  transform: translate3d(0px, -50%, 0);
}

.swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 6px 0;
  display: block;
}

.swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
  top: 50%;
  transform: translateY(-50%);
  width: 8px;
}

.swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  display: inline-block;
  transition: 0.2s transform, 0.2s top;
}

.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 0 4px;
}

.swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
  left: 50%;
  transform: translateX(-50%);
  white-space: nowrap;
}

.swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  transition: 0.2s transform, 0.2s left;
}

.swiper-container-horizontal.swiper-container-rtl > .swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  transition: 0.2s transform, 0.2s right;
}

.swiper-pagination-progressbar {
  background: rgba(0, 0, 0, 0.25);
  position: absolute;
}

.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
  background: var(--swiper-pagination-color, var(--swiper-theme-color));
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  transform: scale(0);
  transform-origin: left top;
}

.swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
  transform-origin: right top;
}

.swiper-container-horizontal > .swiper-pagination-progressbar, .swiper-container-vertical > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
  width: 100%;
  height: 4px;
  left: 0;
  top: 0;
}

.swiper-container-horizontal > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite, .swiper-container-vertical > .swiper-pagination-progressbar {
  width: 4px;
  height: 100%;
  left: 0;
  top: 0;
}

.swiper-pagination-white {
  --swiper-pagination-color:#ffffff;
}

.swiper-pagination-black {
  --swiper-pagination-color:#000000;
}

.swiper-pagination-lock {
  display: none;
}

.swiper-scrollbar {
  border-radius: 10px;
  position: relative;
  -ms-touch-action: none;
  background: rgba(0, 0, 0, 0.1);
}

.swiper-container-horizontal > .swiper-scrollbar {
  position: absolute;
  left: 1%;
  bottom: 3px;
  z-index: 50;
  height: 5px;
  width: 98%;
}

.swiper-container-vertical > .swiper-scrollbar {
  position: absolute;
  right: 3px;
  top: 1%;
  z-index: 50;
  width: 5px;
  height: 98%;
}

.swiper-scrollbar-drag {
  height: 100%;
  width: 100%;
  position: relative;
  background: rgba(0, 0, 0, 0.5);
  border-radius: 10px;
  left: 0;
  top: 0;
}

.swiper-scrollbar-cursor-drag {
  cursor: move;
}

.swiper-scrollbar-lock {
  display: none;
}

.swiper-zoom-container {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.swiper-zoom-container > canvas, .swiper-zoom-container > img, .swiper-zoom-container > svg {
  max-width: 100%;
  max-height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

.swiper-slide-zoomed {
  cursor: move;
}

.swiper-lazy-preloader {
  width: 42px;
  height: 42px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -21px;
  margin-top: -21px;
  z-index: 10;
  transform-origin: 50%;
  animation: swiper-preloader-spin 1s infinite linear;
  box-sizing: border-box;
  border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color));
  border-radius: 50%;
  border-top-color: transparent;
}

.swiper-lazy-preloader-white {
  --swiper-preloader-color:#fff;
}

.swiper-lazy-preloader-black {
  --swiper-preloader-color:#000;
}

@keyframes swiper-preloader-spin {
  100% {
    transform: rotate(360deg);
  }
}
.swiper-container .swiper-notification {
  position: absolute;
  left: 0;
  top: 0;
  pointer-events: none;
  opacity: 0;
  z-index: -1000;
}

.swiper-container-fade.swiper-container-free-mode .swiper-slide {
  transition-timing-function: ease-out;
}

.swiper-container-fade .swiper-slide {
  pointer-events: none;
  transition-property: opacity;
}

.swiper-container-fade .swiper-slide .swiper-slide {
  pointer-events: none;
}

.swiper-container-fade .swiper-slide-active, .swiper-container-fade .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}

.swiper-container-cube {
  overflow: visible;
}

.swiper-container-cube .swiper-slide {
  pointer-events: none;
  backface-visibility: hidden;
  z-index: 1;
  visibility: hidden;
  transform-origin: 0 0;
  width: 100%;
  height: 100%;
}

.swiper-container-cube .swiper-slide .swiper-slide {
  pointer-events: none;
}

.swiper-container-cube.swiper-container-rtl .swiper-slide {
  transform-origin: 100% 0;
}

.swiper-container-cube .swiper-slide-active, .swiper-container-cube .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}

.swiper-container-cube .swiper-slide-active, .swiper-container-cube .swiper-slide-next, .swiper-container-cube .swiper-slide-next + .swiper-slide, .swiper-container-cube .swiper-slide-prev {
  pointer-events: auto;
  visibility: visible;
}

.swiper-container-cube .swiper-slide-shadow-bottom, .swiper-container-cube .swiper-slide-shadow-left, .swiper-container-cube .swiper-slide-shadow-right, .swiper-container-cube .swiper-slide-shadow-top {
  z-index: 0;
  backface-visibility: hidden;
}

.swiper-container-cube .swiper-cube-shadow {
  position: absolute;
  left: 0;
  bottom: 0px;
  width: 100%;
  height: 100%;
  opacity: 0.6;
  z-index: 0;
}

.swiper-container-cube .swiper-cube-shadow:before {
  content: "";
  background: #000;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  filter: blur(50px);
}

.swiper-container-flip {
  overflow: visible;
}

.swiper-container-flip .swiper-slide {
  pointer-events: none;
  backface-visibility: hidden;
  z-index: 1;
}

.swiper-container-flip .swiper-slide .swiper-slide {
  pointer-events: none;
}

.swiper-container-flip .swiper-slide-active, .swiper-container-flip .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}

.swiper-container-flip .swiper-slide-shadow-bottom, .swiper-container-flip .swiper-slide-shadow-left, .swiper-container-flip .swiper-slide-shadow-right, .swiper-container-flip .swiper-slide-shadow-top {
  z-index: 0;
  backface-visibility: hidden;
}

@keyframes confetti-slow {
  0% {
    transform: translate3d(0, 0, 0) rotateX(0) rotateY(0);
  }
  100% {
    transform: translate3d(25px, 105vh, 0) rotateX(360deg) rotateY(180deg);
  }
}
@keyframes confetti-medium {
  0% {
    transform: translate3d(0, 0, 0) rotateX(0) rotateY(0);
  }
  100% {
    transform: translate3d(100px, 105vh, 0) rotateX(100deg) rotateY(360deg);
  }
}
@keyframes confetti-fast {
  0% {
    transform: translate3d(0, 0, 0) rotateX(0) rotateY(0);
  }
  100% {
    transform: translate3d(-50px, 105vh, 0) rotateX(10deg) rotateY(250deg);
  }
}
.confetti-container {
  perspective: 700px;
  position: fixed;
  overflow: hidden;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

.confetti {
  position: absolute;
  z-index: 1;
  top: -10px;
  border-radius: 0%;
}
.confetti--animation-slow {
  animation: confetti-slow 3.15s linear 1 forwards;
}
.confetti--animation-medium {
  animation: confetti-medium 2.45s linear 1 forwards;
}
.confetti--animation-fast {
  animation: confetti-fast 1.75s linear 1 forwards;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section {
  display: block;
}

audio,
canvas,
video {
  display: inline-block;
}

audio:not([controls]) {
  display: none;
}

html {
  font-size: 100%;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}

sub,
sup {
  position: relative;
  font-size: 75%;
  line-height: 0;
  vertical-align: baseline;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

img {
  border: 0;
  -ms-interpolation-mode: bicubic;
}

form {
  margin: 0;
  padding: 0;
}

button,
input,
select,
textarea {
  margin: 0;
  font-size: 100%;
  vertical-align: middle;
  -webkit-font-smoothing: antialiased;
}

button,
input {
  line-height: normal;
}

button,
html input[type=button],
input[type=reset],
input[type=submit] {
  -webkit-appearance: button;
  cursor: pointer;
}

label,
select,
button,
input[type=button],
input[type=reset],
input[type=submit],
input[type=radio],
input[type=checkbox] {
  cursor: pointer;
}

fieldset {
  padding: 0;
  margin: 0;
  border: 0;
}

textarea {
  overflow: auto;
  vertical-align: top;
}

input::-ms-clear {
  display: none;
}

/* Slider */
.slick-slider {
  position: relative;
  display: block;
  box-sizing: border-box;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -khtml-user-select: none;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent;
}

.slick-list {
  position: relative;
  display: block;
  overflow: hidden;
  margin: 0;
  padding: 0;
}

.slick-list:focus {
  outline: none;
}

.slick-list.dragging {
  cursor: pointer;
  cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list {
  transform: translate3d(0, 0, 0);
}

.slick-track {
  position: relative;
  top: 0;
  left: 0;
  display: block;
}

.slick-track:before,
.slick-track:after {
  display: table;
  content: "";
}

.slick-track:after {
  clear: both;
}

.slick-loading .slick-track {
  visibility: hidden;
}

.slick-slide {
  display: none;
  float: left;
  height: 100%;
  min-height: 1px;
}

[dir=rtl] .slick-slide {
  float: right;
}

.slick-slide img {
  display: block;
}

.slick-slide.slick-loading img {
  display: none;
}

.slick-slide.dragging img {
  pointer-events: none;
}

.slick-initialized .slick-slide {
  display: block;
}

.slick-loading .slick-slide {
  visibility: hidden;
}

.slick-vertical .slick-slide {
  display: block;
  height: auto;
  border: 1px solid transparent;
}

.slick-arrow.slick-hidden {
  display: none;
}

@font-face {
  font-family: "Inter";
  src: url("fonts/Inter-Regular.woff2") format("woff2"), url("fonts/Inter-Regular.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Inter";
  src: url("fonts/Inter-SemiBold.woff2") format("woff2"), url("fonts/Inter-SemiBold.woff") format("woff");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Inter";
  src: url("fonts/Inter-SemiBoldItalic.woff2") format("woff2"), url("fonts/Inter-SemiBoldItalic.woff") format("woff");
  font-weight: 600;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Inter";
  src: url("fonts/Inter-BoldItalic.woff2") format("woff2"), url("fonts/Inter-BoldItalic.woff") format("woff");
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Inter";
  src: url("fonts/Inter-ExtraBoldItalic.woff2") format("woff2"), url("fonts/Inter-ExtraBoldItalic.woff") format("woff");
  font-weight: 800;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Inter";
  src: url("fonts/Inter-BlackItalic.woff2") format("woff2"), url("fonts/Inter-BlackItalic.woff") format("woff");
  font-weight: 900;
  font-style: italic;
  font-display: swap;
}
body, html {
  height: 100%;
  min-height: 100%;
  min-width: 320px;
  scroll-behavior: smooth;
}

body {
  padding: 0px;
  margin: 0px;
  color: #fff;
  line-height: 1.5;
  font-size: 16px;
  font-family: "Inter", Arial, Helvetica, sans-serif;
  background: #17224C;
  font-weight: 400;
  overflow-y: auto;
  scroll-behavior: smooth;
}
body.overflow {
  height: 100vh;
  height: 100svh;
  overflow: hidden;
}

img {
  display: block;
  max-width: 100%;
  border-style: none;
}

*,
*:before,
*:after {
  box-sizing: border-box;
  touch-action: manipulation;
}

*:hover,
*:focus,
*:active {
  outline: none;
}

a:not(.button) {
  text-decoration: underline;
  color: inherit;
}

a:not(.button):hover {
  text-decoration: none;
}

ul, ol {
  margin: 0;
  padding: 0;
  list-style: none outside;
}

b {
  font-weight: 700;
}

p {
  margin: 0 0 0.5em;
}

p:last-child {
  margin-bottom: 0;
}

.center {
  text-align: center;
}

.nowrap {
  white-space: nowrap;
}

.hidden {
  display: none !important;
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  clip: rect(0 0 0 0);
  overflow: hidden;
}

.container {
  max-width: 1775px;
  width: 92%;
  margin: 0 auto;
}

@media (max-width: 1079.9px) {
  .container {
    width: 100%;
    padding-left: 28px;
    padding-right: 28px;
  }
}
.button {
  display: inline-flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
  vertical-align: top;
  font-size: 20px;
  text-decoration: none;
  padding: 0.5em 1em;
  line-height: 1.2;
  height: 3.6em;
  text-align: center;
  border: 0 none;
  margin: 0;
  font-family: "Inter", Arial, Helvetica, sans-serif;
  font-weight: 600;
  border-radius: 1.8em;
  position: relative;
  width: 100%;
  max-width: 544px;
  white-space: nowrap;
}

.button--100 {
  width: 100%;
  max-width: none;
}

.button[disabled] {
  pointer-events: none;
}

.button--red {
  background-color: #F1111F;
  color: #fff;
  transition: background-color 0.15s ease;
}

@media (hover: hover) {
  .button--red:hover {
    background-color: #be0612;
  }
}
.button--white {
  background: #E5D2F9;
  color: #F1111F;
  transition: background-color 0.15s ease;
}

@media (hover: hover) {
  .button--white:hover {
    background-color: #fff;
  }
}
.outer {
  width: 100%;
  overflow: hidden;
}

@media (max-width: 1079.9px) {
  .button {
    font-size: 14px;
    height: 3.85em;
    border-radius: 2em;
    max-width: 300px;
  }
}
.yellow {
  color: #FFE34F;
}

.loader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2000;
  background: linear-gradient(180deg, #432D7E 0%, #17224C 100%);
  font-size: min(1px, 0.1vh);
}

.loader__logo {
  position: absolute;
  top: 2.4%;
  left: 50%;
  transform: translateX(-50%);
  width: 155em;
}
.loader__logo img {
  display: block;
  width: 100%;
}

.loader__img {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  transform: translateY(-50%);
}
.loader__img img {
  display: block;
  margin: 0 auto;
  width: 225em;
  max-width: 40%;
}

@media (max-width: 1079.9px) {
  .loader {
    font-size: 0.6px;
  }
  .loader__img img {
    width: 140px;
  }
}
.lp {
  background: #432D7E;
  min-height: 100vh;
}

.lp__blue-bg {
  background: #17224C;
}

.lp__container {
  max-width: 2560px;
  margin: 0 auto;
}

.lp__creative {
  height: min(978px, 50vw);
  background: url(img/lp-creative.jpg) no-repeat top center/auto 100% transparent;
  position: relative;
}
.lp__creative h1 {
  text-align: center;
  font-size: min(80px, 4.15vw);
  font-style: italic;
  font-weight: 900;
  line-height: 0.96;
  letter-spacing: 0.01em;
  text-transform: uppercase;
  color: #fff;
  margin: 0;
  position: absolute;
  top: 12.2%;
  left: 0;
  right: 0;
  filter: drop-shadow(0.0375em 0.0375em 0 #442564) drop-shadow(0.0375em 0.0375em 0.75em rgba(35, 0, 71, 0.4));
}

@supports ((-webkit-background-clip: text) or (background-clip: text)) or (-webkit-background-clip: text) {
  .lp__creative h1 {
    background: linear-gradient(179deg, #FFF 5.45%, #9F70D1 127.01%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }
}
.lp__logo {
  position: absolute;
  top: 2.4%;
  left: 50%;
  transform: translateX(-50%);
  width: min(155px, 8%);
}
.lp__logo img {
  display: block;
  width: 100%;
}

.lp__welcome {
  margin: -8.28% auto 0;
  position: relative;
  width: 96%;
  max-width: 1840px;
  padding-bottom: 40px;
  font-size: min(20px, 1.38vw);
}
.lp__welcome h2 {
  font-size: 2.4em;
  font-style: italic;
  font-weight: 800;
  line-height: 1;
  margin: 0 auto 0.5em;
  max-width: 13em;
  position: relative;
}
.lp__welcome p {
  font-size: 1em;
  position: relative;
}
.lp__welcome .button {
  margin-top: 2em;
  position: relative;
}

@keyframes lp-tail {
  0% {
    transform: translate(-50%, 0);
    animation-timing-function: cubic-bezier(0.61, 1, 0.88, 1);
  }
  50% {
    transform: translate(-50%, 25%);
    animation-timing-function: cubic-bezier(0.61, 1, 0.88, 1);
  }
  100% {
    transform: translate(-50%, 0);
  }
}
.welcome__tail {
  width: 25.8%;
  background: url(img/lp-tail.svg) no-repeat top center/100% auto transparent;
  position: absolute;
  bottom: 100%;
  left: 50%;
  transform: translate(-50%, 1px);
  z-index: 5;
}
.welcome__tail:before {
  content: "";
  display: block;
  padding-top: 17.5%;
}
.welcome__tail:after {
  content: "";
  width: 11.66%;
  height: 38%;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  background: url(img/lp-arrow.svg) no-repeat center center/contain transparent;
  animation: lp-tail 1.5s linear infinite;
}

.welcome__bg {
  background: url(img/lp-welcome.png) no-repeat bottom center/100% auto, linear-gradient(180deg, #6C3C9F 0%, #002948 89.52%);
  border-radius: min(60px, 3.125vw);
  padding: 4.8% 20px 28.8%;
  color: #fff;
  text-align: center;
  overflow: hidden;
  position: relative;
}

.lp__web {
  position: absolute;
  top: 0;
}
.lp__web--left {
  width: min(442px, 25%);
  height: 443px;
  left: 0;
  background: url(img/lp-web-left.svg) no-repeat top left/contain transparent;
}
.lp__web--right {
  width: min(403px, 22%);
  height: 450px;
  right: 0;
  background: url(img/lp-web-right.svg) no-repeat top right/contain transparent;
}

@media (max-width: 1079.9px) {
  .lp__creative {
    height: 510px;
    background-image: url(img/lp-creative-m.jpg);
    background-size: 1080px auto;
  }
  .lp__creative h1 {
    top: 80px;
    font-size: min(34px, 9.4vw);
  }
  .lp__logo {
    width: 94px;
  }
  .lp__welcome {
    margin-top: -58px;
    width: auto;
    max-width: 960px;
    font-size: 16px;
  }
  .lp__welcome h2 {
    font-size: 28px;
  }
  .lp__welcome .button {
    margin-top: 1em;
  }
  .welcome__tail {
    width: 187px;
  }
  .welcome__bg {
    padding: 32px 20px 290px;
    background-size: auto 500px, auto;
    border-radius: 30px;
  }
  .lp__web {
    display: none;
  }
}
.rules {
  background: linear-gradient(180deg, #17224C 0%, #432D7E 100%);
  padding: 60px 0;
  text-align: center;
  color: #fff;
  font-size: min(1px, 0.057vw);
}
.rules h2 {
  font-size: 48em;
  font-style: italic;
  font-weight: 800;
  line-height: 1;
  margin: 0 0 0.83em;
}
.rules .button-hld {
  margin-top: 40em;
}
.rules .button-next {
  display: none;
}

.rules__container {
  max-width: 1680px;
  margin: 0 auto;
  width: 96%;
}

.cards__list {
  margin: 0 -12em;
}
.cards__list .swiper-wrapper {
  height: auto;
  align-items: stretch;
}
.cards__list:not(.swiper-container-initialized) .swiper-wrapper {
  display: flex;
  justify-content: center;
}
.cards__list .swiper-slide {
  padding: 0 12em;
  height: auto;
}
.cards__list .swiper-pagination {
  position: static;
  display: flex;
  flex-flow: row nowrap;
  align-items: stretch;
  justify-content: center;
  margin-top: 24em;
}
.cards__list .swiper-pagination-lock {
  display: none;
}
.cards__list .swiper-pagination-bullet {
  flex: 0 1 auto;
  background: #DECAF4;
  opacity: 0.2;
  border-radius: 4px;
}
.cards__list .swiper-pagination-bullet-active {
  opacity: 1;
  width: 32px;
  background: #B38EDA;
}

.card {
  max-width: 544em;
  height: 100%;
  border-radius: 40em;
  border: 1px solid rgba(6, 68, 93, 0.1);
  background: linear-gradient(180deg, rgba(205, 157, 255, 0.5) -15%, rgba(20, 173, 152, 0.5) 168.33%), rgba(29, 0, 126, 0.4);
  box-shadow: 0 4em 20em 0 rgba(0, 52, 107, 0.12);
  padding: 24em 24em 40em;
}
.card h3 {
  font-size: 36em;
  line-height: 1.2;
  font-style: italic;
  font-weight: 700;
  margin: 0 0 0.22em;
}
.card p {
  font-size: 16em;
  margin: 0 auto;
}

.card__img {
  border-radius: 16em;
  overflow: hidden;
  margin: 0 0 26em;
  background: linear-gradient(180deg, #212158 17.67%, #382B72 133.67%);
}
.card__img img {
  display: block;
  width: 100%;
}

.card__text--m {
  display: none;
}

.touch .card__text--d {
  display: none;
}
.touch .card__text--m {
  display: block;
}

@media (max-width: 1079.9px) {
  .lp__rules {
    padding: 40px 0;
    font-size: 0.83px;
  }
  .lp__rules h2 {
    font-size: 28px;
  }
  .lp__rules .cards__list {
    max-width: 320px;
    margin: 0 auto;
  }
  .lp__rules .cards__list .swiper-slide {
    padding: 0 10px;
  }
  .lp__rules .button-go {
    display: none;
  }
  .lp__rules .button-next {
    display: inline-flex;
  }
  .rules__container {
    width: auto;
  }
  .card {
    padding-bottom: 24em;
  }
  .card h3 {
    font-size: 24px;
  }
  .card p {
    font-size: 14px;
  }
}
.game__rules {
  font-size: min(1em, 0.057vw);
  max-width: 1820em;
  margin: 0 auto;
  border-radius: 48em;
  position: relative;
  padding: 60em;
}
.game__rules .cards__list {
  display: flex;
  flex-flow: row nowrap;
  align-items: stretch;
  justify-content: center;
}
.game__rules .card {
  max-width: 544em;
  flex: 1 1 544em;
  margin: 0 12em;
  height: auto;
}
.game__rules .button {
  font-size: 20em;
  max-width: min(544px, (100% - 2.4em) / 3);
}
.game__rules .card__text--d {
  display: block !important;
}
.game__rules .card__text--m {
  display: none !important;
}

.rules__close {
  display: none;
  font-size: 2.66em;
  width: 44em;
  height: 44em;
  border-radius: 50%;
  background: url(img/help-close.svg) no-repeat center center/20em 18em #F1111F;
  position: absolute;
  top: -11em;
  right: -11em;
  border: 0 none;
  margin: 0;
  padding: 0;
}

@media (max-width: 1079.9px) {
  .game__rules .card h3 {
    display: none;
  }
  .game__rules .card p {
    font-size: 32em;
    font-style: italic;
    font-weight: 600;
  }
  .game__rules .card__text--d {
    display: none !important;
  }
  .game__rules .card__text--m {
    display: block !important;
  }
  .game__rules .button-hld {
    display: none;
  }
  .rules__close {
    display: block;
  }
}
.popup {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(153, 122, 167, 0.5);
  overflow-y: auto;
  z-index: 1000;
  display: flex;
  font-size: min(1px, 0.1vh);
}

.popup__inner {
  flex: 1 1 100%;
  margin: auto 0;
  padding: 30em 0;
}

.popup__bg {
  border-radius: 48em;
  background: linear-gradient(180deg, #432D7E 0%, #17224C 100%);
  max-width: 800em;
  margin: 0 auto;
  color: #fff;
  text-align: center;
  padding: 40em;
}
.popup__bg > img {
  display: block;
  max-width: 100%;
  margin: 0 auto 24em;
}
.popup__bg .button {
  margin-top: 1.2em;
  font-size: 20em;
}
.popup__bg .button + .button {
  margin-top: 0.8em;
}

.popup__title {
  font-size: 36em;
  font-style: italic;
  font-weight: 700;
  line-height: 1.2;
  margin: 0 0 0.33em;
}

.popup__text {
  font-size: 16em;
}

.popup--pause .popup__title {
  margin-bottom: 0;
}
.popup--pause .popup__bg > img {
  max-width: 50%;
}

.popup--help .popup__inner {
  padding: 25em;
}

@media (max-width: 1079.9px) {
  .popup {
    font-size: 0.7px;
  }
  .popup__bg {
    max-width: 320px;
    padding: 24px;
    border-radius: 30px;
  }
  .popup__bg .button {
    font-size: 14px;
    height: 48px;
    margin-top: 1em;
  }
  .popup__title {
    font-size: 20px;
  }
  .popup__text {
    font-size: 12px;
  }
  .popup--pause .popup__bg > img {
    max-width: 110px;
  }
  .popup--lose .popup__bg > img {
    max-width: 225px;
  }
  .popup--help {
    font-size: min(1px, 0.1vh);
  }
}
.game-wrapper {
  width: 100%;
  height: 100vh;
  height: 100dvh;
  background: linear-gradient(180deg, #B29EFA 0%, #2E429A 100%);
  position: relative;
  overflow: hidden;
  display: flex;
  opacity: 1;
  transition: opacity 0.1s linear;
}
.game-wrapper.game-hidden {
  position: absolute;
  top: -100%;
  opacity: 0;
  z-index: -1;
}

.game-web {
  position: absolute;
}
.game-web--top-left {
  top: 0;
  left: 0;
  width: 1688px;
  height: 1324px;
  background: url(img/web-top-left.svg) no-repeat bottom right transparent;
}
.game-web--top-right {
  top: 0;
  right: 0;
  width: 1070px;
  height: 1095px;
  background: url(img/web-top-right.svg) no-repeat bottom left transparent;
}
.game-web--bottom-left {
  bottom: 0;
  left: 0;
  width: 751px;
  height: 688px;
  background: url(img/web-bottom-left.svg) no-repeat top right transparent;
}
.game-web--bottom-right {
  bottom: 0;
  right: 0;
  width: 751px;
  height: 688px;
  background: url(img/web-bottom-right.svg) no-repeat top left transparent;
}

.game-outer {
  width: 100%;
  height: 100%;
  max-width: 1920px;
  max-height: 1010px;
  margin: auto;
  flex: 1 1 100%;
  position: relative;
}

.game {
  --game-em: 1;
  font-size: calc(var(--game-em) * 1px);
  height: 100%;
  background: linear-gradient(180deg, #D5ACFF 0%, #1C7F9A 115.8%);
  padding: 25em;
  overflow: hidden;
}

.game__container {
  height: 100%;
  background: #072F50;
  overflow: hidden;
  position: relative;
}
.game__container > * {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
       user-select: none;
  -webkit-tap-highlight-color: transparent;
}

.game__header {
  position: absolute;
  top: 20em;
  left: 30em;
  right: 30em;
  z-index: 50;
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: space-between;
}

.logo img {
  display: block;
  width: 123em;
}

.game__menu {
  display: flex;
  flex-flow: row nowrap;
}

.header__button {
  display: block;
  font-size: inherit;
  width: 60em;
  height: 60em;
  border-radius: 50%;
  background: linear-gradient(180deg, rgba(205, 157, 255, 0.4) 0%, rgba(20, 173, 152, 0.4) 109.37%);
  backdrop-filter: blur(2px);
  border: 0 none;
  margin: 0;
  padding: 0;
  overflow: hidden;
}
.header__button + .header__button {
  margin-left: 20em;
}
.header__button::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background: none no-repeat center center transparent;
}
.header__button--sound::before {
  background-image: url("data:image/svg+xml,%3Csvg width='26' height='22' viewBox='0 0 26 22' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_2001_12942)'%3E%3Cpath d='M17.5002 7.06246C18.9999 9.06274 18.9999 12.9373 17.5002 14.9376M20.8753 3.12491C25.3618 7.40897 25.3888 14.6192 20.8753 18.8751M1.75 14.3289V7.66997C1.75 7.02421 2.25401 6.49995 2.87502 6.49995H6.90932C7.0582 6.49942 7.20542 6.46875 7.34212 6.40978C7.47882 6.3508 7.60216 6.26476 7.70471 6.15682L11.0798 2.34527C11.7885 1.60726 13.0002 2.13039 13.0002 3.17328V18.8267C13.0002 19.8775 11.7739 20.3961 11.0696 19.6435L7.70583 15.8533C7.60299 15.7423 7.47841 15.6537 7.33983 15.5929C7.20125 15.5321 7.05164 15.5005 6.90032 15.5001H2.87502C2.25401 15.5001 1.75 14.9758 1.75 14.3289Z' stroke='white' stroke-width='2.25003' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_2001_12942'%3E%3Crect width='26' height='22' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
  background-size: 26em 22em;
}
.header__button--sound.off::before {
  background-image: url("data:image/svg+xml,%3Csvg width='26' height='22' viewBox='0 0 26 22' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_796_87762)'%3E%3Cpath d='M24.736 14.5208L17.6943 7.47916M24.736 7.47916L17.6943 14.5208' stroke='white' stroke-width='2.34722' stroke-linecap='round'/%3E%3Cpath d='M1.26392 14.4727V7.52613C1.26392 6.85248 1.78969 6.30557 2.43753 6.30557H6.6461C6.8014 6.30502 6.95499 6.27302 7.0976 6.2115C7.2402 6.14998 7.36887 6.06022 7.47584 5.94762L10.9967 1.97143C11.736 1.20154 13 1.74727 13 2.83521V19.1648C13 20.261 11.7208 20.802 10.9861 20.0169L7.47701 16.063C7.36974 15.9472 7.23977 15.8547 7.0952 15.7913C6.95063 15.7279 6.79456 15.6949 6.63671 15.6945H2.43753C1.78969 15.6945 1.26392 15.1476 1.26392 14.4727Z' stroke='white' stroke-width='2.34722' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_796_87762'%3E%3Crect width='26' height='21.6667' fill='white' transform='translate(0 0.166656)'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
  background-size: 26em 22em;
}
.header__button--pause::before {
  background-image: url(img/pause-icon.svg);
  background-size: 26em 22em;
}
.header__button--help::before {
  background-image: url(img/help-icon.svg);
  background-size: 26em 22em;
}

.game__info {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-flow: row nowrap;
  justify-content: flex-start;
  align-items: stretch;
  height: 60em;
}
.game__info > * {
  background: linear-gradient(180deg, rgba(205, 157, 255, 0.4) -15%, rgba(20, 173, 152, 0.4) 168.33%);
  backdrop-filter: blur(2px);
  border-radius: 30em;
}

.game__points {
  padding: 0.42em 0.85em 0.35em 2.4em;
  color: #F9F9F9;
  text-align: left;
  font-size: 28em;
  font-weight: 600;
  line-height: 1.35;
  position: relative;
}
.game__points::before {
  content: "";
  width: 1.14em;
  height: 1.14em;
  background: url(img/points-icon.svg) no-repeat 0 0/contain transparent;
  position: absolute;
  left: 0.85em;
  top: calc(50% - 0.57em);
}
.game__points span {
  color: #FFE34F;
}

.game__lives {
  margin-left: 20em;
  padding: 14em 24em;
  display: flex;
  flex-flow: row nowrap;
}

@keyframes minusLife {
  0% {
    transform: scale(1);
    opacity: 1;
  }
  30% {
    transform: scale(1.2);
    opacity: 1;
  }
  100% {
    transform: scale(0);
    opacity: 0;
  }
}
.game__life {
  width: 37em;
  height: 32em;
  background: url(img/heart-empty.svg) no-repeat 0 0/contain transparent;
}
.game__life + .game__life {
  margin-left: 12em;
}
.game__life:before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background: url(img/heart-full.svg) no-repeat 0 0/contain transparent;
  transform-origin: center center;
  transition: transform 0.3s cubic-bezier(0.6, -0.28, 0.735, 0.045), opacity 0.1s ease 0.2s;
  transform: scale(0);
  opacity: 0;
}
.game__life--full:before {
  transform: scale(1);
  opacity: 1;
}

@keyframes bg_move {
  to {
    background-position: -4200em;
  }
}
.paused .game__bg-back,
.paused .game__bg-middle,
.paused .game__bg-front,
.paused .hero__image,
.paused .hero__basket,
.paused .enemy__image,
.paused .enemy__image:before {
  animation-play-state: paused !important;
}

.game__bg-back {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 740em;
  background: url(img/game/bg1.png) repeat-x 0 0/4200em auto transparent;
  animation: bg_move 35s linear 0s infinite;
}

.game__bg-middle {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 740em;
  background: url(img/game/bg2.png) repeat-x 0 0/4200em auto transparent;
  animation: bg_move 20s linear 0s infinite;
}

.game__bg-front {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 335em;
  background: url(img/game/bg3.png) repeat-x 0 0/4200em auto transparent;
  animation: bg_move 10s linear 0s infinite;
}

@keyframes blink {
  0% {
    opacity: 0.8;
  }
  50% {
    opacity: 0.5;
  }
  100% {
    opacity: 0.8;
  }
}
@keyframes witch-idle {
  to {
    background-position: -5610em;
  }
}
@keyframes witch-move {
  to {
    background-position: -2970em;
  }
}
@keyframes witch-start {
  0% {
    left: -330em;
  }
  100% {
    left: max(35%, 220em);
  }
}
@keyframes witch-end {
  0% {
    left: max(35%, 220em);
  }
  100% {
    left: calc(100% + 330em);
  }
}
.game__hero {
  position: absolute;
  top: 260em;
  left: max(35%, 220em);
  transition: top 0.2s linear;
  transform-origin: center center;
}
.game__hero[data-pos="2"] {
  top: 460em;
}
.game__hero[data-pos="1"] {
  top: 660em;
}
.game__hero.off-screen {
  left: -330em;
}
.game__hero.off-screen2 {
  animation: witch-end 2s linear forwards;
}
.game__hero.started {
  animation: witch-start 2s linear forwards;
}
.game__hero.damaged {
  animation: blink 0.25s ease-in-out infinite;
}
.game__hero.damaged .hero__image {
  filter: sepia(1) hue-rotate(305deg) saturate(5);
}

.hero__image {
  background: url(img/game/hero-sprite.png) no-repeat 0 0/5610em 220em transparent;
  width: 330em;
  height: 220em;
  position: absolute;
  top: -110em;
  left: -215em;
  animation: witch-idle 1s steps(17) infinite;
}

@keyframes basket-move {
  0% {
    transform: rotate(5deg);
  }
  100% {
    transform: rotate(-5deg);
  }
}
.hero__basket {
  width: 57em;
  height: 70em;
  background: url(img/game/basket-sprite.png) no-repeat 0 0/455em 70em transparent;
  position: absolute;
  top: 138em;
  right: -11em;
  transform-origin: top center;
  animation: basket-move 0.8s ease-in-out 0s infinite alternate;
}
.hero__basket[data-percent="1"] {
  background-position: -65em 0;
}
.hero__basket[data-percent="2"] {
  background-position: -130em 0;
}
.hero__basket[data-percent="3"] {
  background-position: -195em 0;
}
.hero__basket[data-percent="4"] {
  background-position: -260em 0;
}
.hero__basket[data-percent="5"] {
  background-position: -325em 0;
}

.hero__body {
  position: absolute;
  top: -80em;
  left: -30em;
  width: 60em;
  height: 150em;
}

@keyframes bat {
  to {
    background-position: -1729em;
  }
}
@keyframes ghost2 {
  to {
    background-position: -1215em;
  }
}
@keyframes ghost3 {
  to {
    background-position: -810em;
  }
}
@keyframes ghost5 {
  to {
    background-position: -1081em;
  }
}
@keyframes pumpkin1 {
  to {
    background-position: -810em;
  }
}
@keyframes pumpkin2 {
  to {
    background-position: -972em;
  }
}
@keyframes pumpkin3 {
  to {
    background-position: -864em;
  }
}
@keyframes enemy-fly {
  from {
    transform: translateY(0em);
  }
  to {
    transform: translateY(-10em);
  }
}
@keyframes enemy-rotate {
  from {
    transform: rotate(-5deg);
  }
  to {
    transform: rotate(5deg);
  }
}
.game__enemy {
  position: absolute;
  width: 0;
  height: 0;
  transform-origin: center center;
  will-change: transform;
}
.game__enemy--pos1 {
  top: 260em;
}
.game__enemy--pos2 {
  top: 460em;
}
.game__enemy--pos3 {
  top: 660em;
}
.game__enemy--pos3 .enemy__body {
  top: -96em;
}
.game__enemy {
  /*&:before {
      content: "";
      display: block;
      background: none no-repeat 0 0 / auto 100% transparent;

      transform-origin: center center;
  }*/
}
.game__enemy--type1 .enemy__image, .game__enemy--type4 .enemy__image {
  width: 192em;
  height: 81em;
  margin: -40.5em 0 0 -96em;
}
.game__enemy--type1 .enemy__image:before, .game__enemy--type4 .enemy__image:before {
  background-image: url(img/game/enemy1-sprite.png);
  background-size: 1729em 81em;
  animation: bat 0.7s steps(9) infinite;
}
.game__enemy--type4 .enemy__image:before {
  background-image: url(img/game/enemy4-sprite.png);
}
.game__enemy--type2 .enemy__image {
  width: 135em;
  height: 135em;
  margin: -67.5em 0 0 -72em;
}
.game__enemy--type2 .enemy__image:before {
  background-image: url(img/game/enemy2-sprite.png);
  background-size: 1215em 135em;
  animation: ghost2 1.3s steps(9) infinite;
}
.game__enemy--type3 .enemy__image {
  width: 90em;
  height: 135em;
  margin: -67.5em 0 0 -42em;
}
.game__enemy--type3 .enemy__image:before {
  background-image: url(img/game/enemy3-sprite.png);
  background-size: 810em 135em;
  animation: ghost3 1s steps(9) infinite;
}
.game__enemy--type5 .enemy__image {
  width: 120em;
  height: 138em;
  margin: -68em 0 0 -60em;
}
.game__enemy--type5 .enemy__image:before {
  background-image: url(img/game/enemy5-sprite.png);
  background-size: 1081em 138em;
  animation: ghost5 1.1s steps(9) infinite;
}
.game__enemy--floor-type1 .enemy__image {
  width: 90em;
  height: 135em;
  margin: -130em 0 0 -48em;
}
.game__enemy--floor-type1 .enemy__image:before {
  background-image: url(img/game/enemy-floor1-sprite2.png);
  background-size: 810em 135em;
  animation: pumpkin1 0.9s steps(9) infinite;
}
.game__enemy--floor-type2 .enemy__image {
  width: 108em;
  height: 96em;
  margin: -84em 0 0 -53em;
}
.game__enemy--floor-type2 .enemy__image:before {
  background-image: url(img/game/enemy-floor2-sprite2.png);
  background-size: 972em 96em;
  animation: pumpkin2 1.1s steps(9) infinite;
}
.game__enemy--floor-type3 .enemy__image {
  width: 96em;
  height: 126em;
  margin: -125em 0 0 -48em;
}
.game__enemy--floor-type3 .enemy__image:before {
  background-image: url(img/game/enemy-floor3-sprite2.png);
  background-size: 864em 126em;
  animation: pumpkin3 1s steps(9) infinite;
}
.game__enemy--floor-type4 .enemy__image {
  width: 108em;
  height: 96em;
  margin: -85em 0 0 -54em;
}
.game__enemy--floor-type4 .enemy__image:before {
  background-image: url(img/game/enemy-floor4-sprite2.png);
  background-size: 972em 96em;
  animation: pumpkin2 1.17s steps(9) infinite;
}

.enemy__image {
  display: block;
  transform-origin: center center;
  animation: enemy-fly 1.2s ease-in-out 0s infinite alternate;
}
.enemy__image:before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background: none no-repeat 0 0/auto 100% transparent;
}

.enemy__body {
  position: absolute;
  width: 56em;
  height: 96em;
  top: -48em;
  left: -28em;
}

@keyframes swingAndJump {
  0% {
    transform: rotate(0deg) translateY(0);
  }
  10% {
    transform: rotate(5deg) translateY(0);
  }
  20% {
    transform: rotate(-5deg) translateY(0);
  }
  30% {
    transform: rotate(5deg) translateY(0);
  }
  40% {
    transform: rotate(-5deg) translateY(0);
  }
  50% {
    transform: rotate(0deg) translateY(0);
  }
  60% {
    transform: rotate(0deg) translateY(-30em);
  }
  80% {
    transform: rotate(0deg) translateY(0);
  }
  100% {
    transform: rotate(0deg) translateY(0);
  }
}
.game__enemy--floor-type1.game__enemy--pos3,
.game__enemy--floor-type2.game__enemy--pos3,
.game__enemy--floor-type3.game__enemy--pos3,
.game__enemy--floor-type4.game__enemy--pos3 {
  top: 810em;
}
.game__enemy--floor-type1 .enemy__image,
.game__enemy--floor-type2 .enemy__image,
.game__enemy--floor-type3 .enemy__image,
.game__enemy--floor-type4 .enemy__image {
  transform-origin: bottom center;
  animation: swingAndJump 1.5s ease-in-out infinite;
}

@keyframes puff {
  100% {
    background-position: -2600em;
  }
}
.static-puff {
  width: 260em;
  height: 260em;
  background: url(img/game/puff.png) no-repeat 0 0/2600em 260em transparent;
  position: absolute;
  animation: puff 0.25s steps(10) forwards;
  z-index: 2;
  top: -130em;
  left: -130em;
}

.game__prize {
  position: absolute;
  width: 0;
  height: 0;
  will-change: transform;
}
.game__prize--pos1 {
  top: 260em;
}
.game__prize--pos2 {
  top: 460em;
}
.game__prize--pos3 {
  top: 660em;
}
.game__prize:before {
  content: "";
  display: block;
  background: none no-repeat 0 0/auto 100% transparent;
  transform-origin: center center;
}
.game__prize--type1:before {
  width: 51em;
  height: 93em;
  margin: -46em 0 0 -25em;
  background-image: url(img/game/prize1.png);
}
.game__prize--type2:before {
  width: 57em;
  height: 82em;
  margin: -41em 0 0 -28em;
  background-image: url(img/game/prize2.png);
}

.prize__body {
  position: absolute;
  width: 65em;
  height: 100em;
  top: -50em;
  left: -32em;
}

.spider {
  --spider-duration: 1.5s;
  position: absolute;
  top: -85em;
  left: min(100% - 100em, 75%);
  height: 0em;
  transition: height var(--spider-duration) ease-out;
}
.spider:before {
  content: "";
  width: 1em;
  right: 0;
  position: absolute;
  height: 100%;
  top: 0;
  background: #fff;
}
.spider--pos1 {
  height: 345em;
  transition-duration: var(--spider-duration);
}
.spider--pos2 {
  height: 545em;
  transition-duration: calc(var(--spider-duration) * 1);
}
.spider--pos3 {
  height: 745em;
  transition-duration: calc(var(--spider-duration) * 1);
}

@keyframes spider {
  to {
    background-position: -3179em;
  }
}
.spider__image {
  width: 187em;
  height: 119em;
  background: url(img/game/spider-sprite2.png) no-repeat 0 0/3179em 119em transparent;
  position: absolute;
  bottom: -70em;
  left: -100em;
  animation: spider 1s steps(17) infinite;
}

@keyframes web-appear {
  0% {
    opacity: 0;
    transform: scale(0);
  }
  10% {
    opacity: 1;
  }
  100% {
    transform: scale(1);
  }
}
.web {
  position: absolute;
  width: 0;
  height: 0;
  left: min(100% - 100em, 75%);
  will-change: transform;
}
.web--pos1 {
  top: 260em;
}
.web--pos2 {
  top: 460em;
}
.web--pos3 {
  top: 660em;
}
.web:before {
  content: "";
  width: 150em;
  height: 168em;
  background: url(img/game/web.png) no-repeat 0 0/150em 168em transparent;
  position: absolute;
  top: -80em;
  left: -75em;
  transform-origin: 75em 80em;
  animation: web-appear 0.2s ease-out 0s forwards;
}

.line {
  position: absolute;
  left: 0;
  width: 100%;
  height: 1px;
  background: red;
}

.line1 {
  top: 260em;
}

.line2 {
  top: 460em;
}

.line3 {
  top: 660em;
}

.game__button {
  display: none;
  width: 70px;
  height: 70px;
  border-radius: 50%;
  margin: 0;
  padding: 0;
  border: 0 none;
  background: linear-gradient(180deg, rgba(205, 157, 255, 0.4) -14.92%, rgba(20, 173, 152, 0.4) 143.06%);
  backdrop-filter: blur(1px);
  position: absolute;
  bottom: 20px;
}
.game__button:before {
  content: "";
  width: 26px;
  height: 28px;
  background: url(img/arrow.svg) no-repeat center center transparent;
  position: absolute;
  top: calc(50% - 14px);
  left: calc(50% - 13px);
  transform-origin: center center;
}
.game__button--up {
  left: 20px;
}
.game__button--up.to-left {
  bottom: 110px;
}
.game__button--down {
  right: 20px;
}
.game__button--down:before {
  transform: scaleY(-1);
}
.game__button--down.to-left {
  right: auto;
  left: 20px;
}

.touch .game__button {
  display: block;
}

.turn {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background: linear-gradient(180deg, #17224C 0%, #432D7E 100%);
  color: #fff;
  text-align: center;
  z-index: 1000;
  display: none;
}

.turn__inner {
  margin: auto;
  flex: 1 1 350px;
  max-width: 350px;
  position: relative;
  z-index: 10;
  padding: 15px;
}

.turn__title {
  font-size: 48px;
  font-style: italic;
  font-weight: 700;
  line-height: 0.9;
  letter-spacing: -0.96px;
  margin: 0 0 16px;
}

.turn__lock {
  padding: 16px;
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.2);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.35;
  text-align: left;
  position: relative;
  display: flex;
  flex-flow: row nowrap;
  justify-content: flex-start;
  align-items: center;
}
.turn__lock::before {
  content: "";
  display: block;
  flex: 0 0 48px;
  margin-right: 16px;
  width: 48px;
  height: 48px;
  background: url(img/lock.svg) no-repeat center center #EAF9FA;
  border-radius: 16px;
}

@media (orientation: portrait) {
  .turn.visible {
    display: flex;
  }
  .game__hero {
    transition: none;
  }
}
@media (max-width: 1079.9px) {
  .game-outer {
    max-height: 960px;
  }
  .game {
    padding: 0;
  }
  .game__header {
    left: 20px;
    right: 20px;
    top: 8px;
    font-size: 0.46px;
  }
  .header__button {
    font-size: 0.8px;
  }
  .header__button + .header__button {
    margin-left: 8px;
  }
}
@keyframes photo-show {
  to {
    opacity: 1;
    transform: translate(0em, 0em);
  }
}
.game__scene {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  display: none;
}

.scene__button {
  display: none;
  position: absolute;
  top: calc(50% + 330em);
  left: 0;
  right: 0;
  text-align: center;
}
.scene__button .button {
  font-size: 20em;
  max-width: 28em;
}

.scene__photo {
  position: absolute;
  top: 50%;
  opacity: 0;
}
.scene__photo--1 {
  width: 650em;
  margin-top: -325em;
  left: max(34em, 50% - 300em + 20em - 650em);
  transform: translate(-20em, 0);
}
.scene__photo--2 {
  width: 600em;
  margin-top: -326em;
  left: calc(50% - 300em);
  transform: translate(0, 20em);
}
.scene__photo--3 {
  width: 650em;
  margin-top: -326em;
  right: max(34em, 50% - 300em + 20em - 650em);
  transform: translate(20em, 0);
}
.scene__photo.go {
  animation: photo-show 0.35s ease-out 0s forwards;
}

@media (max-width: 1079.9px) {
  .scene__button {
    top: min(100% - 50px, 50% + 280em);
  }
  .scene__button .button {
    font-size: 14px;
    height: 48px;
    max-width: 200px;
  }
}
.final {
  min-height: 100vh;
  min-height: 100svh;
  background: url(img/final-bg.jpg) no-repeat fixed center center/cover transparent;
  font-size: min(1px, 0.1vh);
}

.final__container {
  padding: 24em 20em 64em;
  position: relative;
}

.final__logo {
  display: block;
  width: 123em;
  margin: 0 auto 24em;
}

.popup__confetti {
  position: fixed !important;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

@media (max-width: 1079.9px) {
  .final__logo {
    width: 94px;
  }
}
.shr {
  border-top: 1px solid rgba(222, 202, 244, 0.5);
  margin: 36em -40em 0;
  padding: 36em 40em 0;
}
.shr p {
  font-size: 20em;
  font-style: italic;
  font-weight: 500;
  margin: 0 0 1em;
}

.shr__list {
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
  margin-bottom: 24px;
}

.shr__list li + li {
  margin-left: 14em;
}

.shr__item {
  display: block;
  font-size: inherit;
  width: 64em;
  height: 64em;
  border-radius: 50%;
  background: linear-gradient(180deg, rgba(205, 157, 255, 0.4) 0%, rgba(20, 173, 152, 0.4) 109.37%);
  position: relative;
  overflow: hidden;
  transition: background-color 0.15s ease 0s;
}
.shr__item:before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background: none no-repeat center center transparent;
}

.shr__item--vk:before {
  background-image: url(img/sc-vk.svg);
  background-size: 38em 23em;
}

.shr__item--vi:before {
  background-image: url(img/sc-vi.svg);
  background-size: 36em 37em;
}

.shr__item--tg:before {
  background-image: url(img/sc-tg.svg);
  background-size: 33em 29em;
  background-position: left calc(50% - 2.5em) top 50%;
}

.shr__item--wa:before {
  background-image: url(img/sc-wa.svg);
  background-size: 37em 37em;
}

.shr__item--ok:before {
  background-image: url(img/sc-ok.svg);
  background-size: 23em 33em;
}

.app__list {
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
}
.app__list li + li {
  margin-left: 10em;
}

.app__item {
  display: block;
  border-radius: 0.75em;
  background: none no-repeat left 1.33em center rgba(0, 0, 0, 0.3);
  padding: 1em 1.33em 1em 5.4em;
  font-size: 12em;
  font-weight: 400;
  line-height: 1.15;
  text-align: left;
  color: #fff;
  text-decoration: none !important;
  white-space: nowrap;
}
.app__item span {
  display: block;
  font-size: 1.58em;
  margin-top: 0.1em;
}
.app__item--ios {
  background-image: url(img/app-ios.svg);
  background-size: 3.5em 2.92em;
}
.app__item--play {
  background-image: url(img/app-play.svg);
  background-size: 3em 3.25em;
}
.app__item--gal {
  background-image: url(img/app-gal.svg);
  background-size: 3.5em 2.92em;
}

@media (max-width: 1079.9px) {
  .shr {
    margin: 24px -24px 0;
    padding: 24px 24px 0;
    font-size: 0.8px;
  }
  .app__list {
    display: block;
    max-width: 155px;
    margin-left: auto;
    margin-right: auto;
  }
  .app__list li + li {
    margin-left: 0;
    margin-top: 10px;
  }
  .app__item {
    font-size: 12em;
  }
}