@media (max-width: 760px) {
  header {
    height: 118px;
    padding: 14px 20px 0;
    align-items: flex-start;
    flex-wrap: wrap;
  }

  header .brand { padding-top: 4px; }

  header .nav-cta { margin-left: auto; }

  header nav {
    display: flex;
    order: 3;
    width: calc(100% + 40px);
    margin: 13px -20px 0;
    padding: 0 20px 14px;
    gap: 20px;
    overflow-x: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
  }

  header nav a { flex: 0 0 auto; }

  .hero { min-height: calc(100svh - 118px); }
}