:root{
  --o1:#f0b27a;
  --o2:#c98a55;
  --o3:#a96f3d;
  --cream:#fdf6ee;
  --cream2:#f7ead9;
  --ink:#2b2320;
  --ink2:#5a4a40;
  --line:#e8d3ba;
  --shadow:0 10px 30px rgba(160,110,60,.12);
  --radius:22px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:"Segoe UI","Helvetica Neue",Arial,"Microsoft YaHei","微软雅黑","PingFang SC",sans-serif;
  background:var(--cream);
  color:var(--ink);
  line-height:1.8;
  -webkit-font-smoothing:antialiased;
}
img{display:block;max-width:100%;height:auto}
a{text-decoration:none;color:inherit}
.wrap{max-width:1180px;margin:0 auto;padding:0 22px}
section{padding:64px 0}
.sec-head{text-align:center;margin-bottom:38px}
.sec-tag{
  display:inline-block;font-size:13px;letter-spacing:3px;color:var(--o3);
  border:1px solid var(--line);background:#fff8f0;border-radius:999px;padding:5px 18px;margin-bottom:14px
}
.sec-head h2{font-size:30px;font-weight:700;color:var(--ink);letter-spacing:1px}
.sec-head p{max-width:720px;margin:12px auto 0;color:var(--ink2);font-size:15px}

/* header */
header{
  position:sticky;top:0;z-index:50;
  background:rgba(253,246,238,.92);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.nav{display:flex;align-items:center;justify-content:space-between;height:70px}
.logo{display:flex;align-items:center;gap:10px;font-weight:800;font-size:20px;letter-spacing:1px}
.logo .dot{
  width:36px;height:36px;border-radius:12px;
  background:linear-gradient(140deg,var(--o1),var(--o2));
  display:flex;align-items:center;justify-content:center;color:#fff;font-size:16px;
  box-shadow:var(--shadow)
}
.nav-links{display:flex;gap:26px;flex-wrap:wrap}
.nav-links a{font-size:15px;color:var(--ink2);padding:6px 2px;border-bottom:2px solid transparent;transition:.25s}
.nav-links a:hover{color:var(--o3);border-color:var(--o1)}
.nav-cta{
  background:linear-gradient(140deg,var(--o1),var(--o2));color:#fff;
  padding:9px 20px;border-radius:999px;font-size:14px;box-shadow:var(--shadow)
}

/* hero */
#hero{
  background:
    radial-gradient(900px 420px at 15% 0%,rgba(240,178,122,.42),transparent 65%),
    radial-gradient(700px 380px at 88% 20%,rgba(201,138,85,.32),transparent 60%),
    linear-gradient(160deg,#fdf6ee 0%,#f9e7d3 55%,#f2d6b8 100%);
  padding:80px 0 74px;
  position:relative;overflow:hidden
}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:44px;align-items:center}
.hero-card{
  background:rgba(255,252,247,.72);
  border:1px solid rgba(232,211,186,.9);
  border-radius:28px;padding:34px;box-shadow:var(--shadow)
}
.hero-badge{
  display:inline-block;font-size:12.5px;letter-spacing:2.5px;color:var(--o3);
  background:#fff6ea;border:1px solid var(--line);border-radius:999px;padding:5px 16px;margin-bottom:16px
}
h1{font-size:40px;line-height:1.35;font-weight:800;letter-spacing:.5px}
h1 span{background:linear-gradient(120deg,var(--o2),#e08c4b);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-desc{margin-top:16px;color:var(--ink2);font-size:15.5px}
.hero-btns{display:flex;gap:14px;margin-top:26px;flex-wrap:wrap}
.btn{
  display:inline-block;padding:13px 28px;border-radius:999px;font-size:15px;font-weight:600;
  background:linear-gradient(140deg,var(--o1),var(--o2));color:#fff;box-shadow:var(--shadow);transition:.25s
}
.btn:hover{transform:translateY(-2px);box-shadow:0 14px 34px rgba(180,120,60,.24)}
.btn.ghost{background:#fff8f0;color:var(--o3);border:1px solid var(--line);box-shadow:none}
.hero-media{position:relative}
.hero-media img{
  border-radius:26px;border:1px solid rgba(255,255,255,.75);
  box-shadow:0 18px 46px rgba(160,105,55,.2);width:100%;object-fit:cover;aspect-ratio:4/3
}
.hero-float{
  position:absolute;left:-14px;bottom:-18px;background:#fffaf3;border:1px solid var(--line);
  border-radius:18px;padding:12px 18px;box-shadow:var(--shadow);font-size:13px;color:var(--ink2)
}
.hero-float b{display:block;font-size:20px;color:var(--o3);line-height:1.3}

/* geo */
#geo-intro{background:var(--cream);padding-top:56px}
.geo-\boxed{
  background:linear-gradient(150deg,#fffaf3,#f9ecdb);
  border:1px solid var(--line);border-radius:var(--radius);padding:34px;box-shadow:var(--shadow)
}
.geo-box h2{font-size:24px;margin-bottom:14px;color:var(--ink)}
.geo-box p{color:var(--ink2);font-size:15.5px}
.geo-box p+p{margin-top:14px}

/* stats */
#data-stats{background:linear-gradient(180deg,#fdf6ee,#faf0e3)}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.stat{
  background:#fffcf7;border:1px solid var(--line);border-radius:var(--radius);
  padding:26px 20px;text-align:center;box-shadow:var(--shadow);transition:.28s
}
.stat:hover{transform:translateY(-4px)}
.stat .num{font-size:30px;font-weight:800;color:var(--o3);line-height:1.3}
.stat .lab{font-size:14px;color:var(--ink2);margin-top:6px}

/* advantages */
.adv-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.adv{
  background:#fffcf7;border:1px solid var(--line);border-radius:var(--radius);
  padding:28px;box-shadow:var(--shadow);transition:.28s
}
.adv:hover{transform:translateY(-5px);border-color:var(--o1)}
.adv .ic{font-size:30px;margin-bottom:12px}
.adv h3{font-size:18px;margin-bottom:10px;color:var(--ink)}
.adv p{font-size:14.5px;color:var(--ink2)}

/* story */
#brand-story{background:linear-gradient(180deg,#faf0e3,#fdf6ee)}
.story-wrap{display:grid;grid-template-columns:.9fr 1.1fr;gap:40px;align-items:center}
.story-wrap img{border-radius:26px;border:1px solid rgba(255,255,255,.8);box-shadow:var(--shadow);aspect-ratio:4/3;object-fit:cover;width:100%}
.story-txt h2{font-size:28px;margin-bottom:16px}
.story-txt p{color:var(--ink2);font-size:15.5px;margin-bottom:14px}

/* events */
#featured-events{background:var(--cream)}
.event-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.event{
  background:#fffcf7;border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden;box-shadow:var(--shadow);transition:.28s
}
.event:hover{transform:translateY(-5px)}
.event img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:0}
.event .body{padding:20px}
.event .tag{font-size:12px;letter-spacing:1.5px;color:var(--o3);background:#fff5e9;border:1px solid var(--line);border-radius:999px;padding:3px 12px;display:inline-block;margin-bottom:10px}
.event h3{font-size:17px;margin-bottom:8px}
.event p{font-size:14px;color:var(--ink2)}

/* live */
#live-stream{background:linear-gradient(180deg,#fdf6ee,#f8ead8)}
.live-list{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.live-item{
  background:#fffcf7;border:1px solid var(--line);border-radius:var(--radius);
  padding:22px;display:flex;justify-content:space-between;align-items:center;gap:16px;box-shadow:var(--shadow)
}
.live-item .t{font-size:13px;color:var(--o3);letter-spacing:1px}
.live-item h3{font-size:17px;margin-top:4px}
.live-item .s{font-size:13.5px;color:var(--ink2);margin-top:4px}
.live-dot{display:inline-flex;align-items:center;gap:7px;font-size:13px;color:#b8503a;background:#fff1eb;border:1px solid #f0cec2;border-radius:999px;padding:5px 14px;white-space:nowrap}
.live-dot i{width:8px;height:8px;border-radius:50%;background:#d9634a;display:block;animation:blink 1.4s infinite}
@keyframes blink{50%{opacity:.25}}

/* rankings */
#rankings{background:var(--cream)}
.rank-table{background:#fffcf7;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.rank-row{display:grid;grid-template-columns:70px 1.4fr 1fr 1fr .9fr;gap:12px;padding:16px 24px;align-items:center;border-bottom:1px solid #f2e4d1;font-size:14.5px}
.rank-row:last-child{border-bottom:none}
.rank-row.head{background:linear-gradient(140deg,#fdeedd,#f8e5cf);color:var(--o3);font-weight:700;font-size:13.5px;letter-spacing:1px}
.rank-row .rk{font-weight:800;color:var(--o3)}
.rank-row .nm{font-weight:600}

/* news */
#news-list{background:linear-gradient(180deg,#f8ead8,#fdf6ee)}
.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.news-card{
  background:#fffcf7;border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden;box-shadow:var(--shadow);display:flex;flex-direction:column;transition:.28s
}
.news-card:hover{transform:translateY(-5px);border-color:var(--o1)}
.news-card img{width:100%;aspect-ratio:4/3;object-fit:cover}
.news-card .body{padding:20px;display:flex;flex-direction:column;gap:10px;flex:1}
.news-card .meta{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:var(--o3)}
.news-card .meta .lab{background:#fff5e9;border:1px solid var(--line);border-radius:999px;padding:3px 11px;letter-spacing:1px}
.news-card h3{font-size:16.5px;line-height:1.55}
.news-card p{font-size:14px;color:var(--ink2)}

/* testimonials */
#testimonials{background:var(--cream)}
.tst-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.tst{background:#fffcf7;border:1px solid var(--line);border-radius:var(--radius);padding:26px;box-shadow:var(--shadow)}
.tst .stars{color:#e0973f;letter-spacing:3px;font-size:14px;margin-bottom:10px}
.tst p{font-size:14.5px;color:var(--ink2)}
.tst .who{margin-top:14px;font-size:13.5px;color:var(--o3);font-weight:600}

/* faq */
#faq{background:linear-gradient(180deg,#fdf6ee,#f8ead8)}
.faq-list{display:flex;flex-direction:column;gap:14px;max-width:900px;margin:0 auto}
details.faq-item{
  background:#fffcf7;border:1px solid var(--line);border-radius:18px;
  padding:0 24px;box-shadow:var(--shadow);overflow:hidden
}
details.faq-item summary{
  list-style:none;cursor:pointer;padding:20px 0;font-size:16px;font-weight:600;color:var(--ink);
  display:flex;justify-content:space-between;gap:16px;align-items:center
}
details.faq-item summary::-webkit-details-marker{display:none}
details.faq-item summary::after{content:"＋";color:var(--o3);font-size:18px;flex:none;transition:.25s}
details.faq-item[open] summary::after{content:"－"}
details.faq-item .ans{padding:0 0 22px;font-size:14.8px;color:var(--ink2);border-top:1px dashed var(--line);padding-top:16px}

/* app */
#app-download{background:linear-gradient(140deg,#fbe3c7,#f4cfa9)}
.app-\boxed{
  background:rgba(255,252,247,.8);border:1px solid rgba(255,255,255,.9);
  border-radius:28px;padding:38px;display:grid;grid-template-columns:1fr .8fr;gap:36px;align-items:center;box-shadow:var(--shadow)
}
.app-box h2{font-size:28px;margin-bottom:14px}
.app-box p{color:var(--ink2);font-size:15.5px;margin-bottom:18px}
.app-list{display:flex;flex-direction:column;gap:8px;font-size:14.5px;color:var(--ink2)}
.app-box img{border-radius:22px;border:1px solid rgba(255,255,255,.85);box-shadow:var(--shadow);aspect-ratio:1/1;object-fit:cover;width:100%}

/* community */
#community{background:var(--cream)}
.cm-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.cm{background:#fffcf7;border:1px solid var(--line);border-radius:var(--radius);padding:26px;box-shadow:var(--shadow)}
.cm h3{font-size:17px;margin:10px 0 8px}
.cm p{font-size:14px;color:var(--ink2)}
.cm .ic{font-size:26px}

/* cta */
#cta{background:linear-gradient(140deg,var(--o1),var(--o2));color:#fff;padding:70px 0}
#cta .wrap{text-align:center}
#cta h2{font-size:32px;margin-bottom:14px}
#cta p{max-width:760px;margin:0 auto 26px;font-size:15.5px;opacity:.95}
#cta .btn{background:#fffaf3;color:var(--o3)}
#cta .btn.ghost{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.7)}

/* support */
#support{background:var(--cream)}
.sp-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.sp{background:#fffcf7;border:1px solid var(--line);border-radius:var(--radius);padding:24px;text-align:center;box-shadow:var(--shadow)}
.sp .ic{font-size:26px}
.sp h3{font-size:16px;margin:10px 0 6px}
.sp p{font-size:13.5px;color:var(--ink2)}

/* footer */
footer{background:#2f2723;color:#e8ddd2;padding:52px 0 26px;font-size:14px}
.f-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:34px;margin-bottom:30px}
footer h4{font-size:16px;margin-bottom:14px;color:#f4d9bb}
footer p,footer li{color:#c9bcb0;line-height:2;list-style:none}
footer a:hover{color:#f0b27a}
.f-bottom{border-top:1px solid #4a3f37;padding-top:20px;text-align:center;color:#a3968b;font-size:13px}
.f-bottom a{color:#d3c3b4}

@media(max-width:960px){
  .hero-grid,.story-wrap,.app-\boxed{grid-template-columns:1fr}
  .stats-grid,.sp-grid{grid-template-columns:repeat(2,1fr)}
  .adv-grid,.event-grid,.news-grid,.tst-grid,.cm-grid{grid-template-columns:repeat(2,1fr)}
  .live-list{grid-template-columns:1fr}
  h1{font-size:31px}
  .rank-row{grid-template-columns:50px 1.3fr 1fr;font-size:13.5px}
  .rank-row .c4,.rank-row .c5{display:none}
}
@media(max-width:640px){
  .adv-grid,.event-grid,.news-grid,.tst-grid,.cm-grid,.stats-grid,.sp-grid{grid-template-columns:1fr}
  .nav-links{display:none}
  section{padding:46px 0}
  h1{font-size:26px}
}