:root {
  --ink: #1a2233;
  --text: #3a4457;
  --mute: #7c8698;
  --line: #e4e7ee;
  --paper: #f7f8fb;
  --white: #ffffff;
  --pri: #e0672a;
  --pri-deep: #b64f1b;
  --accent: #2f3f5c;
  --soft: #fdeee4;
  --soft-2: #eef1f7;
}

/* 资源墙英雄区：右侧白板 + 斜贴色卡 + 手机 */
.hv-grid .hero-grid { grid-template-columns: 0.92fr 1.08fr; gap: 40px; align-items: center; }
.hv-grid .hero::before { left: 0; right: 0; top: -8%; width: 100%; height: 116%;
  background: radial-gradient(circle at 82% 28%, rgba(224,103,42,.13), rgba(47,63,92,.05) 46%, transparent 68%); }
.hv-grid .hero-visual { min-height: 494px; }
.hv-grid .hero-visual::before {
  content: ""; position: absolute; inset: 20px 0 26px 10px; border-radius: 24px;
  background: var(--white); border: 1px solid var(--line); box-shadow: 0 22px 54px rgba(26,34,51,.10);
}
.hv-grid .hero-visual::after {
  content: ""; position: absolute; left: 16px; bottom: 64px; z-index: 1; width: 168px; height: 154px;
  border-radius: 20px; rotate: -8deg;
  background: linear-gradient(152deg, #ffd9c0, #f6a97a 58%, #e0672a);
  box-shadow: 0 16px 36px rgba(224,103,42,.26);
}
.hv-grid .hero-glow { width: 58%; opacity: .5; }
.hv-grid .stage-phone {
  justify-self: end; align-self: center; width: min(204px, 50%); margin-right: 7%;
  padding: 7px; border-radius: 26px; rotate: 1.5deg; animation: none;
}
.hv-grid .stage-phone img { border-radius: 20px; }
.hv-grid .hero-badge {
  left: 28px; right: auto; top: 48px; width: 94px; height: 94px; border-radius: 20px;
  background: var(--ink); rotate: 0deg; box-shadow: 0 16px 34px rgba(26,34,51,.28);
}
.hv-grid .hero-badge strong { color: #ffb184; }
.hv-grid .hero-strip {
  left: 20px; bottom: 18px; flex-wrap: wrap; max-width: 62%; gap: 6px;
  background: transparent; border: 0; box-shadow: none; padding: 0;
}
.hv-grid .hero-strip span { background: var(--white); border: 1px solid var(--line); color: var(--text); font-weight: 600; }

@media (max-width: 640px) {
  .hv-grid .hero-grid { grid-template-columns: 1fr; gap: 18px; }
  .hv-grid .hero-visual { min-height: 424px; }
  .hv-grid .hero-visual::before { inset: 14px 0 18px; }
  .hv-grid .hero-visual::after { left: 8px; bottom: 44px; width: 138px; height: 132px; }
  .hv-grid .stage-phone { width: min(186px, 54%); margin-right: 6%; }
  .hv-grid .hero-badge { left: 16px; top: 30px; width: 76px; height: 76px; border-radius: 16px; }
  .hv-grid .hero-badge strong { font-size: 23px; }
  .hv-grid .hero-strip { display: none; }
}