/* ===================== */
/* 🌌 背景光晕层 */
/* ===================== */
.hero-section{
  position:relative;
  background:#f8fafc;
  padding:120px 20px;
  overflow:hidden;
  text-align:center;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}

/* 光晕 */
.hero-bg{
  position:absolute;
  top:-200px;
  left:50%;
  transform:translateX(-50%);
  width:900px;
  height:900px;
  background:radial-gradient(circle, rgba(86,184,184,0.25) 0%, rgba(86,184,184,0.08) 40%, transparent 70%);
  filter:blur(60px);
  z-index:0;
}

/* 内容层 */
.hero-container{
  position:relative;
  z-index:1;
  max-width:820px;
  margin:0 auto;
}

/* ===================== */
/* Tag */
/* ===================== */
.hero-tag{
  display:inline-block;
  background:rgba(86,184,184,0.12);
  color:#56B8B8;
  padding:8px 18px;
  border-radius:20px;
  font-size:12px;
  font-weight:600;
  letter-spacing:1px;
  margin-bottom:30px;
}

/* ===================== */
/* 标题 */
/* ===================== */
.hero-title{
  font-size:48px;
  font-weight:800;
  line-height:1.2;
  color:#0f172a;
  margin-bottom:24px;
}

/* 渐变文字（核心） */
.gradient-text{
  background:linear-gradient(90deg, #56B8B8, #7AD3D3);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
}

/* ===================== */
/* 描述 */
/* ===================== */
.hero-desc{
  font-size:18px;
  color:#64748b;
  line-height:1.7;
  margin-bottom:42px;
}

/* ===================== */
/* 按钮 */
/* ===================== */
.hero-actions{
  display:flex;
  justify-content:center;
  gap:16px;
  flex-wrap:wrap;
  margin-bottom:26px;
}

.btn-primary{
  background:#ff7a18;
  color:#fff;
  padding:16px 34px;
  border-radius:40px;
  font-weight:600;
  font-size:16px;
  text-decoration:none;
  box-shadow:0 10px 25px rgba(255,122,24,0.3);
  transition:all .3s;
}

.btn-primary:hover{
  transform:translateY(-3px);
}

.btn-secondary{
  border:1px solid #e2e8f0;
  padding:16px 34px;
  border-radius:40px;
  font-weight:600;
  color:#0f172a;
  background:#fff;
  text-decoration:none;
}

.btn-secondary:hover{
  background:#f1f5f9;
}

/* ===================== */
/* Note */
/* ===================== */
.hero-note{
  font-size:14px;
  color:#94a3b8;
}

/* ===================== */
/* 📱 Mobile */
/* ===================== */
@media (max-width:768px){

  .hero-section{
    padding:80px 20px;
  }

  .hero-title{
    font-size:32px;
  }

  .hero-desc{
    font-size:16px;
  }

  .hero-actions{
    flex-direction:column;
  }

  .btn-primary,
  .btn-secondary{
    width:100%;
  }

}