feat(design): re-theme to CIBG Huisstijl (Bootstrap 5.2), replacing RHC/Utrecht

The portal now adheres to the CIBG design system (designsystem.cibg.nl) — a customized
Bootstrap 5.2 build — replacing the Rijkshuisstijl-Community / Utrecht theme. See ADR-0003.

- Vendor @cibg/huisstijl@3.22.0 under public/cibg-huisstijl/, loaded via a <link> in
  index.html (Storybook serves it via staticDirs). Drop the two @rijkshuisstijl-community deps.
- Token bridge in styles.scss: redefine the app's ~54 --rhc-* tokens onto CIBG/--bs-* values,
  so components keep referencing tokens (no 300+ site rewrite). System-font stack; licensed
  RO/Rijks text fonts intentionally not shipped.
- Re-skin every shared atom to Bootstrap/CIBG classes (btn, form-control, form-check-*,
  table, breadcrumb, …) keeping their input() APIs. alert is hand-rolled (CIBG drops .alert);
  local .card/.badge renamed to avoid Bootstrap collisions.
- Domain pages: drop stray rhc-*/utrecht-* classes; registration-table → table table-striped.

Verified: build green, check:tokens OK, lint clean, 174 tests pass, build-storybook OK,
and the served build loads the vendored CSS (200, .btn-primary present).

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

src/app/shared/ui/data-row/data-row.component.ts

@@ -1,16 +1,27 @@
 import { Component, input } from '@angular/core';
 
-/** Molecule: one key/value row inside an RHC data-summary.
-    Wrap several of these in .rhc-data-summary (see registration-summary). */
+/** Molecule: one key/value row in a data summary. Hand-rolled from tokens
+    (CIBG has no data-summary component). Wrap several in a <dl> (see registration-summary). */
 @Component({
   selector: 'app-data-row',
-  // The RHC item draws a divider below every row; drop it on the last one so the
-  // list ends cleanly instead of looking like a trailing empty row.
-  styles: [`:host:last-child .rhc-data-summary__item { border-block-end-style: none; }`],
+  styles: [`
+    .item{
+      display:grid;
+      grid-template-columns:minmax(8rem, 14rem) 1fr;
+      gap:var(--rhc-space-max-md);
+      padding-block:var(--rhc-space-max-md);
+      border-block-end:var(--rhc-border-width-sm) solid var(--rhc-color-border-subtle);
+      margin:0;
+    }
+    /* drop the divider on the last row so the list ends cleanly */
+    :host:last-child .item{border-block-end-style:none}
+    .item-key{font-weight:var(--rhc-text-font-weight-semi-bold);margin:0}
+    .item-value{margin:0}
+  `],
   template: `
-    <div class="rhc-data-summary__item">
-      <dt class="rhc-data-summary__item-key">{{ key() }}</dt>
-      <dd class="rhc-data-summary__item-value"><ng-content>{{ value() }}</ng-content></dd>
+    <div class="item">
+      <dt class="item-key">{{ key() }}</dt>
+      <dd class="item-value"><ng-content>{{ value() }}</ng-content></dd>
     </div>
   `,
 })