*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Microsoft YaHei',Arial,sans-serif;background:#ffffff;color:#222222;line-height:1.8}
.container{max-width:1200px;margin:0 auto;padding:0 20px}

/* 黑灰主色体系，绿色只做点缀 */
:root{
  --main:#111111;
  --strong:#000000;
  --accent:#03b752;
  --accent-dark:#028f40;
  --text-main:#222222;
  --text-light:#666666;
  --border:#e6e6e6;
}

header{background:#ffffff;border-bottom:1px solid #d9d9d9;padding:15px 0;position:sticky;top:0;z-index:100}
.header-content{display:flex;justify-content:space-between;align-items:center}
.logo{display:flex;align-items:center;gap:12px}
.logo img{height:45px;width:auto}
.logo-text{font-size:24px;font-weight:700;color:#fff}
nav{display:flex;gap:25px}
nav a{color:var(--text-main);text-decoration:none;font-weight:500;transition:.3s}
nav a:hover{color:var(--accent)}
.banner{padding:60px 0;background:#ffffff}
.banner-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.banner-content h1{font-size:42px;color:#029c4a;margin-bottom:20px;font-weight:700}
.banner-desc{font-size:18px;color:var(--text-main);margin-bottom:30px;line-height:1.9}
.features-list{margin:25px 0}
.features-list li{padding:10px 0;font-size:16px;color:var(--text-main);list-style:none;padding-left:25px;position:relative}
.features-list li:before{content:'✓';position:absolute;left:0;color:var(--accent);font-weight:700}
.btn-group{display:flex;gap:20px;margin-top:30px}
.btn{padding:15px 35px;border:none;border-radius:6px;font-size:16px;font-weight:600;cursor:pointer;transition:.3s;text-decoration:none;display:inline-block}
.btn-primary{background:var(--main);color:#ffffff;box-shadow:0 4px 12px rgba(0,0,0,.15)}
.btn-primary:hover{background:var(--accent);transform:translateY(-2px)}
.btn-secondary{background:#ffffff;color:var(--main);border:2px solid var(--main)}
.btn-secondary:hover{background:var(--main);color:#ffffff}
.banner-image img{width:100%;height:auto;border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,.08)}
.section{padding:60px 0;background:#ffffff}
.section-title{font-size:32px;color:var(--strong);text-align:center;margin-bottom:40px;font-weight:700}
.intro-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:25px}
.intro-card{background:#ffffff;padding:30px 20px;border-radius:8px;text-align:center;border:1px solid var(--border);transition:.3s}
.intro-card:hover{border-color:var(--main);transform:translateY(-5px);box-shadow:0 4px 16px rgba(0,0,0,.08)}
.intro-card h3{font-size:20px;color:var(--strong);margin:15px 0;font-weight:600}
.intro-card p{font-size:14px;color:var(--text-light)}
.number{font-size:36px;font-weight:700;color:#333}
.content-section{background:#ffffff;padding:50px;border-radius:8px;margin:30px 0;border:1px solid var(--border)}
.content-section h2{font-size:28px;color:var(--strong);margin-bottom:25px}
.content-section p{margin-bottom:15px;color:var(--text-main)}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.two-col img{width:100%;border-radius:8px;box-shadow:0 4px 16px rgba(0,0,0,.06)}
.list-section ol,.list-section ul{margin-left:20px}
.list-section li{margin:12px 0;color:var(--text-main)}
table{width:100%;border-collapse:collapse;margin:30px 0;background:#ffffff;border:1px solid var(--border)}
table th{background:var(--main);color:#ffffff;padding:15px;text-align:left;font-weight:600}
table td{padding:12px 15px;border-bottom:1px solid var(--border);color:var(--text-main)}
table tr:hover{background:#f7f7f7}
.faq-item{background:#ffffff;padding:25px;margin:15px 0;border-radius:8px;box-shadow:0 2px 10px rgba(0,0,0,.04)}
.faq-item h3{color:var(--strong);margin-bottom:10px;font-size:20px}
.faq-item p{color:var(--text-main)}
footer{background:var(--main);color:#ffffff;padding:40px 0;margin-top:60px}
.footer-content{text-align:center}
.footer-buttons{display:flex;justify-content:center;gap:15px;margin:20px 0;flex-wrap:wrap}
.footer-btn{background:transparent;border:1px solid #ffffff;color:#ffffff;padding:8px 20px;border-radius:4px;cursor:pointer;font-size:14px}
.footer-info{margin-top:25px;font-size:14px;line-height:2;color:#dddddd}
.back-top{position:fixed;bottom:30px;right:30px;background:var(--main);color:#ffffff;width:50px;height:50px;border-radius:50%;display:none;align-items:center;justify-content:center;cursor:pointer;font-size:20px;box-shadow:0 4px 12px rgba(0,0,0,.15)}
.back-top:hover{background:var(--accent)}

/* 用户评价板块 */
.review-grid{
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap:24px;
}
.review-card{
  background:#ffffff;
  border:1px solid var(--border);
  border-radius:10px;
  padding:24px;
  transition:0.3s;
}
.review-card:hover{
  border-color:var(--main);
  box-shadow:0 4px 18px rgba(0,0,0,.07);
}
.review-header{
  display:flex;
  align-items:center;
  gap:14px;
  margin-bottom:16px;
}
.review-avatar{
  width:56px;
  height:56px;
  border-radius:50%;
  object-fit:cover;
  border:2px solid var(--border);
}
.review-name{
  font-weight:600;
  font-size:16px;
  color:var(--strong);
}
.review-tag{
  font-size:13px;
  color:var(--accent);
  margin-top:4px;
}
.review-star{
  color:#ffb400;
  margin-bottom:12px;
}
.review-text{
  font-size:15px;
  color:var(--text-main);
  line-height:1.7;
}

@media(max-width:768px){
.banner-grid,.two-col{grid-template-columns:1fr}
.intro-grid{grid-template-columns:1fr}
.review-grid{grid-template-columns:1fr}
nav{display:none}
.banner-content h1{font-size:28px}
.btn-group{flex-direction:column}
}