feat: Add Academy, Whistleblower, Incidents SDK modules, pitch-deck, blog and CI/CD config

- Academy, Whistleblower, Incidents frontend pages with API proxies and types
- Vendor compliance API proxy route
- Go backend handlers and models for all new SDK modules
- Investor pitch-deck app with interactive slides
- Blog section with DSGVO, AI Act, NIS2, glossary articles
- MkDocs documentation site
- CI/CD pipelines (Woodpecker, GitHub Actions), security scanning config
- Planning and implementation documentation

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

website/app/blog/dsgvo-vvt-erstellen/page.tsx

@@ -0,0 +1,725 @@
+import { Metadata } from 'next'
+
+export const metadata: Metadata = {
+  title: 'VVT erstellen - Schritt-fuer-Schritt Anleitung | BreakPilot Comply',
+  description: 'Lernen Sie, wie Sie ein DSGVO-konformes Verzeichnis von Verarbeitungstaetigkeiten (VVT) nach Art. 30 erstellen.',
+  openGraph: {
+    title: 'VVT erstellen - Schritt-fuer-Schritt Anleitung',
+    description: 'Lernen Sie, wie Sie ein DSGVO-konformes Verzeichnis von Verarbeitungstaetigkeiten (VVT) nach Art. 30 erstellen.',
+    type: 'article',
+    locale: 'de_DE',
+  },
+}
+
+export default function VVTErstellenPage() {
+  return (
+    <div className="min-h-screen bg-white">
+      {/* Hero Section */}
+      <section className="bg-gradient-to-br from-sky-50 via-white to-fuchsia-50 border-b border-gray-100">
+        <div className="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 py-12 sm:py-16">
+          <div className="flex items-center gap-2 mb-6">
+            <span className="inline-flex items-center px-3 py-1 rounded-full text-sm font-medium bg-sky-100 text-sky-700">
+              DSGVO-Leitfaden
+            </span>
+            <span className="inline-flex items-center px-3 py-1 rounded-full text-sm font-medium bg-gray-100 text-gray-600">
+              Art. 30 DSGVO
+            </span>
+          </div>
+          <h1 className="text-4xl sm:text-5xl font-bold text-gray-900 leading-tight mb-6">
+            Verzeichnis von Verarbeitungstaetigkeiten (VVT) erstellen
+          </h1>
+          <p className="text-xl text-gray-600 leading-relaxed max-w-3xl">
+            Eine umfassende Schritt-fuer-Schritt Anleitung zur Erstellung eines
+            DSGVO-konformen VVT nach Art. 30 &ndash; mit Vorlagen, Praxistipps und
+            haeufigen Fehlern, die Sie vermeiden sollten.
+          </p>
+          <div className="flex items-center gap-4 mt-8 text-sm text-gray-500">
+            <span>Aktualisiert: Februar 2026</span>
+            <span className="w-1 h-1 rounded-full bg-gray-300" />
+            <span>Lesezeit: ca. 12 Minuten</span>
+          </div>
+        </div>
+      </section>
+
+      {/* Table of Contents */}
+      <nav className="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 py-8 border-b border-gray-100">
+        <h2 className="text-sm font-semibold text-gray-500 uppercase tracking-wider mb-4">Inhalt</h2>
+        <ol className="grid sm:grid-cols-2 gap-2 text-gray-700">
+          <li className="flex items-start gap-2">
+            <span className="text-sky-500 font-semibold">1.</span>
+            <a href="#was-ist-vvt" className="hover:text-sky-600 transition-colors">Was ist ein VVT?</a>
+          </li>
+          <li className="flex items-start gap-2">
+            <span className="text-sky-500 font-semibold">2.</span>
+            <a href="#wer-muss-vvt-fuehren" className="hover:text-sky-600 transition-colors">Wer muss ein VVT fuehren?</a>
+          </li>
+          <li className="flex items-start gap-2">
+            <span className="text-sky-500 font-semibold">3.</span>
+            <a href="#pflichtinhalte" className="hover:text-sky-600 transition-colors">Was muss im VVT stehen?</a>
+          </li>
+          <li className="flex items-start gap-2">
+            <span className="text-sky-500 font-semibold">4.</span>
+            <a href="#schritt-fuer-schritt" className="hover:text-sky-600 transition-colors">Schritt-fuer-Schritt Anleitung</a>
+          </li>
+          <li className="flex items-start gap-2">
+            <span className="text-sky-500 font-semibold">5.</span>
+            <a href="#haeufige-fehler" className="hover:text-sky-600 transition-colors">Haeufige Fehler vermeiden</a>
+          </li>
+          <li className="flex items-start gap-2">
+            <span className="text-sky-500 font-semibold">6.</span>
+            <a href="#vvt-vorlage" className="hover:text-sky-600 transition-colors">VVT-Vorlage mit Beispieleintraegen</a>
+          </li>
+          <li className="flex items-start gap-2">
+            <span className="text-sky-500 font-semibold">7.</span>
+            <a href="#automatisierung" className="hover:text-sky-600 transition-colors">Automatisierung mit BreakPilot Comply</a>
+          </li>
+        </ol>
+      </nav>
+
+      {/* Article Content */}
+      <article className="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
+
+        {/* Section 1: Was ist ein VVT? */}
+        <section id="was-ist-vvt">
+          <h2 className="text-2xl font-bold text-gray-900 mt-12 mb-4">
+            1. Was ist ein Verzeichnis von Verarbeitungstaetigkeiten?
+          </h2>
+          <p className="text-gray-600 leading-relaxed mb-4">
+            Das Verzeichnis von Verarbeitungstaetigkeiten (VVT) ist ein zentrales Dokumentationsinstrument der
+            Datenschutz-Grundverordnung (DSGVO). Es erfasst systematisch alle Prozesse innerhalb einer Organisation,
+            bei denen personenbezogene Daten verarbeitet werden. Das VVT bildet damit das Rueckgrat Ihres
+            Datenschutzmanagements und dient als Nachweis gegenueber Aufsichtsbehoerden, dass Sie Ihre
+            Rechenschaftspflicht nach Art. 5 Abs. 2 DSGVO ernst nehmen.
+          </p>
+
+          {/* Legal Reference Box */}
+          <div className="bg-gray-50 border border-gray-200 rounded-xl p-6 mb-6">
+            <div className="flex items-start gap-3">
+              <div className="flex-shrink-0 w-10 h-10 bg-gray-200 rounded-lg flex items-center justify-center">
+                <svg className="w-5 h-5 text-gray-600" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                  <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5c1.747 0 3.332.477 4.5 1.253v13C19.832 18.477 18.247 18 16.5 18c-1.746 0-3.332.477-4.5 1.253" />
+                </svg>
+              </div>
+              <div>
+                <h4 className="font-semibold text-gray-800 mb-1">Rechtsgrundlage: Art. 30 DSGVO</h4>
+                <p className="text-gray-600 text-sm leading-relaxed">
+                  &laquo;Jeder Verantwortliche und gegebenenfalls sein Vertreter fuehren ein Verzeichnis aller
+                  Verarbeitungstaetigkeiten, die ihrer Zustaendigkeit unterliegen.&raquo; &ndash; Art. 30 Abs. 1 Satz 1 DSGVO.
+                  Das VVT muss schriftlich gefuehrt werden, wobei ein elektronisches Format zulaessig ist (Art. 30 Abs. 3).
+                </p>
+              </div>
+            </div>
+          </div>
+
+          <p className="text-gray-600 leading-relaxed mb-4">
+            Konkret bedeutet das: Jedes Mal, wenn Ihre Organisation personenbezogene Daten erhebt, speichert,
+            uebertraegt, aendert oder loescht, stellt dies eine Verarbeitungstaetigkeit dar, die im VVT
+            dokumentiert werden muss. Typische Beispiele sind die Lohn- und Gehaltsabrechnung, das
+            Bewerbermanagement, der Betrieb einer Website mit Kontaktformular oder die Nutzung von
+            Cloud-Diensten zur E-Mail-Kommunikation.
+          </p>
+          <p className="text-gray-600 leading-relaxed mb-4">
+            Das VVT ist kein einmaliges Projekt, sondern ein lebendes Dokument: Es muss fortlaufend aktualisiert
+            werden, wenn neue Verarbeitungen hinzukommen, bestehende sich aendern oder Verarbeitungen eingestellt
+            werden. Aufsichtsbehoerden koennen das VVT jederzeit anfordern &ndash; eine fehlende oder unvollstaendige
+            Dokumentation kann Bussgelder nach Art. 83 Abs. 4 lit. a DSGVO nach sich ziehen.
+          </p>
+        </section>
+
+        {/* Section 2: Wer muss ein VVT fuehren? */}
+        <section id="wer-muss-vvt-fuehren">
+          <h2 className="text-2xl font-bold text-gray-900 mt-12 mb-4">
+            2. Wer muss ein VVT fuehren?
+          </h2>
+          <p className="text-gray-600 leading-relaxed mb-4">
+            Die kurze Antwort: Nahezu jede Organisation. Art. 30 Abs. 5 DSGVO sieht zwar eine Ausnahme fuer
+            Unternehmen mit weniger als 250 Mitarbeitern vor, doch diese Ausnahme greift nur, wenn die
+            Verarbeitung nicht regelmaessig erfolgt, keine Risiken fuer Betroffene birgt und keine besonderen
+            Datenkategorien (Art. 9) betrifft. In der Praxis erfuellt kaum ein Unternehmen alle drei Bedingungen
+            gleichzeitig &ndash; bereits eine regelmaessige Kundendatenbank oder Lohnbuchhaltung macht das VVT zur Pflicht.
+          </p>
+
+          <h3 className="text-xl font-semibold text-gray-800 mt-8 mb-3">
+            Pflichten fuer Verantwortliche (Art. 30 Abs. 1)
+          </h3>
+          <p className="text-gray-600 leading-relaxed mb-4">
+            Als Verantwortlicher &ndash; also die natuerliche oder juristische Person, die ueber Zwecke und Mittel der
+            Verarbeitung entscheidet &ndash; muessen Sie ein umfassendes VVT fuehren. Dies betrifft jedes Unternehmen,
+            jeden Verein, jede Behoerde und jede Bildungseinrichtung, die personenbezogene Daten verarbeitet.
+            Das VVT des Verantwortlichen umfasst die meisten Pflichtangaben und bildet die Grundlage fuer
+            alle weiteren Datenschutzmassnahmen wie die Datenschutz-Folgenabschaetzung (DSFA) oder die
+            Beantwortung von Betroffenenanfragen.
+          </p>
+
+          <h3 className="text-xl font-semibold text-gray-800 mt-8 mb-3">
+            Pflichten fuer Auftragsverarbeiter (Art. 30 Abs. 2)
+          </h3>
+          <p className="text-gray-600 leading-relaxed mb-4">
+            Auch Auftragsverarbeiter &ndash; also Dienstleister, die personenbezogene Daten im Auftrag des
+            Verantwortlichen verarbeiten &ndash; muessen ein eigenes VVT fuehren. Typische Beispiele sind
+            Cloud-Anbieter, IT-Dienstleister, Lohnbueros oder Hosting-Provider. Das VVT des
+            Auftragsverarbeiters ist weniger umfangreich, muss aber dennoch Kategorien der Verarbeitungen,
+            Angaben zu Drittlandsuebermittlungen und die technisch-organisatorischen Massnahmen (TOMs) enthalten.
+          </p>
+
+          {/* Tip Box */}
+          <div className="bg-sky-50 border-l-4 border-sky-500 rounded-r-xl p-5 mb-6">
+            <div className="flex items-start gap-3">
+              <svg className="w-5 h-5 text-sky-500 flex-shrink-0 mt-0.5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
+              </svg>
+              <div>
+                <h4 className="font-semibold text-sky-800 mb-1">Praxistipp</h4>
+                <p className="text-sky-700 text-sm leading-relaxed">
+                  Auch wenn Sie glauben, unter die Ausnahme des Art. 30 Abs. 5 zu fallen: Fuehren Sie trotzdem
+                  ein VVT. Ohne Verzeichnis koennen Sie die Rechenschaftspflicht nach Art. 5 Abs. 2 DSGVO
+                  kaum erfuellen. Im Ernstfall muss Ihre Organisation nachweisen, dass die Ausnahme greift &ndash;
+                  und genau das erfordert eine Dokumentation, die dem VVT stark aehnelt.
+                </p>
+              </div>
+            </div>
+          </div>
+
+          <h3 className="text-xl font-semibold text-gray-800 mt-8 mb-3">
+            Sonderfall: Bildungseinrichtungen und Schulen
+          </h3>
+          <p className="text-gray-600 leading-relaxed mb-4">
+            Schulen und Bildungseinrichtungen verarbeiten regelmaessig besonders schuetzenswerte Daten von
+            Minderjaehrigen. Hier gelten erhoehte Anforderungen: Noten, Fehlzeiten, Foerdermassnahmen und
+            gesundheitliche Einschraenkungen gehoeren zu den Kategorien, die besonderer Sorgfalt beduerfen.
+            Das VVT muss hier besonders detailliert die Rechtsgrundlagen (haeufig Art. 6 Abs. 1 lit. e DSGVO
+            in Verbindung mit den jeweiligen Landesschulgesetzen) und die Loeschfristen dokumentieren.
+          </p>
+        </section>
+
+        {/* Section 3: Was muss im VVT stehen? */}
+        <section id="pflichtinhalte">
+          <h2 className="text-2xl font-bold text-gray-900 mt-12 mb-4">
+            3. Was muss im VVT stehen? &ndash; Pflichtinhalte nach Art. 30 Abs. 1
+          </h2>
+          <p className="text-gray-600 leading-relaxed mb-4">
+            Art. 30 Abs. 1 DSGVO definiert einen Mindestkatalog an Angaben, die jede Verarbeitungstaetigkeit
+            im VVT enthalten muss. Die folgende Tabelle zeigt alle Pflichtfelder mit Erlaeuterungen und
+            konkreten Beispielen aus der Praxis.
+          </p>
+
+          <div className="overflow-x-auto mb-6">
+            <table className="w-full border-collapse text-sm">
+              <thead>
+                <tr className="bg-gray-900 text-white">
+                  <th className="text-left px-4 py-3 font-semibold rounded-tl-lg">Pflichtfeld</th>
+                  <th className="text-left px-4 py-3 font-semibold">Rechtsgrundlage</th>
+                  <th className="text-left px-4 py-3 font-semibold rounded-tr-lg">Beispiel</th>
+                </tr>
+              </thead>
+              <tbody>
+                <tr className="border-b border-gray-100">
+                  <td className="px-4 py-3 font-medium text-gray-800">Name und Kontaktdaten des Verantwortlichen</td>
+                  <td className="px-4 py-3 text-gray-600">Art. 30 Abs. 1 lit. a</td>
+                  <td className="px-4 py-3 text-gray-600">Musterfirma GmbH, Musterstr. 1, 10115 Berlin</td>
+                </tr>
+                <tr className="border-b border-gray-100 bg-gray-50">
+                  <td className="px-4 py-3 font-medium text-gray-800">Name des Datenschutzbeauftragten</td>
+                  <td className="px-4 py-3 text-gray-600">Art. 30 Abs. 1 lit. a</td>
+                  <td className="px-4 py-3 text-gray-600">Dr. Maria Muster, dsb@musterfirma.de</td>
+                </tr>
+                <tr className="border-b border-gray-100">
+                  <td className="px-4 py-3 font-medium text-gray-800">Zwecke der Verarbeitung</td>
+                  <td className="px-4 py-3 text-gray-600">Art. 30 Abs. 1 lit. b</td>
+                  <td className="px-4 py-3 text-gray-600">Durchfuehrung des Beschaeftigungsverhaeltnisses</td>
+                </tr>
+                <tr className="border-b border-gray-100 bg-gray-50">
+                  <td className="px-4 py-3 font-medium text-gray-800">Kategorien betroffener Personen</td>
+                  <td className="px-4 py-3 text-gray-600">Art. 30 Abs. 1 lit. c</td>
+                  <td className="px-4 py-3 text-gray-600">Beschaeftigte, Bewerber, Kunden</td>
+                </tr>
+                <tr className="border-b border-gray-100">
+                  <td className="px-4 py-3 font-medium text-gray-800">Kategorien personenbezogener Daten</td>
+                  <td className="px-4 py-3 text-gray-600">Art. 30 Abs. 1 lit. c</td>
+                  <td className="px-4 py-3 text-gray-600">Stammdaten, Kontaktdaten, Bankverbindung</td>
+                </tr>
+                <tr className="border-b border-gray-100 bg-gray-50">
+                  <td className="px-4 py-3 font-medium text-gray-800">Kategorien von Empfaengern</td>
+                  <td className="px-4 py-3 text-gray-600">Art. 30 Abs. 1 lit. d</td>
+                  <td className="px-4 py-3 text-gray-600">Finanzbehorden, Sozialversicherungstraeger, Steuerberater</td>
+                </tr>
+                <tr className="border-b border-gray-100">
+                  <td className="px-4 py-3 font-medium text-gray-800">Uebermittlungen in Drittlaender</td>
+                  <td className="px-4 py-3 text-gray-600">Art. 30 Abs. 1 lit. e</td>
+                  <td className="px-4 py-3 text-gray-600">USA (Standardvertragsklauseln), kein Transfer</td>
+                </tr>
+                <tr className="border-b border-gray-100 bg-gray-50">
+                  <td className="px-4 py-3 font-medium text-gray-800">Loeschfristen</td>
+                  <td className="px-4 py-3 text-gray-600">Art. 30 Abs. 1 lit. f</td>
+                  <td className="px-4 py-3 text-gray-600">3 Jahre nach Ende des Beschaeftigungsverhaeltnisses</td>
+                </tr>
+                <tr>
+                  <td className="px-4 py-3 font-medium text-gray-800 rounded-bl-lg">Technisch-organisatorische Massnahmen (TOMs)</td>
+                  <td className="px-4 py-3 text-gray-600">Art. 30 Abs. 1 lit. g</td>
+                  <td className="px-4 py-3 text-gray-600 rounded-br-lg">Verschluesselung, Zugriffskontrolle, Backups</td>
+                </tr>
+              </tbody>
+            </table>
+          </div>
+
+          {/* Legal Reference Box */}
+          <div className="bg-gray-50 border border-gray-200 rounded-xl p-6 mb-6">
+            <div className="flex items-start gap-3">
+              <div className="flex-shrink-0 w-10 h-10 bg-gray-200 rounded-lg flex items-center justify-center">
+                <svg className="w-5 h-5 text-gray-600" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                  <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5c1.747 0 3.332.477 4.5 1.253v13C19.832 18.477 18.247 18 16.5 18c-1.746 0-3.332.477-4.5 1.253" />
+                </svg>
+              </div>
+              <div>
+                <h4 className="font-semibold text-gray-800 mb-1">Hinweis: Empfohlene Zusatzangaben</h4>
+                <p className="text-gray-600 text-sm leading-relaxed">
+                  Ueber die Pflichtfelder hinaus empfehlen Aufsichtsbehoerden wie die DSK (Datenschutzkonferenz),
+                  weitere Felder aufzunehmen: die Rechtsgrundlage der Verarbeitung (Art. 6 Abs. 1 DSGVO),
+                  die verantwortliche Fachabteilung, das Datum der letzten Aktualisierung sowie einen
+                  Verweis auf eine durchgefuehrte Datenschutz-Folgenabschaetzung (DSFA), falls erforderlich.
+                </p>
+              </div>
+            </div>
+          </div>
+        </section>
+
+        {/* Section 4: Schritt-fuer-Schritt */}
+        <section id="schritt-fuer-schritt">
+          <h2 className="text-2xl font-bold text-gray-900 mt-12 mb-4">
+            4. VVT erstellen &ndash; Schritt-fuer-Schritt Anleitung
+          </h2>
+          <p className="text-gray-600 leading-relaxed mb-6">
+            Die Erstellung eines VVT wirkt auf den ersten Blick komplex, laesst sich aber in fuenf
+            ueberschaubare Schritte gliedern. Gehen Sie methodisch vor und beziehen Sie alle Fachabteilungen
+            Ihrer Organisation ein.
+          </p>
+
+          {/* Step 1 */}
+          <div className="bg-sky-50 border-l-4 border-sky-500 rounded-r-xl p-6 mb-6">
+            <div className="flex items-start gap-4">
+              <span className="flex-shrink-0 w-10 h-10 bg-sky-500 text-white rounded-full flex items-center justify-center font-bold text-lg">
+                1
+              </span>
+              <div>
+                <h3 className="text-xl font-semibold text-gray-800 mb-2">Bestandsaufnahme aller Verarbeitungen</h3>
+                <p className="text-gray-600 leading-relaxed mb-3">
+                  Erfassen Sie zunaechst alle Prozesse in Ihrer Organisation, bei denen personenbezogene
+                  Daten verarbeitet werden. Fuehren Sie Interviews mit den Leitern aller Fachabteilungen:
+                  Personalwesen, Vertrieb, Marketing, IT, Finanzbuchhaltung, Kundenservice und Geschaeftsfuehrung.
+                </p>
+                <p className="text-gray-600 leading-relaxed">
+                  <span className="font-medium text-gray-800">Praxistipp:</span> Starten Sie mit einer einfachen
+                  Frage an jede Abteilung: &laquo;Welche personenbezogenen Daten verarbeiten Sie im Tagesgeschaeft und
+                  welche Software-Systeme nutzen Sie dafuer?&raquo; Erstellen Sie daraus eine Rohliste aller
+                  Verarbeitungstaetigkeiten. Vergessen Sie nicht die weniger offensichtlichen Prozesse wie
+                  Videoüberwachung, Zugangskontrollsysteme oder die Nutzung von Messenger-Diensten.
+                </p>
+              </div>
+            </div>
+          </div>
+
+          {/* Step 2 */}
+          <div className="bg-sky-50 border-l-4 border-sky-500 rounded-r-xl p-6 mb-6">
+            <div className="flex items-start gap-4">
+              <span className="flex-shrink-0 w-10 h-10 bg-sky-500 text-white rounded-full flex items-center justify-center font-bold text-lg">
+                2
+              </span>
+              <div>
+                <h3 className="text-xl font-semibold text-gray-800 mb-2">Verarbeitungen strukturiert dokumentieren</h3>
+                <p className="text-gray-600 leading-relaxed mb-3">
+                  Ueberfuehren Sie die Rohliste in ein strukturiertes Format. Fuer jede Verarbeitungstaetigkeit
+                  erfassen Sie alle Pflichtangaben nach Art. 30 Abs. 1 (siehe Tabelle oben). Verwenden Sie eine
+                  einheitliche Vorlage, damit alle Eintraege konsistent und vergleichbar sind.
+                </p>
+                <p className="text-gray-600 leading-relaxed">
+                  <span className="font-medium text-gray-800">Praxistipp:</span> Gruppieren Sie die Verarbeitungen
+                  nach Fachabteilungen oder Geschaeftsprozessen. Typische Gruppierungen sind: Personalverwaltung,
+                  Kundenbeziehungsmanagement, Marketingmassnahmen, IT-Betrieb, Finanzen/Buchhaltung und
+                  Kommunikation. Innerhalb jeder Gruppe benennen Sie die konkreten Einzelverarbeitungen.
+                </p>
+              </div>
+            </div>
+          </div>
+
+          {/* Step 3 */}
+          <div className="bg-sky-50 border-l-4 border-sky-500 rounded-r-xl p-6 mb-6">
+            <div className="flex items-start gap-4">
+              <span className="flex-shrink-0 w-10 h-10 bg-sky-500 text-white rounded-full flex items-center justify-center font-bold text-lg">
+                3
+              </span>
+              <div>
+                <h3 className="text-xl font-semibold text-gray-800 mb-2">Rechtsgrundlagen und Loeschfristen festlegen</h3>
+                <p className="text-gray-600 leading-relaxed mb-3">
+                  Bestimmen Sie fuer jede Verarbeitungstaetigkeit die passende Rechtsgrundlage nach Art. 6 Abs. 1
+                  DSGVO. Die gaengigsten sind: Einwilligung (lit. a), Vertragserfullung (lit. b), rechtliche
+                  Verpflichtung (lit. c) und berechtigtes Interesse (lit. f). Dokumentieren Sie fuer jede Rechtsgrundlage
+                  eine konkrete Begruendung.
+                </p>
+                <p className="text-gray-600 leading-relaxed">
+                  Legen Sie anschliessend die Loeschfristen fest. Diese ergeben sich aus gesetzlichen
+                  Aufbewahrungspflichten (z.B. 6 Jahre fuer Geschaeftsbriefe nach HGB, 10 Jahre fuer Buchungsbelege
+                  nach AO) und dem Grundsatz der Speicherbegrenzung (Art. 5 Abs. 1 lit. e DSGVO). Wo keine
+                  gesetzliche Aufbewahrungspflicht besteht, sollten Daten nach Zweckerfullung zeitnah geloescht werden.
+                </p>
+              </div>
+            </div>
+          </div>
+
+          {/* Step 4 */}
+          <div className="bg-sky-50 border-l-4 border-sky-500 rounded-r-xl p-6 mb-6">
+            <div className="flex items-start gap-4">
+              <span className="flex-shrink-0 w-10 h-10 bg-sky-500 text-white rounded-full flex items-center justify-center font-bold text-lg">
+                4
+              </span>
+              <div>
+                <h3 className="text-xl font-semibold text-gray-800 mb-2">Technisch-organisatorische Massnahmen (TOMs) zuordnen</h3>
+                <p className="text-gray-600 leading-relaxed mb-3">
+                  Ordnen Sie jeder Verarbeitungstaetigkeit die relevanten Schutzmassnahmen zu. Die TOMs muessen
+                  dem Stand der Technik entsprechen und ein dem Risiko angemessenes Schutzniveau gewaehrleisten
+                  (Art. 32 DSGVO). Unterscheiden Sie zwischen technischen Massnahmen (Verschluesselung,
+                  Pseudonymisierung, Firewalls, Zugriffskontrollen) und organisatorischen Massnahmen
+                  (Schulungen, Vertraulichkeitsvereinbarungen, Vier-Augen-Prinzip, Berechtigungskonzepte).
+                </p>
+                <p className="text-gray-600 leading-relaxed">
+                  <span className="font-medium text-gray-800">Praxistipp:</span> Erstellen Sie ein zentrales
+                  TOM-Dokument, auf das Sie im VVT referenzieren koennen. So vermeiden Sie Redundanzen und
+                  stellen sicher, dass Aenderungen an den TOMs automatisch fuer alle betroffenen
+                  Verarbeitungstaetigkeiten gelten.
+                </p>
+              </div>
+            </div>
+          </div>
+
+          {/* Step 5 */}
+          <div className="bg-sky-50 border-l-4 border-sky-500 rounded-r-xl p-6 mb-6">
+            <div className="flex items-start gap-4">
+              <span className="flex-shrink-0 w-10 h-10 bg-sky-500 text-white rounded-full flex items-center justify-center font-bold text-lg">
+                5
+              </span>
+              <div>
+                <h3 className="text-xl font-semibold text-gray-800 mb-2">Regelmaessige Ueberpruefung und Aktualisierung</h3>
+                <p className="text-gray-600 leading-relaxed mb-3">
+                  Ein VVT ist nur nuetzlich, wenn es aktuell ist. Definieren Sie einen festen Review-Zyklus &ndash;
+                  mindestens jaehrlich, idealerweise quartalsweise. Legen Sie ausserdem fest, bei welchen Ereignissen
+                  eine sofortige Aktualisierung erfolgen muss: Einfuehrung neuer Software, Wechsel von Dienstleistern,
+                  organisatorische Umstrukturierungen oder Aenderungen gesetzlicher Rahmenbedingungen.
+                </p>
+                <p className="text-gray-600 leading-relaxed">
+                  <span className="font-medium text-gray-800">Praxistipp:</span> Benennen Sie fuer jede
+                  Verarbeitungstaetigkeit einen fachlichen Verantwortlichen, der Aenderungen meldet. Verknuepfen
+                  Sie das VVT-Review mit bestehenden Prozessen wie dem Aenderungsmanagement (Change Management)
+                  oder dem jaehrlichen Audit-Zyklus Ihrer Organisation.
+                </p>
+              </div>
+            </div>
+          </div>
+        </section>
+
+        {/* Section 5: Haeufige Fehler */}
+        <section id="haeufige-fehler">
+          <h2 className="text-2xl font-bold text-gray-900 mt-12 mb-4">
+            5. Haeufige Fehler beim VVT &ndash; und wie Sie sie vermeiden
+          </h2>
+          <p className="text-gray-600 leading-relaxed mb-6">
+            Aus unserer Erfahrung in der Beratung von Schulen und Bildungseinrichtungen sehen wir immer
+            wieder dieselben Stolperfallen. Vermeiden Sie diese vier haeufigen Fehler von Anfang an.
+          </p>
+
+          {/* Mistake 1 */}
+          <div className="bg-amber-50 border-l-4 border-amber-500 rounded-r-xl p-5 mb-5">
+            <div className="flex items-start gap-3">
+              <svg className="w-6 h-6 text-amber-500 flex-shrink-0 mt-0.5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-2.5L13.732 4c-.77-.833-1.964-.833-2.732 0L4.082 16.5c-.77.833.192 2.5 1.732 2.5z" />
+              </svg>
+              <div>
+                <h4 className="font-semibold text-amber-800 mb-1">Fehler 1: VVT nur einmal erstellen und nie aktualisieren</h4>
+                <p className="text-amber-700 text-sm leading-relaxed">
+                  Viele Organisationen erstellen ein VVT im Rahmen eines Projekts und legen es dann ab. Doch
+                  ein veraltetes VVT ist fast so schlecht wie gar keines &ndash; es taeuscht Compliance vor, die nicht
+                  existiert. Neue Tools, Dienstleister oder Prozesse werden nicht erfasst, und im Ernstfall
+                  stimmt die Dokumentation nicht mit der Realitaet ueberein. Richten Sie automatische
+                  Erinnerungen ein und machen Sie das VVT-Review zum festen Bestandteil Ihres Datenschutzkalenders.
+                </p>
+              </div>
+            </div>
+          </div>
+
+          {/* Mistake 2 */}
+          <div className="bg-amber-50 border-l-4 border-amber-500 rounded-r-xl p-5 mb-5">
+            <div className="flex items-start gap-3">
+              <svg className="w-6 h-6 text-amber-500 flex-shrink-0 mt-0.5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-2.5L13.732 4c-.77-.833-1.964-.833-2.732 0L4.082 16.5c-.77.833.192 2.5 1.732 2.5z" />
+              </svg>
+              <div>
+                <h4 className="font-semibold text-amber-800 mb-1">Fehler 2: Zu grobe Granularitaet der Verarbeitungen</h4>
+                <p className="text-amber-700 text-sm leading-relaxed">
+                  Ein Eintrag wie &laquo;Personalwesen&raquo; ist viel zu allgemein. Unterschiedliche Verarbeitungstaetigkeiten
+                  innerhalb einer Abteilung haben oft unterschiedliche Rechtsgrundlagen, Loeschfristen und
+                  Empfaengerkreise. Trennen Sie zum Beispiel: Bewerbermanagement (Rechtsgrundlage: Art. 6 Abs. 1 lit. b,
+                  Loeschfrist: 6 Monate), Lohnabrechnung (Rechtsgrundlage: Art. 6 Abs. 1 lit. c, Loeschfrist: 10 Jahre)
+                  und Zeiterfassung (Rechtsgrundlage: Art. 6 Abs. 1 lit. b, Loeschfrist: 2 Jahre).
+                </p>
+              </div>
+            </div>
+          </div>
+
+          {/* Mistake 3 */}
+          <div className="bg-amber-50 border-l-4 border-amber-500 rounded-r-xl p-5 mb-5">
+            <div className="flex items-start gap-3">
+              <svg className="w-6 h-6 text-amber-500 flex-shrink-0 mt-0.5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-2.5L13.732 4c-.77-.833-1.964-.833-2.732 0L4.082 16.5c-.77.833.192 2.5 1.732 2.5z" />
+              </svg>
+              <div>
+                <h4 className="font-semibold text-amber-800 mb-1">Fehler 3: Drittlandsuebermittlungen uebersehen</h4>
+                <p className="text-amber-700 text-sm leading-relaxed">
+                  Cloud-Dienste wie Google Workspace, Microsoft 365 oder Zoom uebermitteln Daten in Drittlaender
+                  (insbesondere die USA). Diese Uebermittlungen muessen im VVT dokumentiert und mit geeigneten
+                  Garantien abgesichert werden &ndash; etwa durch Standardvertragsklauseln (SCCs) oder einen
+                  Angemessenheitsbeschluss. Pruefen Sie fuer jeden eingesetzten Dienstleister, wo die Daten
+                  tatsaechlich gespeichert und verarbeitet werden, und halten Sie die Ergebnisse im VVT fest.
+                </p>
+              </div>
+            </div>
+          </div>
+
+          {/* Mistake 4 */}
+          <div className="bg-amber-50 border-l-4 border-amber-500 rounded-r-xl p-5 mb-5">
+            <div className="flex items-start gap-3">
+              <svg className="w-6 h-6 text-amber-500 flex-shrink-0 mt-0.5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-2.5L13.732 4c-.77-.833-1.964-.833-2.732 0L4.082 16.5c-.77.833.192 2.5 1.732 2.5z" />
+              </svg>
+              <div>
+                <h4 className="font-semibold text-amber-800 mb-1">Fehler 4: Fehlende Einbindung der Fachabteilungen</h4>
+                <p className="text-amber-700 text-sm leading-relaxed">
+                  Das VVT darf kein reines Datenschutz-Projekt sein. Wenn nur der DSB oder die IT-Abteilung
+                  das Verzeichnis pflegt, werden zwangslaeufig Verarbeitungen uebersehen. Jede Fachabteilung
+                  kennt ihre eigenen Prozesse am besten und muss aktiv in die Erstellung und Pflege eingebunden
+                  werden. Benennen Sie Datenschutzkoordinatoren in jeder Abteilung, die als Ansprechpartner
+                  fuer VVT-relevante Aenderungen dienen.
+                </p>
+              </div>
+            </div>
+          </div>
+        </section>
+
+        {/* Section 6: VVT-Vorlage */}
+        <section id="vvt-vorlage">
+          <h2 className="text-2xl font-bold text-gray-900 mt-12 mb-4">
+            6. VVT-Vorlage mit Beispieleintraegen
+          </h2>
+          <p className="text-gray-600 leading-relaxed mb-6">
+            Die folgende Tabelle zeigt drei beispielhafte Eintraege, wie sie in einem VVT einer
+            Bildungseinrichtung aussehen koennten. Nutzen Sie dieses Format als Ausgangspunkt fuer
+            Ihr eigenes Verzeichnis.
+          </p>
+
+          <div className="overflow-x-auto mb-6">
+            <table className="w-full border-collapse text-sm">
+              <thead>
+                <tr className="bg-gray-900 text-white">
+                  <th className="text-left px-3 py-3 font-semibold rounded-tl-lg whitespace-nowrap">Feld</th>
+                  <th className="text-left px-3 py-3 font-semibold whitespace-nowrap">Schueleranmeldung</th>
+                  <th className="text-left px-3 py-3 font-semibold whitespace-nowrap">Lohn- und Gehaltsabrechnung</th>
+                  <th className="text-left px-3 py-3 font-semibold rounded-tr-lg whitespace-nowrap">Website-Betrieb</th>
+                </tr>
+              </thead>
+              <tbody>
+                <tr className="border-b border-gray-100">
+                  <td className="px-3 py-3 font-medium text-gray-800 whitespace-nowrap">Bezeichnung</td>
+                  <td className="px-3 py-3 text-gray-600">Anmeldung und Verwaltung von Schuelerdaten</td>
+                  <td className="px-3 py-3 text-gray-600">Abrechnung und Auszahlung von Gehaeltern</td>
+                  <td className="px-3 py-3 text-gray-600">Betrieb der oeffentlichen Website</td>
+                </tr>
+                <tr className="border-b border-gray-100 bg-gray-50">
+                  <td className="px-3 py-3 font-medium text-gray-800 whitespace-nowrap">Verantwortlicher</td>
+                  <td className="px-3 py-3 text-gray-600">Musterschule, Schulstr. 5, 30159 Hannover</td>
+                  <td className="px-3 py-3 text-gray-600">Musterschule, Schulstr. 5, 30159 Hannover</td>
+                  <td className="px-3 py-3 text-gray-600">Musterschule, Schulstr. 5, 30159 Hannover</td>
+                </tr>
+                <tr className="border-b border-gray-100">
+                  <td className="px-3 py-3 font-medium text-gray-800 whitespace-nowrap">Zweck</td>
+                  <td className="px-3 py-3 text-gray-600">Erfuellung der Schulpflicht, Verwaltung des Schulverhaeltnisses</td>
+                  <td className="px-3 py-3 text-gray-600">Durchfuehrung der Beschaeftigungsverhaeltnisse</td>
+                  <td className="px-3 py-3 text-gray-600">Oeffentlichkeitsarbeit, Information der Schulgemeinschaft</td>
+                </tr>
+                <tr className="border-b border-gray-100 bg-gray-50">
+                  <td className="px-3 py-3 font-medium text-gray-800 whitespace-nowrap">Rechtsgrundlage</td>
+                  <td className="px-3 py-3 text-gray-600">Art. 6 Abs. 1 lit. e DSGVO i.V.m. NSchG</td>
+                  <td className="px-3 py-3 text-gray-600">Art. 6 Abs. 1 lit. b, c DSGVO i.V.m. EntgFG, SGB IV</td>
+                  <td className="px-3 py-3 text-gray-600">Art. 6 Abs. 1 lit. f DSGVO (berechtigtes Interesse)</td>
+                </tr>
+                <tr className="border-b border-gray-100">
+                  <td className="px-3 py-3 font-medium text-gray-800 whitespace-nowrap">Betroffene</td>
+                  <td className="px-3 py-3 text-gray-600">Schueler, Erziehungsberechtigte</td>
+                  <td className="px-3 py-3 text-gray-600">Lehrkraefte, Verwaltungspersonal</td>
+                  <td className="px-3 py-3 text-gray-600">Website-Besucher</td>
+                </tr>
+                <tr className="border-b border-gray-100 bg-gray-50">
+                  <td className="px-3 py-3 font-medium text-gray-800 whitespace-nowrap">Datenkategorien</td>
+                  <td className="px-3 py-3 text-gray-600">Name, Geburtsdatum, Adresse, Noten, Fehlzeiten</td>
+                  <td className="px-3 py-3 text-gray-600">Stammdaten, Bankverbindung, Steuer-ID, SV-Nummer</td>
+                  <td className="px-3 py-3 text-gray-600">IP-Adresse, Browser-Typ, Zugriffszeitpunkte</td>
+                </tr>
+                <tr className="border-b border-gray-100">
+                  <td className="px-3 py-3 font-medium text-gray-800 whitespace-nowrap">Empfaenger</td>
+                  <td className="px-3 py-3 text-gray-600">Schulbehoerde, aufnehmende Schule bei Wechsel</td>
+                  <td className="px-3 py-3 text-gray-600">Finanzamt, Krankenkasse, Rentenversicherung</td>
+                  <td className="px-3 py-3 text-gray-600">Hosting-Anbieter (AV-Vertrag)</td>
+                </tr>
+                <tr className="border-b border-gray-100 bg-gray-50">
+                  <td className="px-3 py-3 font-medium text-gray-800 whitespace-nowrap">Drittlandtransfer</td>
+                  <td className="px-3 py-3 text-gray-600">Nein</td>
+                  <td className="px-3 py-3 text-gray-600">Nein</td>
+                  <td className="px-3 py-3 text-gray-600">Nein (EU-Hosting)</td>
+                </tr>
+                <tr className="border-b border-gray-100">
+                  <td className="px-3 py-3 font-medium text-gray-800 whitespace-nowrap">Loeschfrist</td>
+                  <td className="px-3 py-3 text-gray-600">5 Jahre nach Verlassen der Schule</td>
+                  <td className="px-3 py-3 text-gray-600">10 Jahre (Aufbewahrungspflicht AO)</td>
+                  <td className="px-3 py-3 text-gray-600">7 Tage (Serverlogfiles)</td>
+                </tr>
+                <tr>
+                  <td className="px-3 py-3 font-medium text-gray-800 whitespace-nowrap rounded-bl-lg">TOMs</td>
+                  <td className="px-3 py-3 text-gray-600">Rollenbasierte Zugriffskontrolle, verschluesselte Datenbank, Backup</td>
+                  <td className="px-3 py-3 text-gray-600">Verschluesselung, Zugriffsbeschraenkung auf HR, Vier-Augen-Prinzip</td>
+                  <td className="px-3 py-3 text-gray-600 rounded-br-lg">TLS-Verschluesselung, automatische Log-Rotation</td>
+                </tr>
+              </tbody>
+            </table>
+          </div>
+
+          {/* Tip Box */}
+          <div className="bg-sky-50 border-l-4 border-sky-500 rounded-r-xl p-5 mb-6">
+            <div className="flex items-start gap-3">
+              <svg className="w-5 h-5 text-sky-500 flex-shrink-0 mt-0.5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
+              </svg>
+              <div>
+                <h4 className="font-semibold text-sky-800 mb-1">Tabellenformat vs. Einzeldokumente</h4>
+                <p className="text-sky-700 text-sm leading-relaxed">
+                  Fuer kleine Organisationen mit weniger als 20 Verarbeitungen reicht eine Tabellenkalkulation
+                  (z.B. LibreOffice Calc) oft aus. Ab einer gewissen Groesse empfiehlt sich jedoch eine
+                  spezialisierte Software, die Zusammenhaenge zwischen Verarbeitungen, TOMs und Auftragsverarbeitern
+                  automatisch verknuepft und Aenderungen versioniert.
+                </p>
+              </div>
+            </div>
+          </div>
+        </section>
+
+        {/* Section 7: Automatisierung */}
+        <section id="automatisierung">
+          <h2 className="text-2xl font-bold text-gray-900 mt-12 mb-4">
+            7. VVT automatisiert verwalten mit BreakPilot Comply
+          </h2>
+          <p className="text-gray-600 leading-relaxed mb-4">
+            Die manuelle Pflege eines VVT in Tabellenkalkulationen wird mit wachsender Organisationsgroesse
+            schnell unuebersichtlich und fehleranfaellig. BreakPilot Comply bietet eine digitale Loesung, die
+            speziell fuer Bildungseinrichtungen und KMU im DACH-Raum entwickelt wurde.
+          </p>
+
+          <div className="bg-gradient-to-br from-sky-50 to-fuchsia-50 border border-sky-200 rounded-2xl p-8 mb-6">
+            <h3 className="text-xl font-semibold text-gray-800 mb-4">
+              So unterstuetzt BreakPilot Comply Ihr VVT
+            </h3>
+            <ul className="space-y-3">
+              <li className="flex items-start gap-3">
+                <span className="flex-shrink-0 w-6 h-6 bg-sky-500 text-white rounded-full flex items-center justify-center text-sm font-bold mt-0.5">
+                  &#10003;
+                </span>
+                <div>
+                  <span className="font-medium text-gray-800">Vorgefertigte Vorlagen fuer Bildungseinrichtungen:</span>
+                  <span className="text-gray-600"> Starten Sie mit branchenspezifischen Vorlagen, die typische Verarbeitungen
+                  wie Schueleranmeldung, Notenverwaltung, Lernplattformen und Kommunikationssysteme bereits enthalten.</span>
+                </div>
+              </li>
+              <li className="flex items-start gap-3">
+                <span className="flex-shrink-0 w-6 h-6 bg-sky-500 text-white rounded-full flex items-center justify-center text-sm font-bold mt-0.5">
+                  &#10003;
+                </span>
+                <div>
+                  <span className="font-medium text-gray-800">Automatische Verknuepfung mit TOM und DSFA:</span>
+                  <span className="text-gray-600"> Technisch-organisatorische Massnahmen und Datenschutz-Folgenabschaetzungen
+                  werden direkt mit den relevanten VVT-Eintraegen verknuepft &ndash; Aenderungen propagieren automatisch.</span>
+                </div>
+              </li>
+              <li className="flex items-start gap-3">
+                <span className="flex-shrink-0 w-6 h-6 bg-sky-500 text-white rounded-full flex items-center justify-center text-sm font-bold mt-0.5">
+                  &#10003;
+                </span>
+                <div>
+                  <span className="font-medium text-gray-800">Loeschfristen-Management:</span>
+                  <span className="text-gray-600"> Automatische Erinnerungen, wenn Loeschfristen ablaufen. Sie behalten
+                  den Ueberblick ueber alle Aufbewahrungsfristen und koennen die Loeschung dokumentiert nachweisen.</span>
+                </div>
+              </li>
+              <li className="flex items-start gap-3">
+                <span className="flex-shrink-0 w-6 h-6 bg-sky-500 text-white rounded-full flex items-center justify-center text-sm font-bold mt-0.5">
+                  &#10003;
+                </span>
+                <div>
+                  <span className="font-medium text-gray-800">Audit-Trail und Versionierung:</span>
+                  <span className="text-gray-600"> Jede Aenderung am VVT wird mit Zeitstempel und Bearbeiter protokolliert.
+                  Bei einer Pruefung durch die Aufsichtsbehoerde koennen Sie jederzeit nachweisen, wann welche
+                  Anpassung vorgenommen wurde.</span>
+                </div>
+              </li>
+              <li className="flex items-start gap-3">
+                <span className="flex-shrink-0 w-6 h-6 bg-sky-500 text-white rounded-full flex items-center justify-center text-sm font-bold mt-0.5">
+                  &#10003;
+                </span>
+                <div>
+                  <span className="font-medium text-gray-800">DSGVO-konformes Hosting in Deutschland:</span>
+                  <span className="text-gray-600"> Alle Daten werden ausschliesslich auf Servern in Deutschland
+                  verarbeitet und gespeichert. Kein Drittlandtransfer, keine US-Cloud-Abhaengigkeit.</span>
+                </div>
+              </li>
+            </ul>
+
+            {/* CTA */}
+            <div className="mt-8 flex flex-col sm:flex-row items-start sm:items-center gap-4">
+              <a
+                href="/kontakt"
+                className="inline-flex items-center px-6 py-3 bg-sky-500 hover:bg-sky-600 text-white font-semibold rounded-xl transition-colors shadow-lg shadow-sky-500/25"
+              >
+                Kostenlose Demo vereinbaren
+                <svg className="w-5 h-5 ml-2" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                  <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M17 8l4 4m0 0l-4 4m4-4H3" />
+                </svg>
+              </a>
+              <span className="text-sm text-gray-500">Unverbindlich &ndash; kein Vertrag erforderlich</span>
+            </div>
+          </div>
+        </section>
+
+        {/* Conclusion */}
+        <section className="mt-16 pt-8 border-t border-gray-200">
+          <h2 className="text-2xl font-bold text-gray-900 mb-4">Fazit</h2>
+          <p className="text-gray-600 leading-relaxed mb-4">
+            Das Verzeichnis von Verarbeitungstaetigkeiten ist weit mehr als eine laestige Pflichtaufgabe &ndash;
+            es ist das Fundament Ihres gesamten Datenschutzmanagements. Ein sorgfaeltig gepflegtes VVT
+            verschafft Ihnen Transparenz ueber alle Datenverarbeitungen in Ihrer Organisation, erleichtert
+            die Beantwortung von Betroffenenanfragen und schafft Vertrauen bei Aufsichtsbehoerden.
+          </p>
+          <p className="text-gray-600 leading-relaxed mb-4">
+            Beginnen Sie mit der Bestandsaufnahme, dokumentieren Sie systematisch und etablieren Sie
+            einen festen Aktualisierungsrhythmus. Mit den richtigen Werkzeugen und Prozessen wird das
+            VVT vom buerokratischen Aufwand zum echten Mehrwert fuer Ihre Organisation.
+          </p>
+        </section>
+
+        {/* Legal Disclaimer */}
+        <div className="mt-12 bg-gray-50 border border-gray-200 rounded-xl p-6">
+          <p className="text-gray-500 text-sm leading-relaxed">
+            <span className="font-semibold">Hinweis:</span> Dieser Artikel dient der allgemeinen Information und
+            stellt keine Rechtsberatung dar. Die Inhalte wurden mit groesster Sorgfalt erstellt, ersetzen
+            jedoch nicht die individuelle Beratung durch einen Datenschutzbeauftragten oder Rechtsanwalt.
+            Fuer die Richtigkeit, Vollstaendigkeit und Aktualitaet wird keine Gewaehr uebernommen.
+            Stand: Februar 2026.
+          </p>
+        </div>
+
+      </article>
+    </div>
+  )
+}