/* Approved hero-only background and clean surfaces, without prototype controls. */
.hero { position: relative; isolation: isolate; }
#hero-signals { position: absolute; inset: 0 0 -79px; z-index: -1; pointer-events: none; overflow: clip; }
.background-art { position: absolute; inset: 0; pointer-events: none; mask-image: linear-gradient(to bottom, transparent, #000 12%, #000 78%, transparent); }
.stage-light, .stage-surround { display: none; }
.product-stage, .ledger, .advice-example { box-shadow: none; }
.stage-toolbar { background: var(--surface); }
.stage-footer { justify-content: flex-end; }
.primary-action { box-shadow: inset 0 1px 0 #c2fff360; }
.signal-side { position: absolute; inset-block: 0; left: 0; width: clamp(100px, 20vw, 280px); }
.signal-side[data-side="1"] { left: auto; right: 0; }
.signal-place { position: absolute; width: 42px; height: 42px; transform: translate(-50%, -50%); }
.signal-life { display: block; width: 100%; height: 100%; opacity: 0; animation: signal-lifetime 14s var(--ease-in-out) infinite; }
.signal-life svg { display: block; width: 100%; height: 100%; stroke: #a4b7b2; stroke-width: 1.2; stroke-linecap: round; stroke-linejoin: round; }
.signal-life[data-accent] .signal-accent { stroke: var(--accent); }
@keyframes signal-lifetime {
  0%,12% { opacity: 0; transform: translate(0, 5px); }
  34% { opacity: .38; transform: translate(2px, 0); }
  60% { opacity: .38; transform: translate(4px, -5px); }
  88%,100% { opacity: 0; transform: translate(6px, -10px); }
}
#hero-signals[data-paused] .signal-life { animation-play-state: paused; }
@media (max-width: 600px) {
  .signal-side { width: 36px; opacity: .65; }
  .signal-place { width: 28px; height: 28px; left: 50% !important; }
  .signal-place:not(:first-child) { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .signal-life { animation: none; transform: none; opacity: .3; }
}

/* Before enhancement, reserve the event's height and show the same first snapshot.
   With JS disabled (or a failed boot) this flag is absent: the static final stays. */
html[data-landing-boot] .product-stage:not([data-interactive-scene]) .insight-card { opacity: 0; }
html[data-landing-boot] .product-stage:not([data-interactive-scene]) .rank-before { opacity: 1; }
html[data-landing-boot] .product-stage:not([data-interactive-scene]) .rank-after { opacity: 0; }
html[data-landing-boot] .product-stage:not([data-interactive-scene]) [data-row="a"] { transform: translateY(calc(1 * var(--row-step))); }
html[data-landing-boot] .product-stage:not([data-interactive-scene]) [data-row="b"] { transform: translateY(calc(2 * var(--row-step))); }
html[data-landing-boot] .product-stage:not([data-interactive-scene]) [data-row="c"] { transform: translateY(calc(3 * var(--row-step))); }
html[data-landing-boot] .product-stage:not([data-interactive-scene]) [data-row="own"] { transform: translateY(0); }