/* =========================================================
   MEMBER SIGN-IN LINK — header (Header.ascx, PPPHeader.ascx)
   Loaded globally by Standard.Master and PPP.Master.
   "Member sign-in" (or "My account" when signed in) sits in
   .nav-right on wider screens and inside the hamburger menu
   (.nav-links) at every width.
   ========================================================= */

.nav-member{
  color:#fff;
  font-size:11px;
  letter-spacing:.12em;
  text-transform:uppercase;
  font-weight:500;
  white-space:nowrap;
  padding:6px 0;
  border-bottom:1px solid rgba(255,255,255,.45);
  opacity:.95;
  transition:opacity .2s ease, border-color .2s ease;
}
.nav-member:hover{opacity:.75;border-bottom-color:#fff;}
.nav-member:focus-visible{outline:2px solid #fff;outline-offset:4px;}

/* Laptop widths: the centred links plus the sign-in link and button need a
   little less spacing to stay on one line ("Our Story" was already wrapping
   at these widths before the sign-in link was added). Below 1280px the
   sign-in link moves into the menu only. */
@media (min-width:1101px) and (max-width:1399px){
  .nav .nav-center{gap:22px;}
  .nav .nav-center a{letter-spacing:.08em;white-space:nowrap;}
}
@media (min-width:1101px) and (max-width:1279px){
  .nav-right > .nav-member{display:none;} /* still in the menu */
}

/* Phones: no room beside the logo, button and menu icon; it lives in the menu. */
@media (max-width:760px){
  .nav-right > .nav-member{display:none;}
}
