@charset "UTF-8";
:root { --green:#00c9a0; --yellow:#ffd900; --muted:#8d9995; --bg:#020b09; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--bg); color:#fff; font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",Arial,sans-serif; }
a { color:inherit; text-decoration:none; }
.site-shell { min-height:100vh; overflow:hidden; background:#020b09 url("images/bg@2x.png") center top / cover no-repeat; }
.hero { min-height:600px; max-width:1440px; margin:auto; padding:32px 7.2% 0; }
.topbar { display:flex; align-items:center; justify-content:space-between; position:relative; z-index:2; }
.brand { color:#cad3d0; font-size:14px; letter-spacing:.02em; }
.brand-mark { color:#4ef3c5; font-size:20px; vertical-align:-1px; margin-right:3px; }
.top-cta {  color:#ffffff; padding:7px 22px; font-size:14px; transition:.2s; background:#1A1A1A; }
.top-cta:hover,.download-btn:hover { background:var(--green); color:#00110d; }
.hero-content { min-height:550px; display:flex; align-items:center; position:relative; }
.hero-copy { position:relative; z-index:1; padding-bottom:12px; }
.eyebrow { width:45px; height:2px; display:block; margin-bottom:18px; background:linear-gradient(90deg, #000000 0%, #0cc298 100%); }
h1 { margin:0; color:var(--yellow); font-size:38px; line-height:1.25; font-weight:800; letter-spacing:.02em; }
.hero-copy p { margin:10px 0 42px; color:#ffffffcc; font-size:16px; }
.hero-copy h1{
  color:#ffffff;
   font-family: "PingFang SC";
}
.hero_ptwo{
  display:none;
}

/* Hero 文字从左到右淡出动画 */
.hero-copy h1 {
  opacity: 0;
  animation: fadeLeft .9s cubic-bezier(.22,.61,.36,1) .2s forwards;
}
.hero_pone {
  opacity: 0;
  animation: fadeLeft .9s cubic-bezier(.22,.61,.36,1) .5s forwards;
}
@keyframes fadeLeft {
  from { opacity: 0; transform: translateX(-30px); }
  to   { opacity: 1; transform: translateX(0); }
}
  .download-btn { display:flex;align-items:center;  width:140px; height:40px; align-items:center; justify-content:center;  border:0; font-size:18px; font-weight:500; }
  .download-btn:first-child { background:#ffffff; color:#000000;}
  .download-btn:last-child { background:#00855C; color:#ffffff; }
  .download-btn img{
    width:21px;margin-right:6px;
  }
.hero_imges{
  width:60px;
  border-radius:10px;
  margin-bottom:20px
}
.download-actions { display:flex; gap:28px; }
.download-btn { color:var(--green); padding:8px 20px; font-size:15px; transition:.2s; }

.hero-art { width:min(57vw, 780px); height:auto; position:absolute; right:-8%; top:50%; transform:translateY(-48%); mix-blend-mode:screen; }
.features { max-width:1200px; margin:0 auto; padding:70px 38px 130px; }
.section-heading { display:flex; justify-content:center; align-items:center; gap:10px; margin-bottom:92px; font-size:29px; font-weight:300; white-space:nowrap; }
.section-heading i { display:block; width:60px; height:2px; background:#fff; transform:scaleX(0); transform-origin:right center; }
.section-heading b { color:var(--yellow); font-weight:500; }
.section-heading i:last-child { background:var(--green); width:44px; transform-origin:left center; }
.section-heading span { opacity:0; transform:translateY(18px); }

/* 标题滚动入场 */
.section-heading.is-visible span {
  animation: headingTextIn .75s cubic-bezier(.22,.61,.36,1) .15s forwards;
}
.section-heading.is-visible i {
  animation: headingLineIn .65s cubic-bezier(.22,.61,.36,1) forwards;
}
.section-heading.is-visible i:last-child {
  animation-delay: .08s;
}
.section-heading.is-visible b {
  animation: headingBrandPulse 1.6s ease .9s;
}

@keyframes headingTextIn {
  from { opacity:0; transform:translateY(18px); }
  to   { opacity:1; transform:translateY(0); }
}
@keyframes headingLineIn {
  from { transform:scaleX(0); }
  to   { transform:scaleX(1); }
}
@keyframes headingBrandPulse {
  0%, 100% { text-shadow:none; }
  40% { text-shadow:0 0 18px rgba(255,217,0,.55); }
}
.feature-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:75px 80px; text-align:center; }
.feature {
  padding:24px 16px; border-radius:12px;
  transition:transform .35s ease, box-shadow .35s ease, background .35s ease, border-color .35s ease;
  border:1px solid rgba(255,255,255,.06);
  position:relative; overflow:hidden;
  opacity:0; transform:translateY(40px);
}
.feature img { width:80px; height:80px; display:block; margin:0 auto 18px; transition:transform .4s ease; }
.feature h3 { margin:0 0 7px; font-size:18px; font-weight:600; transition:color .3s ease; }
.feature p { margin:0; color:#8d9693; font-size:14px; transition:color .3s ease; }

/* 滚动进入动画 */
.feature.is-visible { animation:featureIn .7s cubic-bezier(.22,.61,.36,1) forwards; }
.feature.is-visible:nth-child(1) { animation-delay:.05s; }
.feature.is-visible:nth-child(2) { animation-delay:.15s; }
.feature.is-visible:nth-child(3) { animation-delay:.25s; }
.feature.is-visible:nth-child(4) { animation-delay:.35s; }
.feature.is-visible:nth-child(5) { animation-delay:.45s; }
.feature.is-visible:nth-child(6) { animation-delay:.55s; }

@keyframes featureIn {
  from { opacity:0; transform:translateY(40px); }
  to   { opacity:1; transform:translateY(0); }
}

/* 鼠标悬停动画 */
.feature:hover {
  transform:translateY(-8px) scale(1.03);
  box-shadow:0 16px 40px rgba(0,201,160,.18), 0 0 0 1px rgba(0,201,160,.35);
  background:linear-gradient(160deg, rgba(0,201,160,.08), rgba(255,217,0,.04));
  border-color:rgba(0,201,160,.45);
}
.feature:hover img { transform:scale(1.12) rotate(-3deg); }
.feature:hover h3 { color:var(--green); }
.feature:hover p { color:#c9d3d0; }
.footer { border-top:1px solid rgba(255,255,255,.12); max-width:1440px; margin:auto; padding:76px 7.2% 50px; color:#89928f; font-size:14px; }
.footer-columns { display:grid; grid-template-columns:1fr 1fr 1fr; gap:30px; }
.footer h4 { margin:0 0 18px; color:#fff; font-size:15px; font-weight:600; }
.footer a { display:block; margin:0 0 15px; }
.footer-bottom { display:flex; justify-content:space-between; gap:30px; margin-top:80px; font-size:12px; }
/* 移动端显示 */
@media (max-width: 760px) {
  .hero_imges{
    display:none;
  }
  .hero_ptwo{
    display:none;
  }
  .site-shell { background-size:auto 100%; background-position:center top; }
  .hero { min-height:1080px; padding:26px 32px 0; }
  .topbar { justify-content:center; }
  .brand { font-size:14px; color:#e8eeec; }
  .top-cta { display:none; }
  .hero-content { min-height:990px; display:block; padding-top:40px; }
  .hero-art { width:calc(100vw + 12px); max-width:none; right:50%; top:95px; transform:translateX(50%); }
  .hero-copy { padding-top:285px; text-align:center; }
  .eyebrow { display:none; }
  h1{
        color: #fff;
        font-size: 23px;
        letter-spacing: .13em;
        text-shadow: 0 2px 0 rgba(0, 0, 0, .3);
  }
  /* h1 { color:#fff; font-size:27px; line-height:1.25; white-space:nowrap; letter-spacing:.1em; transform:scaleX(.82); transform-origin:center; text-shadow:0 2px 0 rgba(0,0,0,.3); } */
  /* h1::before { content:"✦"; color:#18e8bd; font-size:25px; margin-right:2px; vertical-align:8px; } */
  .hero-copy p { margin:17px 0 80px; font-size:14px; color:#bfc7c4; text-align:center; }
  .download-actions { display:block; }
  .download-btn { display:flex;align-items:center;  width:calc(100vw - 32px); height:52px; align-items:center; justify-content:center; margin:0 0 20px -16px; border:0; font-size:18px; font-weight:500; }
  .download-btn:first-child { background:#ffffff; color:#000000;font-weight:600; }
  .download-btn:last-child { background:#00855C; color:#ffffff;font-weight:600; }
  .download-btn img{
    width:21px;margin-right:6px;
  }
  .features,.footer { display:none; }
}
@media (min-width:761px) and (max-width:1000px) { h1 { font-size:30px; } .hero-art { right:-20%; width:65vw; } .feature-grid { gap:55px 25px; } }

/* 微信内打开引导遮罩 */
.wx-guide { position:fixed; inset:0; z-index:9999; }
.wx-guide-mask { position:absolute; inset:0; background:rgba(0,0,0,.85); }
.wx-guide-content {
  position:relative; z-index:1;
  margin:15% auto 0; max-width:300px; text-align:center;
  padding:40px 24px 32px;
}
.wx-guide-tip {
  color:#fff; font-size:18px; line-height:1.8; margin:0 0 20px;
}
.wx-guide-tip b { color:var(--yellow); font-size:22px; }
.wx-guide-sub { color:#a2aaa7; font-size:15px; margin:0; }

@media (max-width:760px) {
  .wx-guide-content { margin:25% auto 0; padding:32px 20px; }
  .wx-guide-tip { font-size:17px; }
  .wx-guide-tip b { font-size:20px; }
  .wx-guide-sub { font-size:14px; }
}

/* Toast 提示 */
.toast {
  position:fixed; top:50%; left:50%; transform:translate(-50%,-50%);
  background:rgba(0,0,0,.85); color:#fff; padding:14px 24px;
  border-radius:8px; font-size:14px; z-index:10000;
  pointer-events:none; white-space:nowrap;
  animation:toast-in .2s ease-out;
}
@keyframes toast-in {
  from { opacity:0; transform:translate(-50%,-40%); }
  to { opacity:1; transform:translate(-50%,-50%); }
}