:root {
  --ink: #241b16;
  --text: #463731;
  --mute: #8a7972;
  --line: #ebe0da;
  --paper: #fdf9f6;
  --white: #ffffff;
  --pri: #b05a2c;
  --pri-deep: #8c4420;
  --accent: #e8a33d;
  --soft: #f8ece2;
  --soft-2: #fdf0da;
}

/* 竖线引导英雄区：左文右机，文案左侧一条强调线 */
.hv-step .hero { padding: 52px 0 46px; background: linear-gradient(180deg, #fdf6f1, #ffffff 74%); }
.hv-step .hero::before { left: 0; right: 0; top: -20%; width: 100%; height: 142%; background: radial-gradient(circle at 68% 44%, rgba(176,90,44,.15), rgba(176,90,44,.04) 46%, transparent 64%); }
.hv-step .hero-grid { grid-template-columns: 1.06fr .94fr; gap: 46px; }
.hv-step .hero-copy { position: relative; padding-left: 22px; border-left: 3px solid var(--accent); }
.hv-step .hero-points { grid-template-columns: 1fr; gap: 0; margin-top: 24px; padding-top: 0; border-top: 0; }
.hv-step .hero-points li { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; padding: 9px 0; border-bottom: 1px dotted var(--line); }
.hv-step .hero-points small { margin-top: 0; }
.hv-step .hero-visual { min-height: 560px; }
.hv-step .hero-glow { width: 74%; }
.hv-step .stage-phone { width: min(226px, 50%); padding: 8px; border-radius: 24px; background: #2a201b; rotate: 0deg; animation: none; box-shadow: 0 22px 50px rgba(70,55,49,.28); }
.hv-step .stage-phone img { border-radius: 17px; }
.hv-step .hero-badge { right: 2%; top: 6%; width: 94px; height: 94px; background: var(--pri); box-shadow: 0 14px 30px rgba(176,90,44,.30); }
.hv-step .hero-strip { left: 3%; bottom: 6%; }
.hv-step .hero-visual::after { content: ""; position: absolute; right: 10%; bottom: 10%; width: 40%; aspect-ratio: 1; border: 1px solid var(--line); border-radius: 20px; }

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