Now I have the full context. The design tokens are already pure black and white (oklch with 0 chroma), which is perfect. Let me build this extremely minimal one-pager.

Here's your page. It's as stripped-back as it gets: your name and title at the top, a Products section for your own software, a Client Work section for references, and an email link at the bottom. Pure black-and-white using the existing design tokens, no images, no decoration, no borders — just cleanly spaced text with subtle underlined links. Replace the placeholder names and href="#" values with your real product names, URLs, and email address.

Good. The dark mode tokens are already defined in globals.css. I need to:

1. Update layout.tsx to use lang="de", add dark class support (system preference based), and update metadata to German.
2. Translate all page content to German.

Let me also check if there's a next-themes package available or if I should use a simpler approach. Given the extreme minimalism, I'll use a lightweight script to detect system preference and toggle the dark class, keeping it dependency-free.

Now update the custom variant in globals.css so it respects the .dark class properly (it already does with &:is(.dark *)), and update the page content to German:

All content is now in German ("Produkte", "Referenzen", "Kundenprojekt", "E-Mail") and the html lang is set to de. Dark mode is handled via a small inline script that checks the system prefers-color-scheme preference and applies the dark class before hydration, so there's no flash of wrong theme. The existing .dark tokens in globals.css invert the black/white palette automatically.