:root {
  --ink: #1a1c33;
  --text: #3b3d5c;
  --mute: #787a9c;
  --line: #e4e4f4;
  --paper: #f7f7fe;
  --white: #ffffff;
  --pri: #5a4fd8;
  --pri-deep: #4438b8;
  --accent: #ff8b3d;
  --soft: #ecebff;
  --soft-2: #ffeddd;
}

/* 扇面英雄区：手机身后一张斜贴色块，底部一条浅带 */
.hv-fan .hero { padding: 48px 0 52px; }
.hv-fan .hero::before { left: 0; right: 0; bottom: 0; top: auto; width: 100%; height: 40%; background: linear-gradient(90deg, #eef0fd, #f8f9ff 62%, #ffffff); }
.hv-fan .hero-grid { grid-template-columns: 1.08fr .92fr; gap: 40px; }
.hv-fan .hero-copy h1 { display: inline-block; padding-bottom: 10px; border-bottom: 3px solid var(--accent); }
.hv-fan .hero-points { grid-template-columns: 1fr 1fr; gap: 14px 22px; }
.hv-fan .hero-points li { padding: 12px 0 0; border-top: 1px solid var(--line); }
.hv-fan .hero-visual { min-height: 556px; }
.hv-fan .hero-glow { width: 70%; background: radial-gradient(circle at 50% 50%, rgba(90,79,216,.16), transparent 68%); }
.hv-fan .hero-visual::after { content: ""; position: absolute; right: 10%; top: 12%; width: 44%; height: 62%; border-radius: 24px; background: linear-gradient(150deg, #ddd9ff, #f2f0ff); rotate: -8deg; }
.hv-fan .stage-phone { width: min(224px, 50%); padding: 7px; border-radius: 24px; background: #ffffff; border: 1px solid var(--line); rotate: 4deg; animation: none; box-shadow: 0 22px 46px rgba(26,28,51,.22); }
.hv-fan .stage-phone img { border-radius: 18px; }
.hv-fan .hero-badge { left: 3%; right: auto; top: 6%; width: 96px; height: 96px; }
.hv-fan .hero-strip { left: auto; right: 2%; bottom: 4%; }

@media (max-width: 980px) {
  .hv-fan .hero-grid { grid-template-columns: 1fr; gap: 26px; }
  .hv-fan .hero-visual { min-height: 520px; }
}
@media (max-width: 640px) {
  .hv-fan .hero { padding: 28px 0 30px; }
  .hv-fan .hero::before { height: 30%; }
  .hv-fan .hero-points { grid-template-columns: 1fr; gap: 0; }
  .hv-fan .hero-visual { min-height: 0; display: flex; flex-direction: column; align-items: center; gap: 16px; }
  .hv-fan .hero-visual::after { display: none; }
  .hv-fan .stage-phone { width: min(214px, 62%); rotate: 0deg; }
  .hv-fan .hero-strip { position: static; margin: 0; flex-wrap: wrap; justify-content: center; }
}