/* Live Build hero */
.lb { position: relative; min-height: 100svh; display: grid; align-items: center; overflow: hidden; background:
  radial-gradient(60% 70% at 72% 50%, oklch(0.22 0.06 330 / .55), transparent 70%),
  radial-gradient(40% 50% at 90% 90%, oklch(0.3 0.12 358 / .25), transparent 70%), var(--ink-0); }
.lb > .wrap { width: 100%; }
.lb-gl { position: absolute; inset: 0; }
.lb-gl canvas { display: block; width: 100%; height: 100%; }
.lb-copy { position: relative; z-index: 1; padding-top: calc(var(--hd, 72px) + 40px); padding-bottom: 80px; pointer-events: none; }
.lb-copy > * { pointer-events: auto; max-width: 600px; }
.lb .pg-lede { margin-top: 24px; max-width: 460px; }
.lb .actions { margin-top: 34px; }
.lb-steps { display: flex; flex-wrap: wrap; gap: 10px 26px; margin-top: 56px; padding: 0; list-style: none; font: 400 var(--t-xs)/1 var(--f-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--fg-3); }
.lb-steps li { display: flex; align-items: center; gap: 10px; transition: color .4s var(--ease); }
.lb-steps li::before { content: ""; width: 8px; height: 8px; border: 1.5px solid var(--fg-3); transition: background-color .3s var(--ease), border-color .3s var(--ease); }
.lb-steps li.on { color: var(--fg); }
.lb-steps li.on::before { background: var(--accent); border-color: var(--accent); }
.lb-steps li.done::before { background: var(--fg-3); border-color: var(--fg-3); }
@media (max-width: 860px) {
  .lb { align-items: end; }
  .lb-copy { padding-top: 46svh; }
  .lb-steps { margin-top: 36px; }
}