/* The site header, identical on every page and copied from the home page's (home.css .nav): frosted white bar,
   logo left, links right, coral "Get the app" pill. Sticky at the top. On phones only the logo and the pill show.
   (David, 5 October: "the same everywhere", and no Meet Wink link.) */
.nav { position: sticky; top: 0; z-index: 50; height: 52px; background: rgba(251, 251, 253, .8);
  -webkit-backdrop-filter: saturate(180%) blur(20px); backdrop-filter: saturate(180%) blur(20px); border-bottom: 1px solid rgba(0, 0, 0, .08);
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", Helvetica, Arial, sans-serif; -webkit-font-smoothing: antialiased; }
.nav-in { max-width: 1024px; margin: 0 auto; height: 100%; padding: 0 22px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.nav-logo { display: block; line-height: 0; }
.nav-logo img { height: 22px; width: auto; display: block; }
.nav-links { display: flex; align-items: center; gap: 28px; font-size: 13px; line-height: normal; }
.nav .nav-links a { color: #1D1D1F; text-decoration: none; }
.nav .nav-links a:hover { text-decoration: underline; }
.nav .nav-links a[aria-current="page"] { font-weight: 600; }
.nav .nav-links a.nav-cta { background: #E63557; color: #FFFFFF; padding: 5px 13px; border-radius: 980px; font-size: 12px; font-weight: 500; }
.nav .nav-links a.nav-cta:hover { text-decoration: none; background: #D42A4C; }
@media (max-width: 820px) { .nav .nav-links a:not(.nav-cta) { display: none; } }
/* styles.css still has the old header's bigger .nav-cta (44px tall, 15px); undo it so the pill matches the home page. */
.nav .nav-links a.nav-cta { display: inline; min-height: 0; gap: 0; font-family: inherit; line-height: normal; white-space: nowrap; }