.donations { padding-top: 0; }
.donate {
  position: relative; border-radius: 28px; overflow: hidden; background: var(--navy); color: #fff; isolation: isolate;
  display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); box-shadow: var(--shadow-lg);
}
.donate .bg { position: absolute; inset: 0 0 0 38%; z-index: -2; }
.donate .bg img { width: 100%; height: 100%; object-fit: cover; }
.donate::before {
  content: ''; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(90deg, var(--navy) 0%, var(--navy) 38%, rgba(32, 33, 88, 0.86) 55%, rgba(32, 33, 88, 0.55) 100%);
}
.donate .copy { padding: clamp(2.2rem, 4vw, 3.6rem); }
.donate .eyebrow.chip { background: transparent; border-color: rgba(255, 152, 0, 0.6); color: var(--orange); }
.donate h2 { color: #fff; font-size: clamp(2rem, 3.3vw, 3rem); font-weight: 700; margin-top: 1.2rem; }
.donate .copy > p { margin-top: 1.1rem; color: #cfd0e6; font-size: 1.12rem; max-width: 34rem; }
.donate .btns { display: flex; flex-wrap: wrap; gap: 0.9rem; margin-top: 2rem; }

.don-list { align-self: center; display: grid; gap: 0.6rem; padding: clamp(1.6rem, 3.5vw, 3rem) clamp(1.6rem, 3.5vw, 3rem) clamp(1.6rem, 3.5vw, 3rem) 0; }
.don-list li {
  display: flex; gap: 0.85rem; align-items: center; padding: 0.75rem 1rem; border-radius: 14px;
  background: rgba(255, 255, 255, 0.1); border: 1px solid rgba(255, 255, 255, 0.16);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
}
.don-list .di { width: 42px; height: 42px; flex: none; border-radius: 12px; display: flex; align-items: center; justify-content: center; background: var(--orange); color: #fff; }
.don-list .di .i { width: 1.2rem; height: 1.2rem; }
.don-list b { display: block; font-family: var(--f-head); font-weight: 600; font-size: 1.08rem; color: #fff; }
.don-list span { display: block; font-size: 0.95rem; color: #cfd0e6; line-height: 1.5; margin-top: 0.15rem; }

@media (max-width: 1100px) {
  .donate { grid-template-columns: 1fr; }
  .donate .bg { inset: 0; }
  .donate::before { background: linear-gradient(180deg, rgba(32, 33, 88, 0.94) 0%, rgba(32, 33, 88, 0.9) 55%, rgba(32, 33, 88, 0.84) 100%); }
  .don-list { padding: 0 clamp(1.6rem, 5vw, 4.5rem) clamp(2rem, 5vw, 4.5rem); }
}

/* ---------- Motion ---------- */
.donate .bg img { transition: transform 1.2s cubic-bezier(0.2, 0.7, 0.2, 1); }
.donate:hover .bg img { transform: scale(1.04); }
.don-list li { transition: background 0.3s ease, border-color 0.3s ease, translate 0.35s cubic-bezier(0.2, 0.7, 0.2, 1); }
.don-list li:hover { background: rgba(255, 255, 255, 0.16); border-color: rgba(255, 152, 0, 0.55); translate: -6px 0; }
.don-list .di { transition: transform 0.5s cubic-bezier(0.3, 1.6, 0.4, 1); }
.don-list li:hover .di { transform: rotate(-10deg) scale(1.1); }

@media (prefers-reduced-motion: no-preference) {
  .donate.rv .don-list li { opacity: 0; }
  .donate.rv.in .don-list li { animation: don-in 0.7s cubic-bezier(0.2, 0.8, 0.2, 1) both; }
  .donate.rv.in .don-list li:nth-child(1) { animation-delay: 0.3s; }
  .donate.rv.in .don-list li:nth-child(2) { animation-delay: 0.42s; }
  .donate.rv.in .don-list li:nth-child(3) { animation-delay: 0.54s; }
  .donate.rv.in .don-list li:nth-child(4) { animation-delay: 0.66s; }
  .donate.rv.in .don-list li:nth-child(n + 5) { animation-delay: 0.78s; }
  .donate .copy .eyebrow .i { animation: beat 1.8s ease-in-out infinite; }
}
@keyframes don-in { from { opacity: 0; translate: 40px 0; } to { opacity: 1; translate: 0 0; } }
@keyframes beat { 0%, 100% { scale: 1; } 15% { scale: 1.2; } 30% { scale: 1; } 45% { scale: 1.12; } }
