fix: eliminate 2s LCP rendering delay from Directus timeout on Hero

The Hero server component awaited getMessages(locale) which called Directus
with a 2-second timeout. On testing.dk0.dev (or when Directus is unreachable),
this blocked the entire Hero render for ~2s → LCP 3.0s / 2320ms rendering delay.

Changes:
- Hero.tsx: remove getMessages() call entirely; use t() for all strings
- messages/en.json + de.json: add hero.badge, hero.line1, hero.line2 keys
- lib/i18n-loader.ts: invert lookup order — JSON first, Directus only as
  override for keys absent from JSON. Previously Directus was tried first
  for every key, causing ~49 parallel network requests per page load in
  HomePageServer (aboutT + projectsT + contactT + footerT translations).
  Now all JSON-backed keys return instantly without any network I/O.

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

app/components/Hero.tsx

@@ -1,18 +1,12 @@
 import { getTranslations } from "next-intl/server";
 import Image from "next/image";
-import { getMessages } from "@/lib/directus";
 
 interface HeroProps {
   locale: string;
 }
 
-export default async function Hero({ locale }: HeroProps) {
-  const [t, cmsMessages] = await Promise.all([
-    getTranslations("home.hero"),
-    getMessages(locale).catch(() => ({} as Record<string, string>)),
-  ]);
-
-  const getLabel = (key: string, fallback: string) => cmsMessages[key] || fallback;
+export default async function Hero({ locale: _locale }: HeroProps) {
+  const t = await getTranslations("home.hero");
 
   return (
     <section className="relative min-h-screen flex flex-col items-center justify-center bg-stone-50 dark:bg-stone-950 px-6 transition-colors duration-500">
@@ -29,15 +23,15 @@ export default async function Hero({ locale }: HeroProps) {
           <div className="flex-1 text-center xl:text-left space-y-6 sm:space-y-8 md:space-y-10">
             <div className="inline-flex items-center gap-2 sm:gap-3 px-4 sm:px-5 py-2 sm:py-2.5 rounded-full bg-white dark:bg-stone-900 border border-stone-200 dark:border-stone-800 shadow-sm animate-[fadeIn_0.5s_ease-out]">
               <span className="w-2 h-2 sm:w-2.5 sm:h-2.5 bg-emerald-500 rounded-full animate-pulse" />
-              <span className="font-mono text-[10px] sm:text-[11px] font-black uppercase tracking-[0.2em] sm:tracking-[0.3em] text-stone-500">{getLabel("hero.badge", "Student & Self-Hoster")}</span>
+              <span className="font-mono text-[10px] sm:text-[11px] font-black uppercase tracking-[0.2em] sm:tracking-[0.3em] text-stone-500">{t("badge")}</span>
             </div>
 
             <h1 className="text-[2.75rem] sm:text-6xl md:text-8xl lg:text-[9.5rem] font-black tracking-tighter leading-[0.85] text-stone-900 dark:text-stone-50 uppercase">
               <span className="block">
-                {getLabel("hero.line1", "Building")}
+                {t("line1")}
               </span>
               <span className="block text-transparent bg-clip-text bg-gradient-to-r from-emerald-400 via-liquid-sky to-liquid-purple pb-2 sm:pb-4">
-                {getLabel("hero.line2", "Stuff.")}
+                {t("line2")}
               </span>
             </h1>