Feature: Fällige Lead-Wiedervorlagen auf der Leads-Seite

naechsterSchrittDatum wurde erfasst, aber nie als faellige Liste geb√ºndelt —
warme Leads gingen unter. Neue Query lead.dueFollowUps (aktive Leads mit
faelligem/ueberfaelligem naechsten Schritt) + "Faellige Wiedervorlagen"-Block
oben auf /leads.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

apps/web/src/routes/leads.tsx

@@ -1,5 +1,6 @@
 import { useState } from 'react';
 import { Link } from 'react-router';
+import { BellRing } from 'lucide-react';
 import { clsx } from 'clsx';
 import { toast } from 'sonner';
 import { trpc } from '../lib/trpc';
@@ -41,6 +42,8 @@ export function LeadsRoute() {
         </div>
       </header>
 
+      <DueFollowUps />
+
       {leads.length === 0 ? (
         <Card.Root>
           <Card.Body>
@@ -75,6 +78,36 @@ export function LeadsRoute() {
   );
 }
 
+function DueFollowUps() {
+  const q = trpc.lead.dueFollowUps.useQuery();
+  if (!q.data || q.data.length === 0) return null;
+  return (
+    <Card.Root>
+      <Card.Body>
+        <h2 className="mb-2 flex items-center gap-2 text-lg font-semibold">
+          <BellRing size={16} className="text-[var(--color-ampel-amber-fg)]" />
+          Fällige Wiedervorlagen ({q.data.length})
+        </h2>
+        <ul className="space-y-1.5 text-sm">
+          {q.data.map((l) => (
+            <li key={l.id} className="flex items-center justify-between gap-3">
+              <Link to={`/lead/${l.id}`} className="min-w-0 flex-1 truncate hover:underline">
+                <span className="font-medium">{l.firma}</span>
+                {l.naechsterSchritt && (
+                  <span className="text-[var(--color-ink-muted)]"> — {l.naechsterSchritt}</span>
+                )}
+              </Link>
+              <span className="shrink-0 font-mono text-xs text-[var(--color-ampel-amber-fg)]">
+                {l.faelligAm}
+              </span>
+            </li>
+          ))}
+        </ul>
+      </Card.Body>
+    </Card.Root>
+  );
+}
+
 function LeadImportDialog({ onClose }: { onClose: () => void }) {
   const projectsQ = trpc.project.list.useQuery();
   const projects = (projectsQ.data ?? []).map((r) => ({ id: r.project.id, name: r.project.name }));