/* Keeps the header CTA legible over both the hero image and the scrolled header. */
.site-header .nav-cta {
  color: var(--navy);
  background: #f1c75b;
  border-color: #d6a72f;
  box-shadow: 0 7px 18px rgba(122, 84, 12, .18);
}

.site-header .nav-cta:hover {
  color: var(--navy);
  background: #f8d979;
  border-color: #c49221;
  box-shadow: 0 10px 24px rgba(122, 84, 12, .24);
  transform: translateY(-1px);
}

.site-header .nav-cta:focus-visible {
  outline: 3px solid rgba(183, 44, 106, .38);
  outline-offset: 4px;
}