/* The official shop keeps the existing navigation and footer link styles. */
.shop-promo__card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: clamp(24px, 5vw, 72px);
  padding: clamp(26px, 5vw, 64px);
  border: 1px solid rgba(111, 180, 255, .24);
  border-radius: 28px;
  background: radial-gradient(ellipse at 100% 0%, rgba(37, 111, 202, .26), transparent 65%), linear-gradient(135deg, #091e39, #061326);
  box-shadow: 0 20px 60px rgba(0, 8, 24, .2);
  color: #f1f7ff;
}
.shop-promo__copy { max-width: 650px; min-width: 0; }
.shop-promo .eyebrow { color: #8dc8ff; }
.shop-promo h2 { margin: 0 0 20px; font-size: clamp(1.8rem, 3.5vw, 3.5rem); line-height: 1.12; }
.shop-promo__copy > p:last-child { margin: 0; color: #b9cde4; line-height: 1.8; }
.shop-promo .shop-promo__button {
  flex-shrink: 0;
  max-width: 100%;
  padding: 18px 24px;
  border: 1px solid #76b7ff;
  background: linear-gradient(135deg, #2774c7, #1657a1);
  color: #fff;
  text-align: center;
  white-space: normal;
}
.shop-promo .shop-promo__button:hover { background: linear-gradient(135deg, #3284da, #1d65b4); }
.shop-promo__button:focus-visible, .shop-footer a:focus-visible { outline: 2px solid #a5d5ff; outline-offset: 5px; }
.shop-footer { margin: 0 auto; padding: 24px 16px; text-align: center; font: inherit; font-size: .85rem; }
.shop-footer a { color: #a5d5ff; text-decoration: none; }
.shop-footer a:hover { text-decoration: underline; text-underline-offset: 4px; }
.shop-footer--launch { position: fixed; right: 12px; bottom: 8px; z-index: 100; padding: 10px; }
@media (min-width: 861px) and (max-width: 1200px) {
  .site-header .main-nav { gap: 12px; }
  .site-header .main-nav a { font-size: .7rem; }
}
@media (max-width: 860px) {
  .shop-promo__card { flex-direction: column; align-items: flex-start; }
  .shop-promo__button { align-self: stretch; }
}
