Migrate /der-eine onto the PDP block system

der-eine was the reference the whole PDP block-builder was designed to
match (gallery sizing, black stepRow-facts icons, dynamic CTA label —
see ProductBlocks.tsx). Migrated it onto its own system: hero body,
usps (the 3 hero features), a "Was kann er?" fact-card section (its own
4 icons — pen/sparkle/compact, new; sunHigh, reused — carried over into
the shared StepIcons set), pricing panel, automatic crossSell.
Testimonials.tsx dropped, not migrated (testimonialsRef removed from
the PDP builder earlier this session). Old Hero/Focus/Testimonials/
Pricing/PasstDazu components left as dead code, same as
/tasse-die-pause's own migration.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_013Eg6h91yngXmSnM51wxXM8

app/components/icons/StepIcons.tsx

@@ -130,6 +130,44 @@ function IconCup() {
   );
 }
 
+function IconPen() {
+  // Pen/nib — same glyph as der-eine's own hand-coded Focus.tsx IconMetal
+  // (32x32 coords carried over unchanged), now available through the
+  // shared set for other PDPs — der-eine's PDP is the block-builder's
+  // reference template, its own icons belong in the shared library too.
+  return (
+    <svg width="32" height="32" viewBox="0 0 32 32" fill="none">
+      <path d="M10 22l2.5-0.8L23 10.7l-2.7-2.7L9.8 19.5 9 22z" stroke="#f6a701" strokeWidth="1.6" strokeLinecap="round" strokeLinejoin="round" />
+      <path d="M19 9l3 3" stroke="#f6a701" strokeWidth="1.6" strokeLinecap="round" strokeLinejoin="round" />
+    </svg>
+  );
+}
+
+function IconSparkle() {
+  // Engraving/laser mark — same glyph as der-eine's own IconSparkle.
+  return (
+    <svg width="32" height="32" viewBox="0 0 32 32" fill="none">
+      <path
+        d="M16 7v5M16 20v5M7 16h5M20 16h5M10.5 10.5l3 3M18.5 18.5l3 3M21.5 10.5l-3 3M13.5 18.5l-3 3"
+        stroke="#f6a701"
+        strokeWidth="1.6"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+}
+
+function IconCompact() {
+  // Four corner brackets pointing inward — same glyph as der-eine's own
+  // IconCompact ("fits anywhere").
+  return (
+    <svg width="32" height="32" viewBox="0 0 32 32" fill="none">
+      <path d="M11 8H8v3M21 8h3v3M11 24H8v-3M21 24h3v-3" stroke="#f6a701" strokeWidth="1.6" strokeLinecap="round" strokeLinejoin="round" />
+    </svg>
+  );
+}
+
 function IconPause() {
   // Two rounded bars — "sit still for a moment" steps.
   return (
@@ -155,6 +193,9 @@ export const STEP_ICONS: Record<string, () => React.ReactNode> = {
   shield: IconShield,
   cup: IconCup,
   pause: IconPause,
+  pen: IconPen,
+  sparkle: IconSparkle,
+  compact: IconCompact,
 };
 
 // Same symbolic clock icon /lebensuhr uses above its "24 Stunden" heading

app/der-eine/page.tsx

@@ -1,21 +1,22 @@
 import type { Metadata } from "next";
-import { Hero } from "./components/Hero";
-import { Focus } from "./components/Focus";
-import { PasstDazu } from "./components/PasstDazu";
-import { Testimonials } from "./components/Testimonials";
-import { Pricing } from "./components/Pricing";
+import { notFound } from "next/navigation";
+import { ProductBlocks } from "../components/ProductBlocks";
 import { Footer } from "../components/Footer";
 import { getProductBySlug, getCompanySettings } from "../lib/payload";
 import { buildProductSchema } from "../lib/structuredData";
 
 const title = "Der Eine. – Für die eine Sache, die gerade zählt.";
 
-// Description reads from the live product instead of a separately
-// hardcoded string, unlike this page's own `title` — matches
-// /tasse-die-pause's own pattern (see that page's comment). Two
-// hand-maintained copies of the same text used to drift apart: this one
-// used to say something different from Products.description (which feeds
-// the cart/checkout/JSON-LD elsewhere) — same field, one source now.
+// der-eine was the reference template the whole PDP block-builder system
+// was designed to match (gallery sizing, black stepRow-facts icons,
+// CTA-label pattern — see ProductBlocks.tsx's own comments) — now migrated
+// onto it itself, same as /tasse-die-pause before it. Testimonials.tsx
+// dropped entirely rather than migrated: the PDP builder no longer offers
+// testimonialsRef (removed 2026-08-29, unused everywhere; the planned
+// replacement is a real reviews feature). Hero.tsx/Focus.tsx/
+// Testimonials.tsx/Pricing.tsx/PasstDazu.tsx in ./components are now dead
+// code, left for a follow-up cleanup pass rather than deleted here — same
+// as /tasse-die-pause's own old components.
 export async function generateMetadata(): Promise<Metadata> {
   const product = await getProductBySlug("stift-kugelschreiber");
   const description = product?.descriptionText || undefined;
@@ -33,21 +34,14 @@ export default async function DerEinePage() {
     getProductBySlug("stift-kugelschreiber"),
     getCompanySettings(),
   ]);
-  const productSchema = product
-    ? buildProductSchema(product, "https://einfach-produktiv.mk360.de/der-eine", seller)
-    : null;
+  if (!product) notFound();
+  const productSchema = buildProductSchema(product, "https://einfach-produktiv.mk360.de/der-eine", seller);
 
   return (
     <>
-      {productSchema && (
-        <script type="application/ld+json" dangerouslySetInnerHTML={{ __html: JSON.stringify(productSchema) }} />
-      )}
+      <script type="application/ld+json" dangerouslySetInnerHTML={{ __html: JSON.stringify(productSchema) }} />
       <main className="flex flex-col flex-1">
-        <Hero />
-        <Focus />
-        <Testimonials />
-        <Pricing />
-        <PasstDazu productSlug="stift-kugelschreiber" />
+        <ProductBlocks product={product} />
       </main>
       <Footer />
     </>