Right align a button in site nav

As the button is in the header-nav-list, next to the other links, then it will be restricted to that container.

One way, is to position it absolutely, which takes it out of the document flow, and can be positioned anywhere. 

The code would do it, seems ok when resizing too (which can cause issues for absolutely positioned items) as the mobile menu kicks in quite quickly before it starts blocking things.

.header-nav-item.header-nav-item--external {
    position: absolute;
    right: 50px;
}

In order to get the nav links to centre vertically in the nav, then you could add align-items: center to the header-nav-list class.

.header-nav-list {
    align-items: center;
}

Absolutely positioned elements can mess up quite easily so if you can move the book now button out to the header-actions section, where the instagram button is (not sure how the page is setup, so not sure if you can) but then that would make it a bit easier to position.

Hope this helps!

Perfect, thank you so much!