.process.seq { padding-block-start: var(--space-8); padding-block-end: var(--space-8); }
.seq__grid { row-gap: var(--space-5); }
.seq__h2 { grid-column: 1 / -1; font-size: var(--step-6); letter-spacing: var(--tracking-display-xl); line-height: var(--lh-display-xl); }
.seq__stage { grid-column: 1 / -1; }
.seq__frame { position: relative; aspect-ratio: 4 / 3; background: var(--dark-0); overflow: hidden; overflow: clip; }
.seq__f { display: none; position: absolute; inset: 0; margin: 0; }
.seq__f:last-child { display: block; }
.seq__f picture { display: block; height: 100%; }
.seq__f img { width: 100%; height: 100%; object-fit: cover; }
.seq__meta { display: none; }
.seq__caption { margin-block-start: var(--space-2); color: var(--ink-muted); }
.seq__cap--pin { display: none; }
.seq__steps { grid-column: 1 / -1; list-style: none; }
.seq__steps li { display: grid; grid-template-columns: 3rem minmax(0, 1fr); border-top: 1px solid var(--hair-light); padding-block: var(--space-4); }
.seq__steps li:last-child { border-bottom: 1px solid var(--hair-light); }
.seq__i { color: var(--brass-deep); padding-block-start: .5rem; }
.seq__steps h3 { font-size: var(--step-3); margin-block-end: var(--space-1); }
.seq__steps p { max-width: 40ch; color: var(--ink); text-wrap: pretty; }
.seq__cta { grid-column: 1 / -1; }
.seq.is-live .seq__h2 { grid-column: 1 / span 5; grid-row: 1; }
.seq.is-live .seq__stage { grid-column: 7 / span 6; grid-row: 1 / span 3; position: sticky; top: calc(var(--header-h) + 4svh); align-self: start; }
.seq.is-live .seq__steps { grid-column: 1 / span 5; grid-row: 2; }
.seq.is-live .seq__cta { grid-column: 1 / span 5; grid-row: 3; }
.seq.is-live .seq__frame { aspect-ratio: 1 / 1; }
.seq.is-live .seq__f { display: block; opacity: 0; transition: opacity 280ms var(--ease-emphasized-accel); }
.seq.is-live .seq__f.is-on { opacity: 1; transition: opacity 420ms var(--ease-emphasized-decel) 280ms; }
.seq.is-live .seq__f img { transform: scale(1.03); }
.seq.is-live .seq__f.is-on img { transform: none; transition: transform 420ms var(--ease-emphasized-decel) 280ms; }
.seq.is-live .seq__meta { display: flex; align-items: center; gap: var(--space-3); margin-block-start: var(--space-3); }
.seq.is-live .seq__counter { color: var(--ink); min-width: 5.5em; }
.seq__rail { display: flex; gap: 4px; flex: 1; }
.seq__rail i { flex: 1; height: 2px; background: var(--hair-light); }
.seq__rail i.is-fill { background: var(--brass-deep); }
.seq__hint { color: var(--ink-muted); transition: opacity 280ms var(--ease-standard); }
.seq.is-live.is-past .seq__hint { opacity: 0; }
.seq.is-live .seq__cap--pin { display: block; }
.seq.is-live .seq__cap--stack { display: none; }
.seq.is-live .seq__steps li { min-block-size: 70svh; align-content: center; border-top: 0; border-bottom: 0 !important; padding-inline-start: var(--space-4);
  border-inline-start: 2px solid transparent; }
.seq.is-live .seq__steps li.is-active { border-inline-start-color: var(--brass-deep); }
.seq.is-live .seq__steps li:not(.is-active) h3, .seq.is-live .seq__steps li:not(.is-active) p, .seq.is-live .seq__steps li:not(.is-active) .seq__i { color: var(--ink-muted); }
.seq.is-live .seq__steps li.is-active h3 { color: var(--ink); }
@media (prefers-reduced-motion: reduce) {
  .seq.is-live .seq__f, .seq.is-live .seq__f.is-on, .seq.is-live .seq__f img, .seq.is-live .seq__f.is-on img, .seq__hint { transition: none; }
}
