docs: replace SHOWCASE-ROADMAP.md with docs/backlog/ (17 WPs)

Turns the prior roadmap sketch into ordered, gated work packages (enforcement
gates, FP/DDD consistency, CIBG fidelity, Storybook curriculum, a11y) from the
2026-07-02 showcase-hardening audit.

docs/backlog/WP-12-datablock.md

@@ -0,0 +1,79 @@
+# WP-12 — CIBG Datablock for application data
+
+Status: todo
+Phase: 2 — CIBG fidelity
+
+## Why
+
+CIBG documents **Datablock** (designsystem.cibg.nl/componenten/datablock/) as THE way to
+display user/application data: a grey `dl/dt/dd` container, `.data-block` +
+`.block-wrapper`, Bootstrap grid for label/value widths, a `--stacked` variant, and
+optional expandable help text (`.dt-item`, `.dt-help-btn-open/-close`, `.dt-help-panel`).
+All classes are **verified present** in `public/cibg-huisstijl/css/huisstijl.min.css`.
+The app currently renders application data with bare `data-row`s inside a custom card —
+adopting Datablock makes the data views design-system-native.
+
+## Read first
+
+- https://designsystem.cibg.nl/componenten/datablock/
+- `public/cibg-huisstijl/css/huisstijl.min.css` (grep `.data-block`)
+- `src/app/shared/ui/data-row/data-row.component.ts`
+- `src/app/shared/ui/review-section/review-section.component.ts` (already uses
+  `.data-block`/`.block-wrapper` ad hoc)
+- Consumers: `src/app/registratie/ui/dashboard.page.ts` ("Persoonsgegevens (BRP)" card),
+  `registration-summary/registration-summary.component.ts`,
+  `registration-detail.page.ts`
+
+## Decisions (pre-made, don't relitigate)
+
+- New **`data-block` molecule** in `shared/ui` wrapping the vendored classes: inputs for
+  optional heading and `stacked` variant; content = projected `data-row`s (or a typed
+  rows input — match how `review-section` projects today; prefer projection for
+  composability).
+- `data-row` stays as the row primitive **inside** the datablock (document that role in
+  its header comment) — don't fork a second row component.
+- `review-section` aligns onto the new molecule instead of hand-carrying the classes.
+- Expandable help text (`.dt-item` + help button/panel) only if a real field needs it —
+  if built, follow CIBG's focus management (focus into panel on open, back to trigger on
+  close) and the documented `aria-*` state on the trigger.
+
+## Files
+
+- New `src/app/shared/ui/data-block/data-block.component.ts` + `data-block.stories.ts`
+- `src/app/shared/ui/review-section/review-section.component.ts`
+- `src/app/registratie/ui/dashboard.page.ts` (Persoonsgegevens card → datablock)
+- `registration-summary.component.ts`, `registration-detail.page.ts`
+- `src/app/shared/ui/data-row/data-row.component.ts` (header comment; possibly minor
+  class alignment)
+
+## Steps
+
+1. Build the molecule (standard + stacked variants), stories for both (axe-gated).
+2. Migrate the three data views; keep copy/i18n ids untouched.
+3. Fold review-section onto the molecule; delete its duplicated class carrying.
+4. Optional `aria-label` on the `dl` where the block has no visible heading.
+5. Visual review dashboard + registration pages.
+
+## Acceptance criteria
+
+- [ ] Application data (BRP card, registration summary/detail, wizard review) renders in
+      CIBG datablocks.
+- [ ] `data-row` documented as the datablock row primitive; no duplicate dl styling
+      anywhere.
+- [ ] Stories for standard + stacked; axe green.
+
+## Verification
+
+GREEN + `npm run test-storybook:ci`. Manual: `npm start` → dashboard + /registratie
+detail; wizard review step still renders.
+
+## Out of scope
+
+The help-panel variant unless a real field needs it; table views (registration-table
+stays a CIBG Tabel).
+
+## Risks
+
+The grey datablock surface may double up visually inside the custom `.app-card` — decide
+per view whether the card wrapper drops (datablock replaces it) and note the choice in
+the component comment.