:root {
  --ink: #101c2c;
  --text: #33475e;
  --mute: #6b7f95;
  --line: #dde7f2;
  --paper: #f6f9fc;
  --white: #ffffff;
  --pri: #2f5fa8;
  --pri-deep: #244a85;
  --accent: #ff6b4a;
  --soft: #e8f0fa;
  --soft-2: #ffeee9;
}

/* 资源托盘：浅色点阵托盘 + 右上胶囊版本签 + 底部胶囊分类条 */
.hv-tray .hero { padding: 44px 0 46px; }
.hv-tray .hero-visual { min-height: 486px; }
.hv-tray .hero-visual::before {
  content: ""; position: absolute; inset: 6% 5% 9% 7%; border-radius: 34px;
  background:
    radial-gradient(#cfe2f7 1px, transparent 1.4px) 0 0 / 14px 14px,
    linear-gradient(165deg, #ffffff, #eef6ff 68%, #e3effc);
  border: 1px solid #dbe9f8; rotate: 1.6deg; box-shadow: 0 30px 64px rgba(23,60,105,.16);
}
.hv-tray .hero-visual::after {
  content: "资源盒 · 4.2.1"; position: absolute; right: 3%; top: 4%;
  padding: 8px 13px; border-radius: 999px; background: #1b3f6b; color: #fff;
  font-size: 12px; font-weight: 800; rotate: 2deg; box-shadow: 0 12px 26px rgba(23,60,105,.18);
}
.hv-tray .hero-glow { width: 74%; opacity: .46; }
.hv-tray .stage-phone {
  width: min(196px, 48%); justify-self: center; align-self: center; margin-top: 12px;
  padding: 8px; border-radius: 26px; background: #16233a; border-color: rgba(27,63,107,.2);
  rotate: 2deg; animation: none; box-shadow: 0 24px 50px rgba(18,42,74,.32);
}
.hv-tray .stage-phone img { border-radius: 20px; }
.hv-tray .hero-badge {
  left: auto; right: 4%; top: auto; bottom: 8%; width: 76px; height: 76px;
  border-radius: 20px; background: #fff; color: var(--pri-deep); border: 1px solid #dbe9f8;
  rotate: 4deg; box-shadow: 0 14px 28px rgba(18,42,74,.16);
}
.hv-tray .hero-badge strong { font-size: 21px; }
.hv-tray .hero-badge span { color: var(--mute); }
.hv-tray .hero-strip {
  left: 6%; right: auto; bottom: 5%; gap: 6px; padding: 7px 10px; border-radius: 999px;
  background: #fff; border: 1px solid #e3eefb; box-shadow: 0 12px 26px rgba(18,42,74,.12);
}
.hv-tray .hero-strip span:first-child { background: var(--pri); color: #fff; }
.fv-bento .feature { min-height: 0; }
.sv-big .shot { border-radius: 14px; }
.rv-three .review { background: var(--white); }

@media (max-width: 640px) {
  .hv-tray .hero-grid { grid-template-columns: 1fr; gap: 16px; }
  .hv-tray .hero-visual { min-height: 452px; }
  .hv-tray .hero-visual::before { inset: 4% 0 5% 0; rotate: 0deg; }
  .hv-tray .hero-visual::after { left: 10px; right: auto; top: 8px; font-size: 10px; padding: 6px 10px; }
  .hv-tray .stage-phone { width: min(166px, 46%); margin-top: 52px; }
  .hv-tray .hero-badge { display: grid; left: 10px; right: auto; top: auto; bottom: 78px; width: 56px; height: 56px; border-radius: 14px; }
  .hv-tray .hero-badge strong { font-size: 16px; }
  .hv-tray .hero-strip { left: 10px; right: 10px; bottom: 8px; padding: 6px 8px; gap: 4px; justify-content: center; }
  .hv-tray .hero-strip span { padding: 3px 7px; font-size: 10px; }
  .fv-bento .feature-grid { grid-template-columns: 1fr; }
}

