*,
*::before,
*::after {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

html {
  scroll-padding-top: calc(var(--padding-menu-top) + 2rem);
  scroll-behavior: smooth;
}

html,
body {
  height: 100%;
  font-size: 62.5%;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

img,
picture,
video,
canvas,
svg {
  display: block;
  width: 100%;
}

input,
button,
textarea,
select {
  font: inherit;
}
input,
button,
textarea,
select,
a,
li {
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  outline: none;
}
input:focus-visible,
button:focus-visible,
textarea:focus-visible,
select:focus-visible,
a:focus-visible,
li:focus-visible {
  outline: green solid 3px;
}

a {
  color: inherit;
  cursor: pointer;
  font: inherit;
}

body {
  margin: 0;
  font-family: Montserrat, serif;
  font-weight: 500;
  color: var(--text-color, #333);
  background-color: var(--bg-color, #f9f9f9);
  font-size: 1.6rem;
  display: flex;
  flex-direction: column;
}

/* Root Variables */
:root {
  /* Colors */
  --color-black: #282828;
  --color-white: #ffffff;
  --color-purple: #9477e2;
  --color-yellow: #ffd20c;
  --color-purple-opacity: rgba(148, 119, 226, 0.1);
  --color-purple-light: #d4c9f3;
  --color-purple-light-light: #f3effc;
  --color-gray: #757575;
  --color-gray-light-2: #f4f4f4;
  --color-gray-light-3: #e5e5e5;
  --color-gray-light: #cacaca;
  --color-gray-dark: #4c4c4c;
  --swiper-theme-color: #ffffff;
  --swiper-pagination-bullet-inactive-color: #ffffff;
  --swiper-pagination-bullet-inactive-opacity: 1;

  --padding-menu-top: 9rem;
  --padding-scroll-block: 4rem;
  --padding-side: 4rem;
}

.purple {
  color: var(--color-purple);
}

main {
  flex-grow: 1;
}

.carts--scroll::-webkit-scrollbar {
  height: 0.5rem;
}
.carts--scroll::-webkit-scrollbar-track {
  background: transparent;
}
.carts--scroll::-webkit-scrollbar-thumb {
  background-color: var(--color-purple);
  border-radius: 20px;
}

.block body {
  overflow: hidden;
  pointer-events: none;
}

.container {
  max-width: 144rem;
  margin: 0 auto;
  padding: var(--space-medium);
  display: inherit;
  width: 100%;
  -webkit-box-pack: inherit;
  -ms-flex-pack: inherit;
  justify-content: inherit;
  -webkit-box-align: inherit;
  -ms-flex-align: inherit;
  align-items: inherit;
  flex-wrap: inherit;
  gap: inherit;
  position: relative;
  height: 100%;
}

.hidden {
  display: none !important;
}

.text-center {
  text-align: center;
}

.btn-main {
  text-align: center;
  padding: 1rem 2rem;
  background-color: var(--color-black);
  color: var(--color-white);
  border-radius: 50rem;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  min-width: 15.7rem;
  cursor: pointer;
  -webkit-transition: background-color 0.5s cubic-bezier(0.075, 0.82, 0.165, 1), color 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
  -o-transition: background-color 0.5s cubic-bezier(0.075, 0.82, 0.165, 1), color 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
  transition: background-color 0.5s cubic-bezier(0.075, 0.82, 0.165, 1), color 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.btn-main::first-letter {
  text-transform: capitalize;
}

.btn-main--white {
  background-color: var(--color-white);
  color: var(--color-black);
}

.btn-main--purple {
  background-color: var(--color-purple);
  color: var(--color-white);
}

.btn-main--trans {
  background-color: var(--color-white);
  color: var(--color-purple);
  border: 0.2rem solid;
  border-color: var(--color-purple);
}
.btn-main--yellow {
  background-color: var(--color-yellow);
  color: var(--color-black);
}

.btn-main--trans:hover {
  background-color: var(--color-purple);
  color: var(--color-white);
  border: 0.2rem solid;
  border-color: var(--color-purple);
}

.btn-main--bold {
  font-weight: 700;
}

.menu {
  width: 100%;
  height: var(--padding-menu-top);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 4.5rem;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 0rem var(--padding-side);
  position: fixed;
  background-color: var(--color-white);
  z-index: 99;
  box-shadow: ;
  justify-content: space-between;
  box-shadow: 0px 4px 4px 0px #00000040;
}

.menu__links {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 100%;
  gap: 4rem;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.menu__links > a,
.footer__links > a {
  -webkit-transition: background-color 0.5s cubic-bezier(0.075, 0.82, 0.165, 1), color 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
  -o-transition: background-color 0.5s cubic-bezier(0.075, 0.82, 0.165, 1), color 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
  transition: background-color 0.5s cubic-bezier(0.075, 0.82, 0.165, 1), color 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
}
.menu__links > a{
  flex-shrink: 0;
}
.menu__logo {
}

.section {
  width: 100%;
}

.section:nth-child(1) {
  margin-top: 0;
  padding-top: var(--padding-menu-top);
  overflow: hidden;
}

.section__block {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.section__block--vert {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.section__wrapper {
  padding: 0rem var(--padding-side);
}

.section__title {
  font-weight: 700;
  font-size: 6.7rem;
  line-height: 6.5rem;
  margin-bottom: 4rem;
}
.section__title--purple {
  color: var(--color-purple);
}

.illustration {
  width: 100%;
  overflow: hidden;
  /* background-color: var(--color-purple); */
  background: rgb(165, 141, 229);
  background: linear-gradient(277deg, rgba(165, 141, 229, 1) 0%, rgba(90, 56, 179, 1) 100%);
  height: calc(100vh - var(--padding-menu-top));
  border-radius: 0rem 0rem 4rem 4rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 10vh var(--padding-side);
  position: relative;
}

.illustration__block {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  overflow: hidden;
  z-index: 3;
  justify-content: space-between;
  height: 100%;
}

.illustration__block > a{
  font-size: 3.1rem;
  padding: 1.5rem 4rem;
  background-color: var(--color-yellow);
}
.illustration__img {
  width: 100%;
  position: absolute;
  bottom: 0;
  right: 4rem;
  pointer-events: none;
  max-width: none;
  width: auto;
  height: 89vh;
  z-index: 2;
}
.illustration__img img{
  width: auto;
  height: 100%;
}
.illustration__circle {
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none;
  max-width: 200rem;
  z-index: 1;
}

.illustration__title {
  font-size: 8.8rem;
  color: var(--color-white);
  font-weight: 700;
  line-height: 9rem;
  z-index: 3;
  width: 65rem;
}
.main-banner-text, .main-banner-badge{
  position: absolute;
}
.main-banner-text {
  height: 21.5vh;
  top: 20.3vh;
  left: 40rem;
  width: auto;
}
 .main-banner-badge{
  height: 24vh;
      bottom: -8vh;
      left: 45rem;
      width: auto;
}
.marquee {
  overflow: hidden;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding-top: 4rem;
}

.marquee h1 {
  font-size: 10.4rem;
  white-space: nowrap;
  line-height: normal;
  font-weight: 700;
  will-change: margin-left;
}

.marquee-accent {
  color: var(--color-purple);
}
.marquee-margin {
  margin-left: 5rem;
}

.carts {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 2rem;
  margin: 4rem 0rem 8rem;
}

.carts-purple {
  display: grid;
  grid-template-columns: repeat(4, minmax(27rem, 38rem));
  justify-content: center;
}

.carts--scroll {
  width: 100%;
  overflow-x: auto;
  padding-left: var(--padding-scroll-block);
  padding-right: 4rem;
  cursor: -webkit-grab;
  cursor: grab;
  padding-bottom: 1.5rem;
}

.cart {
  width: 100%;
  background-color: var(--color-white);
  border-radius: 4.5rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  padding: 3rem;
  height: 32rem;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-shadow: 8px 12px 81px 0px rgba(148, 119, 226, 0.2);
  box-shadow: 8px 12px 81px 0px rgba(148, 119, 226, 0.2);
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.cart--purple {
  min-width: auto;
  max-width: auto;
  background-color: var(--color-purple-opacity);
  -webkit-box-shadow: none;
  box-shadow: none;
  scroll-snap-align: center;
  padding: 3rem;
}
.cart--purple .cart__title {
  font-size: 3.9rem;
}

.cart--purple .cart__description {
  font-weight: 400;
  white-space: wrap;
  max-width: 100%;
  font-size: 2rem;
  margin-right: 0;
}

.cart__title {
  font-size: 4rem;
  color: var(--color-purple);
  font-weight: 700;
  line-height: normal;
}

.cart__description {
  font-size: 2rem;
  color: var(--color-gray);
  font-weight: 500;
  text-transform: lowercase;
  white-space: nowrap;
  line-height: normal;
  margin-right: 1rem;
}

.cart__block {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: end;
}

.cart__img {
  width: auto;
  height: 17rem;
  margin-right: auto;
  -webkit-transition: -webkit-transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
  transition: -webkit-transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
  -o-transition: transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
  transition: transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
  transition: transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1), -webkit-transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
  flex-shrink: 0;
}
.cart__img img{
  width: auto;
  height: 100%;
}
.cart__icon {
  width: 2.8rem;
  height: 2.8rem;
  aspect-ratio: 1/1;
  background-color: var(--color-purple);
  border-radius: 50%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.carts-first .cart__icon {
  display: none;
}

.cart__icon > svg {
  width: 50%;
}

.banner {
  width: 100%;
  background-color: var(--color-white);
  -webkit-box-shadow: 8px 12px 81px 0px rgba(148, 119, 226, 0.2);
  box-shadow: 8px 12px 81px 0px rgba(148, 119, 226, 0.2);
  padding: 4rem 7rem;
  border-radius: 4rem;
  display: -webkit-box;
  display: -ms-flexbox;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  overflow: hidden;
  margin: 8rem 0rem;
  margin-top: 0;
}

.banner__title {
  font-size: 6.7rem;
  font-weight: 700;
  line-height: 7rem;
  color: var(--color-purple);
  margin-bottom: 3rem;
}
.banner__text {
  font-weight: 400;
  line-height: normal;
  color: var(--color-gray-dark);
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.banner__list {
  padding-left: 2.5rem;
  line-height: 2.5rem;
}

.banner__link {
  text-decoration: underline !important;
  color: var(--color-purple);
  font-weight: 600;
}

.banner__block:nth-child(1) {
  width: 55%;
}
.banner__block:nth-child(2) {
  width: 55%;
}

.banner__step {
  width: 100%;
  max-width: 28rem;
  height: 7.3rem;
  position: absolute;
  cursor: pointer;
}

.banner__step[data-step-order="1"] {
  position: absolute;
  top: 14rem;
  left: 0;
  max-width: 37rem;
}
.banner__step[data-step-order="2"] {
  position: absolute;
  top: 26rem;
  left: 10rem;
  max-width: 32rem;
}
.banner__step[data-step-order="3"] {
  position: absolute;
  top: 18rem;
  right: 0rem;
}

.banner__step:before {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0.2rem;
  left: 0;
  content: "";
  background-color: var(--color-gray-light);
  border-color: var(--color-gray-light);
  border-radius: 10rem;
}

.banner__step-wrapper {
  background-color: var(--color-gray-light-2);
  border-radius: 10rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  padding: 1.5rem;
  border: 0.1rem solid rgba(202, 202, 202, 0.5);
  gap: 2rem;
  height: 100%;
  position: relative;
  z-index: 2;
  -webkit-transition: background-color 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
  -o-transition: background-color 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
  transition: background-color 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.banner__step-number {
  background-color: var(--color-purple);
  color: var(--color-white);
  font-size: 2.7rem;
  font-weight: 600;
  min-width: 4rem;
  height: 4rem;
  aspect-ratio: 1 / 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  overflow: hidden;
  border-radius: 50%;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-item-align: center;
  -ms-grid-row-align: center;
  align-self: center;
}

.banner__step-text {
  font-size: 1.4rem;
  color: var(--color-black);
  max-width: auto;
  font-weight: 600;
  line-height: 1.6rem;
  -ms-flex-item-align: center;
  -ms-grid-row-align: center;
  align-self: center;
  text-align: left;
}

.banner__images-area {
  width: 100%;
  height: 55rem;
  background-image: url("../img/laptop.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  position: relative;
}

.banner__image {
  position: absolute;
  pointer-events: none;
}
.banner__image--plus {
  width: 100%;
  max-width: 13rem;
  top: 1rem;
  left: 4rem;
}
.banner__image--confetti {
  width: 100%;
  max-width: 17rem;
  top: 4rem;
  right: 0;
  z-index: 10;
}
.banner__image--present {
  width: 100%;
  max-width: 21rem;
  bottom: 0;
  left: 0;
  z-index: 10;
}

.banner-save-scores {
  background: rgb(165, 141, 229);
  background: linear-gradient(277deg, rgba(165, 141, 229, 1) 0%, rgba(90, 56, 179, 1) 100%);
  position: relative;
  display: flex;
  gap: 1rem;
}
.banner-save-scores .banner__title {
  color: var(--color-white);
  font-weight: 600;
}

.banner-save-scores .banner__block:nth-child(3) {
  width: 30%;
  align-self: start;
  display: flex;
  justify-content: flex-end;
}
.banner-save-scores .banner__block:nth-child(2) {
  width: 70%;
}
.banner-save-scores .banner__block > .btn-main {
  align-self: flex-start;
  font-size: 2rem;
}

.banner-save-scores .illustration__circle {
  position: absolute;
  left: 0%;
  width: 115%;
  z-index: 0;
}

.shadow-object:before {
  position: absolute;
  content: "";
  bottom: -3rem;
  left: 40%;
  -webkit-transform: translateX(-50%) rotate(5deg);
  -ms-transform: translateX(-50%) rotate(5deg);
  transform: translateX(-50%) rotate(5deg);
  width: 20rem;
  height: 5rem;
  background-color: #28282874;
  -webkit-perspective: 100rem;
  perspective: 100rem;
  -webkit-filter: blur(32px);
  filter: blur(32px);
}

.swiper-banner {
  height: 50rem;
  -webkit-box-shadow: 8px 12px 81px 0px rgba(148, 119, 226, 0.2);
  box-shadow: 8px 12px 81px 0px rgba(148, 119, 226, 0.2);
  border-radius: 4rem;
}

.swiper-banner .swiper-slide {
  overflow: hidden;
}

.swiper-banner .banner {
  margin: 0;
  -webkit-box-shadow: none;
  box-shadow: none;
  height: 100%;
}
.swiper-banner .banner__images-area {
  height: auto;
  background-image: none;
}

.banner-swiper--1 {
  background: rgb(186, 138, 0);
  background: -o-linear-gradient(61deg, rgb(231, 177, 16) 0%, rgb(244, 204, 24) 50%, rgba(255, 210, 12, 1) 100%);
  background: linear-gradient(29deg, rgb(231, 177, 16) 0%, rgb(244, 204, 24) 50%, rgba(255, 210, 12, 1) 100%);
}
.banner-swiper--2 {
  background: #fdd835;
}
.banner-swiper--2 .btn-main{
  padding: 2.3rem 3rem;
  font-size: 2.1rem;
}
.banner-swiper--1 .banner__title,
.banner-swiper--1 .banner__text {
  color: var(--color-white);
}

.swiper-pagination-bullet-active {
  width: 30px;
  border-radius: 100px;
}

.qiestion {
  gap: 3rem;
  margin: 10rem 0rem;
}

.question__left {
  width: 100%;
  max-width: 46rem;
}
.question__right .btn-main{
  display: none;
}
.question__right {
  width: 100%;
}

.accordions {
  width: 100%;
}

.accordionjs .acc_section.acc_active > .acc_content {
  /* padding: 0rem 3rem; */
}

.accordionjs .acc_section .acc_content {
  padding: 3rem;
}

.accordionjs .acc_section {
  border-color: var(--color-purple);
  border: 0px;
}

.accordionjs .acc_section .accordions__icon {
  -webkit-transition: -webkit-transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
  transition: -webkit-transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
  -o-transition: transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
  transition: transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
  transition: transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1), -webkit-transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.accordionjs .acc_section.acc_active .accordions__icon {
  -webkit-transform: rotate(134deg);
  -ms-transform: rotate(134deg);
  transform: rotate(134deg);
}

.accordionjs .acc_section.acc_active > .acc_head {
  background-color: transparent;
  border-bottom: 0.2rem solid var(--color-purple);
  border-radius: 50rem;
}

.accordionjs .acc_section .acc_head {
  width: 100%;
  background: transparent;
  border: 0.2rem solid var(--color-purple);
  border-radius: 50rem;
  padding: 1.5rem 4rem;
  font-size: 2.2rem;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.accordionjs .acc_section .acc_head > svg {
  width: 100%;
  max-width: 3rem;
}

footer > .section:nth-child(1) {
  padding: 0;
}

.footer {
  margin: 4rem 0rem;
  font-weight: 600;
}

.footer .btn-main {
  text-transform: none;
  white-space: nowrap;
}
.footer > .section__block:nth-child(1) {
  width: 100%;
}

.footer__links {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  gap: 1rem;
  white-space: nowrap;
}
.footer__contact {
  color: var(--color-purple);
  transition: .3s;
}
.footer__contact:hover{
  color: var(--color-yellow);
}
.footer__title {
  text-wrap: nowrap;
}
.footer__socials {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.footer__social {
  width: 4.5rem;
  height: 4.5rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
/* .footer__social {
  border: 0.2rem solid var(--color-gray-light-3);
  border-radius: 50%;
  width: 4.5rem;
  height: 4.5rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 0.9rem;
} */

.footer-block {
  gap: 4rem;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
}

.footer-block .section__block {
  width: 100%;
  gap: 1.5rem;
  -ms-flex-item-align: start;
  align-self: flex-start;
}

.footer__socials {
  gap: 0.7rem;
  color: var(--color-purple);
}

.footer__wrapper {
  background-color: var(--color-purple);
  border-radius: 4rem 4rem 0rem 0rem;
  padding-top: 6rem;
  padding-bottom: 6rem;
  gap: 4rem;
}

.footer__wrapper--gap {
  gap: 4rem;
}

.footer__wrapper--gap > .footer__text:nth-child(2) {
  text-align: right;
}

.footer__text {
  color: var(--color-white);
  font-weight: 400;
  width: 100%;
}

.footer__text > a {
  text-decoration: underline;
}

*[data-animation] {
  opacity: 0;
}

.animate__animated {
  opacity: 1;
}

.animtaion__delay-01s {
  -webkit-animation-delay: 0.1s;
  animation-delay: 0.1s;
}
.animtaion__delay-02s {
  -webkit-animation-delay: 0.2s;
  animation-delay: 0.2s;
}
.animtaion__delay-03s {
  -webkit-animation-delay: 0.3s;
  animation-delay: 0.3s;
}
.animtaion__delay-04s {
  -webkit-animation-delay: 0.4s;
  animation-delay: 0.4s;
}
.animtaion__delay-05s {
  -webkit-animation-delay: 0.5s;
  animation-delay: 0.5s;
}
.animtaion__delay-06s {
  -webkit-animation-delay: 0.6s;
  animation-delay: 0.6s;
}
.animtaion__delay-07s {
  -webkit-animation-delay: 0.7s;
  animation-delay: 0.7s;
}
.animtaion__delay-1s {
  -webkit-animation-delay: 1s;
  animation-delay: 1s;
}

.animation-duration-2s {
  animation-duration: 2s !important;
}

.banner__step.animate__animated {
  -webkit-animation-fill-mode: backwards;
  animation-fill-mode: backwards;
}

.menu-mobile {
  display: none;
}
.mobile-banner__wrapper{
  display: flex;
}
.menu-mobile__content {
  pointer-events: none;
  top: -100%;
  -webkit-transition: top 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
  -o-transition: top 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
  transition: top 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.switcher {
  display: flex;
  gap: 1rem;
  background-color: var(--color-purple-light-light);
  width: fit-content;
  height: 4.25rem;
  border-radius: 20rem;
  font-weight: 600;
  margin-bottom: 4rem;
}

.switcher__button {
  padding: 1.3rem 3rem;
  display: inline-flex;
  align-items: center;
  border-radius: 20rem;
  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);

  &.switcher__button--active {
    background-color: var(--color-purple);
    color: var(--color-white);
    -webkit-box-shadow: 0px 4px 4px 0px rgba(148, 119, 226, 0.2);
    -moz-box-shadow: 0px 4px 4px 0px rgba(148, 119, 226, 0.2);
    box-shadow: 0px 4px 4px 0px rgba(148, 119, 226, 0.2);
  }
}

*[data-switch-card] {
  display: none;
}

.switch-active {
  display: flex;
}

.carts-switcher .cart__description {
  white-space: wrap;
}
.carts-switcher .cart__title {
  line-height: 3.2rem;
  font-size: 3rem;
}
.carts-switcher .cart__icon {
  width: 4.8rem;
  height: 4.8rem;
  font-size: 2.4rem;
  color: var(--color-white);
}

.slide-hp .banner__text {
  font-size: 4rem;
  color: var(--color-purple);
  text-transform: uppercase;
  font-weight: 600;
  color: rgb(40 40 40 / 80%);
  text-shadow: 3px 3px 3px rgba(0, 0, 0, 0.2);
  white-space: nowrap;
  position: relative !important;
}

.slide-hp .banner__block:nth-child(1) {
  height: 100%;
}

.slide-hp .banner__title {
  font-size: 9rem;
  color: var(--color-purple);
  text-transform: uppercase;
  font-weight: 700;
  margin-bottom: 1rem;
  text-shadow: 3px 3px 3px rgba(0, 0, 0, 0.2);
  position: relative !important;
}

.slide-hp .banner__title--big {
  font-size: 26.3rem;
  color: var(--color-purple);
  line-height: 20rem;
}

.slide-hp .illustration__circle {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 70%;
  z-index: 0;
}
.slide-common .illustration__circle {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 70%;
  z-index: 0;
}
.slide-app .illustration__circle {
  position: absolute;
  right: 0;
  left: auto;
  bottom: 0;
  width: 70%;
  z-index: 0;
  transform: rotate(180deg) translateX(0rem);
}
.slide-app .banner__descr{
  font-weight: 500;
  font-size: 3.6rem;
  line-height: 100%;
  color: #FFFFFF;
}
.banner__descr{
  color: #4C4C4C;
}
.slide-app .banner-swiper--2{
  background: linear-gradient(270deg, #A58DE5 0%, #5A38B3 111.14%);
  padding: 5rem 10rem;
}
.slide-hp .banner__images-area > img {
  transform: scale(1.2);
  transform-origin: left top;
}
.slide-hp .btn-main {
  bottom: 0;
}
.slide-common .banner__images-area > img.hb-img{
          max-width:80rem;
              bottom: -37rem;
}
.slide-common .banner__images-area > img.balance-img{
              max-width: 56rem;
    bottom: -13rem;
    right: 14rem;
}
.slide-app .banner__images-area > img.gift-img{
      bottom: -5rem;
    max-width: none;
    width: 69rem;
    right: 10rem;
}
.slide-app .banner__images-area > img.woman-img{
          max-width:60rem;
              bottom: -8rem;
}
.slide-app .banner__images-area > img.pesr-img{
  max-width: 47rem;
  bottom: -8rem;
  right: 8rem;
}
.slide-common .illustration__circle {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 70%;
  z-index: 0;
}
.slide-common .banner__block {
  height: 100%;
}
.slide-common .banner__block:nth-child(1) {
  z-index: 1;
}
.slide-common  .banner__title {
  text-transform: uppercase;
  color: var(--color-black);
}
.slide-common  .banner__title span{
  color: var(--color-purple);
} 
.slide-common .banner__block:nth-child(1) > .btn-main {
  bottom: 0;
}
.slide-common .banner__images-area {
  height: 100%;
  width: 100%;
}
.slide-common .banner__images-area > img {
  bottom: -6rem;
  position: absolute;
  right: 0;
  max-width: 80%;
}

.slide-app .banner__block {
  height: 100%;
}
.slide-app .banner__title{
  color: var(--color-white);
}
.slide-app .banner__title span{
  color: var(--color-yellow);
}
.slide-app .banner__block:nth-child(1) {
  z-index: 1;
}
.slide-app .banner__block:nth-child(1) > .banner__title {
  font-size: 5rem;
  line-height:110%;
  margin-top: 0;
  margin-bottom: 2.8rem;
  text-transform: uppercase;
}
.slide-app .banner__block:nth-child(1) > .banner__title img{
  width: 80%;
}
.slide-app .banner__block:nth-child(1) > .btn-main {
  bottom: 0;
}
.slide-app .banner__images-area {
  height: 100%;
  width: 100%;
}
.slide-app .banner__images-area > img {
  bottom: -27rem;
    position: absolute;
    right: 20rem;
    max-width: 91%;
}
.slide-app .banner__links {
  display: flex!important;
  gap: 1.5rem;
  align-items: center;
  bottom: 0;
}
.slide-app .banner__links a{
  width: 19rem;
  display: block;
  border-radius: 1rem;
  overflow: hidden;
}
.slide-app .banner__links a img{
  width: 100%;
}
.breadcrumbs {
  display: flex;
  gap: 3rem;
  padding: 3rem 0rem;
}

.breadcrumbs__host {
  color: var(--color-purple);
}

.breadcrumbs__host--current {
  color: var(--color-black);
}

.document {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}
.document img{
  border-radius: 2rem;

}
.document__link {
  color: var(--color-purple);
}

.document__list > li::marker {
}
.document table{
  border: 1px solid #000;

}
.document table tr td{
  padding: 1rem;
  border: 1px solid #000;
}
.banner.banner-mycard {
  background: rgb(165, 141, 229);
  background: linear-gradient(277deg, rgba(165, 141, 229, 1) 0%, rgba(90, 56, 179, 1) 100%);
  padding: 0;
  margin: 4.5rem 0rem;
}
.banner.banner-mycard .banner__title {
  color: var(--color-white);
  text-transform: uppercase;
  margin-bottom: 1rem;
}
.banner.banner-mycard .banner__title > span {
  color: var(--color-yellow);
}
.banner.banner-mycard .banner__block:nth-child(1) {
  width: 55%;
  display: flex;
  flex-direction: column;
  gap: 3rem;
  padding: 5rem 0rem 5rem 5rem;
}
.banner.banner-mycard .banner__block:nth-child(2) {
  width: 45%;
}
.banner.banner-mycard .banner__info {
  color: var(--color-white);
}
.banner.banner-mycard .banner__info-title {
  font-size: 2.5rem;
  font-weight: 700;
  line-height: 2.7rem;
}
.banner.banner-mycard .banner-mycard__images-area {
  height: 100%;
  position: absolute;
  bottom: 0;
  right: 0;
  width: inherit;
  overflow: hidden;
}
.banner.banner-mycard .banner-mycard__images-area > .banner__image--logo-p1 {
  width: 80%;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}
.banner.banner-mycard .banner-mycard__images-area > .banner__image--logo-p2 {
  width: 45%;
  position: absolute;
  bottom: 3rem;
  left: 50%;
  transform: translateX(-50%);
}
.banner.banner-mycard .banner-mycard__images-area > .banner__image--grandma {
  width: 80%;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}

.mycard-info {
  display: flex;
  flex-direction: column;
  gap: 3rem;
  margin-bottom: 6rem;
}

.popup-mini {
  width: calc(100% - (var(--padding-side) * 2));
  max-width: 160rem;
  position: fixed;
  bottom: 2rem;
  left: 50%;
  border-radius: 2rem 0rem 2rem 2rem;
  background-color: var(--color-white);
  padding: 2.3rem;
  z-index: 998;
  transform: translateX(-200%);
}
.popup-mini--active {
  animation: slideOutLeftCookie 0.5s ease 2s forwards;
}
.popup-mini--leave {
  animation: slideOutLeftCustom 0.5s ease forwards;
}
.popup-mini .popup-mini__content {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 2rem;
}

.popup-mini .popup-mini__content > .info {
  width: 100%;
}

.popup-mini .popup-mini__content > .buttons {
  display: flex;
  gap: 1.2rem;
}

.popup-mini .popup-mini__content .info__title {
  font-size: 2.4rem;
  font-weight: 600;
}
.popup-mini .popup-mini__content .info__text > a {
  color: var(--color-purple);
  text-decoration: underline;
}

.popup-mini .popup-mini__content > .image svg {
  min-width: 7.1rem;
}

.mobile-block {
  display: none;
}

.btn-more-mobile {
  margin-bottom: 3rem;
}
.btn-more-mobile button {
  width: 100%;
}

.btn-mobile--illustration {
  width: 100%;
  margin-top: 2rem;
  font-size: 2rem;
  font-weight: 600;
  display: none;
}

.slide-hp .predescr {
  font-size: 1.3rem;
  color: var(--color-white);
  bottom: 0;
  opacity: 0.6;
  display: none !important;
}
.auth-menu{
  position: relative;
}
.auth-menu p{
  display: flex;
  align-items: center;
  justify-content: center;
  gap:1rem;
  padding: 0 3rem;
}
.auth-menu p img{
  width: 2rem;
  height: 2rem;
}
.auth-menu p i{
  font-size: 1rem;
}
.auth-links{
  /* box-sizing: unset; */
  position: absolute;
  top: 4rem;
  left: 0;
  background: #ffff;
  width: -webkit-fill-available;
  border-radius: 0 0 2rem 2rem;
  overflow: hidden;
  height: 0;
  transition: .3s;
  box-shadow: 0px 6px 10px 0px #00000026;
  gap: .6rem;
  display: flex;
  flex-direction: column;
}
.auth-links li:first-child{
  border-top: 1px solid #E2E2E2;
  padding-top: 1rem;
}
.auth-links li:last-child{
  padding-bottom: 1rem;
}

.auth-links li{
  padding: 0 2rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.auth-links li:after{
  content: '';
  width: 0.5rem;
  height: 0.8rem;
  background: url(../img/account-arrow.svg) 0 0 no-repeat;
  background-size: cover;
}
.auth-links li a i{
  width: 1.8rem;
  display: none;
}
.auth-menu:hover .auth-links{
  height: 11rem;
}
.mobile-banner{
  display: none;
}
.mobile-banner__wrapper{
  gap: 2rem;
  align-items: center;
  padding: 1rem 0;
  background: #fff;
}
.mobile-banner__close{
  width: 1.7rem;
  height: 1.7rem;
}
.mobile-banner__close img{
  width: 100%;
}
.mobile-banner__text{
  font-size: 1rem;
}
.mobile-banner__img{
  width: 5rem;
  height: 5rem;
}
.mobile-banner__img img{
  width: 100%;
}
.mobile-banner .ave-btn{
  margin-left: auto;
}
.slick-slider{
  margin-left: -1.8rem;
  margin-right:-1.8rem;
}
.slick-slider__slide{
  overflow: hidden;
  border-radius: 3.2rem;
  margin: 0 1.8rem;
}
.section-app-main{
  padding-bottom: 10rem;
  box-shadow: 0px -4px 8px 0px #0000000D inset;
}
.section-app-small{
  padding-top: 10rem;
  box-shadow: none;
}
.section-app-small .swiper-banner{
  height: 35rem;
}
.section-app-small .banner__block:nth-child(1){
  width: 70%;
}
.section-app-small .slide-app .banner__block:nth-child(1) > .banner__title{
  font-size: 7rem;
}
.section-app-small .slide-app .banner__images-area > img{
  bottom: -7rem;
      position: absolute;
      right: 28rem;
      max-width: 52%;
}
.section-app-slider{
  padding-top: 5.8rem;
  padding-bottom: 7.2rem;
  box-shadow: 0px -4px 8px 0px #0000000D inset;

}
.section-app-banner{
  padding-top: 10rem;
}
.section-app-video{
  background: #F4F4F4;
  padding: 9.1rem 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.section-app-video .section__title{
  text-align: center;
}
.app-video{
  height: 57.2rem;
  width: 101.15rem;
  border-radius: 3.2rem;
  overflow: hidden;
}
.app-video iframe{
  height: 100%;
  width: 100%;
}
.slick-dots{
  display: flex;
  gap:.7rem;
  justify-content: center;
  align-items: center;
  bottom: -4.5rem;
}
.slick-dots li.slick-active button{
  width: 2.4rem;
  border-radius: 0.45rem;
  background: #FFD20C;
}
.slick-dots li button{
  padding: 0;
  background: #F3F3F4;
  width: 0.8rem;
  height: 0.8rem;
  transition: .3s;
  border-radius: 50%;
}
.slick-dots li{
  width: auto;
  height: auto;
  margin: 0;
}
.slick-dots li button:before{
  display: none;
}
.slick-prev:before, .slick-next:before{
  display: none;
}
.slick-next,.slick-prev{
  content: "";
  display: block;
  width: 5rem;
  height: 5rem;
  -webkit-mask-size: 100%;
          mask-size: 100%;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  background-color: #282828;
  -webkit-transition: 0.3s;
  transition: 0.3s;
  top: -6.6rem;
}
.slick-next:focus, .slick-prev:focus{
  background-color: #282828;
}
.slick-next:hover,.slick-prev:hover{
  background-color: #9477E2;
}
.slick-next{
    
    /* top: 0; */
    right: 1.6rem;
    -webkit-mask-image: url(../img/arrow-r.svg);
          mask-image: url(../img/arrow-r.svg);
}
.slick-prev{
    /* top: 0; */
    right: 8.6rem;
    left: auto;
    -webkit-mask-image: url(../img/arrow-l.svg);
          mask-image: url(../img/arrow-l.svg);
}
.dobraya-cena{
  width: 61rem;
  border-radius: 2rem;
  overflow: hidden;
}
@media screen and (min-width: 1200px) {
  .banner-swiper--2 .banner__title {
  }

  .slide-common .banner__images-area > img {
    max-width: 51rem;
  }
}
@media screen and (min-width: 769px) {
  .section__block-socials .footer__title {
    text-align: end;
  }
}

@media screen and (min-width: 950px) {
  *[data-switch-card],
  .carts-first,
  .carts-purple {
    margin-bottom: 12rem;
  }
}

@media screen and (max-width: 1350px) {
  :root {
    --padding-menu-top: 7.8rem;
  }

  .menu {
    font-size: 1.2rem;
    box-shadow: none;
  }

  .btn-main {
    min-width: 12.7rem;
    font-size: 1.4rem;
    white-space: nowrap;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
  }

  .illustration {
  }

  .illustration__title {
    line-height: normal;
    font-size: 7rem;
    line-height: 7rem;
    width: 100%;
  }

  .illustration__block > a{
    font-size: 1.5rem;
    padding: 1.2rem 3.5rem;
  }

  .marquee h1 {
    font-size: 6rem;
  }

  .cart__title {
    font-size: 3rem;
  }

  .cart__description {
    font-size: 1.7rem;
  }
  #membership .section__title{
    padding: 0rem 2rem;
    margin-bottom: 4rem;
  }
  #membership{
    margin-bottom: 2rem;
  }
  .auth-block{
    font-size: 2.4rem;
  }
  .auth-menu p{
    padding: 0;
  }
  .auth-menu{
    margin-bottom: 2rem;
  }
  .auth-menu .fa-chevron-down{
    display: none;
  }
  .auth-links li{
    padding: 0;
    text-align: right;

  }
  .auth-menu .auth-links{
    height: 11rem;
    border-radius: 0;
    top: 5rem;
            flex-direction: column;
        gap: .5rem;
  }
  .auth-links li a{
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 2rem;
  }
  .section__title {
    font-size: 5rem;
    line-height: normal;
  }

  .cart {
    height: 26rem;
    width: 34rem;
    box-shadow: 8px 12px 30px 0px rgba(148, 119, 226, 0.2);
  }

  .cart--purple {
    background-color: var(--color-purple-opacity);
    -webkit-box-shadow: none;
    box-shadow: none;
    scroll-snap-align: center;
    padding: 4rem;
  }

  .banner__title {
    font-size: 4.5rem;
    line-height: normal;
  }

  .banner__text {
    font-size: 1.3rem;
  }

  .banner__step {
    max-width: 24rem;
    height: 5.3rem;
  }

  .banner__step-wrapper {
    padding: 1.2rem;
    gap: 1.5rem;
  }

  .banner__step-number {
    font-size: 2rem;
    min-width: 3rem;
    height: 3rem;
  }

  .banner__step-text {
    font-size: 1.1rem;
    max-width: auto;
    line-height: normal;
    text-align: left;
  }

  .accordionjs .acc_section .acc_head {
    font-size: 1.5rem;
    padding: 1.2rem 3rem;
  }

  .accordionjs .acc_section .acc_head > svg {
    max-width: 2rem;
  }

  .banner__images-area {
    height: 30rem;
  }

  .banner__image--plus {
    max-width: 10rem;
    top: 0rem;
  }
  .banner__image--confetti {
    max-width: 13rem;
    top: 0rem;
    z-index: 10;
  }

  .banner__image--present {
    width: 100%;
    max-width: 14rem;
    bottom: 0;
    left: 0;
    z-index: 10;
  }
  .banner__image--plus {
    max-width: 10rem;
    top: 0rem;
  }

  .banner__step[data-step-order="1"] {
    position: absolute;
    top: 8rem;
    left: 0;
    max-width: 29rem;
  }

  .banner__step[data-step-order="2"] {
    position: absolute;
    top: 17rem;
    left: 10rem;
    max-width: 24rem;
  }

  .banner__step[data-step-order="3"] {
    position: absolute;
    top: 11rem;
    right: 0rem;
  }

  .footer .section__title {
    font-size: 4rem;
  }

  .footer-block {
    font-size: 1.2rem;
  }
  .footer-block .btn-main {
    font-size: 1.2rem;
  }

  .footer__text {
    font-size: 1.2rem;
  }

  .footer__wrapper {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }

  /* .footer__social {
    width: 3.5rem;
    height: 3.5rem;
    padding: 0.6rem;
    -webkit-transition: background-color 0.5s cubic-bezier(0.075, 0.82, 0.165, 1), color 0.5s cubic-bezier(0.075, 0.82, 0.165, 1),
      border-color 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
    -o-transition: background-color 0.5s cubic-bezier(0.075, 0.82, 0.165, 1), color 0.5s cubic-bezier(0.075, 0.82, 0.165, 1), border-color 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
    -webkit-transition: background-color 0.5s cubic-bezier(0.075, 0.82, 0.165, 1), color 0.5s cubic-bezier(0.075, 0.82, 0.165, 1),
      border-color 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
    transition: background-color 0.5s cubic-bezier(0.075, 0.82, 0.165, 1), color 0.5s cubic-bezier(0.075, 0.82, 0.165, 1), border-color 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
  } */

  .slide-hp .banner__title {
    font-size: 6rem;
  }

  .slide-hp .banner__title--big {
    font-size: 20rem;
    line-height: 11.5rem;
  }

  .carts-switcher .cart__icon {
    width: 3.8rem;
    height: 3.8rem;
    font-size: 2rem;
  }

  .slide-hp .banner__text {
    font-size: 3rem;
  }

  .carts-switcher .cart__title {
    line-height: 2.2rem;
    font-size: 2.2rem;
  }

  .switcher__button {
    font-size: 1.35rem;
    line-height: 90%;
    padding: 0.3rem 1rem;
  }
  .illustration__img {
    max-width: 65rem;
    right: -1rem;
    height: 80vh;
  }
  .carts-purple {
    grid-template-columns: repeat(3, minmax(27rem, 38rem));
  }
}

@media screen and (max-width: 1100px) {
  .banner__step[data-step-order="1"] {
    max-width: 22rem;
  }
}

@media screen and (max-width: 950px) {
  .section__wrapper:has(.carts-mobile-scroll) {
    padding: 0;
  }
  .footer__wrapper--gap{
    flex-direction: column;
    gap: 2rem;
  }
  .footer__wrapper--gap > .footer__text:nth-child(2){
    text-align: left;
  }
  .footer-block{
    gap: 2rem;
  }
  .footer-block .section__block{
    gap: 1rem;
  }
  .carts-mobile-scroll {
    overflow-x: auto;
    margin: 0;
    padding: 0rem 1.9rem 4rem;
    justify-content: flex-start;
  }
  .carts-mobile-scroll .carts{
    width: auto;
  } 
  .carts--scroll {
    margin: 0rem;
  }

  .carts-mobile-scroll,
  .carts--scroll {
    -ms-overflow-style: none;
    scrollbar-width: none;
    overflow-y: scroll;
  }
  .carts-mobile-scroll::-webkit-scrollbar,
  .carts--scroll::-webkit-scrollbar {
    display: none;
  }

  #membership .banner{
    width: auto;
    margin: 0rem 2rem;
    flex-direction: column-reverse;
  }
  .mobile-block {
    display: block;
  }
  .mobile-block--hide {
    display: none !important;
  }
  .swiper-banner {
    height: 55rem;
  }

  .banner__block:nth-child(1) {
    z-index: 10;
  }

  .banner__block:nth-child(2) {
    width: 100%;
  }

  .slide-common .banner__block:nth-child(2) {
    width: 100%;
    position: absolute;
    right: -4%;
    bottom: -10%;
  }

  .banner.banner-mycard .banner__block:nth-child(1) {
    width: 100%;
    padding: 3rem;
  }
  .banner-mycard .banner__block:nth-child(2) {
    display: none;
  }

  .slide-hp .banner__title {
    font-size: 4rem;
  }

  .slide-hp .banner__title--big {
    font-size: 14rem;
    line-height: 8.5rem;
  }

  .slide-hp .banner__text {
    font-size: 2rem;
  }

  .document-title {
    font-size: 3rem;
  }
  .document {
    font-size: 1.3rem;
  }

  .breadcrumbs {
    font-size: 1.2rem;
  }

  .slide-common .banner__images-area > img {
    bottom: -3rem;
    position: absolute;
    max-width: 60%;
    right: auto;
    right: 29rem;
  }

  .banner.banner-save-scores {
    flex-direction: column;
    gap: 1rem;
  }

  .banner-save-scores .banner__block:nth-child(3) {
    width: 100%;
    align-self: start;
    display: flex;
    justify-content: center;
  }
  .banner-save-scores .banner__block:nth-child(3) > .btn-main {
    width: 100%;
    max-width: 100%;
    font-size: 2rem;
    text-align: center;
  }
  .banner-save-scores .banner__block:nth-child(2) {
    width: 100%;
    position: relative;
    left: 0;
  }

  .carts-purple {
    display: flex;
    grid-template-columns: repeat(2, minmax(27rem, 38rem));
    margin: 3rem;
  }
}

@media screen and (max-width: 768px) {

  .illustration__img {
    max-width: none;
    right: -2rem;
    height: auto;

  }
  .illustration__img img{
    width: 100%;
    height: auto;
  }
  .auth-block{
    width: 100%;
  }
  .section-app-small .swiper-banner{
    height: auto;
  }
  .section-app-small .slide-app .banner__images-area > img{
    display: none;
  }
  .section-app-small .banner__block:nth-child(1){
    width: 100%;
  }
  .section-app-small .slide-app .banner__block:nth-child(1) > .banner__title{
    font-size: 3.8rem;
  }
  .section-app-small .slide-app .banner__links{
    position: initial!important;
    width: 100%;
  }
  .section-app-small .slide-app .banner__links a{
    width: 100%;
    border-radius: 3rem;
  }

  .dobraya-cena{
    width: 100%;
  }
  .auth-menu p{
    justify-content: flex-start;
    font-weight: 600;
  }
  .auth-links{
    box-shadow: none;
  }
  .auth-links li:first-child{
    border: none;
    padding: 0;
  }
  .auth-menu .auth-links{
    top: 4rem;
  }
  .auth-links li a{
    padding-left: 3rem; 
  }
  .auth-links li:after{
    width: 0.9rem;
    height: 1.6rem;
  }
  .app-video{
    height: 21.2rem;
    width: 100%;
  }
  .slide-app .banner-swiper--2{
    padding: 3.2rem;
  }
  .slide-app .banner__links{
    flex-direction: column;
    gap:1rem;
  }
  .slide-app .banner__links a{
    width: 12rem;
  }
  .slide-app .banner__images-area{
    height: auto;
  }
  .section-app-slider{
    padding: 3rem;
    padding-bottom: 6rem;
  }
  .section-app-video{
    padding: 3rem 0;
  }
  .section-app-banner{
    padding-top: 3rem;
  }
  .slide-app .banner__images-area > img{
    bottom: 0rem;
    position: absolute;
    right: -1.3rem;
    max-width: none;
    width: 35rem;
  }
  .slide-app .banner__images-area > img.pesr-img{
    bottom: -5rem;
    position: absolute;
    right: -4.3rem;
    max-width: 90%;
  }
  .slide-app .banner__images-area > img.woman-img{
    bottom: -3rem;
    position: absolute;
    right: -4.3rem;
    max-width: none;
    width: 118%;
  }
  .slide-app .banner__images-area > img.gift-img{
    bottom: 6rem;
    position: absolute;
    right: -3.3rem;
    max-width: max-content;
    width: 46rem;
  }
  .slide-common .banner__images-area > img.balance-img{
    bottom: -5rem;
    position: absolute;
    right: 0.7rem;
    max-width: max-content;
    width: 37rem;
  }
  .slide-common .banner__images-area > img.hb-img{
    bottom: -21rem;
    position: absolute;
    right: -7.3rem;
    max-width: max-content;
    width: 50rem;
  }
  .slide-app .banner__images-area > img.pesr-img{
    bottom: -5rem;
            position: absolute;
            right: -0.3rem;
            max-width: max-content;
            width: 32rem;
  }
  .slick-next, .slick-prev{
    height: 3.2rem;
    width: 3.2rem;
    top: -9.6rem;
  }
  .slick-prev {
    right: 5.6rem;
  }
  :root {
    --padding-side: 2rem;
  }
  .menu-mobile__content{
    padding-right: 3.2rem;
    padding-left: 3.2rem;
  }
  .section__title {
    font-size: 4rem;
  }
  .section__title.section__title-dobraya{
    font-weight: 700;
    font-style: Bold;
    font-size: 4.5rem;
    line-height:110%;
    letter-spacing: -1.19px;
    margin-bottom: 2.5rem;
  }
  .illustration__title {
    line-height: normal;
    font-size: 5rem;
    line-height: 6rem;
    width: 24rem;
  }
  .main-banner-text{
    left: auto;
    right: 0.3rem;
    top: 6rem;
    width: 23rem;
    height: auto;
  }
  .main-banner-badge{
    height: auto;
    bottom: auto;
    top: 11rem;
    left: 0rem;
    width: 16rem;
  }
  .menu {
    display: none;
  }
  .menu-mobile {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-direction: column; 
    height: auto;
    position: fixed;
    background-color: var(--color-white);
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    pointer-events: auto;
    z-index: 999;
  }
  .menu-mobile__wrapper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--color-white);
    z-index: 9999;
  }
  .menu-mobile .container {
    z-index: 9999;
    background-color: var(--color-white);
    padding: 0rem var(--padding-side);
    height: 7.8rem; 
    box-shadow: 0px 2px 4px 0px #00000026;
    display: flex;

  }
  .menu-mobile .container > .menu__buttons {
    margin-right: 1.5rem;
  }
  .menu__logo{
    margin-right: auto;
  }
  .menu-mobile__burger--open .menu-mobile__content {
    pointer-events: all;
    top: var(--padding-menu-top);
  }

  .menu-mobile__content {
    background-color: var(--color-white);
    height: calc(100vh - var(--padding-menu-top));
    position: fixed;
    z-index: 999;
    width: 100%;
    left: 0;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 4rem 3.2rem;
    align-items: end;
    gap: 3.6rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
  .menu-mobile .auth-block{
    width: auto;
  }
  .menu-mobile .auth-menu p,
  .menu-mobile .auth-links{
    display: none;
  }
  .menu-mobile .auth-block a{
    display: block;
  }
  .menu-mobile__content .auth-menu p,
  .menu-mobile__content .auth-links{
    display: flex;
  }
  .menu-mobile__content .auth-block{
    width: 100%;
  }
  .auth-menu:hover .auth-links{
    height: 12rem;
  }
  .menu-mobile__content .menu__buttons{
    display: none;
  }
  .menu-mobile .menu__links {
    height: auto;
    flex-direction: column;
    font-size: 2.4rem;
    font-weight: 600;
    align-items: end;
    gap: 2rem;
    padding-bottom: 3.6rem;
    border-bottom: 1px solid #E2E2E2;
    width: 100%;
  }
  .menu-mobile .menu__links .btn-main{
    font-size: 2rem;
  }
  .menu-mobile .menu__buttons > .btn-main {
    width: 100%;
    font-size: 2rem;
  }

  .carts--scroll {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    padding-left: var(--padding-side);
  }

  .cart {
    height: 23rem;
    flex-shrink: 0;
    padding: 3rem 2rem;
  }

  .cart__img {
    height: 11rem;
    flex-shrink: 0;
    margin-right: 0;
    margin-right: auto;
  }
  .cart__description{
  }
  .cart--purple {
    padding: var(--padding-side);
  }

  .qiestion {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    margin: 5rem 0rem;
  }

  .banner {
    padding: 3rem;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 4rem;
  }

  .banner__block:nth-child(1),
  .banner__block:nth-child(2) {
    width: 100%;
  }

  .banner__title {
    font-size: 2.5rem;
  }
  .banner__text {
    font-size: 1.2rem;
  }

  .banner__step {
    z-index: 99;
  }

  .banner__step {
    z-index: 99;
  }

  .banner__images-area {
    height: 22rem;
  }

  .banner__step[data-step-order="1"] {
    top: 0rem;
    left: 0;
  }

  .banner__step[data-step-order="2"] {
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
  }
  .banner__step[data-step-order="3"] {
    top: auto;
    right: 0rem;
    bottom: 0rem;
  }

  .section__block.footer {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }

  .footer-block {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }

  .slide-hp .illustration__circle {
    width: 110%;
  }

  .illustration__block > a {
    display: none;
  }

  .btn-mobile--illustration {
    display: block;
    text-align: center;
  }

  .illustration {
    padding-top: 3rem;
    align-items: start;
    height: 62rem;
  }

  .slide-hp .banner__images-area > img {
    transform: scale(1.3);
    transform-origin: center;
  }

  .popup-mini .popup-mini__content {
    flex-direction: column;
  }
  .popup-mini .popup-mini__content .image {
    display: flex;
    width: 100%;
    align-items: center;
    gap: 1rem;
  }

  .popup-mini .popup-mini__content .image > svg {
    max-width: 4.7rem;
  }
  .popup-mini .popup-mini__content .info__text {
    font-size: 1.3rem;
  }
  .document-title {
    font-size: 4rem;
  }
  .document {
    font-size: 1.3rem;
  }
  .breadcrumbs {
    font-size: 1rem;
  }

  .slide-hp .predescr {
    display: block !important;
  }
  .slide-common .banner__block:nth-child(1) {
    width: 100%;
    height: 30%;
  }

  .slide-common .banner__block:nth-child(2) {
    width: 100%;
    height: 70%;
    left: 0;
  }

  .slide-common .banner__images-area > img {
    bottom: -3rem;
    position: absolute;
    max-width: 80%;
    right: auto;
    right: 2rem;
  }

  .slide-common .illustration__circle {
    width: 110%;
  }

  .swiper-banner + .btn-main {
    margin-top: 2rem;
    width: 100%;
    text-align: center;
  }

  .banner.banner-save-scores {
    flex-direction: column;
  }
  .banner-save-scores .banner__title {
    color: var(--color-white);
    font-weight: 600;
  }

  .banner-save-scores .banner__block:nth-child(3) {
    width: 100%;
    align-self: start;
    display: flex;
    justify-content: flex-end;
  }
  .banner-save-scores .banner__block:nth-child(2) {
    width: 100%;
  }
  .banner-save-scores .banner__block > .btn-main {
    align-self: flex-start;
    font-size: 2rem;
  }

  .banner-save-scores .illustration__circle {
    position: absolute;
    left: 0%;
    width: 115%;
    z-index: 0;
  }

  .footer__socials {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    align-items: center;
    justify-content: flex-start;
  }

  .carts-purple {
    grid-template-columns: repeat(2, minmax(22rem, 38rem));
  }
  .cart--purple .cart__title {
    font-size: 2.5rem;
  }

  .carts-purple {
    margin: 0rem;
  }
  .switcher{
    margin: 0 2rem 2rem;
  }
  .carts-switcher {
    flex-direction: column!important;
    overflow: hidden!important;
  }
  .slide-app .banner__descr{
    font-size: 1.8rem;
  }
}

@media screen and (max-width: 500px) {
  .slide-common .banner__block:nth-child(2) {
    bottom: -2rem;
  }
  .menu-mobile .menu__buttons > .btn-main {
    font-size: 1.5rem;
    min-width: 10.7rem;
  }
  .slide-common .banner__block:nth-child(1) > .banner__title {
    font-size: 3.2rem;
  }
  .slide-app .banner__block:nth-child(1) > .banner__title{
    font-size: 3.2rem;
    margin-bottom: 1rem;
  }

  .slide-common .banner__images-area > img {
    bottom: -7rem;
    position: absolute;
    max-width: 100%;
    right: auto;
    right: auto;
  }
  .section__title{
    margin-bottom: 3rem;
  }

  .question__left .btn-main{
    display: none;
    width: 100%;
  }
  .question__right{
    flex-direction: column;
  }
  .question__right .btn-main{
    display: block;
    width: 100%;
    text-align: center;
  }
  .carts-purple {
    justify-content: flex-start;
  }
  .carts-purple {
    grid-template-columns: repeat(1, minmax(22rem, 38rem));
  }

  .carts-purple .cart__title {
    font-size: 3rem;
  }
  .carts-purple .cart__description {
    font-size: 1.6rem;
  }
}

@media (hover: hover) {
  .btn-main:hover {
    background-color: var(--color-purple);
  }
  .btn-main--white:hover,
  .btn-main--purple:hover,
  .btn-main--yellow:hover {
    background-color: var(--color-black);
    color: var(--color-white);
  }

  .menu__links > a:hover,
  .footer__links > a:hover {
    color: var(--color-purple);
  }

  .banner__step:hover > .banner__step-wrapper {
    background-color: #ebebeb;
  }

  .cart:hover .cart__img {
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
  }

  /* .footer__social:hover {
    border-color: var(--color-purple);
    background-color: var(--color-purple);
    color: var(--color-white);
  } */
}

@media (hover: none) {
  .btn-main:active {
    background-color: var(--color-purple);
  }
  .btn-main--white:active,
  .btn-main--purple:active,
  .btn-main--yellow:active {
    background-color: var(--color-black);
    color: var(--color-white);
  }

  .menu__links > a:active,
  .footer__links > a:active {
    color: var(--color-purple);
  }

  .banner__step:active > .banner__step-wrapper {
    background-color: #ebebeb;
  }

  .cart:active .cart__img {
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
  }

  .footer__social:active {
    border-color: var(--color-purple);
    background-color: var(--color-purple);
    color: var(--color-white);
  }
}

.animate__slideInUpDeep {
  animation-name: slideInUpDeep;
}

@keyframes slideOutLeftCookie {
  0% {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }

  100% {
    -webkit-transform: translateZ(0);
    transform: translateX(-50%);
  }
}

@keyframes slideOutLeftCustom {
  0% {
    transform: translateX(-50%);
  }
  100% {
    visibility: hidden;
    -webkit-transform: translate3d(-200%, 0, 0);
    transform: translate3d(-200%, 0, 0);
  }
}
@keyframes slideInUpDeep {
  0% {
    visibility: visible;
    -webkit-transform: translate3d(0, 200%, 0);
    transform: translate3d(0, 200%, 0);
  }
  100% {
    transform: translateZ(0);
  }
}