Right-alignment of flex elements

The horizontal alignment of the elements is done by the justify-content property.

.header {
  width: 100%;
  height: 100vh;
  background: url(../img/header-bg.jpg) no-repeat center center / cover;
  position: relative;
  z-index: 1000;
}

.header::before {
  content: "";
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1000;
}

.header__nav {
  display: flex;
}

.header__menu-list {
  border: 1px solid #fff;
  display: flex;
  flex: 1;
  justify-content: flex-end; // Выравнивание по правому краю

}

<header class="header" id="header">
  <div class="container">
    <nav class="header__nav">
      <div class="header__logo logo">
        <a href="#" class="header__logo-link">Landing Page №1</a>
      </div>
      
      <ul class="header__menu-list">
        <li class="header__menu-item">
          <a href="#">Услуги</a>
        </li>
        <li class="header__menu-item">
          <a href="#">Форма</a>
        </li>
        <li class="header__menu-item">
          <a href="#">Подвал</a>
        </li>
      </ul>
    </nav>
  </div>
</header>

You have at least 2 ways: 1) Using the Bootstrap 4 class: "ml-auto" or " d-flex justify-content-end" 2) Using flex: justify-content: flex-end;