/* 首页英雄区：实验台 A-3 的精简版（labs/u7-journey.js，data-preset="hero"）+ 预测门。
   舞台的这几条样式和实验台自带的一致，写在这里是为了首屏在脚本装好之前就排好版：先出静态画面，3D 空闲时再装上。 */
.hero-lab { display: grid; gap: 18px; margin: 0; }
@media (min-width: 900px) {
  .hero-lab { grid-template-columns: minmax(0, 1fr) 356px; gap: 28px; align-items: start; }
}
.hero-lab .lj-stage { position: relative; aspect-ratio: 4 / 3; overflow: hidden; border-radius: 4px; background: #c9d2df; }
.hero-lab .lj-stage > picture, .hero-lab .lj-stage > picture > img { position: absolute; inset: 0; width: 100%; height: 100%; display: block; object-fit: cover; }
.hero-lab .lj-veil { position: absolute; left: 0; top: 0; bottom: 0; width: 50%; z-index: 2; display: grid; place-items: center; text-align: center;
  background: repeating-linear-gradient(135deg, #2a2c31 0 10px, #25272b 10px 20px); color: #f2efe8; }
.hero-lab .lj-veil b { display: block; font: 600 17px/1.4 var(--font-serif); letter-spacing: .04em; }
.hero-lab .lj-veil small { display: block; margin-top: 6px; font-size: 13px; opacity: .85; }
.hero-side [data-lk="predict"] { margin: 0; }
.hero-side [data-lk="predict"] > [data-part="q"] { font-size: 18px; }
.hero-side .stage-cap { margin: 14px 0 0; }
.hero-scene .lj-steps { margin-top: 4px; }
@media (max-width: 600px) {
  .hero-lab .lj-veil b { font-size: 15px; } .hero-lab .lj-veil small { font-size: 12px; }
  .hero-scene { margin: 0 calc(-1 * var(--gutter)); }
  .hero-scene .lj-stage { border-radius: 0; }
  .hero-scene .lj-status, .hero-scene .lj-steps { padding: 0 var(--gutter); }
}

/* 管线地图下面：选中的那个案例 */
.pin-card { margin: 6px 0 0; padding: 14px 18px 12px; min-height: 7.2em; background: var(--card); border: 1px solid var(--line); border-left: 3px solid var(--ink); border-radius: 0 6px 6px 0; }
.pin-card:empty { display: none; }
.pin-card p { margin: 0; }
.pin-card-h { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; font-size: 14px; color: var(--ink-2); }
.pin-card-h .case { font-size: 13px; color: var(--safelight); letter-spacing: 0.06em; }
.pin-card-t { font-family: var(--font-serif); font-weight: 600; font-size: 18px; line-height: 1.55; margin: 6px 0 4px !important; }
.pin-card-w { font-size: 14px; color: var(--muted); line-height: 1.65; }
/* 全部案例：收起来，按环节排 */
.pins-all { margin: 18px 0 0; border-top: 1px solid var(--line); }
.pins-all > summary { min-height: 48px; display: flex; align-items: center; gap: 8px; cursor: pointer; font-size: 15px; font-weight: 600; color: var(--ink-2); list-style: none; }
.pins-all > summary::-webkit-details-marker { display: none; }
.pins-all > summary::before { content: "+"; font-family: var(--font-mono); font-weight: 400; width: 1.2em; color: var(--muted); }
.pins-all[open] > summary::before { content: "−"; }
.pins-all .pins { margin-top: 4px; }
.pins .pin-t { display: block; margin-top: 2px; }
.pins .stage { font-size: 13px; color: var(--ink-2); }
.map-note { margin-top: 18px; }
.units .all { font-size: 13px; color: var(--ink-2); }
