/* Ways to pay: the accepted payment methods, shown under pricing and in
   every footer. Each mark sits on its own chip so brand colours stay as
   published on light and dark backgrounds alike. Zelle publishes only a
   white mark, so its chip is Zelle purple. */

.pay-strip {
  margin-top: 34px; padding-top: 28px; text-align: center;
  border-top: 1.5px solid rgba(10,35,66,0.12);
}
.pay-strip .pay-strip-text { margin-left: auto; margin-right: auto; }
.pay-strip .pay-logos { justify-content: center; }
.pay-strip-label {
  font-family: 'JetBrains Mono', monospace; font-size: 0.72rem; font-weight: 700;
  letter-spacing: 0.18em; text-transform: uppercase; color: rgba(10,35,66,0.55);
  display: inline-flex; align-items: center; gap: 10px; margin-bottom: 14px;
}
.pay-strip-label::before { content: ''; width: 26px; height: 2px; background: #1E45FB; }
.pay-strip-text {
  font-size: 0.98rem; line-height: 1.65; color: rgba(10,35,66,0.7); max-width: 60ch; margin: 0 0 18px;
}
.pay-strip-text b { color: #0A2342; font-weight: 600; }

.pay-logos {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
}
.pay-logos li {
  display: flex; align-items: center; justify-content: center;
  height: 40px; padding: 0 14px;
  background: #FFFFFF; border: 1.5px solid rgba(10,35,66,0.12); border-radius: 10px;
}
.pay-logos img { display: block; height: 18px; width: auto; }
.pay-logos .pay-stripe img { height: 24px; }
.pay-logos .pay-paypal img { height: 20px; }
.pay-logos .pay-venmo img { height: 15px; }
.pay-logos .pay-afterpay img { height: 15px; }
.pay-logos .pay-klarna img { height: 16px; }
.pay-logos .pay-zelle { background: #6D1ED4; border-color: #6D1ED4; }
.pay-logos .pay-zelle img { height: 20px; }

/* In a dark footer the chips carry the marks; the label goes light. */
.pay-footer { display: flex; flex-direction: column; gap: 10px; }
.pay-footer .pay-strip-label { color: rgba(255,255,255,0.45); margin-bottom: 0; }
.pay-footer .pay-strip-label::before { background: #CDF22B; }
.pay-footer .pay-logos li { height: 32px; padding: 0 10px; border-color: transparent; }
.pay-footer .pay-logos img { height: 14px; }
.pay-footer .pay-logos .pay-stripe img { height: 19px; }
.pay-footer .pay-logos .pay-paypal img { height: 16px; }
.pay-footer .pay-logos .pay-venmo img { height: 12px; }
.pay-footer .pay-logos .pay-afterpay img { height: 12px; }
.pay-footer .pay-logos .pay-klarna img { height: 13px; }
.pay-footer .pay-logos .pay-zelle img { height: 16px; }

@media (max-width: 560px) {
  .pay-logos { gap: 8px; }
  .pay-logos li { height: 36px; padding: 0 11px; }
}