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

.container {
  margin: 0 auto;
  position: relative;
  padding: 0 20px;
  max-width: 100%;
  width: 375px;
}

.wrapper {
  overflow: hidden;
  position: relative;
  margin: 0 auto -30px;
  max-width: 1920px;
  overflow: hidden;
}

body {
  font-family: "Manrope", sans-serif;
  color: #1A1A1A;
  font-size: 18px;
  line-height: 1.22;
  background: #F0F0F0;
}

section {
  position: relative;
  padding-bottom: 40px;
}

img {
  max-width: 100%;
  margin: 0 auto;
  display: block;
}

a {
  text-decoration: none;
}

ul {
  list-style: none;
}

h1 {
  font-size: 32px;
  font-weight: 700;
}

h2 {
  font-size: 22px;
  font-weight: 500;
}

.title {
  font-size: 24px;
  font-weight: 500;
}
.title b {
  font-weight: 600;
}

.text {
  font-size: 20px;
  font-weight: 400;
}
.text b {
  font-weight: 600;
}

.button {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 5px;
  outline: none;
  width: 234px;
  height: 60px;
  border: none;
  line-height: 1;
  position: relative;
  border: 1px solid #4E4E4E;
  transition: background-color 0.4s;
  border-radius: 122px;
  cursor: pointer;
  font-family: Manrope;
  font-size: 18px;
  line-height: 1;
  color: #FFFFFF;
  background-color: #242424;
  z-index: 15;
}
.button svg {
  fill: #fff;
  width: 24px;
  height: 24px;
  margin-left: 10px;
}
.button span {
  font-size: 20px;
  font-weight: 600;
}
.button:hover {
  background-color: #3A3A3A;
}
.button--wh {
  background: #FFF;
  color: #1A1A1A;
}
.button--wh svg {
  fill: #1A1A1A;
}
.button--wh:hover {
  background: rgba(255, 255, 255, 0.8);
}

.bl {
  border-radius: 20px;
  background: #1A1A1A;
  color: #fff;
}

.container.bl {
  padding: 36px 20px 50px;
}

.container.wh, .container.bl {
  width: 335px;
}

.wh {
  border-radius: 20px;
  background: #FFF;
}

.info {
  padding-top: 12px;
}
.info p {
  margin-top: 24px;
}

#spriteSvg {
  position: absolute;
  top: -10px;
  left: -10px;
  width: 0;
  height: 0;
  opacity: 0;
}

.bg {
  background: #FFF;
}

.header {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 100;
}
.header .container {
  display: flex;
  height: 60px;
  justify-content: space-between;
  align-items: center;
}
.header__logo {
  display: inline-block;
}
.header__logo svg, .header__logo a svg {
  width: 58px;
  height: 23px;
  fill: #1A1A1A;
  margin-top: 3px;
}
.header__logo a {
  display: inline-block;
}
.header__nav {
  display: flex;
}
.header__nav li {
  display: block;
}
.header__nav li:first-child {
  margin-right: 29px;
}
.header__nav a {
  color: #1A1A1A;
  position: relative;
  z-index: 5;
  transition: color 0.4s;
  font-weight: 600;
}
.header__nav a::before {
  position: absolute;
  content: "";
  border-radius: 40px;
  background: #1A1A1A;
  opacity: 0;
  top: -5px;
  bottom: -5px;
  left: -20px;
  right: -20px;
  z-index: -1;
  transition: opacity 0.4s;
}
.header__nav a:hover {
  color: #fff;
}
.header__nav a:hover::before {
  opacity: 1;
}
.header.scroll {
  position: fixed;
  transform: translateY(-100%);
}
.header.animation {
  transition: transform 0.25s;
}
.header.show {
  position: fixed;
  transform: translateY(0);
  transition: transform 0.25s;
}

.header {
  background: #F0F0F0;
}

.promo {
  padding-top: 114px;
}
.promo .container::before {
  position: absolute;
  content: "";
  inline-size: 93px;
  aspect-ratio: 1;
  border-radius: 93px;
  transform: translate3d(0, 0, 0);
  will-change: transform;
  transition: filter 0.2s ease-in-out;
  filter: blur(85.2441635132px);
  bottom: 70px;
  right: 110px;
  background: #513ECA;
  z-index: 1;
}
.promo h3 {
  font-weight: 600;
}
.promo h1 {
  margin-top: 24px;
}
.promo h2 {
  margin-top: 13px;
}
.promo .button {
  margin-top: 40px;
}
.promo .phone {
  z-index: 10;
  transform-style: preserve-3d;
  transform: translateZ(1px);
}

.phone {
  margin-top: 67px;
  padding: 18px 16px 0 19px;
  width: 230px;
  border-radius: 32px 32px 0 0;
  border: 2px solid #1A1A1A;
  background: #FFF;
  position: relative;
  z-index: 15;
  transform-style: preserve-3d;
}
.phone::after {
  transform: translateZ(-1px);
  position: absolute;
  content: "";
  width: 186px;
  height: 117px;
  right: -86px;
  top: 61px;
  z-index: -5;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='297' height='187' fill='none'%3E%3Cg clip-path='url(%23a)'%3E%3Cg clip-path='url(%23b)'%3E%3Cpath fill='%23000' d='M-56-80.2 389-73l-4.5 278-445-7.1z'/%3E%3Cg filter='url(%23c)'%3E%3Cellipse cx='217.9' cy='202.6' fill='%238777F1' rx='245' ry='136' transform='rotate(23 217.9 202.6)'/%3E%3C/g%3E%3Cg filter='url(%23d)'%3E%3Ccircle cx='-11.5' cy='84' r='167.7' fill='%23425680' transform='rotate(1 -11.5 84)'/%3E%3C/g%3E%3Cg filter='url(%23e)'%3E%3Cellipse cx='566.2' cy='492.3' fill='%23513ECA' rx='551.1' ry='169.8' transform='rotate(30 566.2 492.3)'/%3E%3C/g%3E%3Cg filter='url(%23f)'%3E%3Cellipse cx='164.4' cy='479.4' fill='%23ADA0FF' rx='830.7' ry='223.3' transform='rotate(24 164.4 479.4)'/%3E%3C/g%3E%3C/g%3E%3Cg filter='url(%23g)'%3E%3Cpath fill='%23fff' fill-opacity='.3' d='M34.5 69.4c0-3 2.5-5.5 5.6-5.5h27.6c3 0 5.5 2.5 5.5 5.5V86c0 3-2.5 5.5-5.5 5.5H40a5.6 5.6 0 0 1-5.6-5.5V69.4Z'/%3E%3Cpath stroke='%23fff' stroke-opacity='.3' stroke-width='.7' d='M34.9 69.4c0-2.9 2.3-5.2 5.2-5.2h27.6c2.8 0 5.2 2.3 5.2 5.2V86c0 2.8-2.4 5.2-5.2 5.2H40a5.2 5.2 0 0 1-5.2-5.2V69.4Z'/%3E%3C/g%3E%3Cpath fill='%23fff' fill-opacity='.3' d='M43.9 64.6h.6v26.2H44v-8.3h-8.7v-.7H44v-8.2h-8.7v-.7H44v-8.3Zm19.6 17.2h9v.7h-9v8.3h-.7V77c0-2.3 1.9-4.1 4.2-4.1h5.5v.7H67c-2 0-3.5 1.5-3.5 3.4v4.8Zm0-17.2h-.7V70h.7v-5.5Z'/%3E%3Cpath fill='%23fff' fill-opacity='.3' fill-rule='evenodd' d='M58.7 77.7a4.8 4.8 0 1 1-9.7 0 4.8 4.8 0 0 1 9.7 0Zm-.7 0a4.1 4.1 0 1 1-8.3 0 4.1 4.1 0 0 1 8.3 0Z' clip-rule='evenodd'/%3E%3Cg fill='%23fff' clip-path='url(%23h)'%3E%3Cpath d='m250.2 36.1.6 1.2c.2.4.2.9.2 1.4 0 .5 0 1-.2 1.4-.1.4-.3.8-.6 1.1-.3.5-.3 1.2.2 1.5.5.4 1.2.3 1.5-.2.4-.5.7-1 1-1.8.3-.6.3-1.3.3-2s0-1.4-.3-2.1c-.2-.6-.6-1.2-1-1.8-.3-.5-1-.5-1.5-.2s-.5 1-.2 1.5Zm3.8-2a8.6 8.6 0 0 1 0 9.1c-.3.5-.1 1.2.3 1.5.6.4 1.2.2 1.6-.3a10.7 10.7 0 0 0 0-11.5c-.4-.4-1-.7-1.6-.3-.4.3-.6 1-.3 1.5Z'/%3E%3Cpath d='M258 32a13.4 13.4 0 0 1 0 13.3c-.3.6-.1 1.2.4 1.5.6.3 1.2.2 1.5-.4a14.8 14.8 0 0 0 0-15.5c-.2-.5-1-.7-1.5-.4-.5.4-.7 1-.4 1.5Z'/%3E%3Cpath d='M262 30a17.6 17.6 0 0 1 0 17.4c-.3.5-.1 1.1.4 1.5.6.3 1.2.1 1.5-.4a19.6 19.6 0 0 0 0-19.6c-.2-.6-1-.7-1.5-.4-.5.2-.7 1-.4 1.5Z'/%3E%3C/g%3E%3Cg filter='url(%23i)'%3E%3Ccircle cx='246.3' cy='151.7' r='12.9' fill='%23fff' fill-opacity='.3'/%3E%3C/g%3E%3Cg filter='url(%23j)'%3E%3Cpath fill='%23fff' fill-opacity='.7' d='M275.1 151.7a12.9 12.9 0 1 1-25.7 0 12.9 12.9 0 0 1 25.7 0Z'/%3E%3C/g%3E%3Cg filter='url(%23k)'%3E%3Cpath fill='%23fff' fill-opacity='.6' d='M254.3 141.6a12.9 12.9 0 0 0 0 20.2 12.9 12.9 0 0 0 0-20.2Z'/%3E%3C/g%3E%3C/g%3E%3Crect width='295.2' height='184.7' x='.9' y='.9' stroke='url(%23l)' stroke-width='1.7' rx='12.9'/%3E%3Cdefs%3E%3Cfilter id='c' width='882.9' height='736.2' x='-223.6' y='-165.5' color-interpolation-filters='sRGB' filterUnits='userSpaceOnUse'%3E%3CfeFlood flood-opacity='0' result='BackgroundImageFix'/%3E%3CfeBlend in='SourceGraphic' in2='BackgroundImageFix' result='shape'/%3E%3CfeGaussianBlur result='effect1_foregroundBlur_3694_39659' stdDeviation='105'/%3E%3C/filter%3E%3Cfilter id='d' width='695.4' height='695.4' x='-359.2' y='-263.7' color-interpolation-filters='sRGB' filterUnits='userSpaceOnUse'%3E%3CfeFlood flood-opacity='0' result='BackgroundImageFix'/%3E%3CfeBlend in='SourceGraphic' in2='BackgroundImageFix' result='shape'/%3E%3CfeGaussianBlur result='effect1_foregroundBlur_3694_39659' stdDeviation='90'/%3E%3C/filter%3E%3Cfilter id='e' width='1267' height='929' x='-67.3' y='27.8' color-interpolation-filters='sRGB' filterUnits='userSpaceOnUse'%3E%3CfeFlood flood-opacity='0' result='BackgroundImageFix'/%3E%3CfeBlend in='SourceGraphic' in2='BackgroundImageFix' result='shape'/%3E%3CfeGaussianBlur result='effect1_foregroundBlur_3694_39659' stdDeviation='75'/%3E%3C/filter%3E%3Cfilter id='f' width='1946.1' height='1214.7' x='-808.6' y='-127.9' color-interpolation-filters='sRGB' filterUnits='userSpaceOnUse'%3E%3CfeFlood flood-opacity='0' result='BackgroundImageFix'/%3E%3CfeBlend in='SourceGraphic' in2='BackgroundImageFix' result='shape'/%3E%3CfeGaussianBlur result='effect1_foregroundBlur_3694_39659' stdDeviation='105'/%3E%3C/filter%3E%3Cfilter id='g' width='55.9' height='44.9' x='25.9' y='55.3' color-interpolation-filters='sRGB' filterUnits='userSpaceOnUse'%3E%3CfeFlood flood-opacity='0' result='BackgroundImageFix'/%3E%3CfeGaussianBlur in='BackgroundImageFix' stdDeviation='4.3'/%3E%3CfeComposite in2='SourceAlpha' operator='in' result='effect1_backgroundBlur_3694_39659'/%3E%3CfeBlend in='SourceGraphic' in2='effect1_backgroundBlur_3694_39659' result='shape'/%3E%3C/filter%3E%3Cfilter id='i' width='60.3' height='60.3' x='216.1' y='121.5' color-interpolation-filters='sRGB' filterUnits='userSpaceOnUse'%3E%3CfeFlood flood-opacity='0' result='BackgroundImageFix'/%3E%3CfeGaussianBlur in='BackgroundImageFix' stdDeviation='8.6'/%3E%3CfeComposite in2='SourceAlpha' operator='in' result='effect1_backgroundBlur_3694_39659'/%3E%3CfeBlend in='SourceGraphic' in2='effect1_backgroundBlur_3694_39659' result='shape'/%3E%3C/filter%3E%3Cfilter id='j' width='60.3' height='60.3' x='232.1' y='121.5' color-interpolation-filters='sRGB' filterUnits='userSpaceOnUse'%3E%3CfeFlood flood-opacity='0' result='BackgroundImageFix'/%3E%3CfeGaussianBlur in='BackgroundImageFix' stdDeviation='8.6'/%3E%3CfeComposite in2='SourceAlpha' operator='in' result='effect1_backgroundBlur_3694_39659'/%3E%3CfeBlend in='SourceGraphic' in2='effect1_backgroundBlur_3694_39659' result='shape'/%3E%3C/filter%3E%3Cfilter id='k' width='44.3' height='54.7' x='232.1' y='124.3' color-interpolation-filters='sRGB' filterUnits='userSpaceOnUse'%3E%3CfeFlood flood-opacity='0' result='BackgroundImageFix'/%3E%3CfeGaussianBlur in='BackgroundImageFix' stdDeviation='8.6'/%3E%3CfeComposite in2='SourceAlpha' operator='in' result='effect1_backgroundBlur_3694_39659'/%3E%3CfeBlend in='SourceGraphic' in2='effect1_backgroundBlur_3694_39659' result='shape'/%3E%3C/filter%3E%3CclipPath id='a'%3E%3Crect width='297' height='186.5' fill='%23fff' rx='13.8'/%3E%3C/clipPath%3E%3CclipPath id='b'%3E%3Cpath fill='%23fff' d='M-56-80.2 389-73l-4.5 278-445-7.1z'/%3E%3C/clipPath%3E%3CclipPath id='h'%3E%3Cpath fill='%23fff' d='M247.2 27.6h22.1v22.1h-22z'/%3E%3C/clipPath%3E%3ClinearGradient id='l' x1='0' x2='297' y1='93.2' y2='93.2' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23fff' stop-opacity='.8'/%3E%3Cstop offset='1' stop-color='%23fff' stop-opacity='.1'/%3E%3C/linearGradient%3E%3C/defs%3E%3C/svg%3E%0A") center/contain no-repeat;
}
.phone::before {
  border-radius: 32px 32px 0 0;
  position: absolute;
  content: "";
  top: -2px;
  left: 0;
  width: 100%;
  height: 190px;
  background: #383838;
  z-index: -1;
}
.phone__bg {
  padding-bottom: 34px;
  color: #fff;
  position: relative;
}
.phone__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 6px;
}
.phone__header figure {
  display: flex;
  align-items: center;
}
.phone__header figure img {
  border-radius: 50%;
  width: 21px;
  margin: 0;
  margin-right: 6px;
}
.phone__header figure figcaption {
  font-size: 11px;
  font-weight: 600;
  position: relative;
}
.phone__header figure figcaption::after {
  content: "";
  position: absolute;
  aspect-ratio: 1;
  inline-size: 14px;
  right: -15px;
  top: 1px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M5.93877 2.25434C5.89844 2.21166 5.8669 2.16145 5.84597 2.10658C5.82504 2.05171 5.81512 1.99325 5.81678 1.93455C5.81845 1.87585 5.83165 1.81805 5.85565 1.76445C5.87965 1.71085 5.91397 1.6625 5.95665 1.62217C5.99934 1.58183 6.04955 1.5503 6.10442 1.52937C6.15929 1.50844 6.21774 1.49852 6.27645 1.50018C6.33515 1.50184 6.39295 1.51505 6.44655 1.53905C6.50015 1.56304 6.5485 1.59737 6.58883 1.64005L10.3891 5.66382C10.4675 5.74682 10.5113 5.85673 10.5113 5.97096C10.5113 6.0852 10.4675 6.1951 10.3891 6.27811L6.58883 10.3023C6.54876 10.3459 6.50043 10.3812 6.44663 10.4059C6.39283 10.4307 6.33465 10.4446 6.27546 10.4467C6.21627 10.4488 6.15725 10.4391 6.10183 10.4182C6.04641 10.3973 5.9957 10.3656 5.95263 10.3249C5.90957 10.2843 5.87501 10.2354 5.85098 10.1813C5.82694 10.1272 5.8139 10.0688 5.81261 10.0096C5.81132 9.95039 5.82181 9.8915 5.84346 9.83638C5.86512 9.78125 5.89752 9.73098 5.93877 9.68848L9.44928 5.97096L5.93877 2.25434Z' fill='white'/%3E%3C/svg%3E") center/contain no-repeat;
}
.phone__bell {
  inline-size: 21px;
  aspect-ratio: 1;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #F5F5F5;
}
.phone__bell svg {
  width: 13px;
  height: 13px;
}
.phone__title {
  font-size: 9px;
  font-weight: 500;
  margin-top: 9px;
}
.phone__title:nth-child(3) {
  position: relative;
}
.phone__title:nth-child(3)::after {
  content: "";
  position: absolute;
  aspect-ratio: 1;
  inline-size: 12px;
  right: 0px;
  top: 1px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M5.93877 2.25434C5.89844 2.21166 5.8669 2.16145 5.84597 2.10658C5.82504 2.05171 5.81512 1.99325 5.81678 1.93455C5.81845 1.87585 5.83165 1.81805 5.85565 1.76445C5.87965 1.71085 5.91397 1.6625 5.95665 1.62217C5.99934 1.58183 6.04955 1.5503 6.10442 1.52937C6.15929 1.50844 6.21774 1.49852 6.27645 1.50018C6.33515 1.50184 6.39295 1.51505 6.44655 1.53905C6.50015 1.56304 6.5485 1.59737 6.58883 1.64005L10.3891 5.66382C10.4675 5.74682 10.5113 5.85673 10.5113 5.97096C10.5113 6.0852 10.4675 6.1951 10.3891 6.27811L6.58883 10.3023C6.54876 10.3459 6.50043 10.3812 6.44663 10.4059C6.39283 10.4307 6.33465 10.4446 6.27546 10.4467C6.21627 10.4488 6.15725 10.4391 6.10183 10.4182C6.04641 10.3973 5.9957 10.3656 5.95263 10.3249C5.90957 10.2843 5.87501 10.2354 5.85098 10.1813C5.82694 10.1272 5.8139 10.0688 5.81261 10.0096C5.81132 9.95039 5.82181 9.8915 5.84346 9.83638C5.86512 9.78125 5.89752 9.73098 5.93877 9.68848L9.44928 5.97096L5.93877 2.25434Z' fill='black'/%3E%3C/svg%3E") center/contain no-repeat;
}
.phone__balance {
  font-size: 16px;
  font-weight: 600;
  margin: 0;
}
.phone__cards {
  margin: 4px 0 0 0;
}
.phone__list {
  margin-top: -24px;
  margin-bottom: 16px;
  display: flex;
  align-items: start;
  justify-content: space-between;
  border-radius: 8px;
  border: 0.537px solid #E8E8E8;
  background: #FFF;
  padding: 9px 24px 9px 9px;
  position: relative;
}
.phone__list::after {
  content: "";
  position: absolute;
  width: 13px;
  height: 13px;
  top: 7px;
  right: 4px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14' fill='none'%3E%3Cg clip-path='url(%23clip0_4021_4680)'%3E%3Cpath d='M6.87116 9.65678C7.08459 9.65678 7.28929 9.74156 7.44021 9.89248C7.59113 10.0434 7.67591 10.2481 7.67591 10.4615C7.67591 10.675 7.59113 10.8797 7.44021 11.0306C7.28929 11.1815 7.08459 11.2663 6.87116 11.2663C6.65773 11.2663 6.45303 11.1815 6.30211 11.0306C6.15119 10.8797 6.06641 10.675 6.06641 10.4615C6.06641 10.2481 6.15119 10.0434 6.30211 9.89248C6.45303 9.74156 6.65773 9.65678 6.87116 9.65678ZM6.87116 6.43776C7.08459 6.43776 7.28929 6.52255 7.44021 6.67347C7.59113 6.82439 7.67591 7.02908 7.67591 7.24252C7.67591 7.45595 7.59113 7.66064 7.44021 7.81156C7.28929 7.96248 7.08459 8.04727 6.87116 8.04727C6.65773 8.04727 6.45303 7.96248 6.30211 7.81156C6.15119 7.66064 6.06641 7.45595 6.06641 7.24252C6.06641 7.02908 6.15119 6.82439 6.30211 6.67347C6.45303 6.52255 6.65773 6.43776 6.87116 6.43776ZM6.87116 3.21875C7.08459 3.21875 7.28929 3.30354 7.44021 3.45446C7.59113 3.60538 7.67591 3.81007 7.67591 4.0235C7.67591 4.23694 7.59113 4.44163 7.44021 4.59255C7.28929 4.74347 7.08459 4.82826 6.87116 4.82826C6.65773 4.82826 6.45303 4.74347 6.30211 4.59255C6.15119 4.44163 6.06641 4.23694 6.06641 4.0235C6.06641 3.81007 6.15119 3.60538 6.30211 3.45446C6.45303 3.30354 6.65773 3.21875 6.87116 3.21875Z' fill='black'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_4021_4680'%3E%3Crect width='12.8761' height='12.8761' fill='white' transform='translate(0.429688 0.804688)'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E") center/cover no-repeat;
}
.phone__list figure {
  width: 75px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.phone__list figure svg {
  max-width: 13px;
  max-height: 13px;
  fill: #000;
}
.phone__list figure figcaption {
  margin-top: 5px;
  font-size: 9px;
  font-weight: 500;
  text-align: center;
}
.phone__dia {
  margin-top: 7px;
  border-radius: 8px;
  border: 0.537px solid #E8E8E8;
  background: #FFF;
  display: grid;
  grid-template-columns: auto 50px;
  grid-template-rows: auto auto;
  padding: 5px 12px 7px 10px;
  font-size: 8px;
  font-weight: 500;
  justify-content: space-between;
}
.phone__dia:last-child {
  height: 58px;
}
.phone__dia h5 {
  grid-row: 1/2;
  grid-column: 1/2;
  justify-content: start;
}
.phone__dia img {
  width: 64px;
  grid-row: 2/3;
  grid-column: 1/2;
  margin: 11px 0 0 0;
}
.phone__dia .balanses {
  margin-top: 7px;
  grid-column: 2/3;
  align-self: end;
  grid-row: 2/3;
}
.phone__dia .balanses p:first-child {
  color: #37A163;
  margin-bottom: 3px;
}

.icons {
  margin-top: -80px;
  position: relative;
  z-index: 50;
}
.icons__inner {
  display: flex;
  justify-content: space-between;
  align-items: start;
  flex-wrap: wrap;
}
.icons__inner figure {
  margin-top: 29px;
  width: 137px;
  flex-direction: column;
  display: flex;
}
.icons__inner figure svg {
  max-width: 36px;
  max-height: 36px;
}
.icons__inner figure figcaption {
  font-weight: 600;
  margin-top: 18px;
}
.icons ~ .empty .title {
  font-weight: 500;
}

.empty {
  margin-top: 76px;
  text-align: center;
}
.empty .button {
  margin: 45px auto 0;
}

.easy {
  margin-top: 107px;
}
.easy svg {
  width: 262px;
  height: 257px;
  margin: 0 auto;
  padding-bottom: 12px;
  display: block;
}
.easy .text {
  margin-top: 24px;
}

.collabs {
  margin-top: 30px;
}
.collabs .container.wh {
  padding: 0px 20px 50px;
}
.collabs img {
  width: 243px;
}
.collabs--ava .container.wh {
  padding-top: 36px;
}
.collabs--ava img {
  width: auto;
}

.built {
  margin-top: 73px;
}

.way__inner {
  padding-top: 50px;
  display: flex;
  align-items: start;
  justify-content: space-around;
  flex-wrap: wrap;
}
.way__item {
  margin-top: 20px;
  padding: 57px 22px;
  border-radius: 20px;
  background: #1A1A1A;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  max-width: 335px;
}
.way__item svg {
  max-width: 95px;
  max-height: 72px;
}
.way__item figcaption {
  margin-top: 41px;
  color: #FFF;
  text-align: center;
  display: flex;
  flex-direction: column;
}
.way__item figcaption b {
  display: block;
  font-weight: 700;
  margin-bottom: 14px;
}

.way__item {
  height: 313px;
}

.works {
  background: #FFF;
  padding: 54px 0 97px;
}
.works .title {
  text-align: center;
}
.works__inner {
  padding: 17px 32px 0;
  display: flex;
  align-items: start;
  justify-content: space-around;
  flex-wrap: wrap;
}
.works__inner img {
  margin: 34px 0 0 0;
  width: 69px;
  border: 1px solid #1A1A1A;
  border-radius: 10px;
}

.forefront {
  background: #1A1A1A;
  padding: 19px 0 247px;
  margin-bottom: -1px;
}
.forefront__bg {
  display: none;
}
.forefront h1, .forefront h2 {
  color: #fff;
  text-align: center;
}
.forefront__logo svg {
  margin: 0 auto;
  display: block;
  width: 58px;
  height: 37px;
  fill: rgba(255, 255, 255, 0.7);
}
.forefront h1 {
  margin-top: 174px;
}
.forefront h2 {
  margin-top: 12px;
}
.forefront .button {
  margin: 67px auto 0;
}
.forefront::before {
  position: absolute;
  content: "";
  inline-size: 338px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: #8777F1;
  filter: blur(263px);
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.forefront:after {
  content: "";
  position: absolute;
  width: 464px;
  height: 585px;
  top: 76px;
  left: 50%;
  transform: translateX(-50%);
  background: url(../img/forefront-bg.png) center/contain no-repeat;
}

.footer {
  background: #1A1A1A;
  padding: 67px 0 51px;
}
.footer__logo svg {
  fill: #FFF;
  width: 81px;
  height: 51px;
}
.footer__logo p {
  color: #FFF;
  font-size: 16px;
}
.footer__note, .footer__about {
  color: #989898;
  font-size: 16px;
}
.footer__note {
  margin-top: 36px;
}
.footer__about {
  margin-top: 51px;
}
.footer__contacts {
  margin-top: 42px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: start;
}
.footer__contacts a {
  margin-top: 14px;
  color: #FFF;
  position: relative;
  margin-right: 32px;
  cursor: pointer;
}
.footer__contacts a:not(.footer__contacts a:last-child)::after {
  content: "";
  position: absolute;
  width: 1px;
  height: 20px;
  background-color: #fff;
  right: -16px;
  top: 0px;
}

@media screen and (min-width: 425px) {
  .container {
    width: 400px;
  }
}
@media screen and (min-width: 768px) {
  .wrapper {
    margin-top: -10px;
  }
  .container, .container.wh, .container.bl {
    width: 744px;
  }
  .container.wh, .container.bl {
    display: grid;
    grid-template-columns: auto auto;
    grid-template-rows: auto auto;
    justify-content: space-between;
  }
  .info {
    margin-left: 20px;
  }
  .header__logo svg, .header__logo a svg {
    margin-top: 0px;
  }
  .promo .container {
    display: grid;
    grid-template-columns: auto auto;
    grid-template-rows: auto auto;
  }
  .promo .container::before {
    right: 20px;
  }
  .promo__titles {
    grid-row: 1/2;
    grid-column: 1/2;
    max-width: 610px;
  }
  .promo__phone {
    grid-row: 1/-1;
    grid-column: 2/3;
  }
  .promo .button {
    grid-row: 2/-1;
    grid-column: 1/2;
  }
  .collabs .container.wh img {
    grid-column: 2/3;
    grid-row: 1/-1;
  }
  .collabs .container.wh .info {
    grid-column: 1/2;
    grid-row: 1/-1;
    margin: 0 20px 0 0;
  }
  .collabs--days .container.wh {
    padding-bottom: 27px;
    align-items: center;
  }
  .forefront:after {
    width: 774px;
    background-image: url(../img/forefront-bg-desk.png);
  }
}
@media screen and (min-width: 990px) {
  .container {
    width: 955px;
  }
  h1 {
    font-size: 40px;
  }
  h2 {
    font-size: 32px;
  }
  h3 {
    font-size: 20px;
  }
  body {
    font-size: 20px;
  }
  .header .container {
    justify-content: start;
  }
  .header__logo {
    margin-right: 450px;
  }
  .header__logo svg, .header__logo a svg {
    margin-top: 6px;
  }
  .header__nav li a {
    font-size: 16px;
  }
  .header__nav li:first-child {
    margin-right: 43px;
  }
  .container, .container.wh, .container.bl {
    width: 956px;
  }
  .phone {
    margin-top: 0px;
    padding: 30px 26px 0 31px;
    width: 375px;
    border-width: 3px;
    border-radius: 53px 53px 0 0;
  }
  .phone::after {
    width: 297px;
    height: 186px;
    right: -135px;
    top: 113px;
  }
  .phone::before {
    height: 280px;
    border-radius: 49px 49px 0 0;
  }
  .phone__bg {
    padding-bottom: 34px;
  }
  .phone__header {
    padding-bottom: 0px;
  }
  .phone__header figure img {
    width: 35px;
    margin-right: 10px;
  }
  .phone__header figure figcaption {
    font-size: 17px;
  }
  .phone__header figure figcaption:after {
    inline-size: 19px;
    right: -24px;
  }
  .phone__bell {
    inline-size: 27px;
  }
  .phone__bell svg {
    width: 21px;
    height: 21px;
  }
  .phone__title {
    font-size: 14px;
    margin-top: 15px;
  }
  .phone__title:nth-child(3)::after {
    inline-size: 17px;
  }
  .phone__balance {
    font-size: 26px;
  }
  .phone__cards {
    margin: 6px 0 0 0;
  }
  .phone__list {
    margin-top: -10px;
    margin-bottom: 26px;
    border-radius: 13px;
    padding: 15px 38px 15px 15px;
    position: relative;
  }
  .phone__list::after {
    width: 21px;
    height: 21px;
    top: 7px;
    right: 4px;
  }
  .phone__list figure {
    width: 75px;
  }
  .phone__list figure svg {
    max-width: 21px;
    max-height: 21px;
  }
  .phone__list figure figcaption {
    margin-top: 9px;
    font-size: 14px;
  }
  .phone__dia {
    margin-top: 12px;
    border-radius: 13px;
    border: 0.837px solid #E8E8E8;
    grid-template-columns: auto 80px;
    padding: 8px 18px 12px 17px;
    font-size: 13px;
  }
  .phone__dia:last-child {
    height: 58px;
  }
  .phone__dia img {
    width: 104px;
    margin: 18px 0 0 0;
  }
  .phone__dia .balanses {
    font-size: 14px;
  }
  .phone__dia .balanses p:first-child {
    margin-bottom: 5px;
  }
  .forefront .container::before {
    width: 1440px;
    height: 833px;
    background-image: url("data:image/svg+xml,%3Csvg width='1440' height='833' viewBox='0 0 1440 833' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='78.8477' y='60' width='339.291' height='222.532' rx='30' transform='rotate(21.027 78.8477 60)' fill='%238777F1' fill-opacity='0.1'/%3E%3Crect x='79.135' y='60.6461' width='338.291' height='221.532' rx='29.5' transform='rotate(21.027 79.135 60.6461)' stroke='url(%23paint0_linear_4420_303)' stroke-opacity='0.3'/%3E%3Crect x='1049.44' y='587' width='339.291' height='222.532' rx='30' transform='rotate(3.97861 1049.44 587)' fill='%238777F1' fill-opacity='0.1'/%3E%3Crect x='1049.91' y='587.533' width='338.291' height='221.532' rx='29.5' transform='rotate(3.97861 1049.91 587.533)' stroke='url(%23paint1_linear_4420_303)' stroke-opacity='0.3'/%3E%3Crect x='145.5' width='339.291' height='222.532' rx='30' transform='rotate(55.5478 145.5 0)' fill='%238777F1' fill-opacity='0.1'/%3E%3Crect x='145.371' y='0.695158' width='338.291' height='221.532' rx='29.5' transform='rotate(55.5478 145.371 0.695158)' stroke='url(%23paint2_linear_4420_303)' stroke-opacity='0.3'/%3E%3Crect x='1148.52' y='528' width='339.291' height='222.532' rx='30' transform='rotate(13.3862 1148.52 528)' fill='%238777F1' fill-opacity='0.1'/%3E%3Crect x='1148.89' y='528.602' width='338.291' height='221.532' rx='29.5' transform='rotate(13.3862 1148.89 528.602)' stroke='url(%23paint3_linear_4420_303)' stroke-opacity='0.3'/%3E%3Cdefs%3E%3ClinearGradient id='paint0_linear_4420_303' x1='248.493' y1='60' x2='248.493' y2='282.532' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='white'/%3E%3Cstop offset='1' stop-color='white' stop-opacity='0'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint1_linear_4420_303' x1='1219.09' y1='587' x2='1219.09' y2='809.532' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='white'/%3E%3Cstop offset='1' stop-color='white' stop-opacity='0'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint2_linear_4420_303' x1='315.145' y1='0' x2='315.145' y2='222.532' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='white'/%3E%3Cstop offset='1' stop-color='white' stop-opacity='0'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint3_linear_4420_303' x1='1318.16' y1='528' x2='1318.16' y2='750.532' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='white'/%3E%3Cstop offset='1' stop-color='white' stop-opacity='0'/%3E%3C/linearGradient%3E%3C/defs%3E%3C/svg%3E%0A");
  }
  .footer .container {
    display: grid;
    grid-template-columns: 45% 55%;
    grid-template-rows: auto auto;
    gap: 10px;
    align-items: end;
    font-weight: 500;
  }
  .footer__logo {
    grid-row: 1/2;
    grid-column: 1/2;
  }
  .footer__logo svg {
    width: 58px;
    height: 23px;
  }
  .footer__note {
    margin: 0;
    grid-row: 1/2;
    grid-column: 2/3;
  }
  .footer__about {
    margin: 0;
    grid-row: 2/3;
    grid-column: 1/2;
  }
  .footer__contacts {
    margin: 0;
    grid-row: 2/3;
    grid-column: 2/3;
    justify-self: end;
  }
  .footer__contacts a {
    margin-top: 0;
    font-size: 16px;
    font-weight: 500;
  }
  .easy svg {
    width: 334px;
    height: 327px;
  }
  .easy--save svg {
    width: 284px;
  }
  .collabs img {
    width: 356px;
  }
  .collabs--ava img {
    width: 507px;
  }
}
@media screen and (min-width: 1250px) {
  .container {
    width: 1200px;
    padding: 0;
  }
  .container.wh, .container.bl {
    width: 1200px;
  }
  .header .container {
    height: 65px;
  }
  .way {
    margin-top: 147px;
    padding: 0;
    padding-bottom: 247px;
  }
  .way__inner {
    padding-top: 0;
  }
  .way__item {
    justify-content: flex-start;
    width: 278px;
    height: 395px;
  }
  .way__item figcaption {
    text-align: left;
    margin-top: 55px;
  }
  .forefront {
    width: 1200px;
    margin: 121px auto 280px;
    border-radius: 20px;
    padding-bottom: 160px;
    overflow: hidden;
  }
  .forefront:before {
    inline-size: 500px;
  }
  .forefront::after {
    width: 1176px;
    top: -13px;
    left: 47%;
  }
  .forefront h1, .forefront h2 {
    width: 808px;
    margin: 0 auto;
  }
  .forefront h1 {
    margin-top: 80px;
    padding: 0;
  }
  .forefront h2 {
    margin-top: 16px;
  }
  .forefront .nfc::after {
    inline-size: 64px;
  }
  .footer .container {
    grid-template-columns: auto 379px 379px;
    align-items: start;
  }
  .footer__about {
    grid-column: 3/4;
    grid-row: 1/2;
  }
  .footer__contacts {
    margin-top: 108px;
    grid-column: -1/-2;
    grid-row: 2/3;
    margin-left: -45px;
  }
  .empty::first-child {
    color: red;
  }
  .empty::first-child title {
    font-weight: 500;
  }
  .promo {
    padding-top: 130px;
  }
  .promo .container {
    grid-template-rows: 282px auto;
  }
  .promo .container::before {
    inline-size: 161px;
    border-radius: 161px;
    bottom: 95px;
    right: 100px;
  }
  .promo__titles {
    margin-top: 51px;
  }
  .promo h1, .promo h2 {
    margin-top: 8px;
  }
  .promo__imgs .promo__img {
    width: 407px;
    margin-left: 10px;
  }
  .promo .button {
    margin-top: 0;
  }
  .promo .phone {
    justify-self: end;
    margin-right: 100px;
  }
  .icons {
    padding: 46px 0;
  }
  .icons__inner {
    padding: 0 66px;
  }
  .icons__inner figure {
    width: 224px;
  }
  .icons__inner figure figcaption {
    margin-top: 28px;
  }
  .collabs {
    margin-top: 50px;
  }
  .collabs--ava .container.wh {
    padding-bottom: 121px;
    padding-top: 73px;
  }
  .collabs--ava .container.wh .text:last-child {
    margin-right: -100px;
  }
  .collabs--ava .container.wh .info {
    padding-top: 0;
    width: 550px;
  }
  .collabs--ava img {
    position: relative;
  }
  .empty {
    margin-top: 139px;
  }
  .empty .title {
    width: 670px;
    margin: 0 auto;
    font-size: 36px;
    font-weight: 600;
  }
  .easy {
    margin-top: 135px;
  }
  .easy--save svg {
    width: 300px;
    height: 344px;
    padding-bottom: 0;
  }
  .container.wh, .collabs .container.wh {
    padding-left: 56px;
    padding-right: 78px;
  }
  .container.wh, .container.bl {
    padding: 46px 49px 87px 73px;
    align-items: center;
  }
  .container.wh .info, .container.bl .info {
    width: 638px;
  }
  .container.wh .info .text, .container.bl .info .text {
    margin: 0;
    font-size: 24px;
  }
  .container.wh .info .text:last-child, .container.bl .info .text:last-child {
    margin-top: 42px;
  }
  .way {
    margin-top: 70px;
  }
  .works {
    padding: 89px 0 179px;
  }
  .works .title {
    font-weight: 600;
  }
  .works__inner img {
    width: 100px;
  }
  .forefront::after {
    display: none;
  }
  .forefront__bg {
    width: 1200px;
    height: 600px;
    position: absolute;
    border-right: 5px solid #000;
    left: 50%;
    transform: translateX(-50%);
    top: -35px;
    overflow: hidden;
    display: block;
  }
  .forefront__item {
    width: 189px;
    border-radius: 18.403px;
    border: 1px solid #494949;
    opacity: 0.6;
    background: #201F25;
    padding: 12px;
    display: flex;
    align-items: center;
    justify-content: start;
    position: absolute;
  }
  .forefront__item img {
    border-radius: 50%;
    width: 40px;
    margin: 0 16px 0 0;
  }
  .forefront__item h5 {
    font-size: 18px;
    line-height: 1;
    font-weight: 600;
    color: #FFF;
  }
  .forefront__item h6 {
    font-size: 15px;
    font-weight: 400;
    line-height: 1;
    color: #FFF;
  }
  .forefront__item--1 {
    filter: blur(0.460085541px);
    animation-delay: 800ms;
    animation: move-1 5.5s ease-in-out infinite;
  }
  .forefront__item--2 {
    filter: blur(1.3802566528px);
    animation: move-2 5.5s ease-in-out infinite;
  }
  .forefront__item--3 {
    filter: blur(2.7605133057px);
    animation: move-3 5.5s ease-in-out infinite;
  }
  .forefront__item--4 {
    animation: move-4 5.5s ease-in-out infinite;
  }
  .forefront__item--5 {
    filter: blur(1.840342164px);
    animation: move-5 5.5s ease-in-out infinite;
  }
  .forefront__item--6 {
    filter: blur(0.460085541px);
    animation: move-6 5.5s linear infinite;
  }
}
@keyframes move-6 {
  0%, 10%, 100% {
    transform: translateX(1009px) translateY(21px);
  }
  25%, 35% {
    transform: translateX(941px) translateY(-9px);
  }
  50%, 60% {
    transform: translateX(889px) translateY(-22px);
  }
  75%, 85% {
    transform: translateX(941px) translateY(-9px);
  }
}
@keyframes move-5 {
  0%, 10%, 100% {
    transform: translateX(1080px) translateY(341px);
  }
  25%, 35% {
    transform: translateX(1078px) translateY(292px);
  }
  50%, 60% {
    transform: translateX(1078px) translateY(272px);
  }
  75%, 85% {
    transform: translateX(1078px) translateY(292px);
  }
}
@keyframes move-4 {
  0%, 10%, 100% {
    transform: translateX(747px) translateY(495px);
  }
  25%, 35% {
    transform: translateX(802px) translateY(458px);
  }
  50%, 60% {
    transform: translateX(863px) translateY(471px);
  }
  75%, 85% {
    transform: translateX(802px) translateY(458px);
  }
}
@keyframes move-3 {
  0%, 10%, 100% {
    transform: translateX(247px) translateY(487px);
  }
  25%, 35% {
    transform: translateX(331px) translateY(514px);
  }
  50%, 60% {
    transform: translateX(357px) translateY(497px);
  }
  75%, 85% {
    transform: translateX(331px) translateY(514px);
  }
}
@keyframes move-2 {
  0%, 10%, 100% {
    transform: translateX(-25px) translateY(373px);
  }
  25%, 35% {
    transform: translateX(-34px) translateY(353px);
  }
  50%, 60% {
    transform: translateX(7px) translateY(374px);
  }
  75%, 85% {
    transform: translateX(-30px) translateY(353px);
  }
}
@keyframes move-1 {
  0%, 10%, 100% {
    transform: translateX(148px) translateY(0px);
  }
  25%, 35% {
    transform: translateX(68px) translateY(0px);
  }
  50%, 60% {
    transform: translateX(7px) translateY(30px);
  }
  75%, 85% {
    transform: translateX(68px) translateY(0px);
  }
}/*# sourceMappingURL=style.css.map */