fix(storefront): home carousel overflow, static-page content, compare colour swatch

- product-carousel-widget: implicit CSS grid track had no min-width:0,
  so the flex scroller's intrinsic content width (fixed 220px product
  cards) overflowed the grid item and pushed body width to ~2187px on
  a 1440px viewport, squeezing the entire homepage into a ~340px column.
  Added min-width:0 to the track and scroller (standard grid/flex
  overflow fix).
- bootstrap.json mock fixture: about-us/privacy-policy/terms-of-service
  static pages (the real CMS pages served via bootstrap.staticPages,
  per docs/PROJECT_INDEX.md) used a 'content' field, but
  content-page.service.ts's normalizePage() only reads 'html' -
  ContentPageBootstrapInput has no 'content' field. Title rendered,
  body was always empty. Renamed the 3 fixture entries' field from
  content to html to match the schema; content now renders.
- compare-table: colour row rendered raw hex/name values as plain text
  (e.g. '#fCfCfC') with no swatch, inconsistent with variant-selector's
  established colour-swatch pattern used on the product page. Added a
  small circular swatch (reusing the same border-radius:50% pattern)
  next to the value.

Verified live via ng serve: overflow gone (body/viewport width match
at 1440/1280/375), static pages render real content, compare swatch
displays. tsc --noEmit and ng build both clean (pre-existing bundle-
budget warning only, already tracked in KNOWN-ISSUES item 12).

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

src/app/widgets/ui/product-carousel-widget.component.ts

@@ -62,10 +62,12 @@ import { ProductCollectionWidgetData } from '../contracts/widget-data.contract';
         display: flex;
         align-items: center;
         gap: 8px;
+        min-width: 0;
       }
 
       .product-carousel-widget__scroller {
         flex: 1;
+        min-width: 0;
         overflow-x: auto;
         scroll-behavior: smooth;
         scrollbar-width: none;