Richie
f146bb0f81
Adopts a single-scroll-container layout for the desktop Comparison page (motivated by a Figma Make exploration). The page header sits in a max-width container matching the table's natural width, with flex spacers either side of the table — when the viewport is wider than the table, spacers centre it; when a 4th+ package pushes the table wider than viewport, spacers collapse and the table extends rightward from the page header's left edge. - New WizardLayout variant `bleed` — viewport-locked, no inner Container, main is the single scroll host, back link routed into children, `data-wizard-scroll` marker for descendants. - ComparisonTable: fixed 300px column widths exposed as COMPARISON_TABLE_COL_WIDTH; sticky-left on row-label column across every per-section mini-table; tiered hover (surface-subtle base / surface-warm recommended column); recommended column carries a resting 50%-opacity warm tint; "Not Included" copy replaces em-dash for unavailable cells in Optionals/Extras sections; CellIconText helper applies lineHeight: 1 so icon+text rows align optically. - ComparisonColumnCard: uniform pt: 5 (40px); medium badge (26px) with star/verified icon; 2px brand-600 border for recommended; provider name wraps to 2 lines in a reserved 36px bottom-aligned slot so 1-line names keep subsequent content on a consistent baseline; Remove link always rendered as the same Link element (visibility-hidden when not applicable) so CTA+footer align across all cards. - Mackay test data extended to exercise 2-line wrap. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>