/* ============================================================
   yidong-seo.css · 移动端SEO优化
   Hero 骨架：H7 圆标+文字（圆形手机图标 + 文字块，横竖线交叉）
   ============================================================ */

/* ---------- Hero H7 圆标+文字 ---------- */
.yd-hero{padding:60px 0 90px;background:linear-gradient(180deg,var(--cream),var(--bg));overflow:hidden}
.yd-hero-x{top:50%;left:0;right:0;opacity:.3}
.yd-hero-v{left:30%;top:10%;bottom:10%;opacity:.15}
.yd-hero-in{display:grid;grid-template-columns:auto 1fr;gap:40px;align-items:center;position:relative;z-index:2}
.yd-hero-icon{
  width:160px;height:160px;border-radius:50%;
  background:var(--green);display:flex;align-items:center;justify-content:center;
  box-shadow:0 0 0 12px rgba(171,224,195,.35),0 0 0 24px rgba(171,224,195,.18);
  flex:none;
}
.yd-phone{width:70px;height:70px;color:var(--ink)}
.yd-hero-text h1{font-size:clamp(28px,3.8vw,44px);font-weight:800;margin:14px 0 18px}
.yd-hero-text h1 em{font-style:normal;color:var(--green-deep)}
.yd-hero-text p{color:var(--muted);font-size:16px;margin-bottom:24px;max-width:560px}
.yd-hero-cta{display:flex;gap:14px;flex-wrap:wrap}

/* ---------- 横向数据条（section 2） ---------- */
.yd-stats{background:var(--white)}
.yd-stats-bar{
  display:grid;grid-template-columns:repeat(4,1fr);
  background:var(--blue);border-radius:var(--r-lg);overflow:hidden;
}
.yd-stat{padding:32px 20px;text-align:center;color:#fff}
.yd-stat b{display:block;font-size:36px;font-weight:800;line-height:1.1}
.yd-stat span{font-size:14px;opacity:.9}
.yd-stat:nth-child(2){background:var(--blue-ink)}
.yd-stat:nth-child(3){background:var(--green-deep);color:var(--ink)}
.yd-stat:nth-child(4){background:var(--yellow);color:var(--ink)}

/* ---------- 编号卡（section 3） ---------- */
.yd-point{background:var(--bg);overflow:hidden}
.yd-point-x{top:50%;left:0;right:0;opacity:.25}
.yd-point-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;position:relative;z-index:2}
.yd-point-card{
  background:var(--white);border:2px solid var(--line);border-radius:var(--r-lg);
  padding:28px 24px;position:relative;
}
.yd-point-no{
  display:inline-block;font-size:32px;font-weight:800;color:var(--blue);
  margin-bottom:8px;opacity:.6;
}
.yd-point-card h3{margin-bottom:8px;font-size:18px}
.yd-point-card p{color:var(--muted);font-size:14.5px}

/* ---------- 对照块（section 4） ---------- */
.yd-rel{background:var(--white)}
.yd-rel-grid{display:grid;grid-template-columns:1fr auto 1fr;gap:22px;align-items:center;max-width:960px;margin:0 auto}
.yd-rel-card{
  background:var(--bg);border:2px solid var(--line);border-radius:var(--r-lg);
  padding:30px 26px;text-align:center;
}
.yd-rel-tag{display:inline-block;padding:5px 16px;border-radius:999px;background:var(--blue);font-size:13px;font-weight:800;margin-bottom:14px}
.yd-tag-green{background:var(--green)}
.yd-rel-card h3{margin-bottom:10px;font-size:19px}
.yd-rel-card p{color:var(--muted);font-size:14.5px}
.yd-rel-hot{border-color:var(--green-deep);background:var(--cream);transform:translateY(14px)}
.yd-rel-vs{
  width:50px;height:50px;border-radius:50%;
  background:var(--yellow);display:flex;align-items:center;justify-content:center;
  font-weight:800;
}
.yd-rel-note{text-align:center;margin-top:30px;color:var(--muted);font-size:15px}

/* ---------- 环形指标（section 5） ---------- */
.yd-vitals{background:var(--bg);overflow:hidden}
.yd-vitals-v{left:40px;top:60px;bottom:60px;opacity:.2}
.yd-vitals-grid{margin-left:50px;display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.yd-vital{text-align:center}
.yd-ring{
  width:130px;height:130px;border-radius:50%;
  background:conic-gradient(var(--green-deep) 0 90%,var(--line) 90% 100%);
  display:flex;align-items:center;justify-content:center;
  margin:0 auto 16px;
}
.yd-ring span{
  width:96px;height:96px;border-radius:50%;background:var(--white);
  display:flex;align-items:center;justify-content:center;
  font-size:30px;font-weight:800;color:var(--green-deep);
}
.yd-vital:nth-child(2) .yd-ring{background:conic-gradient(var(--blue) 0 85%,var(--line) 85% 100%)}
.yd-vital:nth-child(2) .yd-ring span{color:var(--blue-ink)}
.yd-vital:nth-child(3) .yd-ring{background:conic-gradient(var(--yellow-deep) 0 88%,var(--line) 88% 100%)}
.yd-vital:nth-child(3) .yd-ring span{color:#8a6d1a}
.yd-vital h3{margin-bottom:8px}
.yd-vital p{color:var(--muted);font-size:14px;max-width:260px;margin:0 auto}

/* ---------- 左图右文案例（section 6） ---------- */
.yd-case{background:var(--white)}
.yd-case-in{display:grid;grid-template-columns:1fr 1.1fr;gap:48px;align-items:center}
.yd-case-media img{width:100%}
.yd-case-text h2{font-size:clamp(24px,3vw,32px);margin-bottom:14px}
.yd-case-text>p{color:var(--muted);margin-bottom:18px}

/* ---------- FAQ（section 7） ---------- */
.yd-faq{background:var(--bg)}
.yd-faq-list{max-width:820px;margin:0 auto;display:flex;flex-direction:column;gap:12px}
.yd-faq-item{
  background:var(--white);border:2px solid var(--line);border-radius:var(--r-md);
  padding:16px 22px;border-bottom:5px solid var(--green-deep);
}
.yd-faq-item summary{font-weight:800;cursor:pointer;list-style:none;position:relative;padding-right:26px}
.yd-faq-item summary::-webkit-details-marker{display:none}
.yd-faq-item summary::after{content:"+";position:absolute;right:0;top:0;font-size:20px;color:var(--green-deep)}
.yd-faq-item[open] summary::after{content:"−"}
.yd-faq-item p{margin-top:10px;color:var(--muted);font-size:14.5px}

/* ---------- 用户习惯（section 7.5） ---------- */
.yd-habit{background:var(--bg);overflow:hidden}
.yd-habit-x{top:50%;left:0;right:0;opacity:.25}
.yd-habit-in{
  position:relative;z-index:2;
  display:grid;grid-template-columns:1.1fr 1fr;gap:40px;align-items:center;
  max-width:1000px;margin:0 auto;
}
.yd-habit-text p{color:var(--muted);font-size:15px;line-height:1.8;margin-bottom:14px}
.yd-habit-text b{color:var(--ink)}
.yd-habit-media img{width:100%}

/* ---------- CTA（section 8） ---------- */
.yd-cta{background:var(--white);padding-bottom:80px}
.yd-cta-band{
  background:linear-gradient(120deg,var(--green) 0%,var(--blue) 100%);
  border-radius:var(--r-lg);padding:60px 40px;text-align:center;
  box-shadow:var(--shadow);
}
.yd-cta-band h2{font-size:clamp(22px,3vw,32px);margin-bottom:14px;color:var(--ink)}
.yd-cta-band p{color:var(--ink);opacity:.8;max-width:560px;margin:0 auto 26px}
.yd-cta-actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-bottom:20px}
.yd-cta-contact{font-size:14px;font-weight:700;letter-spacing:.04em;color:var(--ink)}

/* ---------- 响应式 ---------- */
@media (max-width:900px){
  .yd-hero-in{grid-template-columns:1fr;text-align:center}
  .yd-hero-icon{margin:0 auto}
  .yd-stats-bar{grid-template-columns:1fr 1fr}
  .yd-point-grid{grid-template-columns:1fr}
  .yd-rel-grid{grid-template-columns:1fr}
  .yd-rel-vs{margin:0 auto}
  .yd-rel-hot{transform:none}
  .yd-vitals-grid{grid-template-columns:1fr;margin-left:0}
  .yd-vitals-v{display:none}
  .yd-habit-in{grid-template-columns:1fr}
  .yd-vitals-v{display:none}
  .yd-case-in{grid-template-columns:1fr}
}