Horizontal Scroll Walkthrough — Sequenced Stage Cards

What it does

• Scroll-locked stage row — vertical scrolling slides a row of stage cards horizontally one at a time
• Live stage counter — a clear '01 / 07' style indicator updates as each card passes
• Progress rail — a horizontal progress bar fills as the learner advances through the stages
• Rich stage cards — each stage has a numbered badge, category tag, illustration, name, description, and a small spec grid
• Mobile touch handling — on smaller screens the row converts to natural touch-scrolling cards
• Synthesis and action close — releases at the end into a summary block plus a clear next-step card

Best use cases

• Strength and athletics — multi-stage progressions where learners cannot skip rungs
• Cooking — multi-step recipes or fermentation timelines that must be walked in order
• Sales and marketing — multi-step launch sequences, funnel stages, or pipeline walkthroughs
• Manufacturing and operations — production-line walkthroughs and assembly sequences
• Education — historical timelines or evolution-of-a-technique lessons
• Career and skill ladders — progressions with strict prerequisites between stages

What you can change with your DNA

When you run this through the remix skill, your CCOS DNA — brand, voice, audience — drives these decisions automatically:

• Colors — single accent color repaints all highlights and progress fills against a dark base. Easily swapped for a soft cream/serif treatment if a different register is needed.
• Fonts — two roles: a strong display font and a mono accent font. The shipped pairing is bold and technical; alternate pairings shift the personality without breaking the rhythm.
• Copy — opener, header chrome, four to twelve stage cards (badge, tag, name, description, spec labels), synthesis block, action card.
• Images — illustrations sit inside each card; swap for photos, animated visuals, or video stills. Visual area is the dominant part of each card.
• Behavior — tune how snappy or buttery the horizontal motion feels, and adjust the total number of stages — the layout recalculates automatically.