/* Inline donation banner cards for index-alt.html (interleaved with the ranking cards
   by js/alt-banners.js). Loaded after style.css; affects only the alt page.
   Colorful, based on the header's accent palette and the site font. */

.give-banner{display:flex;align-items:center;justify-content:space-between;gap:16px;
  border-radius:var(--radius);padding:16px 20px;margin:0 0 12px;
  text-decoration:none;color:#fff;box-shadow:var(--shadow)}
.give-banner:hover{text-decoration:none;color:#fff;filter:brightness(1.05)}
.give-gd{background:linear-gradient(135deg,#574fe6 0%,#8b5cf6 100%)}
.give-amf{background:linear-gradient(135deg,#0f766e 0%,#14b8a6 100%)}
.give-gwwc{background:linear-gradient(135deg,#8e2f54 0%,#bb4773 100%)}

.gb-main{min-width:0}
.gb-eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:.1em;font-weight:600;opacity:.85;margin:0 0 3px}
.gb-title{font-size:18px;font-weight:700;line-height:1.2;margin:0 0 4px}
.gb-sub{font-size:13.5px;line-height:1.45;opacity:.92;margin:0;max-width:62ch}
.gb-cta{flex:none;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.55);
  color:#fff;font-weight:600;font-size:13.5px;padding:9px 16px;border-radius:var(--radius-sm);white-space:nowrap}
.give-banner:hover .gb-cta{background:rgba(255,255,255,.30)}

@media (max-width:620px){
  .give-banner{flex-direction:column;align-items:flex-start;gap:12px;padding:16px}
  .gb-cta{align-self:stretch;text-align:center}
}