/* Menu fixes.
   1) Desktop Chrome: the menu links faded to clear when the page was at the very top. Give the bar a soft dark
      fade behind it and keep the links solid white so they can always be read.
   2) iPhone / Safari: the three-line menu icon (hamburger) drew unclearly. It is now built from three
      absolutely positioned bars, which Safari draws reliably, with a clear tap area. */
@media (min-width: 1025px) {
  .site-header:not(.scrolled):not(.is-scrolled) { background-image: linear-gradient(to bottom, rgba(0,0,0,.55), rgba(0,0,0,0)); }
  .site-header:not(.scrolled):not(.is-scrolled) .nav__links > li > .nav__link:not(.nav__cta),
  .site-header:not(.scrolled):not(.is-scrolled) .nav__logo-text {
    color: #fff; opacity: 1; visibility: visible; text-shadow: 0 1px 8px rgba(0,0,0,.65);
  }
}

.nav__burger {
  -webkit-appearance: none; appearance: none;
  position: relative; width: 44px; height: 44px; min-width: 44px; padding: 0; margin: 0;
  border: 0; border-radius: 8px; background: transparent; cursor: pointer; overflow: visible;
  -webkit-tap-highlight-color: transparent; touch-action: manipulation; z-index: 1101; color: #fff;
}
.nav__burger span {
  display: block; position: absolute; left: 10px; width: 24px; height: 3px; margin: 0; padding: 0;
  border-radius: 3px; background-color: #fff; opacity: 1; box-shadow: 0 0 3px rgba(0,0,0,.55);
  -webkit-transform-origin: center; transform-origin: center;
}
.nav__burger span:nth-child(1) { top: 12px; }
.nav__burger span:nth-child(2) { top: 20px; }
.nav__burger span:nth-child(3) { top: 28px; }
.site-header.scrolled .nav__burger span, .site-header.is-scrolled .nav__burger span { background-color: #2a2238; box-shadow: none; }