Hero: Projektzähler live statt hartkodierter 10+

Die Statistik-Zeile im Hero zeigte fest "10+ Projekte". Sie hängt jetzt
am selben /api/projects wie der Abschnitt "Projekte" (gleicher
react-query queryKey, also weiterhin nur ein Request) und zählt die
Repositories, die tatsächlich in Gitea liegen. Fallback bleibt 10,
falls die API nicht antwortet.

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

src/components/Hero.tsx

@@ -2,9 +2,11 @@ import { useNavigate } from "react-router-dom";
 import { ArrowRight } from "lucide-react";
 import React, { useState, useEffect, useRef } from "react";
 import { useTheme } from "next-themes";
+import { useQuery } from "@tanstack/react-query";
 import Silk from "@/components/Silk";
 import CountUp from "@/components/CountUp";
 import { trackCtaClick } from "@/lib/analytics";
+import { fetchProjects } from "@/lib/projects";
 
 const SPARKLE_SVG = (
   <svg className="btn-svg" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden>
@@ -37,6 +39,17 @@ const Hero = () => {
   const [companyAge, setCompanyAge] = useState("");
   const secondBtnRef = useRef<HTMLButtonElement>(null);
 
+  // Projektzähler kommt live aus Gitea – gleicher queryKey wie im Abschnitt
+  // „Projekte", react-query teilt sich den einen Request.
+  const { data: projectsSnapshot } = useQuery({
+    queryKey: ["projects"],
+    queryFn: ({ signal }) => fetchProjects(signal),
+    staleTime: 5 * 60 * 1000,
+    refetchOnWindowFocus: false,
+    retry: 1,
+  });
+  const projectCount = projectsSnapshot?.total ?? 10;
+
   useEffect(() => {
     const calculateAge = () => {
       const now = new Date();
@@ -172,7 +185,7 @@ const Hero = () => {
             <div className="stat-number text-4xl md:text-5xl text-foreground mb-2">
               <CountUp
                 from={0}
-                to={10}
+                to={projectCount}
                 direction="up"
                 duration={1.2}
                 className="count-up-text"