/* Industry cube hero (2026-10-22). Loaded only when a page's Hero animation = Industry cube (sf_hero_has_cube).
   Two-column .page-hero-grid like the landing hero; the canvas fades in on the first live frame (.live).
   No WebGL or a load failure (.still): the figure collapses. */
.ind-hero-grid { align-items: center; }
.ind-hero-grid .title { max-width: none; }
.ind-cube { display: flex; flex-direction: column; align-items: center; margin: 0; }
.ind-cube-stage { position: relative; width: 100%; max-width: 520px; aspect-ratio: 1 / 1; cursor: pointer; }
.ind-cube-stage canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; opacity: 0; transition: opacity .6s ease; }
.ind-cube.live canvas { opacity: 1; }
.ind-cube.still { display: none; }
.ind-cube-cap { display: flex; gap: 12px; min-height: 1.5em; margin-top: -8px; font: 500 12px/1.5 var(--mono); color: var(--muted); }
.ind-cube-cap .n { color: var(--accent); }
.chip.is-on { border-color: var(--accent); color: var(--fg); }
@media (max-width: 1020px) {
  .ind-cube { margin-top: -32px; }
  .ind-cube-stage { max-width: 320px; }
}
