.header {
   display: flex;
   align-items: center;
   width: 100%;
   height: 120px;
   background: rgba(255, 255, 255, 0.2);
   box-shadow: inset 0px 4px 18px rgba(159, 102, 255, 0.1), inset 0px 1px 40px rgba(100, 92, 224, 0.2);
   backdrop-filter: blur(50px);
   z-index: 100;
   position: relative;
}

.header_fixed {
   position: fixed;
   left: 0;
   top: 0;
}

.header__navigation {
   display: flex;
   align-items: center;
   justify-content: space-between;
}

.navigation__logo {
   width: 81px;
   height: 60px;
}

.navigation__row {
   display: flex;
   align-items: center;
   justify-content: center;
}

.navigation__link {
   margin-right: 40px;
   font-style: normal;
   font-weight: 500;
   font-size: 18px;
   line-height: 22px;
   color: #2A2D33;
   cursor: pointer;
   user-select: none;
   transition: 0.2s color;
}

.navigation__link--active,
.navigation__link:hover {
   font-weight: 800;
   color: #212353;
}

.navigation__link:last-child {
   margin-right: 0;
}

.navigation_icons {
   display: flex;
   justify-content: space-between;
   cursor: pointer;
   user-select: none;
   max-width: calc((40px * 2) + (30px * 3));
   min-width: calc(40px *4);
   width: 100%;
}

.wrapper {
   width: 40px;
   height: 40px;
   display: flex;
   align-items: center;
   justify-content: center;
   background: #163760;
   border-radius: 50px;
}

.wrapper:last-child {
   margin-right: 0;
}

.icon {
   width: 24px;
   height: 24px;
}

.icon_whatsApp {
   width: 40px;
   height: 40px;
}

.icon_telegram {
   width: 40px;
   height: 40px;
}

.hamburger-menu {
   display: none;
}

@media(max-width: 1024px) {

   .header {
      width: 100%;
      height: 90px;
      background: rgba(255, 255, 255, 0.2);
      box-shadow: inset 0px 4px 18px rgba(159, 102, 255, 0.1), inset 0px 1px 40px rgba(100, 92, 224, 0.2);
      backdrop-filter: blur(50px);
   }

   .header__navigation {
      display: none;
   }

   .hamburger-menu {
      display: block;
   }

   #menu__toggle {
      opacity: 0;
   }

   .menu__btn {
      display: flex;
      align-items: center;
      position: fixed;
      top: 30px;
      left: calc(100% - 60px);
      width: 26px;
      height: 26px;
      cursor: pointer;
      z-index: 1;
   }

   .menu__btn>span,
   .menu__btn>span::before,
   .menu__btn>span::after {
      display: block;
      position: absolute;
      width: 100%;
      height: 2px;
      background-color: #645CE0;
   }

   .menu__btn>span::before {
      content: '';
      top: -8px;
   }

   .menu__btn>span::after {
      content: '';
      top: 8px;
   }

   #menu__toggle:checked~.menu__btn>span {
      transform: rotate(45deg);
   }

   #menu__toggle:checked~.menu__btn>span::before {
      top: 0;
      transform: rotate(0);
   }

   #menu__toggle:checked~.menu__btn>span::after {
      top: 0;
      transform: rotate(90deg);
   }

   #menu__toggle:checked~.menu__box {
      visibility: visible;
      opacity: 100%;
   }


   .menu__btn>span,
   .menu__btn>span::before,
   .menu__btn>span::after {
      transition-duration: .25s;
   }

   .menu__box {
      transition-duration: .25s;
   }

   .menu__item {
      transition-duration: .25s;
   }

   .menu__box {
      display: block;
      position: fixed;
      visibility: hidden;
      top: 0;
      left: 0;
      opacity: 0;
      width: 100%;
      height: 534px;
      background: rgba(255, 255, 255);
      box-shadow: inset 0px 4px 18px rgba(159, 102, 255, 0.1), inset 0px 1px 40px rgba(100, 92, 224, 0.2);
      backdrop-filter: blur(50px);
      margin: 0;
      padding-top: 90px;
      list-style: none;
      text-align: center;
   }

   .item__image {
      width: 82px;
      height: 60px;
      margin-bottom: 30px;
   }

   .menu__item {
      display: block;
      padding-bottom: 20px;
      font-style: normal;
      font-weight: 500;
      font-size: 18px;
      line-height: 22px;
      color: #2A2D33;
   }

   .menu__item:last-child {
      padding-bottom: 0;
   }

   .menu__item:nth-child(1) {
      padding-bottom: 0;
   }

   .menu__item:nth-child(5) {
      padding-bottom: 0;
   }

   .item__social {
      margin-top: 60px;
      display: flex;
      align-items: center;
      justify-content: center;
   }

   .social__wrapper {
      margin-right: 30px;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 38px;
      height: 38px;
      background: #163760;
      border-radius: 50px;
   }

   .wrapper__icon {
      width: 24px;
      height: 24px;
   }

   .wrapper__icon_whatsApp {
      margin-right: 30px;
      width: 40px;
      height: 40px;
   }

   .wrapper__icon_telegram {
      width: 40px;
      height: 40px;
   }

   .item__wrapper {
      width: 38px;
      height: 38px;
      background: #163760;
      border-radius: 50px
   }

   .wrapper__image {
      width: 24px;
      height: 24px;
   }

}

@media (max-width: 320px) {
   .header {
      height: 70px;
   }

   .menu__btn {
      top: 20px;
      left: calc(100% - 50px);
   }
}