.header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 80px;
  border-bottom: 1px solid var(--main-border-color);
  background-color: var(--main-background-color);
  z-index: 2;
}

.header__inner-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 100%;
}

.header__link-logo {
  display: block;
  width: 203px;
  height: 34px;
}

.header__nav-list {
  display: flex;
}

.header__nav-item {
  transition: color .1s linear;
}

.header__nav-item:hover .header__link, .header__link_active {
  color: var(--main-accent-color);
}

.header__nav-item:active .header__link {
  color: var(--active-accent-color);
}

.header__nav-item:not(:last-child) {
  margin-right: 35px;
}

.header__link {
  font-weight: 600;
  user-select: none;
  transition: color .1s linear;
}

.header__download-button {
  opacity: 0;
  padding: 12px 18px;
  transition: opacity .2s ease;
}

.header__download-button-text {
  background-position: 0 center;
  padding-left: 32px;
  background-size: 24px;
  display: block;
}

.header__menu-button {
  background-image: url("/images/icons/menu.svg");
  width: 40px;
  height: 40px;
  padding: 0;
  background-position: center;
  background-color: var(--main-background-color);
  border: none;
  display: none;
  transition: background-image .1s linear;
}

.header__button-container {
  display: flex;
  align-items: center;
}

a.header__download-button_show {
  opacity: 1;
  pointer-events: initial;
}

@media screen and (max-width: 1280px) and (min-width: 426px) {
  .header__link-logo {
    width: 176px;
  }

  .download-button_short .header__download-button-text span {
    display: none;
  }
}

@media screen and (max-width: 1024px) {
  .header__nav-container {
    position: absolute;
    top: calc(100% + 1px);
    left: 0;
    right: 0;
    background-color: var(--main-background-color);
    transition-property: transform, opacity;
    transition-timing-function: ease;
    transition-duration: .3s;
    transform: scaleY(.3);
    transform-origin: top;
    pointer-events: none;
    z-index: 1;
    opacity: 0;
  }

  .header_show-menu .header__nav-container {
    transform: scaleY(1);
    pointer-events: unset;
    opacity: 1;
  }

  .header_show-menu .header__menu-button {
    background-image: url("/images/icons/close.svg");
  }

  .header__nav-list {
    flex-flow: column;
    padding: 4px 16px 1px;
    box-shadow: 0 16px 36px #5a656c3d;
  }

  .header__menu-button {
    display: block;
  }

  .header__link {
    display: block;
    padding: 17px 0;
  }

  .header__nav-item:not(:last-child) {
    margin: 0;
    border-bottom: 1px solid var(--main-border-color);
  }

  .header__download-button {
    margin-right: 12px;
    opacity: 0;
    pointer-events: none;
  }
}

@media screen and (max-width: 680px) {
  .header {
    height: 62px;
  }

  .header__link-logo {
    width: 135px;
    height: 23px;
  }

  .header__inner-container {
    padding: 0 16px;
  }

  .header__nav-item:hover {
    color: var(--main-text-color);
  }

  .header__download-button {
    padding: 8px 24px;
  }

  .header__download-button .header__download-button-text span {
    display: none;
  }
}