.donation-page { display:grid; gap:2.5rem; letter-spacing:0; }
.donation-panel { width:100%; min-width:0; box-sizing:border-box; }
#donationIdentity label { display:grid; gap:8px; margin:18px 0; font-weight:600; }
#donationIdentity input { width:100%; min-width:0; box-sizing:border-box; padding:14px; font:inherit; font-size:16px; border:1px solid #ccd9d0; border-radius:8px; }
#donationIdentity .donation-form-actions { margin-top:24px; }
.donation-return { border:0; background:transparent; color:#123b2c; padding:12px 0; margin-bottom:16px; font:inherit; cursor:pointer; }
button.pay-card { font:inherit; text-align:left; cursor:pointer; background:white; color:#18291f; border:1px solid #ccd9d0; }
.donation-page [hidden] { display:none !important; }
.donation-tabs { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:2rem; }
.donation-tabs button { position:relative; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; gap:14px; text-align:left; min-height:280px; border:1px solid #d8e1dc; border-radius:8px; padding:36px; background:#fff; color:#18291f; box-shadow:0 12px 30px #123b2c0a; cursor:pointer; transition:background .2s,color .2s,transform .2s,box-shadow .2s; font:inherit; }
.donation-choice-icon { display:block; width:64px; height:64px; margin-bottom:16px; }
.donation-tabs button strong { font-size:30px; line-height:1.15; }
.donation-tabs button small { font-size:15px; opacity:.75; padding-right:32px; }
.donation-tabs button:first-child { background:#123b2c; color:white; border-color:#123b2c; }
.donation-tabs button:first-child .donation-choice-icon { filter:invert(1); }
.donation-tabs button[aria-expanded=true] { box-shadow:0 0 0 3px #659a7f,0 16px 36px #123b2c16; }
.donation-choice-arrow { position:absolute; right:28px; bottom:28px; font-size:26px; transition:transform .2s; }
.donation-tabs button[aria-expanded=true] .donation-choice-arrow { transform:rotate(90deg); }
.donation-tabs button:hover { transform:translateY(-2px); }
.donation-panel { max-width:760px; margin:0 auto; padding:12px 0 32px; animation:donationReveal .25s ease both; }
.donation-panel h3,.donation-impact h3 { margin:0 0 12px; font-size:30px; line-height:1.2; }
.donation-panel p,.donation-impact p { color:#65716a; line-height:1.7; }
.donation-panel .pay-buttons { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.donation-panel .pay-card { min-width:0; min-height:112px; border-radius:8px; padding:18px; box-shadow:0 8px 24px #123b2c08; }
.donation-panel .pay-logo { flex:none; width:56px; height:56px; }
.donation-panel .pay-logo img { width:100%; height:100%; object-fit:contain; }
.donation-note { display:block; margin-top:18px; color:#65716a; }
.donation-progress { display:flex; flex-wrap:wrap; gap:12px; justify-content:space-between; color:#315943; font-size:13px; margin-bottom:28px; }
.donation-progress progress { width:100%; height:5px; border:0; accent-color:#123b2c; border-radius:4px; overflow:hidden; }
.donation-progress progress::-webkit-progress-bar { background:#e1e8e3; }
.donation-progress progress::-webkit-progress-value { background:#123b2c; transition:width .3s; }
#donationForm fieldset { min-width:0; border:0; padding:0; margin:0 0 24px; animation:donationReveal .25s ease both; }
#donationForm legend { font-size:26px; font-weight:750; margin-bottom:16px; }
#donationForm label { display:grid; gap:8px; font-size:14px; font-weight:600; margin-bottom:18px; }
#donationForm input:not([type=radio]),#donationForm textarea { width:100%; min-width:0; border:1px solid #ccd9d0; border-radius:8px; padding:14px; background:#fff; color:#18291f; font:inherit; font-size:16px; }
#donationForm textarea { resize:vertical; }
.donation-page :focus-visible { outline:3px solid #609e80; outline-offset:3px; }
.donation-categories { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }
#donationForm .donation-categories label { position:relative; margin:0; cursor:pointer; }
.donation-categories input { position:absolute; opacity:0; }
.donation-categories span { display:grid; place-items:center; min-height:72px; border:1px solid #d7e1db; border-radius:8px; background:white; transition:background .2s,box-shadow .2s; }
.donation-categories input:checked + span { background:#e9f4ed; border-color:#123b2c; color:#123b2c; box-shadow:inset 0 0 0 1px #123b2c; }
.donation-categories input:focus-visible + span { outline:3px solid #609e80; outline-offset:3px; }
.donation-name-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.donation-form-actions { display:flex; gap:12px; justify-content:space-between; }
.donation-form-actions button { min-height:48px; border:1px solid #cad7cf; border-radius:8px; padding:12px 20px; font:inherit; font-weight:650; cursor:pointer; color:#123b2c; background:white; }
.donation-form-actions [data-donation-next],.donation-form-actions [data-donation-submit] { background:#123b2c; color:#fff; margin-left:auto; }
.donation-form-actions button:disabled { opacity:.6; cursor:wait; }
.donation-error { padding:14px; border-left:3px solid #ba4848; background:#fff2f2; color:#923535 !important; }
.donation-success { padding:30px 0; text-align:center; }
.donation-success > span { display:grid; place-items:center; width:64px; height:64px; border-radius:50%; margin:0 auto 24px; background:#e0f1e6; color:#123b2c; font-size:30px; animation:donationReveal .4s ease; }
.donation-success a { display:inline-block; margin-top:16px; font-weight:700; color:#123b2c; }
.donation-impact { display:grid; grid-template-columns:1fr 1.2fr; align-items:center; gap:32px; padding-top:48px; border-top:1px solid #dce3df; }
.donation-impact a { display:inline-flex; align-items:center; gap:20px; padding:12px 0; border-bottom:1px solid #123b2c; font-weight:700; }
.donation-photos { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.donation-photos img { display:block; width:100%; aspect-ratio:3/4; object-fit:cover; border-radius:8px; }
@keyframes donationReveal { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:translateY(0); } }
@media(max-width:650px) { .donation-tabs { grid-template-columns:1fr; gap:16px; } .donation-tabs button { min-height:190px; padding:24px; gap:10px; } .donation-choice-icon { width:48px; height:48px; margin-bottom:6px; } .donation-tabs button strong { font-size:25px; } .donation-panel .pay-buttons,.donation-impact { grid-template-columns:1fr; } .donation-categories { grid-template-columns:1fr 1fr; } .donation-name-row { grid-template-columns:1fr; gap:0; } .donation-panel h3,.donation-impact h3 { font-size:26px; } .donation-page { gap:24px; } }
@media(prefers-reduced-motion:reduce) { .donation-page * { animation:none !important; transition:none !important; } }
