Redesign the site with the Signal design

[dinooo13]

Redesigns fmeyer.dev with the Signal design, picked from three switchable explorations (Editorial, Signal, Studio) that were built and compared on this PR's preview. The other two and the switcher have been removed; Signal is now the only design and is prerendered like the old site.

What changes for visitors

• Look: dark-first (light mode fully supported), with a fading engineering grid and a blue glow behind the hero. The type is Geist and Geist Mono, with a floating glass nav and glowing cards.
• Hero: leads with Fabian, not the employer. Name, role, and "I help companies make the move to agentic engineering." An agent-session terminal shows the spec → code → verify workflow and links to the Rheinwerk workshop.
• Homepage order: Focus → Experience (the three most recent roles, "Show earlier roles" for the rest) → Speaking → Labs.
• Every page ends with a "Let's talk." contact card (email plus profiles).
• Labs: two-column cards, and the whole card is clickable. Detail pages have a manifest panel and a challenge → approach → next steps flow with a roadmap terminal.
• Speaking: talk rows with a date block and an "Upcoming" chip. Detail pages have a session spec sheet, the abstract, and resource cards.
• Error pages use the same layout.

Under the hood

• AppHeader / AppFooter / layouts/default.vue form the site shell. Pages keep data loading, SEO and schema-org and render HomeView, LabsView, SpeakingView, LabDetailView, TalkDetailView.
• app/assets/css/signal.css holds the theme: tokens for light and dark, Nuxt UI overrides, and the signal-* component classes.
• useNow() keeps the time-dependent "Upcoming" badges hydration-safe on the static build.
• Removed the classic landing components and cards, the unused template stock photos in public/hero (about 3.2 MB), and the exploration tooling.
• CLAUDE.md describes the new structure and conventions (stretched-link cards, useNow(), reduced-motion coverage in signal.css).

Fixes to bugs on the live site

• Nested <h1>: the homepage and every detail page rendered an <h1> inside UPageHero's own <h1>. Every page now has exactly one.
• Duplicate theme-color: after hydration there were four theme-color meta tags instead of two, because unhead couldn't match its keyed entries to the prerendered pair.
• Contrast: the yellow "WIP" and talk-list badges failed WCAG AA contrast.
• 3.2 MB of PDF prefetches: every page prefetched the three bundled talk-slide PDFs. On throttled mobile they compete with the page's own resources; Lighthouse's simulated LCP reached about 19 s on the home and speaking pages. PDFs are now excluded from prefetch/preload but stay bundled and linked.

Verification

• pnpm lint, pnpm typecheck and pnpm generate pass (0 prerender errors, 35 routes)
• Static build, 11 pages × light/dark × 1440/390 px: one <h1> each, no horizontal overflow, no broken images, no 404s, no hydration warnings or console errors
• axe-core 4.13 (WCAG 2.0/2.1 A + AA): 0 violations in light and dark
• Every lab card and talk row is clickable across its whole area; keyboard focus rings are visible
• Lighthouse on the preview (10 runs: 5 pages × mobile/desktop, before the PDF fix): accessibility 96–100, best practices 100. Performance on desktop was 82–100; on mobile it was 57–95, held back by the PDF prefetches, which are now fixed. SEO showed 66–69, but the only failing audit is "blocked from indexing", which is expected on noindex previews. The 96s came from small breadcrumb touch targets, also now fixed.
• Lighthouse re-test after the fixes, mobile: home 92 / 100 / 100 (LCP 2.7 s), speaking 95 / 100 / 100 (LCP 2.5 s), talk detail 94 / 100 / 100 (LCP 2.6 s), as performance / accessibility / best practices. CLS 0 and TBT at most 80 ms on all three.
• Homepage JS is 589 KB uncompressed (it was 813 KB while the design switcher shipped all three designs)

🤖 Generated with Claude Code