.box{border:1px solid rgba(255,255,255,.22);border-radius:18px;background:rgba(255,255,255,.07);padding:clamp(20px,2.6vw,36px)}
.box .sec-h{margin-bottom:18px}
.donate{display:flex;justify-content:center}
.donate-btn{width:min(100%,440px);padding:16px 28px;font-size:clamp(16px,1.8vw,20px)}
.lk.off::after{display:none}
.heart-fx{position:relative;display:inline-block;flex:none;width:clamp(26px,2.6vw,34px);height:clamp(26px,2.6vw,34px);align-self:center}
.heart-fx svg{position:absolute;inset:0;width:100%;height:100%;fill:#ff5f5f;overflow:visible}
.heart-fx .main{transform-origin:50% 58%;animation:hbeat 3.4s ease-in-out infinite}
.heart-fx .ghost{fill:#fff;opacity:0;transform-origin:50% 50%;animation:hfly 3.4s ease-out infinite;animation-delay:var(--dl,0s);inset:auto;width:var(--w);height:var(--w);left:calc((100% - var(--w)) / 2);top:calc((100% - var(--w)) / 2)}
.heart-fx .g1{--w:74%;--dx:2px;--dy:-44px;--r:-6deg;--dl:0s}
.heart-fx .g2{--w:52%;--dx:-20px;--dy:-34px;--r:-22deg;--dl:.14s}
.heart-fx .g3{--w:38%;--dx:19px;--dy:-52px;--r:20deg;--dl:.28s}
@keyframes hbeat{0%,100%{transform:scale(1);opacity:1}5%{transform:scale(1.3)}10%{transform:scale(1)}15%{transform:scale(1.3)}20%{transform:scale(1)}28%{opacity:.4}34%{opacity:1}42%{opacity:.4}48%{opacity:1;transform:scale(1.12)}58%{transform:scale(1)}}
@keyframes hfly{0%,52%{opacity:0;transform:translate(0,0) rotate(0) scale(1)}58%{opacity:.6}100%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(var(--r)) scale(.6)}}
@media (prefers-reduced-motion:reduce){.heart-fx .main,.heart-fx .ghost{animation:none}.heart-fx .ghost{display:none}}
.donate-main{min-width:0}
.donate-body{display:grid;grid-template-columns:1fr auto;gap:clamp(18px,3vw,40px);align-items:center}
.donate-text{margin:0;text-align:justify;font-size:clamp(14px,1.25vw,17px);line-height:1.75;color:rgba(255,255,255,.92)}
.donate-text a{font-weight:700;text-decoration:none}
.donate-text b{font-weight:700}
.donate-qr{display:block;width:clamp(150px,17vw,230px);height:auto;border-radius:14px;box-shadow:0 8px 22px rgba(4,30,56,.38)}
@media (max-width:640px){.donate-body{grid-template-columns:1fr}.donate-qr{margin:0;width:100%}}
.qr-btn{display:block;flex:none;width:clamp(150px,17vw,230px);padding:0;border:0;background:none;border-radius:14px;cursor:zoom-in;transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s}
.qr-btn .donate-qr{width:100%;box-shadow:0 8px 22px rgba(4,30,56,.38);transition:box-shadow .35s}
@media (hover:hover){.qr-btn:hover{transform:translateY(-4px)}.qr-btn:hover .donate-qr{box-shadow:0 14px 30px rgba(4,30,56,.5)}}
.qr-btn:focus-visible{outline:2px solid var(--c);outline-offset:4px}
@media (max-width:640px){.qr-btn{margin:4px 0 0;width:100%}}
.qr-big{position:relative;z-index:1;display:block;max-width:min(92vw,560px);max-height:calc(100vh - 60px);max-height:calc(100svh - 60px);width:auto;height:auto;border-radius:0;background:none;filter:drop-shadow(0 24px 40px rgba(0,0,0,.55));transform:scale(.94);transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.modal.open .qr-big{transform:none}
@media (prefers-reduced-motion:reduce){.qr-big{transition:none;transform:none}}
/* Nút ủng hộ: cùng 1 style ở mọi trang, kích thước bằng nhau, nội dung căn giữa */
.donate-btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:18px}
.donate-btns .lk{box-sizing:border-box;display:flex;align-items:center;justify-content:center;gap:8px;width:auto;min-height:48px;padding:10px 16px;border-radius:999px;background:rgba(255,255,255,.14);font-size:clamp(13px,1.25vw,16px);line-height:1.2;text-align:center;text-transform:uppercase;white-space:nowrap;flex:1 1 230px}
.donate-btns .lk::after{content:"↗";font-size:.9em;opacity:.7}
.donate-btns .lk>span{display:inline}
@media (hover:hover){.donate-btns .lk:hover{background:rgba(255,255,255,.26);color:var(--c);transform:translateY(-2px);box-shadow:0 6px 16px rgba(4,30,56,.35)}}
.donate-btns .lk:focus-visible{outline:2px solid var(--c);outline-offset:3px}
@media (max-width:480px){.donate-btns .lk{flex-basis:100%}}
