Numbered process/workflow panel suited to onboarding flows or service steps: a numbered list of steps sits beside a single content panel that swaps as you move through them. A plain, fully editable section (eyebrow, heading, intro) holds two matched component lists — "Process Nav Item" instances in the Nav list and "Process Panel" instances in the Panels stack — duplicate, reorder or delete one of each (with the same tabId) in Layers to change the step count. Nav items are typed: tabId, number (e.g. "01"), title. Panels are typed: tabId (must match the nav item it belongs to), title, description, image, imageAlt. Section-level options are data attributes on the wrapper: data-nav (numbers|dots) numbers show the index and title in a vertical list, dots collapse the same buttons to a compact row of numbered circles for tight spaces; data-default (1-based index of the step shown first). Inline JS (the kit's tabs pattern, extended with Previous/Next buttons and swipe-free keyboard support) sets aria-selected/aria-controls, moves focus with arrow keys, Home/End, and swaps the active panel with a cross-fade-and-rise transition driven by CSS (no @keyframes, prefers-reduced-motion drops it to an instant swap). Without JavaScript every panel's full content renders in reading order beneath the nav list, so nothing is hidden — the tabbed swap is a progressive enhancement. Container-query side-by-side layout above 46em, stacked below; :focus-visible rings; clamp() type.