Как сделать border-bottom?
Уберите header из контейнера, а в контейнер поместите содержимое header'а<header class="header-menu">
      <div class="container">
        <div class="header-menu__logo"><img src="img/logo.png" alt="Логотип"></div>
        <div class="header-menu__nav-bar">
          <nav class="header-menu__nav">
            <a class="header-menu__links" href="#">ABOUT</a>
            <a class="header-menu__links" href="#">CONTACT</a>
            <a class="header-menu__links" href="#">CATALOG</a>
            <a class="header-menu__links" href="#">BLOG</a>
            <button type="button" class="header-menu__btn" name="button">Sign in</button>
          </nav>
        </header>
     </div>
теперь у вас header на всю ширину, можете задавать ему border
Владимир Проскурин уже ответил вам, как следует адекватно сделать, но если Вы захотите немного псевдоэлементов и оставить структуру кода html, как есть, то переходите по ссылке)
https://codepen.io/anon/pen/dBKeaz