feat: German as the main language, English under /en, with a language switch

The site now exists in German (at the root, with /impressum and /datenschutz)
and English (/en). A request without a language follows the visitor's choice
from the language switch, then the browser language, then German; the old
English legal addresses move to /en for good.

All visible texts are data in src/content/de.ts and en.ts, so components hold
none of their own. The header carries a DE/EN switch whose bit curtain covers
the page while it is swapped and reopens at the same reading position. Title,
description, canonical, hreflang, Open Graph, the share image, the sitemap and
the structured data are per language. The privacy notice now describes the
cookie that remembers the chosen language.

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

apps/web/src/components/home/HeroStatement.tsx

@@ -1,16 +1,12 @@
 import * as React from "react";
 import { Button } from "@/src/components/Button";
 import { AbstractCircuit } from "@/src/components/Effects";
-import { BitHeadline, type BitLine } from "./BitHeadline";
+import type { Content } from "@/src/content/types";
+import { BitHeadline } from "./BitHeadline";
 
-const HEADLINE: readonly BitLine[] = [
-  { text: "WEB APPS", tone: "solid" },
-  { text: "& WEBSITES.", tone: "bits" },
-];
-
-const TRUST = ["15 years in web", "Remote, EU core hours"] as const;
-
-export const HeroStatement: React.FC = () => (
+export const HeroStatement: React.FC<{ hero: Content["hero"] }> = ({
+  hero,
+}) => (
   <section className="relative overflow-hidden bg-white">
     <div className="absolute inset-0 opacity-70">
       <AbstractCircuit />
@@ -18,16 +14,13 @@ export const HeroStatement: React.FC = () => (
 
     <div className="relative z-10 mx-auto flex min-h-[calc(100dvh-5rem)] w-full max-w-[1400px] flex-col justify-center px-5 py-16 md:px-12 md:py-24">
       <BitHeadline
-        lines={HEADLINE}
+        lines={hero.headline}
         className="font-sans text-[12.5vw] font-black leading-[0.88] tracking-tighter md:text-[11.5vw] xl:text-[10.5rem]"
       />
 
       <div className="mt-10 grid grid-cols-1 gap-10 md:mt-14 md:grid-cols-12 md:items-end md:gap-12">
         <p className="m-0 max-w-2xl font-sans text-xl leading-snug text-slate-500 md:col-span-7 md:text-3xl">
-          Freelance web developer with 15 years of experience.{" "}
-          <span className="text-slate-900">
-            I build web apps, interfaces and websites.
-          </span>
+          {hero.lead} <span className="text-slate-900">{hero.leadStrong}</span>
         </p>
 
         <div className="flex flex-col gap-4 md:col-span-5 md:items-end">
@@ -36,7 +29,7 @@ export const HeroStatement: React.FC = () => (
             className="flex w-full flex-col gap-4 sm:flex-row md:w-auto"
           >
             <Button href="#contact" size="large" className="w-full sm:w-auto">
-              Get in touch
+              {hero.primaryCta}
             </Button>
             <Button
               href="#hello"
@@ -44,14 +37,14 @@ export const HeroStatement: React.FC = () => (
               size="large"
               className="w-full sm:w-auto"
             >
-              What I do
+              {hero.secondaryCta}
             </Button>
           </div>
         </div>
       </div>
 
       <ul className="m-0 mt-14 flex list-none flex-wrap gap-x-8 gap-y-3 border-t border-slate-200 p-0 pt-6 md:mt-20">
-        {TRUST.map((item) => (
+        {hero.trust.map((item) => (
           <li
             key={item}
             className="font-mono text-[10px] uppercase tracking-[0.2em] text-slate-500 md:text-[11px]"
@@ -60,7 +53,7 @@ export const HeroStatement: React.FC = () => (
           </li>
         ))}
         <li className="font-mono text-[10px] uppercase tracking-[0.2em] text-slate-500 md:text-[11px]">
-          Built and running:{" "}
+          {hero.builtAndRunning}{" "}
           <a
             href="https://klz-cables.com"
             target="_blank"