/* Bandeau de dons IBCSC ASBL (accueil + page Dons). */
.don-band { padding: clamp(18px, 3vw, 34px) clamp(16px, 4vw, 52px); background: var(--obs-paper, #f4f2ed); }
.don-inner {
    position: relative; max-width: 1256px; margin: 0 auto; overflow: hidden;
    display: grid; grid-template-columns: 136px minmax(0, 1fr) minmax(300px, 400px); gap: clamp(18px, 3vw, 40px); align-items: center;
    padding: clamp(20px, 3vw, 30px) clamp(20px, 3.2vw, 38px);
    color: #e7f2f7; background: #03101b;
    background-image: radial-gradient(circle at 12% 30%, rgba(17, 191, 255, .16), transparent 42%), radial-gradient(circle at 92% 110%, rgba(245, 165, 36, .14), transparent 45%);
    border: 1px solid rgba(17, 191, 255, .22); border-radius: 18px; box-shadow: 0 18px 40px rgba(3, 16, 27, .18);
}
.don-inner::before {
    content: ''; position: absolute; inset: 0; pointer-events: none; opacity: .5;
    background-image: radial-gradient(rgba(17, 191, 255, .35) 1px, transparent 1.2px); background-size: 22px 22px;
    mask-image: linear-gradient(90deg, #000, transparent 40%);
}
.don-visual { position: relative; display: grid; place-items: center; }
.don-glow { animation: don-breathe 3.6s ease-in-out infinite; transform-origin: 80px 80px; }
.don-orbit { fill: none; stroke: rgba(17, 191, 255, .28); stroke-width: 1; stroke-dasharray: 3 5; }
.don-orbit-2 { stroke: rgba(17, 191, 255, .18); }
.don-sat { fill: #11bfff; transform-origin: 80px 80px; animation: don-spin 9s linear infinite; }
.don-sat-2 { fill: #f5a524; animation-duration: 6s; animation-direction: reverse; }
.don-shield { fill: rgba(17, 191, 255, .1); stroke: #11bfff; stroke-width: 2; stroke-linejoin: round; }
.don-heart { fill: #f5a524; transform-origin: 80px 82px; animation: don-beat 1.6s ease-in-out infinite; }
@keyframes don-spin { to { transform: rotate(360deg); } }
@keyframes don-beat { 0%, 60%, 100% { transform: scale(1); } 15% { transform: scale(1.16); } 30% { transform: scale(.98); } 45% { transform: scale(1.08); } }
@keyframes don-breathe { 50% { transform: scale(.9); opacity: .7; } }
.don-copy { position: relative; min-width: 0; }
.don-kicker { display: flex; align-items: center; gap: 10px; margin: 0 0 8px; font-size: .74rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: #11bfff; }
.don-flag { display: inline-flex; height: 10px; border-radius: 2px; overflow: hidden; }
.don-flag i { width: 6px; } .don-flag i:nth-child(1) { background: #111; } .don-flag i:nth-child(2) { background: #fdda24; } .don-flag i:nth-child(3) { background: #ef3340; }
.don-copy h2 { margin: 0 0 8px; color: #fff; font-size: clamp(1.3rem, 2.2vw, 1.75rem); line-height: 1.15; letter-spacing: -.01em; }
.don-text { margin: 0 0 12px; color: #a9bfcb; font-size: .95rem; line-height: 1.55; max-width: 60ch; }
.don-uses { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.don-uses li { display: inline-flex; align-items: center; gap: 7px; padding: 5px 11px; border: 1px solid rgba(17, 191, 255, .25); border-radius: 999px; font-size: .8rem; color: #d7e7ef; }
.don-uses li::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: #11bfff; }
.don-uses .don-use-1::before { background: #f5a524; } .don-uses .don-use-2::before { background: #3ddc97; }

.don-form { position: relative; display: grid; gap: 12px; padding: 16px; border-radius: 14px; background: rgba(255, 255, 255, .04); border: 1px solid rgba(255, 255, 255, .08); }
.don-amounts { display: grid; grid-template-columns: repeat(5, 1fr); gap: 7px; margin: 0; padding: 0; border: 0; }
.don-amounts legend { grid-column: 1 / -1; padding: 0; margin-bottom: 8px; font-size: .78rem; color: #8fa6b3; text-transform: uppercase; letter-spacing: .1em; }
.don-pill { position: relative; }
.don-pill input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.don-pill span {
    display: grid; place-items: center; height: 42px; border-radius: 10px; border: 1px solid rgba(17, 191, 255, .3); color: #e7f2f7;
    font-weight: 700; font-size: .95rem; font-variant-numeric: tabular-nums; transition: background .15s, border-color .15s, color .15s, transform .15s;
}
.don-pill:hover span { border-color: #11bfff; transform: translateY(-1px); }
.don-pill input:checked + span { background: #11bfff; border-color: #11bfff; color: #03101b; }
.don-pill input:focus-visible + span { outline: 2px solid #fff; outline-offset: 2px; }
.don-custom { grid-column: 1 / -1; position: relative; display: block; margin-top: 2px; }
.don-custom input {
    width: 100%; box-sizing: border-box; height: 42px; padding: 0 34px 0 12px; border-radius: 10px; border: 1px solid rgba(255, 255, 255, .16);
    background: rgba(3, 16, 27, .6); color: #fff; font: inherit; font-size: .95rem;
}
.don-custom input::placeholder { color: #7f96a3; }
.don-custom input:focus { outline: none; border-color: #11bfff; box-shadow: 0 0 0 3px rgba(17, 191, 255, .2); }
.don-custom b { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); color: #7f96a3; font-weight: 600; }
.don-form.is-custom .don-pill input:checked + span { background: transparent; color: #e7f2f7; border-color: rgba(17, 191, 255, .3); }
.don-submit {
    display: inline-flex; align-items: center; justify-content: center; gap: 10px; height: 48px; border: 0; border-radius: 11px; cursor: pointer;
    background: #f5a524; color: #03101b; font: inherit; font-weight: 800; font-size: 1rem; transition: transform .15s, box-shadow .15s, background .15s;
}
.don-submit:hover { background: #ffb83d; transform: translateY(-1px); box-shadow: 0 10px 24px rgba(245, 165, 36, .3); }
.don-submit svg { animation: don-beat 1.6s ease-in-out infinite; }
.don-note { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 0; font-size: .74rem; color: #8fa6b3; line-height: 1.4; }
.don-logos { display: inline-flex; gap: 8px; align-items: center; flex: none; }
.don-logos img { height: 16px; width: auto; }
.don-logos img[alt="Bancontact"] { height: 22px; background: #fff; border-radius: 3px; padding: 1px 3px; }
.don-error { margin: 0; padding: 8px 10px; border-radius: 8px; background: rgba(239, 51, 64, .15); color: #ffb3b9; font-size: .85rem; }
.don-month { margin: 0; font-size: .8rem; color: #3ddc97; }
.don-test { position: absolute; top: -10px; right: 12px; margin: 0; padding: 2px 8px; border-radius: 6px; background: #f5a524; color: #03101b; font-size: .68rem; font-weight: 800; text-transform: uppercase; }
.don-hp, .don-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
@media (max-width: 1060px) {
    .don-inner { grid-template-columns: 96px minmax(0, 1fr); }
    .don-visual svg { width: 96px; height: 96px; }
    .don-form { grid-column: 1 / -1; }
}
@media (max-width: 600px) {
    .don-inner { grid-template-columns: 1fr; }
    .don-visual { display: none; }
    .don-amounts { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 5px; }
    .don-pill span { font-size: .85rem; }
    .don-note { flex-direction: column; align-items: flex-start; }
}
@media (prefers-reduced-motion: reduce) {
    .don-glow, .don-sat, .don-heart, .don-submit svg { animation: none; }
}

/* Page de remerciement */
.don-thanks { max-width: 640px; margin: clamp(30px, 6vw, 80px) auto; padding: 0 16px; text-align: center; }
.don-thanks-mark { display: grid; place-items: center; width: 84px; height: 84px; margin: 0 auto 18px; border-radius: 50%; background: #03101b; }
.don-thanks-mark svg { width: 44px; height: 44px; }
.don-thanks h1 { margin: 0 0 12px; }
.don-thanks p { line-height: 1.6; }
.don-thanks .don-vat { font-size: .88rem; opacity: .75; }
.don-thanks-actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; margin-top: 22px; }