/* Header Donate button (every page). Gold pill so it reads as the primary action. */
.nav-donate {
  display: inline-flex;
  align-items: center;
  margin-left: 18px;
  padding: 12px 26px;
  border: 1px solid #e2d8a7;
  border-radius: 50px;
  background-color: #e2d8a7;
  color: #000;
  font-family: Aboreto, sans-serif;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .08em;
  line-height: 1;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
  transition: background-color .3s ease, color .3s ease, box-shadow .3s ease;
}
.nav-donate:hover {
  background-color: transparent;
  color: #e2d8a7;
  box-shadow: 0 0 0 3px rgba(226, 216, 167, .18);
}
.nav-donate:focus-visible {
  outline: 2px solid #e2d8a7;
  outline-offset: 3px;
}

/* Slide-out menu: Donate above Contact Us */
.nav-donate-menu {
  margin-bottom: 12px;
  background-color: #e2d8a7;
  border-color: #e2d8a7;
  color: #000;
  font-weight: 700;
}
.nav-donate-menu:hover {
  background-color: transparent;
  color: #e2d8a7;
}

@media screen and (max-width: 991px) {
  .nav-donate { margin-left: auto; margin-right: 16px; padding: 10px 20px; font-size: 13px; }
}
@media screen and (max-width: 479px) {
  .nav-donate { margin-right: 10px; padding: 9px 16px; font-size: 12px; }
}

/* Desktop button sits inside the right-hand menu; the mobile one sits next to
   the hamburger. Show exactly one of them. */
.nav-donate-mobile { display: none; }
@media screen and (max-width: 991px) {
  .nav-donate-desktop { display: none; }
  .nav-donate-mobile { display: inline-flex; }
}
@media screen and (min-width: 992px) and (max-width: 1279px) {
  .nav-donate-desktop { margin-left: 8px; padding: 10px 16px; font-size: 13px; }
}
@media screen and (min-width: 1280px) {
  /* Five right-hand items no longer fit a fixed 1fr column; size columns to content. */
  .nav-menu-wrapper { grid-column-gap: 24px; grid-template-columns: auto auto auto; justify-content: space-between; }
  .cart-nav-wrapper { min-width: 0; }
}