/* ===== 动态渐变背景 ===== */
#bg-grad{
  position:fixed; top:0; left:0; width:100%; height:100%;
  background:linear-gradient(-45deg,#1a1a2e,#16213e,#0f0f0f,#2d2d2d);
  background-size:400% 400%;
  animation:gradientShift 15s ease infinite;
  z-index:-2;
}
@keyframes gradientShift{
  0%{background-position:0% 50%;}
  50%{background-position:100% 50%;}
  100%{background-position:0% 50%;}
}

/* ===== 打字机 ===== */
.typewrite{
  border-right:2px solid var(--accent);
  animation:blink 1s infinite;
}
@keyframes blink{50%{border-color:transparent;}}

/* ===== 英雄区 ===== */
.hero{max-width:1200px;margin:0 auto;padding:10rem 2rem 5rem;display:flex;align-items:center;gap:2rem;}
.hero-content{flex:1;}
.hero-title{font-family:'Orbitron',sans-serif;font-size:4rem;line-height:1.1;margin-bottom:.5rem;}
.gradient-text{background:linear-gradient(90deg,var(--accent),#c084fc);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
.hero-subtitle{font-size:1.3rem;color:var(--text-muted);margin-bottom:2rem;}
.hero-stats{display:flex;gap:2rem;margin-bottom:2rem;}
.stat{display:flex;align-items:center;gap:.5rem;color:var(--text-muted);}
.hero-image{flex:1;display:flex;justify-content:center;}
.hero-image img{max-width:100%;border-radius:15px;box-shadow:0 10px 30px rgba(111,66,193,.3);}

/* ===== 悬浮卡片 ===== */
.features{padding:4rem 2rem;max-width:1200px;margin:0 auto;}
.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;}
.feature-card{
  background:rgba(45,45,45,.6);
  border:1px solid rgba(111,66,193,.2);
  border-radius:20px;
  padding:2rem;
  text-align:center;
  backdrop-filter:blur(8px);
  transition:all .3s;
}
.feature-card:hover{
  border-color:var(--accent);
  transform:translateY(-8px);
  box-shadow:0 12px 30px rgba(111,66,193,.4);
}
.feature-card i{font-size:3rem;color:var(--accent);margin-bottom:.8rem;}
.feature-card h3{font-size:1.5rem;margin-bottom:.5rem;}
.feature-card p{color:var(--text-muted);}

/* ===== 服务器状态 ===== */
.server-status{padding:4rem 2rem;max-width:1200px;margin:0 auto;}
.status-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:2rem;}
.status-card{background:rgba(45,45,45,.6);border:1px solid rgba(111,66,193,.2);border-radius:15px;padding:2rem;text-align:center;}
.status-indicator{width:20px;height:20px;border-radius:50%;margin:0 auto 1rem;}
.status-indicator.online{background:var(--success);animation:pulse 2s infinite;}
.status-indicator.maintenance{background:var(--warning);}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(124,58,237,.7);}70%{box-shadow:0 0 0 10px rgba(124,58,237,0);}100%{box-shadow:0 0 0 0 rgba(124,58,237,0);}}
.player-count{display:block;font-size:1.5rem;color:var(--accent);margin-top:.5rem;}

/* ===== 评价 ===== */
.testimonials{padding:4rem 2rem;max-width:1200px;margin:0 auto;}
.testimonials-slider{display:flex;gap:2rem;overflow-x:auto;padding:1rem 0;scroll-snap-type:x mandatory;}
.testimonial{flex:0 0 300px;background:rgba(45,45,45,.6);border:1px solid rgba(111,66,193,.2);border-radius:15px;padding:2rem;text-align:center;scroll-snap-align:start;}
.player-avatar{width:80px;height:80px;border-radius:50%;margin-bottom:1rem;}
.testimonial-text{font-style:italic;color:var(--text-muted);margin-bottom:1rem;}
.player-name{color:var(--accent);font-weight:bold;}

/* ===== 响应式 ===== */
@media(max-width:768px){
  .hero{flex-direction:column;text-align:center;padding:7rem 1rem 3rem;}
  .hero-title{font-size:2.5rem;}
}