:root{
  --bg:#fff;
  --ink:#171826;
  --muted:#667085;
  --soft:#f7f8ff;
  --line:rgba(34,38,74,.10);
  --pink:#ff4eb8;
  --blue:#35d7ff;
  --violet:#8b5cff;
  --mint:#34e7b7;
  --shadow:0 24px 70px rgba(61,72,128,.14);
  --radius:28px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",Arial,sans-serif;
  color:var(--ink);
  background:
    radial-gradient(circle at 10% 10%, rgba(255,78,184,.18), transparent 30%),
    radial-gradient(circle at 90% 20%, rgba(53,215,255,.22), transparent 34%),
    linear-gradient(180deg,#fff 0%,#fbfcff 54%,#fff 100%);
  line-height:1.72;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.site-header{
  position:sticky;
  top:0;
  z-index:20;
  background:rgba(255,255,255,.82);
  backdrop-filter:blur(22px);
  border-bottom:1px solid var(--line);
}
.notice-bar{
  padding:.48rem 6vw;
  font-size:.92rem;
  color:#4c526a;
  text-align:center;
  background:linear-gradient(90deg,rgba(255,78,184,.10),rgba(53,215,255,.12),rgba(139,92,255,.10));
}
.nav-shell{
  min-height:76px;
  padding:0 6vw;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1.2rem;
}
.brand-logo{display:inline-flex;align-items:center;gap:.72rem;font-weight:900}
.logo-mark{
  width:48px;height:48px;border-radius:18px;display:grid;place-items:center;
  color:#fff;letter-spacing:-.08em;
  background:linear-gradient(135deg,var(--pink),var(--blue) 55%,var(--violet));
  box-shadow:0 12px 36px rgba(255,78,184,.28);
}
.logo-text{letter-spacing:.02em}
.nav-links{display:flex;align-items:center;gap:.35rem;flex-wrap:wrap;justify-content:flex-end}
.nav-links a{
  padding:.66rem .86rem;
  border-radius:999px;
  font-size:.95rem;
  color:#30364e;
  transition:.25s ease;
}
.nav-links a:hover{background:#fff;box-shadow:0 10px 25px rgba(48,54,78,.10);color:#12162a}
.nav-toggle{display:none;border:0;background:#fff;border-radius:14px;padding:.6rem .78rem;box-shadow:var(--shadow)}
.search-strip{
  padding:0 6vw 1rem;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:.6rem;
}
.search-strip input{
  width:100%;
  border:1px solid var(--line);
  border-radius:20px;
  padding:1rem 1.15rem;
  background:#fff;
  box-shadow:0 12px 34px rgba(61,72,128,.08);
  outline:none;
}
.search-strip input:focus{border-color:rgba(255,78,184,.55);box-shadow:0 0 0 5px rgba(255,78,184,.10)}
.search-strip button,.btn{
  border:0;
  border-radius:20px;
  padding:1rem 1.2rem;
  font-weight:800;
  cursor:pointer;
  background:linear-gradient(135deg,var(--pink),var(--blue));
  color:#fff;
  box-shadow:0 15px 34px rgba(53,215,255,.22);
}
.search-tip{grid-column:1/-1;margin:.1rem 0 0;color:var(--muted);font-size:.9rem}
.hero{
  position:relative;
  overflow:hidden;
  margin:3rem auto 2rem;
  width:min(1180px,88vw);
  border-radius:42px;
  background:#fff;
  box-shadow:var(--shadow);
  isolation:isolate;
}
.hero:before{
  content:"";
  position:absolute;inset:-30%;
  background:
    radial-gradient(circle,rgba(255,78,184,.22),transparent 28%),
    radial-gradient(circle at 70% 30%,rgba(53,215,255,.24),transparent 26%);
  animation:floatGlow 10s linear infinite;
  z-index:-1;
}
@keyframes floatGlow{to{transform:rotate(360deg)}}
.hero-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:2rem;align-items:center;padding:3rem}
.eyebrow{
  display:inline-flex;align-items:center;gap:.45rem;
  padding:.35rem .7rem;border-radius:999px;
  background:rgba(139,92,255,.10);color:#6c42e8;font-weight:800;font-size:.9rem;
}
.hero h1{font-size:clamp(2.2rem,6vw,5.3rem);line-height:.98;margin:1rem 0 .9rem;letter-spacing:-.07em}
.gradient-text{background:linear-gradient(100deg,var(--pink),var(--blue),var(--violet));-webkit-background-clip:text;background-clip:text;color:transparent}
.lead{font-size:1.14rem;color:#485066;max-width:58ch}
.hero-actions{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:1.5rem}
.btn.secondary{background:#fff;color:#24283c;border:1px solid var(--line)}
.hero-media{
  min-height:420px;
  border-radius:34px;
  background:url('/assets/images/hero.webp') center/cover no-repeat;
  position:relative;
  overflow:hidden;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.6),0 30px 90px rgba(139,92,255,.22);
}
.hero-media:after{
  content:"▶";
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:86px;height:86px;border-radius:50%;display:grid;place-items:center;
  color:#fff;font-size:2.1rem;background:rgba(255,78,184,.82);
  box-shadow:0 0 0 18px rgba(255,255,255,.34),0 0 60px rgba(53,215,255,.58);
}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem;margin-top:1.6rem}
.stat{padding:1rem;border:1px solid var(--line);border-radius:22px;background:rgba(255,255,255,.72)}
.stat strong{display:block;font-size:1.35rem}
.section{
  width:min(1180px,88vw);
  margin:2.5rem auto;
  padding:2.1rem;
  border-radius:var(--radius);
  background:rgba(255,255,255,.84);
  box-shadow:var(--shadow);
  border:1px solid var(--line);
}
.section-head{display:flex;align-items:end;justify-content:space-between;gap:1rem;margin-bottom:1.4rem}
.section h2{font-size:clamp(1.55rem,3vw,2.5rem);line-height:1.12;margin:.2rem 0}
.section p{color:#4b536a}
.grid{display:grid;gap:1rem}
.grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid.four{grid-template-columns:repeat(4,minmax(0,1fr))}
.grid.five{grid-template-columns:repeat(5,minmax(0,1fr))}
.mt-1{margin-top:1rem}
.video-card{
  position:relative;
  overflow:hidden;
  min-height:100%;
  border-radius:26px;
  background:#fff;
  border:1px solid var(--line);
  box-shadow:0 16px 44px rgba(61,72,128,.10);
  transition:transform .25s ease,box-shadow .25s ease;
}
.video-card:hover{transform:translateY(-8px);box-shadow:0 26px 70px rgba(255,78,184,.20)}
.video-frame{position:relative;aspect-ratio:16/10;overflow:hidden;background:#eef3ff}
.demo-video,.video-frame img{width:100%;height:100%;object-fit:cover}
.demo-video{display:block}
.play-badge{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(.86);
  width:64px;height:64px;border-radius:50%;display:grid;place-items:center;
  opacity:0;
  color:#fff;background:linear-gradient(135deg,var(--pink),var(--blue));
  box-shadow:0 0 0 16px rgba(255,255,255,.26),0 0 46px rgba(53,215,255,.60);
  transition:.25s ease;
}
.video-card:hover .play-badge{opacity:1;transform:translate(-50%,-50%) scale(1)}
.video-body{padding:1.05rem}
.video-body h3{margin:.2rem 0 .55rem;font-size:1.12rem;line-height:1.35}
.tag{
  display:inline-flex;
  padding:.26rem .58rem;
  border-radius:999px;
  background:rgba(53,215,255,.12);
  color:#1280a2;
  font-size:.82rem;
  font-weight:800;
}
.metrics{display:flex;gap:.72rem;flex-wrap:wrap;color:#6b7280;font-size:.9rem;margin-top:.8rem}
.card{
  border:1px solid var(--line);
  background:linear-gradient(180deg,#fff,rgba(248,250,255,.90));
  border-radius:24px;
  padding:1.15rem;
  min-height:100%;
  box-shadow:0 12px 34px rgba(61,72,128,.08);
}
.card h3{margin:.1rem 0 .5rem}
.topic-stream{display:grid;gap:.7rem}
.barrage{
  padding:.85rem 1rem;
  border-radius:999px;
  background:linear-gradient(90deg,rgba(255,78,184,.10),rgba(53,215,255,.10));
  border:1px solid rgba(255,255,255,.8);
  color:#3e465b;
  animation:softPulse 3.6s ease-in-out infinite;
}
@keyframes softPulse{50%{transform:translateX(8px)}}
.expert{display:flex;gap:1rem;align-items:center}
.expert img{width:82px;height:82px;border-radius:24px;object-fit:cover;border:3px solid #fff;box-shadow:0 12px 30px rgba(61,72,128,.15)}
.review{position:relative}
.review:before{content:"“";position:absolute;right:1rem;top:.5rem;font-size:4rem;line-height:1;color:rgba(255,78,184,.18);font-weight:900}
.logo-wall{display:grid;grid-template-columns:repeat(6,1fr);gap:.8rem}
.partner-logo{
  min-height:74px;
  display:grid;place-items:center;
  border-radius:22px;
  background:linear-gradient(135deg,rgba(255,78,184,.12),rgba(53,215,255,.12));
  border:1px solid var(--line);
  font-weight:900;
  color:#4b5574;
}
.faq details{
  border:1px solid var(--line);
  border-radius:20px;
  background:#fff;
  padding:1rem 1.1rem;
}
.faq details+details{margin-top:.75rem}
.faq summary{cursor:pointer;font-weight:900}
.contact-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:1rem}
.qr-row{display:flex;gap:1rem;flex-wrap:wrap}
.qr-row img{border-radius:24px;border:1px solid var(--line);background:#fff}
.breadcrumb{width:min(1180px,88vw);margin:1.4rem auto 0;color:#697089;font-size:.92rem}
.breadcrumb a{color:#4b74ff}
.content-list{display:grid;gap:1rem}
.content-list article{padding:1.25rem;border-radius:22px;border:1px solid var(--line);background:#fff}
.site-footer{
  margin-top:4rem;
  padding:3rem 6vw;
  color:#3e465b;
  background:
    radial-gradient(circle at 0 0,rgba(255,78,184,.14),transparent 30%),
    radial-gradient(circle at 100% 20%,rgba(53,215,255,.18),transparent 30%),
    #f7f9ff;
  border-top:1px solid var(--line);
}
.footer-grid{display:grid;grid-template-columns:1.4fr .8fr .8fr 1fr;gap:1.2rem}
.footer-grid h2{font-size:1.05rem}
.footer-logo{margin-bottom:1rem}
.footer-links{padding:0;list-style:none;margin:0}
.footer-links li+li{margin-top:.4rem}
.update-time{font-weight:900;color:#12162a}
@media (max-width:980px){
  .nav-toggle{display:inline-flex}
  .nav-links{display:none;position:absolute;left:6vw;right:6vw;top:114px;padding:1rem;background:#fff;border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow)}
  .nav-links.open{display:grid;grid-template-columns:1fr 1fr}
  .hero-grid,.contact-grid{grid-template-columns:1fr}
  .grid.three,.grid.four,.grid.five,.footer-grid{grid-template-columns:1fr 1fr}
  .logo-wall{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:640px){
  .search-strip{grid-template-columns:1fr}
  .hero{width:94vw;margin-top:1.2rem;border-radius:28px}
  .hero-grid{padding:1.3rem}
  .hero-media{min-height:280px}
  .section{width:94vw;padding:1.2rem}
  .grid.three,.grid.four,.grid.five,.footer-grid{grid-template-columns:1fr}
  .stats{grid-template-columns:1fr}
  .nav-links.open{grid-template-columns:1fr;top:108px}
}