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

* {
  margin: 0;
  padding: 0;
  border: 0 solid transparent;
}

*:focus {
  outline: none;
}

a {
  color: inherit;
  text-decoration: inherit;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

ul,
ol {
  list-style: none;
}

input,
textarea,
select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: 100%;
  font-family: "Exo", sans-serif;
}

[type='checkbox'],
[type='radio'] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

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

html,
body {
  min-height: 100%;
}

button {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  font-weight: inherit;
  color: inherit;
  background: transparent;
  border: none;
  padding: 0;
  margin: 0;
  cursor: pointer;
}

::-webkit-scrollbar {
  width: 4px;
}

@font-face {
  font-family: 'Avenir';
  src: url('../f/AvenirLTStd-Heavy.woff2') format('woff2'),
    url('../f/AvenirLTStd-Heavy.woff') format('woff');
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Futura';
  src: url('../f/FuturaLT-Book.woff2') format('woff2'),
    url('../f/FuturaLT-Book.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Futura';
  src: url('../f/FuturaLT-Light.woff2') format('woff2'),
    url('../f/FuturaLT-Light.woff') format('woff');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

:root {
  --color-text: #252e39;
  --color-text-invert: #ffffff;
  --color-accent: #008afc;
  --color-success: #008000;
  --color-error: #ff0000;
  --font-size: 18px;
  --font-size-small: 14px;
  --font-size-btn: 13px;
  --font-size-title: 60px;
  --font-size-title-2: 35px;
  --indent: 100px;
  --anchor-scroll-offset: 100px;
}

html {
  scroll-padding-top: var(--anchor-scroll-offset);
}

@media (prefers-reduced-motion: no-preference) {
  html {
    scroll-behavior: smooth;
  }
}

body {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  min-height: 100dvh;
  background: #FFFFFF;
  position: relative;
  color: var(--color-text);
  font-family: 'Futura', sans-serif;
  font-weight: 300;
  font-style: normal;
  line-height: 1.5;
  font-size: var(--font-size);
  overflow-x: hidden;
}

.btn {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;
  height: 60px;
  width: 100%;
  padding: 10px 20px;
  background: transparent;
  border: 2px solid var(--color-accent);
  color: var(--color-accent);
  border-radius: 20px;
  font-family: 'Avenir', sans-serif;
  font-size: var(--font-size-btn);
  font-weight: bold;
  font-style: normal;
  cursor: pointer;
  transition: all 0.3s ease;
}

.btn:hover {
  background: var(--color-accent);
  color: var(--color-text-invert);
}

.center {
  width: calc(100vw - 40px);
  max-width: 1020px;
  margin: 0 auto;
  padding: 0 20px;
}

main {
  -ms-flex: 1;
  flex: 1;
}

.header {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 40;
}

.header__inner {
  padding: 25px 0;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: justify;
  justify-content: space-between;
  gap: 25px;
}

.header__logo {
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
}

.header__logo img {
  height: 48px;
  display: block;
}

.menu-toggle {
  width: 40px;
  height: 40px;
  display: none;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;
  cursor: pointer;
  position: relative;
}

.menu-toggle::before,
.menu-toggle::after {
  content: "";
  position: absolute;
  height: 2px;
  border-radius: 999px;
  background: var(--color-text-invert);
  transition: top 0.28s ease, -webkit-transform 0.28s ease;
  transition: transform 0.28s ease, top 0.28s ease;
  transition: transform 0.28s ease, top 0.28s ease, -webkit-transform 0.28s ease;
}

.menu-toggle::before {
  top: 13px;
  width: 21px;
  box-shadow: 0 13px 0 var(--color-text-invert);
}

.menu-toggle::after {
  top: 19px;
  width: 21px;
}

.menu-toggle[data-state="is-active"]::before,
.menu-toggle[data-state="is-active"]::after {
  top: 18px;
  box-shadow: none;
}

.menu-toggle[data-state="is-active"]::before {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.menu-toggle[data-state="is-active"]::after {
  width: 21px;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.menu-toggle:hover {
  opacity: 0.7;
}

.header__menu,
.header__menu-items {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  gap: 25px;
}

.header__link {
  color: var(--color-text-invert);
  font-weight: normal;
  line-height: 2;
  transition: all 0.2s ease;
}

.header__link[aria-current="page"],
.header__link:hover {
  color: var(--color-text);
}

.header__link[aria-current="page"] {
  pointer-events: none;
}

.has-sub-menu {
  position: relative;
}

.header__sub-menu {
  position: absolute;
  top: 100%;
  right: 0;
  width: 100%;
  min-width: -webkit-max-content;
  min-width: max-content;
  padding: 10px 0;
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s ease;
  pointer-events: none;
  z-index: -1;
}

.header__menu-item.has-sub-menu:hover .header__sub-menu {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  z-index: 1000;
}

.header__sub-menu .header__menu-item {
  text-align: right;
}

.header__sub-menu .header__link {
  padding: 5px 0;
}

.dropdown {
  position: relative;
}

.dropdown_button {
  cursor: pointer;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: justify;
  justify-content: space-between;
  transition: all 0.3s ease;
  outline: none;
  width: auto;
  min-width: 72px;
  padding: 10px;
}

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

.flag-icon {
  display: block;
  width: 24px;
  height: 24px;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  -o-object-fit: contain;
  object-fit: contain;
}

.dropdown_button .flag-icon {
  margin-right: auto;
}

.dropdown_button svg {
  width: 14px;
  height: 7px;
  fill: #ffffff;
}

.dropdown_button[aria-expanded="true"] svg {
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}

.dropdown_menu {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  z-index: 1000;
  overflow: hidden;
  opacity: 0;
  transition: opacity 0.3s ease;
}

.dropdown_menu[data-state="show"] {
  display: block;
  visibility: visible;
  opacity: 1;
}

.dropdown_menu-item {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  text-decoration: none;
  transition: all 0.3s ease;
  padding: 10px;
}

.dropdown_menu-item img {
  transition: all 0.3s ease;
}

.dropdown_menu-item:hover img {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

.dropdown_menu-item.is-active {
  display: none;
}

.main {
  background: url('../i/bg2.jpg') no-repeat center center;
  background-size: cover;
}

.main--home {
  background-image: url('../i/bg.jpg');
}

.main--who-we-are,
.main--b2c-platform,
.main--social-network,
.main--legal {
  position: relative;
  overflow: hidden;
  background: none;
}

.main--who-we-are__inner,
.main--b2c-platform__inner,
.main--social-network__inner,
.main--legal__inner {
  position: relative;
  z-index: 2;
}

.main__inner {
  padding: var(--indent) 0;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;
  min-height: 500px;
}

.main--home .main__inner {
  min-height: 890px;
}

.main__title {
  max-width: 600px;
  font-size: var(--font-size-title);
  font-weight: 700;
  line-height: 1.1;
  text-align: center;
  color: var(--color-text-invert);
}

.main--home .main__title {
  margin-bottom: 150px;
}

.section {
  padding: calc(var(--indent) / 2) 0;
}

.section--1 {
  margin-top: -300px;
}

.section--1-inner {
  margin-top: -150px;
  position: relative;
  z-index: 2;
}

.section--3,
.section--5,
.social-network .section--1-inner,
.b2c-platform .section--1-inner,
.legal .section--1-inner {
  margin-bottom: var(--indent);
}

.section__title {
  font-size: var(--font-size-title);
  font-weight: 700;
  line-height: 1.1;
  text-align: center;
  margin-bottom: var(--indent);
}

.section__text {
  padding: 0 calc(var(--indent) / 2);
  margin-bottom: calc(var(--indent) / 2);
}

.block {
  border-radius: 30px;
  padding: var(--indent) calc(var(--indent) / 2);
  width: 100%;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: start;
  justify-content: flex-start;
  box-shadow: 0px 3px 20px 5px rgba(0, 0, 0, 0.06);
  background-color: #ffffff;
  background-position: bottom right -55px;
  background-repeat: no-repeat;
  background-size: 55%;
}

.block__1 {
  background-image: url('../i/block-1.svg');
}

.block__2 {
  -ms-flex-pack: end;
  justify-content: flex-end;
  background-image: url('../i/block-2.svg');
  background-position: bottom left -65px;
  margin-bottom: var(--indent);
}

.block__3 {
  background-image: url('../i/block-3.svg');
}

.block__4 {
  background: #ffffff;
}

.block__5,
.block__6,
.block__7,
.block__8,
.block__legal {
  background: #ffffff;
  padding: calc(var(--indent) / 2);
}

.block__wrap {
  width: 50%;
  max-width: 360px;
}

.block__5 .block__wrap,
.block__7 .block__wrap,
.block__8 .block__wrap {
  max-width: initial;
  width: 100%;
}

.block__title {
  font-size: var(--font-size-title-2);
  font-weight: 700;
  line-height: 1.1;
  margin-bottom: 25px;
}

.block__text {
  margin-bottom: var(--indent);
}

.block__5 .block__text,
.block__7 .block__text,
.block__8 .block__text {
  margin-bottom: calc(var(--indent) / 2);
}

.block__5 .block__text:last-child,
.block__7 .block__text:last-child,
.block__8 .block__text:last-child {
  margin-bottom: 0;
}

.block__7 .block__text:last-child {
  margin-top: calc(var(--indent) / 2);
}

.block__items {
  width: 100%;
  max-width: initial;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 30px
}

.block__6 .block__items {
  row-gap: var(--indent);
}

.block__item {
  width: calc((100% - 60px) / 3);
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: start;
  justify-content: flex-start;
  gap: 40px;
}

.block__6 .block__item {
  width: calc((100% - 60px) / 2);
}

.block__item-icon {
  width: 50px;
  height: 50px;
}

.block__item-icon svg {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
  object-fit: contain;
}

.block__item-title {
  width: 100%;
  font-weight: normal;
}

.section--contact-us {
  position: relative;
  overflow: hidden;
  padding: var(--indent) 0;
  background-color: #008afc;
}

.section--contact-us__parallax,
.main--who-we-are__parallax,
.main--b2c-platform__parallax,
.main--social-network__parallax,
.main--legal__parallax {
  position: absolute;
  left: 50%;
  top: -20%;
  z-index: 0;
  width: 100%;
  max-width: none;
  height: 140%;
  margin-left: -50%;
  background-image: url('../i/bg2.jpg');
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  will-change: transform;
  pointer-events: none;
}

.main--who-we-are__parallax,
.main--b2c-platform__parallax,
.main--social-network__parallax,
.main--legal__parallax {
  top: -50%;
  height: 240%;
}

.section--contact-us__overlay,
.main--who-we-are__overlay,
.main--b2c-platform__overlay,
.main--social-network__overlay,
.main--legal__overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(180deg,
    rgba(0, 138, 252, 0.5) 0%,
    rgba(0, 138, 252, 0.78) 100%);
}

.section--contact-us__inner {
  position: relative;
  z-index: 2;
}

@media (prefers-reduced-motion: reduce) {

  .section--contact-us__parallax,
  .main--who-we-are__parallax,
  .main--b2c-platform__parallax,
  .main--social-network__parallax,
  .main--legal__parallax {
    top: 0;
    height: 100%;
    will-change: auto;
  }
}

.contact-us__title {
  font-size: var(--font-size-title);
  font-weight: 700;
  line-height: 1.1;
  text-align: center;
  margin-bottom: calc(var(--indent) / 2);
  color: var(--color-text-invert);
}

.contact-us__text {
  padding: 0 calc(var(--indent) / 2);
  margin-bottom: calc(var(--indent) / 2);
  color: var(--color-text-invert);
}

.contact-us_form {
  border-radius: 30px;
  padding: calc(var(--indent) / 2);
  width: 100%;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;
  box-shadow: 0px 3px 20px 5px rgba(0, 0, 0, 0.06);
  background-color: #ffffff;
  position: relative;
  z-index: 0;
}

.contact-us_form ::-webkit-input-placeholder {
  color: var(--color-text);
}

.contact-us_form :-ms-input-placeholder {
  color: var(--color-text);
}

.contact-us_form ::-ms-input-placeholder {
  color: var(--color-text);
}

.contact-us_form ::placeholder {
  color: var(--color-text);
}

.contact-us_content,
.contact-us_fields {
  width: 100%;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
}

.contact-us_content {
  gap: calc(var(--indent) / 2);
}

.contact-us_fields {
  gap: 20px;
}

.contact-us_field {
  width: 100%;
}

.field_input,
.field_textarea {
  font-family: 'Futura', sans-serif;
  font-weight: 300;
  font-style: normal;
  font-size: var(--font-size-small);
  background: #FFFFFF;
  border-radius: 10px;
  border: 1px solid #000000;
  padding: 10px 20px;
  color: var(--color-text);
}

.field_textarea {
  min-height: 150px;
  resize: vertical;
}

.field_error:not(:empty) {
  padding-top: 4px;
  font-size: var(--font-size-small);
  color: #ff0000;
}

.contact-us_success {
  position: relative;
  z-index: 1;
  display: none;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  min-height: 200px;
  font-size: var(--font-size-title-2);
  font-weight: 700;
  text-align: center;
  color: var(--color-success);
}

.contact-us_form[data-state="is-success"] .contact-us_success {
  display: -ms-flexbox;
  display: flex;
}

.contact-us_form[data-state="is-success"] .contact-us_content {
  display: none;
}

.footer {
  background-color: #252e39;
  color: var(--color-text-invert);
  padding: 20px 0;
}

.footer__inner {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: justify;
  justify-content: space-between;
  gap: 20px;
}

.footer__links {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  gap: 30px;
}

.footer__links a[aria-current="page"] {
  pointer-events: none;
}

.legal__content {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 20px;
}

.legal__content h4 {
  font-size: var(--font-size);
  font-weight: 300;
  color: var(--color-accent);
}

.legal__content a {
  text-decoration: underline;
}

.legal__content ul {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 10px;
  list-style: disc;
  list-style-position: inside;
}

@media (max-width: 1023px) {
  body[data-state~="nav-open"] {
    overflow: hidden;
    -ms-scroll-chaining: none;
    overscroll-behavior: none;
  }

  .header[data-state="is-open"] {
    position: fixed;
    width: 100vw;
    left: 0;
    top: 0;
  }

  .menu-toggle {
    display: -ms-flexbox;
    display: flex;
    position: relative;
    z-index: 100;
  }

  .header__menu {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-pack: start;
    justify-content: flex-start;
    gap: 20px;
    border-top: none;
    overflow-y: auto;
    z-index: 60;
    display: none;
    padding: 100px 20px 20px;
    background: var(--color-accent);
  }

  #js-header-menu[data-state="is-visible"] {
    display: -ms-flexbox;
    display: flex;
  }

  .header__menu-items {
    width: 100%;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 0;
  }

  .header__menu-item {
    padding: 10px 20px;
    width: auto;
    min-width: 200px;
    text-align: center;
  }

  .has-sub-menu>.header__link {
    padding: 10px 20px;
    display: block;
  }

  .has-sub-menu {
    padding: 0;
  }

  .header__sub-menu {
    position: relative;
    top: 0;
    padding: 0;
    min-width: initial;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    z-index: 1000;
  }

  .header__sub-menu .header__menu-item {
    text-align: center;
  }
}

@media (max-width: 767px) {
  :root {
    --font-size: 14px;
    --font-size-small: 12px;
    --font-size-btn: 12px;
    --font-size-title: 36px;
    --font-size-title-2: 24px;
    --indent: 60px;
    --anchor-scroll-offset: 60px;
  }

  .main--home .main__inner {
    height: 100vh;
    min-height: 600px;
  }

  .center {
    width: 100%;
    padding: 0 20px;
  }

  .header__menu-item {
    width: 100%;
  }

  .block__1,
  .block__2,
  .block__3 {
    background-size: 75%;
    padding-bottom: 200px;
  }

  .block__1 .block__wrap,
  .block__2 .block__wrap,
  .block__3 .block__wrap {
    width: 100%;
    max-width: initial;
  }

  .btn {
    background: var(--color-accent);
    color: var(--color-text-invert);
  }

  .block .block__item {
    width: 100%;
    gap: 20px;
  }

  .block__item-icon {
    width: 40px;
    height: 40px;
  }

  .footer__inner {
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 20px;
  }
}