feat: plakat redesign phase 1 (tokens, fonts, poster hero, header)

- New design tokens: signal red, ink and paper as RGB channels; ink and paper
  swap roles in dark mode so every component inverts cleanly
- Fonts via next/font: Bricolage Grotesque (with wdth/opsz axes), Geist,
  Geist Mono; drop Inter and Playfair
- Poster hero: kicker, giant DK0 wordmark that reacts to pointer distance
  (weight and width through a damped spring, desktop only, off for reduced
  motion), claim as h1, intro with thesis countdown, marquee strip
- Header in poster style: transparent over the red hero, paper strip with
  ink rule when scrolled or on subpages; drawer menu restyled
- Remove wavy SVG separators, CSS shader gradient, background blobs and
  unused providers that caused the pink/purple bands between sections
- Drop the global p/span/div color override so colors inherit properly
- New hero texts in de/en, tests and i18n key check updated

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

tailwind.config.ts

@@ -32,6 +32,14 @@ export default {
           "0%": { opacity: "0", transform: "translateY(-12px)" },
           "100%": { opacity: "1", transform: "translateY(0)" },
         },
+        wordmarkUp: {
+          "0%": { opacity: "0", transform: "translateY(40%)" },
+          "100%": { opacity: "1", transform: "translateY(0)" },
+        },
+        marquee: {
+          "0%": { transform: "translateX(0)" },
+          "100%": { transform: "translateX(-50%)" },
+        },
         scrollHint: {
           "0%": { opacity: "0", transform: "scaleY(0.4)" },
           "40%": { opacity: "1", transform: "scaleY(1)" },
@@ -43,6 +51,8 @@ export default {
         "slide-down": "slideDown 500ms cubic-bezier(0.23, 1, 0.32, 1) both",
         "scroll-hint": "scrollHint 2.4s cubic-bezier(0.77, 0, 0.175, 1) infinite",
         "spin-slow": "spin 4s linear infinite",
+        "wordmark-up": "wordmarkUp 900ms cubic-bezier(0.23, 1, 0.32, 1) both",
+        marquee: "marquee 32s linear infinite",
       },
       colors: {
         background: "var(--background)",
@@ -78,6 +88,14 @@ export default {
         border: "var(--border)",
         input: "var(--input)",
         ring: "var(--ring)",
+        // Plakat-Design: Rot, Tinte, Papier. Tinte und Papier tauschen im Dark Mode die Rollen.
+        signal: "rgb(var(--plakat-red) / <alpha-value>)",
+        ink: "rgb(var(--plakat-ink) / <alpha-value>)",
+        paper: {
+          DEFAULT: "rgb(var(--plakat-paper) / <alpha-value>)",
+          2: "rgb(var(--plakat-paper-2) / <alpha-value>)",
+        },
+        ok: "rgb(var(--plakat-ok) / <alpha-value>)",
         // Warm brown palette
         cream: "#FAF8F3",
         sand: "#EFEBE9",
@@ -122,9 +140,10 @@ export default {
         },
       },
       fontFamily: {
-        sans: ["var(--font-inter)", "sans-serif"],
-        serif: ["var(--font-playfair)", "Georgia", "serif"],
-        mono: ["var(--font-roboto-mono)", "Monaco", "Courier New", "monospace"],
+        sans: ["var(--font-geist)", "Helvetica Neue", "Arial", "sans-serif"],
+        display: ["var(--font-bricolage)", "Avenir Next", "Segoe UI", "sans-serif"],
+        serif: ["var(--font-bricolage)", "Avenir Next", "Segoe UI", "sans-serif"],
+        mono: ["var(--font-geist-mono)", "SF Mono", "Menlo", "monospace"],
       },
     },
   },