Wire testimonials CMS collection and Payload Live Preview

Testimonials on /todo-cards, /newsletter, /challenge now come from the new
Payload testimonials collection via a shared TestimonialsGrid component,
instead of 3 separately hardcoded arrays.

Adds Next.js Draft Mode (/api/preview) plus Live-Preview-aware client
wrappers (LiveRichText, LiveTestimonialsGrid, LivePostContent) for posts,
legal pages, and testimonials — mounted only while Draft Mode is enabled,
so ordinary visitors keep getting the plain static components.

app/todo-cards/page.tsx

@@ -1,10 +1,13 @@
 import type { Metadata } from "next";
+import { draftMode } from "next/headers";
 import { TodoKartenHero } from "./components/TodoKartenHero";
 import { HowItWorks } from "./components/HowItWorks";
 import { Focus } from "./components/Focus";
-import { Testimonials } from "./components/Testimonials";
 import { Pricing } from "./components/Pricing";
 import { Footer } from "../components/Footer";
+import { TestimonialsGrid } from "../components/TestimonialsGrid";
+import { LiveTestimonialsGrid } from "../components/LiveTestimonialsGrid";
+import { getTestimonials } from "../lib/payload";
 
 const title = "ToDo-Karten – Kleine Karten. Große Wirkung.";
 const description =
@@ -29,14 +32,21 @@ export const metadata: Metadata = {
   },
 };
 
-export default function TodoCardsPage() {
+export default async function TodoCardsPage() {
+  const testimonials = await getTestimonials("todo-cards");
+  const { isEnabled: isPreview } = await draftMode();
+
   return (
     <>
       <main className="flex flex-col flex-1">
         <TodoKartenHero />
         <HowItWorks />
         <Focus />
-        <Testimonials />
+        {isPreview ? (
+          <LiveTestimonialsGrid testimonials={testimonials} />
+        ) : (
+          <TestimonialsGrid testimonials={testimonials} />
+        )}
         <Pricing />
       </main>
       <Footer />