Wire up the blog section to Payload CMS instead of hardcoded posts

Blog.tsx now fetches the einfach-produktiv tenant's posts from the
shared Payload instance at build/render time (ISR, 60s revalidate),
via a small typed fetch helper in app/lib/payload.ts.

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

app/components/Blog.tsx

@@ -1,37 +1,15 @@
 import Link from "next/link";
+import { getBlogPosts } from "../lib/payload";
 
-const featured = {
-  thumbnail: "/blog-featured.jpg",
-  category: "Fokus",
-  readTime: "5 Min",
-  title: "Der Feierabend-Knopf",
-  excerpt:
-    "So schaffst du deinen Tag wirklich im Feierabend und nicht, wenn der Laptop zu ist. Feierabend, wenn du ihn lebst",
-  href: "/blog/feierabend-knopf",
-};
+export async function Blog() {
+  const posts = await getBlogPosts(3);
+  if (posts.length === 0) return null;
 
-const secondary = [
-  {
-    thumbnail: "/blog-post-1.jpg",
-    category: "Methoden",
-    readTime: "6 Min",
-    title: "Die 2-Minuten-Regel richtig anwenden",
-    excerpt:
-      "Warum sie wirklich funktioniert – und wie du sie in deinem Alltag clever nutzt.",
-    href: "/blog/2-minuten-regel",
-  },
-  {
-    thumbnail: "/blog-post-2.jpg",
-    category: "Tools",
-    readTime: "4 Min",
-    title: "Die Promodoro-Technik für deinen Alltag",
-    excerpt:
-      "Effektives Zeitmanagement in vier kleinen Schritten, die dir helfen, fokussiert und mit mehr Energie zu arbeiten.",
-    href: "/blog/promodoro-technik",
-  },
-];
+  const featured = { ...posts[0], href: `/blog/${posts[0].slug}` };
+  const secondary = posts
+    .slice(1, 3)
+    .map((post) => ({ ...post, href: `/blog/${post.slug}` }));
 
-export function Blog() {
   return (
     <div id="blog" className="flex flex-col gap-[3rem] items-start pb-[4rem] w-full bg-[#f5f0e8]">
 
@@ -56,7 +34,7 @@ export function Blog() {
           <div className="relative h-[220px] shrink-0 w-[60%]">
             <img
               alt=""
-              src={featured.thumbnail}
+              src={featured.thumbnail ?? undefined}
               className="absolute inset-0 w-full h-full object-cover pointer-events-none"
             />
           </div>
@@ -65,7 +43,7 @@ export function Blog() {
               <div className="flex gap-2 items-center font-semibold text-[#777] text-[1rem] uppercase whitespace-nowrap">
                 <span>{featured.category}</span>
                 <span>•</span>
-                <span>{featured.readTime}</span>
+                <span>{featured.readTime} Min</span>
               </div>
               <div className="flex flex-col gap-4 text-[#222221]">
                 <p
@@ -92,14 +70,14 @@ export function Blog() {
         <div className="flex gap-3 w-full">
           {secondary.map((post) => (
             <div
-              key={post.title}
+              key={post.id}
               className="flex-1 border border-[#d9d9d9] rounded-xl flex gap-3 h-[230px] items-center py-2"
             >
               {/* Thumbnail: own border-radius so it sits neatly inside the padded card */}
               <div className="rounded-xl overflow-hidden shrink-0 h-full w-[14.7rem]">
                 <img
                   alt=""
-                  src={post.thumbnail}
+                  src={post.thumbnail ?? undefined}
                   className="w-full h-full object-cover pointer-events-none"
                 />
               </div>
@@ -108,7 +86,7 @@ export function Blog() {
                   <div className="flex gap-2 items-center font-semibold text-[#777] text-[1rem] uppercase whitespace-nowrap">
                     <span>{post.category}</span>
                     <span>•</span>
-                    <span>{post.readTime}</span>
+                    <span>{post.readTime} Min</span>
                   </div>
                   <div className="flex flex-col gap-4">
                     <p