Kontaktformular: Datenschutzhinweis unter dem Senden-Button

"Wir verwenden Ihre Angaben nur, um Ihre Anfrage zu beantworten. Mehr dazu
in unserer Datenschutzerklärung." als kleiner, gedämpfter Text mit Link auf
https://project.webklar.com/datenschutz.html (gleiches Ziel wie im Footer).
Textfarben sind die Theme-Token (muted-foreground / foreground), in Hell
und Dunkel über 4,5:1.

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

src/pages/Contact.tsx

@@ -179,6 +179,17 @@ const Contact = () => {
                   </>
                 )}
               </Button>
+
+              <p className="text-sm leading-relaxed text-muted-foreground">
+                Wir verwenden Ihre Angaben nur, um Ihre Anfrage zu beantworten. Mehr dazu in unserer{" "}
+                <a
+                  href="https://project.webklar.com/datenschutz.html"
+                  className="text-foreground underline underline-offset-4 hover:no-underline"
+                >
+                  Datenschutzerklärung
+                </a>
+                .
+              </p>
             </form>
 
             {/* Contact Info */}

src/test/sofort-paket.test.tsx

@@ -366,3 +366,25 @@ describe("C4 Schreibweise WEBklar", () => {
     },
   );
 });
+
+describe("C2 Datenschutzhinweis am Kontaktformular", () => {
+  const HINWEIS =
+    "Wir verwenden Ihre Angaben nur, um Ihre Anfrage zu beantworten. Mehr dazu in unserer Datenschutzerklärung.";
+
+  it("steht unter dem Senden-Button und verlinkt die Datenschutzerklärung", () => {
+    seite("/kontakt");
+    const senden = screen.getByRole("button", { name: /Nachricht senden/ });
+    const formular = senden.closest("form") as HTMLFormElement;
+    const hinweis = within(formular).getByText((_, el) => el?.tagName === "P" && el.textContent === HINWEIS);
+    expect(senden.compareDocumentPosition(hinweis) & Node.DOCUMENT_POSITION_FOLLOWING).toBeTruthy();
+    expect(within(hinweis).getByRole("link", { name: "Datenschutzerklärung" })).toHaveAttribute("href", DATENSCHUTZ);
+  });
+
+  it("ist kleiner, gedämpfter Text mit gut lesbarem Link (Farb-Token siehe C5)", () => {
+    seite("/kontakt");
+    const hinweis = screen.getByRole("link", { name: "Datenschutzerklärung" }).closest("p") as HTMLElement;
+    expect(hinweis).toHaveClass("text-muted-foreground");
+    expect(hinweis.className).toMatch(/text-(xs|sm)/);
+    expect(screen.getByRole("link", { name: "Datenschutzerklärung" })).toHaveClass("text-foreground", "underline");
+  });
+});