:root {
  --ink: #18203f;
  --text: #3a4468;
  --mute: #77809e;
  --line: #e2e6f4;
  --paper: #f7f9fe;
  --white: #ffffff;
  --pri: #3a5bd9;
  --pri-deep: #2b46ad;
  --accent: #ff7aa2;
  --soft: #eaefff;
  --soft-2: #ffe8ef;
}

/* 左右翻转英雄区：图在左，文案在右 */
.hv-flip .hero { padding: 46px 0 50px; }
.hv-flip .hero::before { left: 0; right: 0; top: -24%; width: 100%; height: 150%; border-radius: 0; background: radial-gradient(circle at 24% 40%, rgba(58,91,217,.16), rgba(255,122,162,.07) 46%, transparent 66%); }
.hv-flip .hero-grid { grid-template-columns: .92fr 1.08fr; gap: 44px; }
.hv-flip .hero-copy { order: 2; }
.hv-flip .hero-visual { order: 1; min-height: 558px; }
.hv-flip .hero-glow { width: 78%; background: radial-gradient(circle at 45% 50%, rgba(58,91,217,.18), transparent 68%); }
.hv-flip .stage-phone { width: min(230px, 52%); padding: 7px; border-radius: 24px; background: #ffffff; border: 1px solid var(--line); rotate: -3deg; animation: none; box-shadow: 0 22px 46px rgba(24,32,64,.20); }
.hv-flip .stage-phone img { border-radius: 18px; }
.hv-flip .hero-badge { right: auto; left: 4%; top: auto; bottom: 8%; width: 88px; height: 88px; border-radius: 50%; rotate: 0deg; }
.hv-flip .hero-strip { left: auto; right: 0; top: auto; bottom: 3%; }
.hv-flip .hero-visual::after { content: ""; position: absolute; left: 9%; top: 5%; width: 24%; height: 1px; background: var(--accent); }

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