/* Iframe demo slots (hero + Career Story). Both demos in /demos/ are 540x675 (4:5).
   The iframe renders at that native size and is scaled to fit the slot
   (--demo-scale, set by assets/js/hero-demo.js). The demos also scale themselves,
   but their stage drifts off-centre in any frame smaller than 540x675, so the
   frame is never made smaller than the stage. */
.hero-demo {
  position: relative; overflow: hidden;
  width: 100%; max-width: 540px; aspect-ratio: 4 / 5; margin-inline: auto;
}
.hero-demo__frame {
  position: absolute; left: 0; top: 0; display: block;
  width: 540px; height: 675px;
  border: 0; background: transparent; pointer-events: none;
  transform-origin: 0 0; transform: scale(var(--demo-scale, 1));
}