Stable src/components/rhythm/PinnedShowcase.astro

When to use

When one product visual should narrate several steps — a feature deep-dive or "how it works" where you want the screen to stay put while the explanation scrolls past it and the visual changes to match the active step. Use StepTimeline for a plain sequential list with no pinned visual, and the scale-to-fit product shot for a single static visual.

  1. 01

    Connect

    Link your carrier and ERP accounts.

  2. 02

    Audit

    Every invoice is checked against your contract.

  3. 03

    Recover

    Claims are filed and tracked to each credit.

Carrier audit
UPS · 1Z…84−$14.20
FedEx · 77…21−$8.90
position: sticky

Simplified static view: in production the visual pins with position: sticky while the steps scroll past it, and an IntersectionObserver marks the active step to drive what the visual shows. Reduced motion swaps the visual instantly.