Migrate CMS from Sanity to self-hosted Directus, add Impressum + Datenschutz

- Replace src/lib/sanity.ts with src/lib/directus.ts (REST API client)
- Update all 9 pages to use Directus field names and imageUrl()
- Add Impressum (§5 TMG) and Datenschutz (DSGVO) pages
- Update .env.example for Directus URL + token

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

src/pages/projekte/[slug].astro

@@ -1,11 +1,10 @@
 ---
 import Layout from "../../layouts/Layout.astro";
-import { getAllProjects, getProject } from "../../lib/sanity";
-import { toHTML } from "@portabletext/to-html";
+import { getAllProjects, getProject, imageUrl } from "../../lib/directus";
 
 export async function getStaticPaths() {
   const projects = await getAllProjects();
-  return projects.map((p: any) => ({ params: { slug: p.slug.current } }));
+  return projects.map((p: any) => ({ params: { slug: p.slug } }));
 }
 
 const { slug } = Astro.params;
@@ -13,23 +12,23 @@ const project = await getProject(slug!);
 
 if (!project) return Astro.redirect("/projekte");
 
-const bodyHtml = project.body ? toHTML(project.body) : "";
+const bodyHtml = project.body ?? "";
 ---
 
 <Layout
   title={project.title}
   description={project.summary}
-  ogImage={project.image?.asset?.url}
+  ogImage={project.image ? imageUrl(project.image) : undefined}
 >
   <!-- Breadcrumb -->
   <div class="max-w-6xl mx-auto px-4 pt-6">
     <a href="/projekte" class="text-sm text-[var(--color-text-muted)] hover:text-[var(--color-primary)]">← Alle Projekte</a>
   </div>
 
-  {project.image?.asset?.url && (
+  {project.image && (
     <div class="max-w-6xl mx-auto px-4 mt-6">
       <div class="aspect-video rounded-3xl overflow-hidden">
-        <img src={`${project.image.asset.url}?w=1200&auto=format`} alt={project.title} class="w-full h-full object-cover" />
+        <img src={imageUrl(project.image, 1200)} alt={project.title} class="w-full h-full object-cover" />
       </div>
     </div>
   )}
@@ -38,7 +37,7 @@ const bodyHtml = project.body ? toHTML(project.body) : "";
     <div class="max-w-3xl">
       <div class="flex items-center gap-3 mb-4 text-sm text-[var(--color-text-muted)]">
         {project.date && <span>📅 {project.date}</span>}
-        {project.targetGroup && <span>👥 {project.targetGroup}</span>}
+        {project.target_group && <span>👥 {project.target_group}</span>}
       </div>
       <h1 class="font-brand text-4xl md:text-5xl text-[var(--color-text)] mb-6">{project.title}</h1>
       <p class="text-xl text-[var(--color-text-muted)] leading-relaxed mb-8">{project.summary}</p>