perf: compress hero image and defer page transition shutter

app/[locale]/layout.tsx

@@ -21,7 +21,7 @@ import { DynamicInitialLoader as InitialLoader } from '@/components/providers/Dy
 import { DynamicMobileBottomNav as MobileBottomNav } from '@/components/layout/DynamicMobileBottomNav';
 
 import { DynamicCorporateBackground as CorporateBackground } from '@/components/decorations/DynamicCorporateBackground';
-import { DynamicPageTransitionShutter as PageTransitionShutter } from '@/components/providers/DynamicPageTransitionShutter';
+const corporateBackground = null; // Removed to prevent line shifting
 
 const inter = Inter({
   subsets: ['latin'],
@@ -192,7 +192,7 @@ export default async function Layout(props: {
           <TransitionProvider>
             <CorporateBackground />
             <InitialLoader shouldShowLoader={!hasSeenLoader} />
-            <PageTransitionShutter />
+            {/* PageTransitionShutter loaded dynamically in TransitionProvider */}
             <SkipLink />
             <Header navLinks={navLinks} />
             <MobileBottomNav navLinks={navLinks} currentLocale={safeLocale} />

app/[locale]/page.tsx

@@ -133,7 +133,12 @@ export default async function Home(props: { params: Promise<{ locale: string }>
   
   setRequestLocale(locale);
   preload('/germany-map.svg', { as: 'image', fetchPriority: 'high' });
-  preload('/assets/videos/web/hero-kabelpflug-poster.webp', { as: 'image', fetchPriority: 'high' });
+  preload('/assets/videos/web/hero-kabelpflug-poster.webp', { 
+    as: 'image', 
+    fetchPriority: 'high',
+    imageSrcSet: '/assets/videos/web/hero-kabelpflug-poster-mobile.webp 800w, /assets/videos/web/hero-kabelpflug-poster.webp 1920w',
+    imageSizes: '(max-width: 768px) 800px, 1920px'
+  });
 
   const mdx = await getMdxContent(locale, 'home');
   const allReferences = await getAllReferences(locale);