Frontend support for stepRow subtitle + new icon block

Mirrors the backend schema additions (StepRowBlock.items.subtitle,
new IconBlock) needed for the /lebensuhr Pages migration: PageBlock
type + mapPayloadPageBlock in payload.ts, a "icon" case in
PageBlocks.tsx, and SYMBOLIC_ICONS (the clock face) added alongside
STEP_ICONS in StepIcons.tsx — a distinct registry since these icons
are standalone, not part of an icon-above-text row.

app/components/PageBlocks.tsx

@@ -5,7 +5,7 @@ import { getTestimonials } from "../lib/payload";
 import { RichText } from "./RichText";
 import { Quote } from "./Quote";
 import { StepArrow } from "./StepArrow";
-import { STEP_ICONS } from "./icons/StepIcons";
+import { STEP_ICONS, SYMBOLIC_ICONS } from "./icons/StepIcons";
 import { TestimonialsGrid } from "./TestimonialsGrid";
 
 // Renders a Payload Pages document's `layout` blocks field — structurally
@@ -42,6 +42,11 @@ export function renderPageBlockSync(block: PageBlock): React.ReactNode {
     case "quote":
       return <Quote key={block.id}>{block.text}</Quote>;
 
+    case "icon": {
+      const SymbolIcon = SYMBOLIC_ICONS[block.icon];
+      return SymbolIcon ? <div key={block.id}>{SymbolIcon()}</div> : null;
+    }
+
     case "image":
       if (!block.image) return null;
       return (
@@ -114,6 +119,7 @@ export function renderPageBlockSync(block: PageBlock): React.ReactNode {
               </div>
               <div className="flex flex-col gap-1 text-center">
                 <p className="font-semibold text-text-primary text-[1rem]">{item.title}</p>
+                {item.subtitle && <p className="font-semibold text-[0.75rem] text-brand">{item.subtitle}</p>}
                 <p className="text-[0.875rem] text-text-muted leading-[1.5]">{item.description}</p>
               </div>
             </div>,