/* vc-bot AERO rebuild */
:root {
  --cyan:#66CCFF; --cyan-deep:#2b9fe0; --cyan-ink:#0a3d5c;
  --muted:#5d7689; --line:rgba(43,159,224,0.25);
  --glass:rgba(255,255,255,0.6); --glass-strong:rgba(255,255,255,0.72); --glass-bd:rgba(102,204,255,0.5);
  --shadow:0 10px 40px rgba(43,159,224,0.18);
  --mono:"Chakra Petch","JetBrains Mono",monospace;
  --display:"Mochiy Pop One","ZCOOL KuaiLe","LXGW WenKai SC","Noto Serif SC",cursive;
  --sans:"LXGW WenKai SC","ZCOOL KuaiLe","Mochiy Pop One","Noto Sans SC","PingFang SC",system-ui,sans-serif;
  --radius:20px; --ease:cubic-bezier(.175,.885,.32,1.1);
}
* { margin:0; padding:0; box-sizing:border-box; }
html, body { min-height:100%; }
body {
  font-family:var(--sans); color:var(--cyan-ink); line-height:1.85;
  background:rgba(225,245,255,0.6); background-attachment:fixed;
  position:relative; overflow-x:hidden;
}

.vc-bg { position:fixed; inset:0; z-index:-3; opacity:0.6; }
.vc-aurora { position:absolute; border-radius:50%; filter:blur(80px); }
.vc-a1 { width:50vw; height:50vw; background:radial-gradient(circle,#66CCFF,transparent 65%); top:-12vw; left:-8vw; animation:drift 20s ease-in-out infinite; }
.vc-a2 { width:44vw; height:44vw; background:radial-gradient(circle,#aee7ff,transparent 65%); bottom:-14vw; right:-10vw; animation:drift 24s ease-in-out infinite reverse; }
.vc-a3 { width:34vw; height:34vw; background:radial-gradient(circle,#b6f0ff,transparent 65%); top:36%; left:52%; animation:drift 28s ease-in-out infinite; }
@keyframes drift { 0%,100%{transform:translate(0,0)} 50%{transform:translate(4vw,-3vw)} }
.vc-grid { position:absolute; inset:0; background-image:linear-gradient(rgba(43,159,224,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(43,159,224,.06) 1px,transparent 1px); background-size:48px 48px; -webkit-mask:radial-gradient(circle at 50% 30%,#000,transparent 88%); mask:radial-gradient(circle at 50% 30%,#000,transparent 88%); }
.vc-bgimg{position:fixed;inset:0;z-index:-2;pointer-events:none;background-image:url('site-data/img/art-9.jpg');background-size:cover;background-position:center;opacity:0.5;}
.vc-top { position:fixed; top:0; left:0; right:0; z-index:60; display:flex; align-items:center; gap:18px; padding:12px 26px; background:rgba(255,255,255,0.6); backdrop-filter:blur(18px) saturate(160%); -webkit-backdrop-filter:blur(18px) saturate(160%); border-bottom:1px solid var(--glass-bd); transition:transform .35s var(--ease); }
.vc-top.hide { transform:translateY(-100%); }
.vc-top .logo { font-family:var(--display); font-weight:900; font-size:18px; color:var(--cyan-deep); white-space:nowrap; cursor:pointer; }
.vc-top .logo b { color:var(--cyan); }
.vc-top nav { display:flex; gap:6px; margin-left:auto; flex-wrap:wrap; }
.vc-top nav a { font-size:13px; color:var(--muted); text-decoration:none; padding:6px 12px; border-radius:999px; transition:all .25s; font-weight:600; white-space:nowrap; }
.vc-top nav a:hover { background:rgba(102,204,255,.18); color:var(--cyan-ink); }
.vc-top .tb-btn { font-family:var(--mono); font-size:12px; padding:7px 16px; border-radius:999px; background:linear-gradient(135deg,var(--cyan-deep),var(--cyan)); color:#fff; text-decoration:none; font-weight:700; white-space:nowrap; }

/* ===== hero banner: AERO glass, 60 percent ===== */
.vc-wrap { max-width:1100px; margin:0 auto; padding:90px 22px 70px; position:relative; z-index:1; }
.vc-hero-banner { background:transparent; border:none; box-shadow:none; border-radius:0; padding:8px 4px 0; margin-bottom:14px; position:relative; }
.vc-hero-cards { background:rgba(255,255,255,0.6); backdrop-filter:blur(22px) saturate(160%); -webkit-backdrop-filter:blur(22px) saturate(160%); border:1px solid rgba(102,204,255,0.5); box-shadow:var(--shadow), inset 0 1px 0 rgba(255,255,255,0.7); border-radius:28px; padding:34px 36px; margin-bottom:34px; overflow:hidden; position:relative; }
.vc-kicker { display:flex; gap:16px; font-family:var(--mono); font-size:11px; letter-spacing:.22em; color:var(--cyan-deep); margin-bottom:18px; flex-wrap:wrap; }
.vc-title { font-family:var(--display); font-size:46px; line-height:1.18; font-weight:900; background:linear-gradient(120deg,var(--cyan-deep),var(--cyan) 60%,#aee7ff); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.vc-sub { color:var(--muted); font-size:15px; margin:16px 0 18px; max-width:62ch; }
.vc-chips { display:flex; flex-wrap:wrap; gap:10px; } .vc-chip { display:inline-flex; align-items:center; gap:4px; padding:7px 14px; border-radius:999px; background:var(--glass-strong); border:1px solid var(--glass-bd); color:var(--cyan-deep); text-decoration:none; font-size:13px; font-weight:600; transition:all .25s; } .vc-chip:hover { background:var(--cyan); color:#fff; transform:translateY(-2px); }
.vc-idcards { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:12px; margin-top:22px; }
.vc-idcard { background:var(--glass-strong); border:1px solid var(--glass-bd); border-radius:14px; padding:14px 16px; }
.vc-idlabel { font-family:var(--mono); font-size:10px; letter-spacing:.2em; color:var(--cyan); }
.vc-idval { font-family:var(--mono); font-size:20px; font-weight:700; color:var(--cyan-ink); }
.vc-idname { font-size:13px; color:var(--cyan-deep); text-decoration:none; font-weight:600; }
.vc-stats { display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:14px; margin-top:22px; }
.vc-stat { background:var(--glass-strong); border:1px solid var(--glass-bd); border-radius:14px; padding:14px; text-align:center; } .vc-stat-k { font-family:var(--mono); font-size:10px; letter-spacing:.15em; color:var(--cyan); } .vc-stat-v { font-size:20px; font-weight:800; color:var(--cyan-ink); margin:4px 0; } .vc-stat-u { font-size:12px; color:var(--muted); }
.vc-marquee { margin-top:22px; overflow:hidden; border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:10px 0; -webkit-mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent); mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent); } .vc-marquee-track { display:flex; gap:40px; white-space:nowrap; animation:mq 18s linear infinite; width:max-content; } .vc-mq-item { display:inline-flex; align-items:center; gap:8px; font-family:var(--mono); font-size:12px; letter-spacing:.1em; color:var(--muted); } .vc-mq-dot { width:6px; height:6px; border-radius:50%; background:var(--cyan); } @keyframes mq { from{transform:translateX(0)} to{transform:translateX(-50%)} }

/* ===== sections & components: AERO glass, adaptive grid ===== */
.vc-sec { margin:40px 0; }
.vc-sechead { display:flex; align-items:baseline; gap:14px; margin-bottom:22px; padding-bottom:12px; border-bottom:2px solid var(--line); flex-wrap:wrap; }
.vc-secnum { font-family:var(--mono); font-size:28px; font-weight:700; color:var(--cyan); }
.vc-sectitle { font-family:var(--display); font-size:26px; font-weight:900; color:var(--cyan-ink); }
.vc-seclatin { font-family:var(--mono); font-size:11px; letter-spacing:.2em; color:var(--muted); margin-left:auto; }
.vc-panel { background:var(--glass); backdrop-filter:blur(16px); border:1px solid var(--glass-bd); border-radius:var(--radius); padding:22px 24px; box-shadow:var(--shadow); margin-bottom:18px; } .vc-panel.accent { border-left:4px solid var(--cyan); }
.vc-tl { position:relative; padding:0 0 22px 24px; border-left:2px solid var(--line); margin-left:6px; } .vc-tl-dot { position:absolute; left:-7px; top:6px; width:12px; height:12px; border-radius:50%; background:var(--cyan); box-shadow:0 0 0 4px rgba(102,204,255,.25); } .vc-tl-date { font-family:var(--mono); font-size:13px; color:var(--cyan-deep); font-weight:700; } .vc-tl-title { font-family:var(--display); font-size:19px; color:var(--cyan-ink); margin:4px 0 8px; } .vc-tl p { color:var(--muted); font-size:14.5px; } .vc-tl a { color:var(--cyan-deep); font-weight:700; text-decoration:none; } .vc-tl ul { padding-left:18px; font-size:14.5px; color:var(--muted); } .vc-tl li { margin:6px 0; }
.vc-cmds { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:12px; margin-bottom:18px; } .vc-cmd { background:var(--glass-strong); border:1px solid var(--glass-bd); border-radius:12px; padding:12px 14px; } .vc-cmd-l { font-size:13px; color:var(--muted); margin-bottom:6px; font-weight:600; } .vc-code { display:inline-block; font-family:var(--mono); font-size:13px; background:rgba(43,159,224,.14); color:var(--cyan-deep); padding:2px 8px; border-radius:6px; margin:3px 4px 0 0; }
.vc-acc { background:var(--glass); backdrop-filter:blur(12px); border:1px solid var(--glass-bd); border-radius:14px; margin:12px 0; overflow:hidden; } .vc-acc-h { display:flex; align-items:center; gap:12px; padding:15px 18px; cursor:pointer; font-weight:700; color:var(--cyan-ink); transition:background .2s; } .vc-acc-h:hover { background:rgba(102,204,255,.12); } .vc-acc-i { font-family:var(--mono); font-size:13px; color:var(--cyan); } .vc-acc-x { margin-left:auto; font-size:20px; color:var(--cyan); transition:transform .3s; } .vc-acc.open .vc-acc-x { transform:rotate(45deg); } .vc-acc-b { max-height:0; overflow:hidden; transition:max-height .35s ease; } .vc-acc.open .vc-acc-b { max-height:1400px; } .vc-acc-in { padding:0 18px 18px; color:var(--muted); font-size:14.5px; } .vc-acc-in ul { padding-left:18px; } .vc-acc-in li { margin:6px 0; } .vc-acc-in a { color:var(--cyan-deep); font-weight:700; text-decoration:none; } .vc-acc-in pre { background:rgba(43,159,224,.1); border:1px solid var(--line); border-radius:8px; padding:12px; font-family:var(--mono); font-size:12.5px; white-space:pre-wrap; color:var(--cyan-ink); margin-top:8px; }
.vc-bots { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:16px; }
.vc-bot { position:relative; min-height:240px; background:rgba(255,255,255,0.5); backdrop-filter:blur(22px) saturate(160%); -webkit-backdrop-filter:blur(22px) saturate(160%); border:2px solid var(--bc, rgba(102,204,255,0.5)); box-shadow:var(--shadow), inset 0 1px 0 rgba(255,255,255,0.7); border-radius:18px; padding:18px; overflow:hidden; }
.vc-bot-halo { position:absolute; top:-40px; right:-40px; width:120px; height:120px; border-radius:50%; background:var(--bc, #66CCFF); filter:blur(30px); opacity:.35; }
.vc-bot-art { display:none; }
.vc-bot-n { position:relative; top:auto; left:auto; z-index:3; font-family:var(--display); font-size:26px; font-weight:900; color:var(--bc, #2b9fe0); text-shadow:0 2px 10px rgba(255,255,255,.95); line-height:1.2; margin-bottom:6px; }
.vc-bot-v { font-family:var(--mono); font-size:12px; color:var(--muted); margin-top:2px; font-weight:600; }
.vc-bot-btn { position:relative; left:auto; bottom:auto; z-index:3; display:inline-block; padding:8px 16px; border-radius:999px; background:rgba(255,255,255,0.35); border:1px solid var(--bc, rgba(102,204,255,0.5)); color:var(--bc, #2b9fe0); text-decoration:none; font-size:12px; font-weight:700; backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
.vc-bot-btn:hover { background:var(--bc, #66CCFF); color:#fff; }
@media (max-width:560px){ .vc-bot { min-height:200px; padding:14px; } .vc-bot-n { font-size:22px; } }
.vc-two { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:14px; } .vc-note { background:var(--glass); backdrop-filter:blur(12px); border:1px solid var(--glass-bd); border-radius:12px; padding:14px 16px; color:var(--muted); font-size:14px; border-left:4px solid var(--cyan); margin-bottom:12px; } .vc-note.vc-danger { border-left-color:#ff6b8a; } .vc-note.vc-ok { border-left-color:#2fb36b; }
.vc-msgbox { margin-top:12px; } .vc-msgbox .lab { font-family:var(--mono); font-size:10px; letter-spacing:.2em; margin-bottom:6px; } .vc-msgbox.vc-good .lab { color:#2fb36b; } .vc-msgbox.vc-bad .lab { color:#e0556b; } .vc-bubble { display:inline-block; background:var(--glass-strong); border:1px solid var(--glass-bd); border-radius:10px; padding:6px 10px; font-size:13px; margin:4px 4px 0 0; color:var(--cyan-ink); }
.vc-legal.vc-danger { border-left:4px solid #ff6b8a; } .vc-legal h4 { font-family:var(--display); color:var(--cyan-ink); font-size:16px; margin:14px 0 6px; } .vc-legal p { color:var(--muted); font-size:14px; margin:6px 0; } .vc-sign { text-align:right; margin-top:16px; padding-top:12px; border-top:1px dashed #e0556b; color:#c0392b; font-weight:700; font-size:14px; }
.vc-team { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:14px; } .vc-tc { background:var(--glass-strong); border:1px solid var(--glass-bd); border-radius:16px; padding:18px 12px; text-align:center; transition:transform .3s var(--ease); } .vc-tc:hover { transform:translateY(-6px); box-shadow:var(--shadow); } .vc-tc-av { width:56px; height:56px; margin:0 auto 10px; border-radius:50%; overflow:hidden; border:2.5px solid #fff; box-shadow:0 4px 14px rgba(43,159,224,.4); } .vc-tc-av img { width:100%; height:100%; object-fit:cover; } .vc-tc-n { font-family:var(--display); font-size:17px; font-weight:900; color:var(--cyan-ink); } .vc-tc-r { font-size:11px; color:#fff; background:linear-gradient(135deg,var(--cyan-deep),var(--cyan)); display:inline-block; padding:2px 10px; border-radius:999px; margin:4px 0; } .vc-tc-q { font-family:var(--mono); font-size:12px; color:var(--muted); }
.vc-foot { text-align:center; color:var(--muted); font-size:13.5px; margin-top:40px; } .vc-foot .hl { color:var(--cyan-deep); font-weight:700; }
.vc-chips-row { display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }

.vc-up { opacity:0; transform:translateY(40px); transition:opacity .8s var(--ease), transform .8s var(--ease); }
.vc-up.in { opacity:1; transform:none; }
.vc-up.d1 { transition-delay:.08s; } .vc-up.d2 { transition-delay:.16s; } .vc-up.d3 { transition-delay:.24s; } .vc-up.d4 { transition-delay:.32s; }
.vc-fly { opacity:0; transform:translateX(-46px); transition:opacity .8s var(--ease), transform .8s var(--ease); }
.vc-fly.in { opacity:1; transform:none; }
.vc-flyr { opacity:0; transform:translateX(46px); transition:opacity .8s var(--ease), transform .8s var(--ease); }
.vc-flyr.in { opacity:1; transform:none; }
.vc-zoom { opacity:0; transform:scale(.88); transition:opacity .8s var(--ease), transform .8s var(--ease); }
.vc-zoom.in { opacity:1; transform:none; }
@media (max-width:900px){ .vc-top nav { display:none; } .vc-title { font-size:34px; } }
@media (max-width:560px){ .vc-wrap { padding:84px 14px 60px; } .vc-hero-banner { padding:26px 18px; border-radius:20px; } .vc-hero-cards { padding:22px 16px; border-radius:20px; } .vc-title { font-size:30px; } .vc-sectitle { font-size:22px; } }
@media (prefers-reduced-motion:reduce){ .vc-up,.vc-fly,.vc-flyr,.vc-zoom{opacity:1!important;transform:none!important;transition:none!important;} .vc-marquee-track,.vc-aurora{animation:none!important;} *{scroll-behavior:auto!important;} }

/* donation pagination (shared) */
.pagination { display:flex; flex-wrap:wrap; gap:8px; margin-top:20px; justify-content:center; align-items:center; }
.pagination .page-nav, .pagination .page-btn { font-family:var(--mono); min-width:40px; padding:9px 14px; border-radius:10px; background:var(--glass); border:1px solid var(--glass-bd); color:var(--cyan-deep); cursor:pointer; font-weight:700; transition:all .2s; backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); }
.pagination .page-nav:hover:not([disabled]), .pagination .page-btn:hover { background:rgba(102,204,255,.28); }
.pagination .page-btn.active { background:linear-gradient(135deg,var(--cyan-deep),var(--cyan)); color:#fff; border-color:transparent; }
.pagination .page-nav[disabled] { opacity:.4; cursor:not-allowed; }
.pagination .page-info { color:var(--muted); font-family:var(--mono); padding:0 4px; }

/* donation hero text always visible */
.vc-hero-banner .vc-sub { color:var(--muted); }
.vc-hero-banner .vc-kicker { color:var(--cyan-deep); }
.vc-hero-banner .vc-title { color:var(--cyan-deep); -webkit-text-fill-color:var(--cyan-deep); background:none; }

/* pagination: narrow screen shows only nav + active */
@media (max-width:560px){
  .pagination .page-btn:not(.active) { display:none; }
  .pagination .page-info { display:none; }
  .pagination { gap:10px; }
}