:root{--navy:#082b58;--navy2:#061d3e;--yellow:#ffc915;--gold:#e7a900;--ink:#10254a;--muted:#65748b;--line:#e6edf4;--soft:#f5faff;--cream:#fffaf0}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI","Microsoft YaHei",sans-serif;color:var(--ink);background:white}.shell{width:min(1360px,calc(100% - 64px));margin:auto}
.site-header{height:84px;position:sticky;top:0;z-index:50;background:rgba(255,255,255,.96);border-bottom:1px solid var(--line);backdrop-filter:blur(14px)}.nav{height:84px;display:flex;align-items:center;justify-content:space-between}.brand{height:64px;width:260px;display:flex;align-items:center;overflow:hidden}.brand img{display:block;max-width:100%;max-height:62px;width:auto;height:auto;object-fit:contain;object-position:left center}.nav-links{display:flex;align-items:center;gap:30px}.nav-links a{text-decoration:none;color:var(--ink);font-weight:750;font-size:14px}.join-nav{background:var(--yellow);padding:13px 22px;border-radius:13px}.menu{display:none;border:0;background:none;font-size:25px;color:var(--navy)}
.hero{overflow:hidden;background:linear-gradient(105deg,#fff 0 43%,#f1f9ff 100%)}.hero-grid{min-height:590px;display:grid;grid-template-columns:.9fr 1.1fr;align-items:center;gap:30px}.eyebrow,.kicker{margin:0;color:#725d17;font-size:12px;letter-spacing:.18em;font-weight:900}.hero h1{font-size:clamp(58px,6vw,92px);line-height:.9;letter-spacing:-.055em;margin:20px 0 24px;color:var(--navy)}.hero h1 span{color:var(--gold)}.cn-lead{font-size:24px;font-weight:850;margin:0 0 12px}.lead{font-size:17px;line-height:1.8;color:#52627a;margin:0}.hero-actions{display:flex;gap:16px;margin-top:30px}.btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;font-weight:850;border-radius:13px;padding:15px 25px}.primary{background:var(--yellow);color:var(--navy);box-shadow:0 10px 24px rgba(231,169,0,.18)}.secondary{background:white;color:var(--navy);border:1px solid #aebbc9}
.hero-visual{height:590px;position:relative;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 55% 45%,#fff 0 25%,transparent 65%)}.hero-visual:before{content:"";position:absolute;inset:10% -10% 0 8%;background:linear-gradient(150deg,transparent 35%,rgba(165,220,255,.22));clip-path:polygon(0 70%,100% 30%,100% 100%,0 100%)}.hero-logo{position:relative;z-index:2;width:min(430px,72%);max-height:500px;object-fit:contain;display:block}.court-lines{position:absolute;inset:auto 0 0 0;height:45%;background:linear-gradient(160deg,transparent 0 49%,rgba(123,194,235,.24) 50% 50.4%,transparent 50.6%),linear-gradient(20deg,transparent 0 49%,rgba(123,194,235,.18) 50% 50.4%,transparent 50.6%)}.scribble{position:absolute;z-index:3;font-family:"Comic Sans MS","Segoe Print",cursive;font-weight:800;color:#0b438c;transform:rotate(-7deg);line-height:1.05}.scribble.one{right:2%;top:34%;font-size:22px}.scribble.two{right:0;bottom:12%;font-size:19px;background:#fff1a6;padding:12px 15px;transform:rotate(-9deg)}
.values{border-bottom:1px solid var(--line);background:white}.value-grid{display:grid;grid-template-columns:repeat(4,1fr);padding:28px 0}.value{display:flex;align-items:center;gap:20px;padding:0 30px;border-right:1px solid var(--line)}.value:last-child{border:0}.value-icon{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;font-size:26px;font-weight:900;flex:0 0 auto}.value-icon.navy{background:var(--navy);color:white}.value-icon.yellow{background:var(--yellow);color:var(--navy)}.value b{display:block;font-size:20px}.value small{display:block;color:var(--muted);line-height:1.5;margin-top:4px}
.section{padding:90px 0}.section h2{font-size:clamp(38px,4vw,58px);line-height:1.05;letter-spacing:-.04em;margin:14px 0 22px}.section p{color:#53627a;line-height:1.8;font-size:16px}.section-intro{display:grid;grid-template-columns:1fr 1fr;gap:90px}.soft{background:var(--soft)}.section-title{display:flex;justify-content:space-between;align-items:end;gap:40px}.hand{font-family:"Comic Sans MS","Segoe Print",cursive!important;color:#0b438c!important;font-weight:800;transform:rotate(-2deg);text-align:right}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:40px}.cards article{background:white;border:1px solid var(--line);border-radius:22px;padding:30px}.cards article>span{width:52px;height:52px;border-radius:16px;background:#fff5c6;display:grid;place-items:center;font-size:25px}.cards h3{font-size:20px}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:48px;border-top:2px solid var(--navy)}.steps div{padding:30px 28px 0 0}.steps i{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--yellow);font-style:normal;font-weight:900;margin-top:-49px;border:5px solid white}.steps p{font-size:14px}
.quote{text-align:center;background:var(--yellow);padding:52px 20px;color:var(--navy)}.quote img{width:66px;height:66px;object-fit:contain}.quote blockquote{font-size:clamp(30px,4vw,48px);font-weight:950;margin:6px 0}.quote p{margin:0;font-weight:800}.fund{display:grid;grid-template-columns:1.2fr .8fr;gap:80px;align-items:center}.tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}.tags span{padding:9px 13px;border-radius:999px;background:#f2f5f8;font-size:13px;font-weight:750}.fund aside{background:linear-gradient(145deg,var(--navy),#10457e);color:white;padding:36px;border-radius:28px}.fund aside small{letter-spacing:.18em}.fund aside strong{display:block;font-size:62px;color:var(--yellow);margin-top:16px}.fund aside>p{display:flex;justify-content:space-between;color:#d4dfec;font-size:14px}.fund aside p b{color:white}.fund aside hr{border:0;border-top:1px solid rgba(255,255,255,.18);margin:22px 0}.event-bg{background:#fff9e8}.event-card{background:white;border:1px solid #f0e3ba;border-radius:28px;padding:45px;display:grid;grid-template-columns:120px 1fr;gap:35px;align-items:center}.trophy{width:100px;height:100px;border-radius:26px;background:var(--yellow);display:grid;place-items:center;font-size:50px}.join{padding:80px 0}.join-card{background:linear-gradient(135deg,var(--navy),#103d76);color:white;border-radius:32px;padding:50px 55px;display:grid;grid-template-columns:1fr auto;align-items:center;gap:50px}.join-card .kicker{color:#ffd75d}.join-card h2{font-size:42px;margin:10px 0}.join-card p{color:#c9d6e6;line-height:1.7}.join-side{text-align:center;display:grid;gap:10px;justify-items:center}.join-side img{width:74px;height:74px;object-fit:contain}.join-side small{max-width:260px;color:#aebed2}
footer{background:var(--navy);color:white}.footer{min-height:120px;display:flex;align-items:center;justify-content:space-between}.footer b{font-size:18px}.footer em{font-style:normal;color:var(--yellow)}.footer small{display:block;margin-top:6px;color:#c8d3e2}.footer p{color:#c8d3e2}
.qr-modal{position:fixed;inset:0;z-index:100;display:none;place-items:center;padding:20px}.qr-modal.open{display:grid}.qr-backdrop{position:absolute;inset:0;background:rgba(4,20,45,.76);backdrop-filter:blur(8px)}.qr-dialog{position:relative;z-index:1;width:min(430px,100%);background:white;border-radius:26px;padding:32px;text-align:center}.qr-close{position:absolute;right:14px;top:12px;border:0;width:38px;height:38px;border-radius:50%;font-size:25px}.modal-bird{width:64px;height:64px;object-fit:contain}.qr-dialog h2{color:var(--navy)}.qr-dialog p{color:var(--muted);line-height:1.6}.qr-image{width:min(300px,90%);aspect-ratio:1;object-fit:cover;border-radius:16px;border:1px solid var(--line)}body.modal-open{overflow:hidden}
@media(max-width:980px){.shell{width:min(100% - 36px,1360px)}.nav-links{display:none;position:absolute;left:0;right:0;top:84px;background:white;padding:24px;flex-direction:column;align-items:flex-start;border-bottom:1px solid var(--line)}.nav-links.open{display:flex}.menu{display:block}.hero-grid{grid-template-columns:1fr;min-height:auto;padding-top:55px}.hero-visual{height:480px}.hero-logo{width:min(390px,70%)}.scribble.one{right:6%}.scribble.two{right:5%}.value-grid{grid-template-columns:repeat(2,1fr);gap:20px}.value:nth-child(2){border-right:0}.section-intro,.fund,.join-card{grid-template-columns:1fr;gap:40px}.cards{grid-template-columns:1fr}.steps{grid-template-columns:1fr;border-top:0;border-left:2px solid var(--navy);margin-left:18px}.steps div{padding:0 0 28px 30px}.steps i{margin:0 0 0 -49px;float:left}.section-title{display:block}.hand{text-align:left}.event-card{grid-template-columns:1fr}.join-side{justify-items:start;text-align:left}.footer{padding:28px 0;gap:20px;flex-direction:column;align-items:flex-start;justify-content:center}}
@media(max-width:560px){.site-header,.nav{height:92px}.brand{width:250px;height:78px}.brand img{width:100%;max-width:250px;max-height:76px;object-fit:contain;object-position:left center}.menu{font-size:30px;line-height:1;width:44px;height:44px;display:grid;place-items:center}.nav-links{top:92px}.hero-grid{padding-top:38px}.hero h1{font-size:50px}.cn-lead{font-size:20px}.hero-actions{flex-direction:column}.hero-visual{height:390px}.hero-logo{width:min(320px,82%);max-height:350px}.scribble.one{font-size:15px;right:0}.scribble.two{font-size:14px;right:0}.value-grid{grid-template-columns:1fr 1fr}.value{padding:0 8px;gap:10px}.value-icon{width:48px;height:48px;font-size:20px}.value b{font-size:16px}.value small{font-size:12px}.section{padding:68px 0}.section h2{font-size:38px}.join-card{padding:34px 26px}.join-card h2{font-size:34px}.event-card{padding:30px}.footer p{margin:0}}


/* V6.2: robust CSS-only mobile navigation */
.nav-toggle,.mobile-nav-backdrop{display:none}

@media(max-width:980px){
  .nav{position:relative}
  .menu{
    display:flex;
    width:48px;
    height:48px;
    padding:11px 9px;
    flex-direction:column;
    justify-content:center;
    gap:6px;
    cursor:pointer;
    position:relative;
    z-index:82;
    border-radius:12px;
    -webkit-tap-highlight-color:transparent;
    touch-action:manipulation;
  }
  .menu span{
    display:block;
    width:28px;
    height:3px;
    border-radius:3px;
    background:var(--navy);
    transition:transform .22s ease,opacity .18s ease;
  }
  .nav-toggle:checked + .menu span:nth-child(1){transform:translateY(9px) rotate(45deg)}
  .nav-toggle:checked + .menu span:nth-child(2){opacity:0}
  .nav-toggle:checked + .menu span:nth-child(3){transform:translateY(-9px) rotate(-45deg)}

  .mobile-nav-backdrop{
    position:fixed;
    inset:0;
    z-index:70;
    background:rgba(4,20,45,.42);
    backdrop-filter:blur(3px);
  }
  .nav-toggle:checked ~ .mobile-nav-backdrop{display:block}

  .nav-links{
    display:flex;
    position:fixed;
    z-index:80;
    top:84px;
    left:auto;
    right:16px;
    width:min(360px,calc(100vw - 32px));
    max-height:calc(100vh - 110px);
    overflow:auto;
    padding:14px;
    flex-direction:column;
    align-items:stretch;
    gap:4px;
    background:white;
    border:1px solid var(--line);
    border-radius:18px;
    box-shadow:0 22px 60px rgba(4,28,62,.2);
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateY(-10px) scale(.98);
    transform-origin:top right;
    transition:opacity .18s ease,transform .18s ease,visibility .18s;
  }
  .nav-toggle:checked ~ .nav-links{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:none;
  }
  .nav-links a{
    width:100%;
    padding:14px 16px;
    border-radius:11px;
    font-size:16px;
  }
  .nav-links a:not(.join-nav):active{background:#f3f7fb}
  .join-nav{text-align:center;margin-top:4px}
}

@media(max-width:560px){
  .site-header,.nav{height:92px}
  .brand{width:min(270px,calc(100vw - 92px));height:80px}
  .brand img{width:100%;max-width:270px;max-height:78px;object-fit:contain;object-position:left center}
  .nav-links{top:100px;right:12px;width:calc(100vw - 24px)}
}


/* V6.3 — iPhone Safari / WeChat WebView mobile compatibility */
html{
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}
body{
  min-width:0;
  overflow-x:hidden;
}
img{max-width:100%}

/* Keep the header visually consistent across iOS browsers. */
@media(max-width:560px){
  .site-header{
    height:88px;
    min-height:88px;
  }
  .nav{
    height:88px;
    min-height:88px;
    width:100%;
    padding-left:18px;
    padding-right:14px;
    box-sizing:border-box;
  }
  .brand{
    width:min(245px,calc(100vw - 88px));
    height:72px;
    flex:0 1 auto;
    overflow:hidden;
  }
  .brand img{
    display:block;
    width:auto;
    height:auto;
    max-width:100%;
    max-height:70px;
    object-fit:contain;
    object-position:left center;
  }
  .menu{
    flex:0 0 48px;
    width:48px;
    height:48px;
    margin-left:auto;
  }
  .nav-links{
    top:96px;
  }
}

/* Very narrow iPhones: preserve menu room without shrinking the whole page. */
@media(max-width:390px){
  .nav{padding-left:14px;padding-right:10px}
  .brand{width:calc(100vw - 82px)}
}
