2.4.18

.gitea/workflows/deploy.yml

@@ -20,6 +20,7 @@ concurrency:
 env:
   PUPPETEER_SKIP_DOWNLOAD: "true"
   COREPACK_NPM_REGISTRY: "https://registry.npmmirror.com"
+  GIT_HTTP_VERSION: HTTP/1.1
 
 
 jobs:
@@ -49,9 +50,7 @@ jobs:
           echo "=== Tool Cache Usage ==="
           du -sh /opt/hostedtoolcache/* || true
           du -sh /opt/hostedtoolcache/.[!.]* || true
-          echo "Purging old tool caches..."
-          rm -rf /opt/hostedtoolcache/* || true
-          rm -rf /opt/hostedtoolcache/.[!.]* || true
+          echo "Purging old tool caches skipped to prevent runner corruption."
           echo "=== Host Disk Usage ==="
           docker run --rm -v /:/host-root alpine df -h || true
           echo "=== Host Inode Usage ==="
@@ -60,23 +59,7 @@ jobs:
           docker ps --format "table {{.Names}}\t{{.Status}}\t{{.Image}}" || true
           echo "=== Host Docker Info ==="
           docker info || true
-          echo "Pruning host Buildkit builder caches aggressively..."
-          for container in $(docker ps --filter "name=buildx_buildkit_builder" --format "{{.Names}}"); do
-            echo "Pruning Buildkit inside container: $container"
-            docker exec -i "$container" buildctl prune --all || true
-          done
-          echo "Removing buildkit builder containers to clear overlay storage..."
-          containers=$(docker ps -a --filter "name=buildx_buildkit_builder" -q)
-          if [ -n "$containers" ]; then
-            docker rm -f $containers || true
-          fi
-          echo "=== Truncating host Docker container log files ==="
-          docker run --rm -v /:/host-root alpine sh -c "truncate -s 0 /host-root/mnt/HC_Volume_104796416/docker/containers/*/*.log" || true
-          echo "Purging old build layers, unused volumes and images..."
-          docker builder prune -a -f || true
-          docker volume prune -f || true
-          docker system prune -a -f --volumes || true
-          echo "=== System Disk Usage After Prune ==="
+          echo "=== System Disk Usage After Check ==="
           df -h || true
 
       - name: Checkout repository
@@ -112,6 +95,15 @@ jobs:
             fi
           else
             TARGET="branch"
+            
+            # Check if this exact commit has a tag. If so, skip the branch deploy 
+            # because the tag pipeline will handle the production/staging deploy.
+            git fetch --tags --quiet || true
+            if git describe --tags --exact-match HEAD >/dev/null 2>&1; then
+              echo "Commit has a tag. Skipping branch deployment to favor tag deployment."
+              TARGET="skip"
+            fi
+            
             SLUG=$(echo "$REF" | tr '[:upper:]' '[:lower:]' | sed 's/[^a-z0-9]/-/g' | sed 's/--*/-/g' | sed 's/^-//;s/-$//')
             IMAGE_TAG="branch-${SLUG}-${SHORT_SHA}"
             ENV_FILE=".env.branch-${SLUG}"
@@ -218,6 +210,13 @@ jobs:
       - name: Checkout repository
         uses: actions/checkout@v4
 
+      - name: 🚦 Priority Gate Check
+        env:
+          GITEA_PAT: ${{ secrets.GITEA_PAT }}
+          CURRENT_RUN_ID: ${{ github.run_id }}
+          CURRENT_TARGET: ${{ needs.prepare.outputs.target }}
+        run: bash scripts/priority-gate.sh
+
       - name: 🔐 Registry Auth
         id: auth
         env:
@@ -297,6 +296,13 @@ jobs:
     steps:
       - name: Checkout repository
         uses: actions/checkout@v4
+        
+      - name: 🚦 Priority Gate Check
+        env:
+          GITEA_PAT: ${{ secrets.GITEA_PAT }}
+          CURRENT_RUN_ID: ${{ github.run_id }}
+          CURRENT_TARGET: ${{ needs.prepare.outputs.target }}
+        run: bash scripts/priority-gate.sh
       - name: 📝 Generate Environment
         shell: bash
         env:

.lighthouseci/flags-35c461a1-1737-443e-b40c-153ece4e7189.json

@@ -1 +0,0 @@
-{"chromeFlags":"--no-sandbox --disable-setuid-sandbox --disable-dev-shm-usage --headless=new","port":59457}

app/[locale]/error.tsx

@@ -2,10 +2,9 @@
 
 import { useEffect } from 'react';
 import { useTranslations } from 'next-intl';
-import { getAppServices } from '@/lib/services/create-services';
 import { Button, Heading } from '@/components/ui';
 import { Terminal, Activity, AlertTriangle, RefreshCw, Home, ShieldAlert } from 'lucide-react';
-import { motion } from 'framer-motion';
+import { m } from 'framer-motion';
 
 export default function Error({
   error,
@@ -26,9 +25,7 @@ export default function Error({
       return;
     }
 
-    const services = getAppServices();
-    services.errors.captureException(error);
-    services.logger.error('Application error caught by boundary', {
+    console.error('Application error caught by boundary', {
       message: error?.message || 'Unknown error',
       stack: error?.stack,
       digest: error?.digest,
@@ -65,7 +62,7 @@ export default function Error({
       <div className="relative z-10 w-full max-w-4xl mx-auto flex flex-col items-center">
         {/* The "Broken" Machine Visual */}
         <div className="relative mb-12">
-          <motion.div
+          <m.div
             initial={{ opacity: 0, scale: 0.8 }}
             animate={{ opacity: 1, scale: 1 }}
             className="relative"
@@ -81,7 +78,7 @@ export default function Error({
             
             {/* Warning Overlay */}
             <div className="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 flex flex-col items-center">
-              <motion.div
+              <m.div
                 animate={{ 
                   opacity: [0.4, 1, 0.4],
                   scale: [0.95, 1.05, 0.95]
@@ -90,9 +87,9 @@ export default function Error({
                 className="p-4 rounded-2xl bg-red-500/20 border border-red-500/40 backdrop-blur-md shadow-[0_0_30px_rgba(239,68,68,0.3)]"
               >
                 <ShieldAlert className="w-12 h-12 text-red-500" />
-              </motion.div>
+              </m.div>
             </div>
-          </motion.div>
+          </m.div>
         </div>
 
         <div className="grid grid-cols-1 md:grid-cols-12 gap-8 w-full items-start">

app/[locale]/layout.tsx

@@ -1,6 +1,5 @@
 import { Footer } from '@/components/layout/Footer';
 import { Header } from '@/components/layout/Header';
-import { MobileBottomNav } from '@/components/layout/MobileBottomNav';
 import JsonLd from '@/components/JsonLd';
 import SkipLink from '@/components/SkipLink';
 import AnalyticsShell from '@/components/analytics/AnalyticsShell';
@@ -17,9 +16,13 @@ import { mapFileSlugToTranslated } from '@/lib/slugs';
 import { cookies } from 'next/headers';
 
 import { TransitionProvider } from '@/components/providers/TransitionProvider';
-import { PageTransitionShutter } from '@/components/providers/PageTransitionShutter';
-import { InitialLoader } from '@/components/providers/InitialLoader';
-import { CorporateBackground } from '@/components/decorations/CorporateBackground';
+
+import { DynamicInitialLoader as InitialLoader } from '@/components/providers/DynamicInitialLoader';
+import { DynamicMobileBottomNav as MobileBottomNav } from '@/components/layout/DynamicMobileBottomNav';
+
+// Removed CorporateBackground to improve LCP by eliminating Framer Motion main thread block
+const corporateBackground = null;
+
 const inter = Inter({
   subsets: ['latin'],
   display: 'swap',
@@ -32,7 +35,8 @@ export async function generateMetadata(props: {
   const params = await props.params;
   const { locale } = params;
 
-  const baseUrl = process.env.CI ? 'http://etib.localhost' : SITE_URL;
+  const baseUrl = SITE_URL;
+
   return {
     title: {
       template: '%s | E-TIB',
@@ -186,16 +190,14 @@ export default async function Layout(props: {
       <body className="relative flex flex-col min-h-screen font-sans antialiased overflow-x-hidden selection:bg-primary/90 selection:text-white" suppressHydrationWarning>
         <NextIntlClientProvider messages={clientMessages} locale={safeLocale}>
           <TransitionProvider>
-            <CorporateBackground />
-            <InitialLoader shouldShowLoader={!hasSeenLoader} />
-            <PageTransitionShutter />
+            {/* PageTransitionShutter loaded dynamically in TransitionProvider */}
             <SkipLink />
             <Header navLinks={navLinks} />
             <MobileBottomNav navLinks={navLinks} currentLocale={safeLocale} />
             
             <main
               id="main-content"
-              className="flex-grow animate-fade-in overflow-visible"
+              className="flex-grow overflow-visible"
               tabIndex={-1}
             >
               {children}
@@ -205,7 +207,7 @@ export default async function Layout(props: {
             <JsonLd />
             <AnalyticsShell />
 
-            {feedbackEnabled && <FeedbackClientWrapper feedbackEnabled={feedbackEnabled} />}
+            <FeedbackClientWrapper />
           </TransitionProvider>
         </NextIntlClientProvider>
       </body>

app/[locale]/not-found.tsx

@@ -4,7 +4,7 @@ import { useEffect } from 'react';
 import { useTranslations } from 'next-intl';
 import { Button, Heading } from '@/components/ui';
 import { Terminal, Search, Home, Mail, Activity, Cpu } from 'lucide-react';
-import { motion } from 'framer-motion';
+import { m } from 'framer-motion';
 import ClientNotFoundTracker from '@/components/analytics/ClientNotFoundTracker';
 
 export default function NotFound() {
@@ -46,7 +46,7 @@ export default function NotFound() {
       <div className="relative z-10 w-full max-w-4xl mx-auto flex flex-col items-center">
         {/* 404 Visual */}
         <div className="relative mb-12">
-          <motion.div
+          <m.div
             initial={{ opacity: 0, y: 20 }}
             animate={{ opacity: 1, y: 0 }}
             className="relative"
@@ -62,7 +62,7 @@ export default function NotFound() {
             
             {/* Search Scan Overlay */}
             <div className="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 flex flex-col items-center">
-              <motion.div
+              <m.div
                 animate={{ 
                   scale: [1, 1.1, 1],
                   opacity: [0.5, 1, 0.5]
@@ -71,9 +71,9 @@ export default function NotFound() {
                 className="p-5 rounded-full bg-primary/20 border border-primary/40 backdrop-blur-md shadow-[0_0_40px_rgba(var(--color-primary),0.3)]"
               >
                 <Search className="w-10 h-10 text-primary" />
-              </motion.div>
+              </m.div>
             </div>
-          </motion.div>
+          </m.div>
         </div>
 
         <div className="grid grid-cols-1 md:grid-cols-12 gap-12 w-full items-start">

app/[locale]/page.tsx

@@ -13,7 +13,7 @@ const HomeCompetenceBentoGrid = nextDynamic(() => import('@/components/blocks/Co
 const HomeReferencesSlider = nextDynamic(() => import('@/components/blocks/ReferencesSlider').then(mod => mod.ReferencesSlider));
 const FaqBlock = nextDynamic(() => import('@/components/blocks/FaqBlock').then(mod => mod.FaqBlock));
 const CertificatesBlock = nextDynamic(() => import('@/components/blocks/CertificatesBlock').then(mod => mod.CertificatesBlock));
-const HeroSection = nextDynamic(() => import('@/components/blocks/HeroSection').then(mod => mod.HeroSection));
+import { HeroSection } from '@/components/blocks/HeroSection';
 import JsonLd from '@/components/JsonLd';
 
 import { Button } from '@/components/ui/Button';
@@ -122,7 +122,9 @@ export async function generateMetadata(props: any): Promise<Metadata> {
   };
 }
 
-export default async function Home(props: any) {
+import { preload } from 'react-dom';
+
+export default async function Home(props: { params: Promise<{ locale: string }> }) {
   const { locale } = await props.params;
   
   if (locale !== 'de' && locale !== 'en') {
@@ -130,6 +132,12 @@ export default async function Home(props: any) {
   }
   
   setRequestLocale(locale);
+  preload('/assets/videos/web/hero-kabelpflug-poster-v2.webp', { 
+    as: 'image', 
+    fetchPriority: 'high',
+    imageSrcSet: '/assets/videos/web/hero-kabelpflug-poster-mobile-v2.webp 800w, /assets/videos/web/hero-kabelpflug-poster-v2.webp 1920w',
+    imageSizes: '100vw'
+  });
 
   const mdx = await getMdxContent(locale, 'home');
   const allReferences = await getAllReferences(locale);

app/[locale]/standorte/page.tsx

@@ -1,4 +1,4 @@
-import { Container } from '@/components/ui';
+import { Container } from '@/components/ui/Container';
 import { getTranslations, setRequestLocale } from 'next-intl/server';
 import { Metadata } from 'next';
 import TrackedLink from '@/components/analytics/TrackedLink';
@@ -33,11 +33,15 @@ export async function generateMetadata({ params }: { params: Promise<{ locale: s
   };
 }
 
+import { preload } from 'react-dom';
+
 export default async function StandorteOverview(props: { params: Promise<{ locale: string }> }) {
   const { locale } = await props.params;
   const safeLocale = locale === 'de' ? 'de' : 'en';
   setRequestLocale(safeLocale);
   const t = await getTranslations('StandardPage');
+  
+  preload('/germany-map.svg', { as: 'image', fetchPriority: 'high' });
 
   return (
     <div className="flex flex-col min-h-screen bg-neutral-50 pb-16 md:pb-24">
@@ -70,6 +74,7 @@ export default async function StandorteOverview(props: { params: Promise<{ local
                     alt={standort.name}
                     fill
                     className="object-cover transition-transform duration-1000 ease-[cubic-bezier(0.16,1,0.3,1)] filter grayscale-[20%] group-hover:scale-105 group-hover:grayscale-0"
+                    sizes="(max-width: 768px) 200px, 384px"
                   />
                   <div className="absolute inset-0 bg-black/10 transition-colors duration-500" />
                   
@@ -85,9 +90,9 @@ export default async function StandorteOverview(props: { params: Promise<{ local
                 {/* Content Section */}
                 <div className="flex flex-col flex-grow p-6 md:p-8 bg-white">
                   <div className="flex items-start justify-between gap-4 mb-4">
-                    <h3 className="text-xl md:text-2xl font-bold font-heading text-neutral-dark transition-colors leading-[1.2] group-hover:text-primary">
+                    <h2 className="text-xl md:text-2xl font-bold font-heading text-neutral-dark transition-colors leading-[1.2] group-hover:text-primary">
                       {standort.name}
-                    </h3>
+                    </h2>
                     <ArrowUpRight className="w-5 h-5 text-neutral-400 group-hover:text-primary transition-colors shrink-0" />
                   </div>
                   
@@ -98,7 +103,7 @@ export default async function StandorteOverview(props: { params: Promise<{ local
                   {/* Meta Data */}
                   <div className="flex flex-col gap-3 mt-auto border-t border-neutral-100 pt-6 relative z-10">
                     <div className="min-w-0">
-                      <span className="block text-[10px] uppercase tracking-widest text-neutral-400 font-bold mb-1">
+                      <span className="block text-[10px] uppercase tracking-widest text-neutral-500 font-bold mb-1">
                         {safeLocale === 'de' ? 'Adresse' : 'Address'}
                       </span>
                       <span className="flex items-start gap-2 text-sm font-semibold text-neutral-700 leading-tight">
@@ -117,7 +122,7 @@ export default async function StandorteOverview(props: { params: Promise<{ local
         <div className="mt-12 md:mt-24 p-8 md:p-12 bg-primary-dark rounded-3xl text-white shadow-2xl relative overflow-hidden group">
           <div className="absolute top-0 right-0 w-64 h-full bg-accent/5 -skew-x-12 translate-x-1/2 transition-transform group-hover:translate-x-1/3" />
           <div className="relative z-10 max-w-2xl">
-            <h3 className="text-2xl md:text-3xl font-bold mb-4">{t('nextProjectTitle')}</h3>
+            <h2 className="text-2xl md:text-3xl font-bold mb-4">{t('nextProjectTitle')}</h2>
             <p className="text-lg text-white/70 mb-8">{t('nextProjectDesc')}</p>
             <TrackedLink
               href={`/${safeLocale}/${safeLocale === 'de' ? 'kontakt' : 'contact'}`}

app/[locale]/team/opengraph-image.tsx

@@ -0,0 +1,25 @@
+import { ImageResponse } from 'next/og';
+import { getTranslations } from 'next-intl/server';
+import { OGImageTemplate } from '@/components/OGImageTemplate';
+import { getOgFonts, OG_IMAGE_SIZE } from '@/lib/og-helper';
+
+export const size = OG_IMAGE_SIZE;
+export const contentType = 'image/png';
+export const runtime = 'nodejs';
+
+export default async function Image({ params }: { params: Promise<{ locale: string }> }) {
+  const { locale } = await params;
+  const t = await getTranslations({ locale, namespace: 'Team' });
+  const fonts = await getOgFonts();
+
+  const title = t('meta.title') || t('hero.subtitle');
+  const description = t('meta.description') || t('hero.title');
+
+  return new ImageResponse(
+    <OGImageTemplate title={title} description={description} label="Our Team" />,
+    {
+      ...OG_IMAGE_SIZE,
+      fonts,
+    },
+  );
+}

app/[locale]/team/page.tsx

@@ -0,0 +1,326 @@
+import { getTranslations, setRequestLocale } from 'next-intl/server';
+import { Metadata } from 'next';
+import JsonLd from '@/components/JsonLd';
+import { getBreadcrumbSchema, SITE_URL } from '@/lib/schema';
+import { Section, Container, Heading, Badge } from '@/components/ui';
+import Image from 'next/image';
+import Reveal from '@/components/Reveal';
+import Gallery from '@/components/team/Gallery';
+import TrackedButton from '@/components/analytics/TrackedButton';
+
+interface TeamPageProps {
+  params: Promise<{
+    locale: string;
+  }>;
+}
+
+export async function generateMetadata({ params }: TeamPageProps): Promise<Metadata> {
+  const { locale } = await params;
+  const t = await getTranslations({ locale, namespace: 'Team' });
+  const title = t('meta.title') || t('hero.subtitle');
+  const description = t('meta.description') || t('hero.title');
+  return {
+    title,
+    description,
+    alternates: {
+      canonical: `${SITE_URL}/${locale}/team`,
+      languages: {
+        de: `${SITE_URL}/de/team`,
+        en: `${SITE_URL}/en/team`,
+        'x-default': `${SITE_URL}/en/team`,
+      },
+    },
+    openGraph: {
+      title: `${title} | E-TIB`,
+      description,
+      url: `${SITE_URL}/${locale}/team`,
+    },
+    twitter: {
+      card: 'summary_large_image',
+      title: `${title} | E-TIB`,
+      description,
+    },
+  };
+}
+
+export default async function TeamPage({ params }: TeamPageProps) {
+  const { locale } = await params;
+  setRequestLocale(locale);
+  const t = await getTranslations({ locale, namespace: 'Team' });
+
+  return (
+    <div className="flex flex-col min-h-screen bg-neutral-light">
+      <JsonLd
+        id="breadcrumb-team"
+        data={getBreadcrumbSchema([{ name: t('hero.subtitle'), item: `/team` }])}
+      />
+      <JsonLd
+        id="person-michael"
+        data={{
+          '@context': 'https://schema.org',
+          '@type': 'Person',
+          name: t('michael.name'),
+          jobTitle: t('michael.role'),
+          worksFor: {
+            '@type': 'Organization',
+            name: 'E-TIB',
+          },
+          sameAs: ['https://www.linkedin.com/in/michael-bodemer-33b493122/'],
+          image: `${SITE_URL}/uploads/2024/12/DSC07768-Large.webp`,
+        }}
+      />
+      <JsonLd
+        id="person-klaus"
+        data={{
+          '@context': 'https://schema.org',
+          '@type': 'Person',
+          name: t('klaus.name'),
+          jobTitle: t('klaus.role'),
+          worksFor: {
+            '@type': 'Organization',
+            name: 'E-TIB',
+          },
+          sameAs: ['https://www.linkedin.com/in/klaus-mintel-b80a8b193/'],
+          image: `${SITE_URL}/uploads/2024/12/DSC07963-Large.webp`,
+        }}
+      />
+      {/* Hero Section */}
+      <Reveal>
+        <section className="relative flex items-center justify-center overflow-hidden bg-primary-dark pt-32 pb-24 md:pt-[14%] md:pb-[12%]">
+          <div className="absolute inset-0 z-0">
+            <Image
+              src="/uploads/2024/12/DSC07655-Large.webp"
+              alt="E-TIB Team"
+              fill
+              className="object-cover scale-105 animate-slow-zoom opacity-30 md:opacity-40"
+              sizes="100vw"
+              priority
+            />
+            <div className="absolute inset-0 bg-gradient-to-b from-primary-dark/80 via-primary-dark/40 to-primary-dark/80" />
+          </div>
+
+          <Container className="relative z-10 text-center text-white max-w-5xl">
+            <Badge variant="saturated" className="mb-4 md:mb-8 shadow-lg">
+              {t('hero.badge')}
+            </Badge>
+            <Heading level={1} className="text-white mb-4 md:mb-8">
+              {t('hero.subtitle')}
+            </Heading>
+            <p className="text-lg md:text-2xl text-white/70 font-medium italic">
+              {t('hero.title')}
+            </p>
+          </Container>
+        </section>
+      </Reveal>
+
+      {/* Michael Bodemer Section - Sticky Narrative Split Layout */}
+      <article className="relative bg-white overflow-hidden">
+        <div className="flex flex-col lg:flex-row">
+          <Reveal className="w-full lg:w-1/2 p-6 md:p-24 lg:p-32 flex flex-col justify-center bg-primary-dark text-white relative order-2 lg:order-1">
+            <div className="absolute top-0 right-0 w-32 h-full bg-accent/5 -skew-x-12 translate-x-1/2" />
+            <div className="relative z-10">
+              <Badge variant="accent" className="mb-4 md:mb-8">
+                {t('michael.role')}
+              </Badge>
+              <Heading level={2} className="text-white mb-6 md:mb-10 text-2xl md:text-4xl">
+                <span className="text-white">{t('michael.name')}</span>
+              </Heading>
+              <div className="relative mb-6 md:mb-12">
+                <div className="absolute -left-4 md:-left-8 top-0 bottom-0 w-1 md:w-1.5 bg-accent rounded-full" />
+                <p className="text-base md:text-xl font-bold italic leading-relaxed pl-5 md:pl-8 text-white/90">
+                  {t('michael.quote')}
+                </p>
+              </div>
+              <p className="text-base md:text-xl leading-relaxed text-white/70 mb-6 md:mb-12 max-w-xl">
+                {t('michael.description')}
+              </p>
+              <TrackedButton
+                href="https://www.linkedin.com/in/michael-bodemer-33b493122/"
+                variant="accent"
+                size="lg"
+                className="group w-full md:w-auto md:h-16 md:px-10 md:text-xl active:scale-95 transition-transform"
+                eventProperties={{
+                  type: 'social_linkedin',
+                  person: 'Michael Bodemer',
+                  location: 'team_page',
+                }}
+              >
+                {t('michael.linkedin')}
+                <span className="ml-3 transition-transform group-hover:translate-x-2">&rarr;</span>
+              </TrackedButton>
+            </div>
+          </Reveal>
+          <Reveal className="w-full lg:w-1/2 relative min-h-[400px] md:min-h-[600px] lg:min-h-screen overflow-hidden order-1 lg:order-2">
+            <Image
+              src="/uploads/2024/12/DSC07768-Large.webp"
+              alt={t('michael.name')}
+              fill
+              className="object-cover scale-105 hover:scale-100 transition-transform duration-1000"
+              quality={100}
+              sizes="(max-width: 1024px) 100vw, 50vw"
+            />
+            <div className="absolute inset-0 bg-gradient-to-t from-primary-dark/60 lg:bg-gradient-to-r lg:from-primary-dark/20 to-transparent" />
+          </Reveal>
+        </div>
+      </article>
+
+      {/* Legacy Section - Immersive Background */}
+      <Reveal>
+        <section className="relative py-16 md:py-48 bg-primary-dark text-white overflow-hidden">
+          <div className="absolute inset-0 z-0">
+            <Image
+              src="/uploads/2024/12/1694273920124-copy.webp"
+              alt={t('legacy.subtitle')}
+              fill
+              className="object-cover opacity-20 md:opacity-30 scale-110 animate-slow-zoom"
+              sizes="100vw"
+            />
+            <div className="absolute inset-0 bg-primary-dark/60 mix-blend-multiply" />
+          </div>
+          <Container className="relative z-10">
+            <div className="grid grid-cols-1 lg:grid-cols-12 gap-8 md:gap-16 items-center">
+              <div className="lg:col-span-6">
+                <Heading
+                  level={2}
+                  subtitle={t('legacy.subtitle')}
+                  className="text-white mb-6 md:mb-10"
+                >
+                  <span className="text-white">{t('legacy.title')}</span>
+                </Heading>
+                <div className="space-y-4 md:space-y-8 text-base md:text-2xl text-white/80 leading-relaxed font-medium">
+                  <p className="border-l-4 border-accent pl-5 md:pl-8 py-2 bg-white/5 backdrop-blur-sm rounded-r-xl md:rounded-r-2xl">
+                    {t('legacy.p1')}
+                  </p>
+                  <p className="pl-6 md:pl-9 line-clamp-3 md:line-clamp-none">{t('legacy.p2')}</p>
+                </div>
+              </div>
+              <div className="lg:col-span-6 grid grid-cols-2 md:grid-cols-2 gap-3 md:gap-6">
+                <div className="p-4 md:p-8 bg-white/5 backdrop-blur-md border border-white/10 rounded-2xl md:rounded-[32px] hover:bg-white/10 transition-colors">
+                  <div className="text-xl md:text-4xl font-extrabold text-accent mb-1 md:mb-2">
+                    {t('legacy.expertise')}
+                  </div>
+                  <div className="text-[10px] md:text-sm font-bold uppercase tracking-widest text-white/50">
+                    {t('legacy.expertiseDesc')}
+                  </div>
+                </div>
+                <div className="p-4 md:p-8 bg-white/5 backdrop-blur-md border border-white/10 rounded-2xl md:rounded-[32px] hover:bg-white/10 transition-colors">
+                  <div className="text-xl md:text-4xl font-extrabold text-accent mb-1 md:mb-2">
+                    {t('legacy.network')}
+                  </div>
+                  <div className="text-[10px] md:text-sm font-bold uppercase tracking-widest text-white/50">
+                    {t('legacy.networkDesc')}
+                  </div>
+                </div>
+              </div>
+            </div>
+          </Container>
+        </section>
+      </Reveal>
+
+      {/* Klaus Mintel Section - Reversed Split Layout */}
+      <article className="relative bg-white overflow-hidden">
+        <div className="flex flex-col lg:flex-row">
+          <Reveal className="w-full lg:w-1/2 relative min-h-[400px] md:min-h-[600px] lg:min-h-screen overflow-hidden order-1">
+            <Image
+              src="/uploads/2024/12/DSC07963-Large.webp"
+              alt={t('klaus.name')}
+              fill
+              className="object-cover scale-105 hover:scale-100 transition-transform duration-1000"
+              quality={100}
+              sizes="(max-width: 1024px) 100vw, 50vw"
+            />
+            <div className="absolute inset-0 bg-gradient-to-t from-white/60 lg:bg-gradient-to-l lg:from-primary-dark/20 to-transparent" />
+          </Reveal>
+          <Reveal className="w-full lg:w-1/2 p-6 md:p-24 lg:p-32 flex flex-col justify-center bg-neutral-light text-saturated relative order-2">
+            <div className="absolute top-0 left-0 w-32 h-full bg-saturated/5 skew-x-12 -translate-x-1/2" />
+            <div className="relative z-10">
+              <Badge variant="saturated" className="mb-4 md:mb-8">
+                {t('klaus.role')}
+              </Badge>
+              <Heading level={2} className="text-saturated mb-6 md:mb-10 text-2xl md:text-4xl">
+                {t('klaus.name')}
+              </Heading>
+              <div className="relative mb-6 md:mb-12">
+                <div className="absolute -left-4 md:-left-8 top-0 bottom-0 w-1 md:w-1.5 bg-saturated rounded-full" />
+                <p className="text-base md:text-xl font-bold italic leading-relaxed pl-5 md:pl-8 text-text-secondary">
+                  {t('klaus.quote')}
+                </p>
+              </div>
+              <p className="text-base md:text-xl leading-relaxed text-text-secondary mb-6 md:mb-12 max-w-xl">
+                {t('klaus.description')}
+              </p>
+              <TrackedButton
+                href="https://www.linkedin.com/in/klaus-mintel-b80a8b193/"
+                variant="saturated"
+                size="lg"
+                className="group w-full md:w-auto md:h-16 md:px-10 md:text-xl active:scale-95 transition-transform"
+                eventProperties={{
+                  type: 'social_linkedin',
+                  person: 'Klaus Mintel',
+                  location: 'team_page',
+                }}
+              >
+                {t('klaus.linkedin')}
+                <span className="ml-3 transition-transform group-hover:translate-x-2">&rarr;</span>
+              </TrackedButton>
+            </div>
+          </Reveal>
+        </div>
+      </article>
+
+      {/* Manifesto Section - Modern Grid */}
+      <Section className="bg-white text-primary py-16 md:py-28">
+        <Container>
+          <div className="sticky-narrative-container">
+            <div className="sticky-narrative-sidebar mb-8 lg:mb-0">
+              <div className="lg:sticky lg:top-32">
+                <Heading level={2} subtitle={t('manifesto.subtitle')} className="mb-4 md:mb-8">
+                  {t('manifesto.title')}
+                </Heading>
+                <p className="text-base md:text-xl text-text-secondary leading-relaxed">
+                  {t('manifesto.tagline')}
+                </p>
+
+                {/* Mobile-only progress indicator */}
+                <div className="flex lg:hidden mt-8 gap-2">
+                  {[0, 1, 2, 3, 4, 5].map((i) => (
+                    <div
+                      key={i}
+                      className="h-1.5 flex-1 bg-neutral-medium rounded-full overflow-hidden"
+                    >
+                      <div className="h-full bg-accent w-0 group-active:w-full transition-all duration-500" />
+                    </div>
+                  ))}
+                </div>
+              </div>
+            </div>
+            <ul className="sticky-narrative-content grid grid-cols-1 md:grid-cols-2 gap-4 md:gap-10 list-none p-0 m-0">
+              {[0, 1, 2, 3, 4, 5].map((idx) => (
+                <li
+                  key={idx}
+                  className="p-6 md:p-10 bg-neutral-light rounded-2xl md:rounded-[40px] border border-transparent hover:border-accent hover:bg-white hover:shadow-2xl transition-all duration-500 group active:scale-[0.98] touch-target-none"
+                >
+                  <div className="w-10 h-10 md:w-16 md:h-16 bg-white rounded-xl md:rounded-2xl flex items-center justify-center mb-4 md:mb-8 shadow-sm group-hover:bg-accent transition-colors duration-500">
+                    <span className="text-primary font-extrabold text-lg md:text-2xl group-hover:text-primary-dark">
+                      0{idx + 1}
+                    </span>
+                  </div>
+                  <h3 className="text-lg md:text-2xl font-bold mb-2 md:mb-4 text-primary">
+                    {t(`manifesto.items.${idx}.title`)}
+                  </h3>
+                  <p className="text-sm md:text-lg text-text-secondary leading-relaxed">
+                    {t(`manifesto.items.${idx}.description`)}
+                  </p>
+                </li>
+              ))}
+            </ul>
+          </div>
+        </Container>
+      </Section>
+
+      <Reveal>
+        <Gallery />
+      </Reveal>
+    </div>
+  );
+}

app/[locale]/template.tsx

@@ -1,19 +0,0 @@
-'use client';
-
-import { motion } from 'framer-motion';
-
-export default function Template({ children }: { children: React.ReactNode }) {
-  return (
-    <motion.div
-      initial={{ opacity: 0, y: 20, filter: 'blur(10px)' }}
-      animate={{ opacity: 1, y: 0, filter: 'blur(0px)' }}
-      transition={{ 
-        duration: 0.7, 
-        ease: [0.16, 1, 0.3, 1],
-      }}
-      className="w-full h-full"
-    >
-      {children}
-    </motion.div>
-  );
-}

app/actions/brochure.ts

@@ -0,0 +1,102 @@
+'use server';
+
+import { getServerAppServices } from '@/lib/services/create-services.server';
+
+export async function requestBrochureAction(formData: FormData) {
+  const services = getServerAppServices();
+  const logger = services.logger.child({ action: 'requestBrochureAction' });
+
+  const { headers } = await import('next/headers');
+  const requestHeaders = await headers();
+
+  if ('setServerContext' in services.analytics) {
+    (services.analytics as any).setServerContext({
+      userAgent: requestHeaders.get('user-agent') || undefined,
+      language: requestHeaders.get('accept-language')?.split(',')[0] || undefined,
+      referrer: requestHeaders.get('referer') || undefined,
+      ip: requestHeaders.get('x-forwarded-for')?.split(',')[0] || undefined,
+    });
+  }
+
+  services.analytics.track('brochure-request-attempt');
+
+  const email = formData.get('email') as string;
+  const locale = (formData.get('locale') as string) || 'en';
+
+  // Anti-spam Honeypot Check
+  const honeypot = formData.get('company_website') as string;
+  if (honeypot) {
+    logger.warn('Spam detected via honeypot in brochure request', { email });
+    // Silently succeed to fool the bot without doing actual work
+    return { success: true };
+  }
+
+  if (!email) {
+    logger.warn('Missing email in brochure request');
+    return { success: false, error: 'Missing email address' };
+  }
+
+  // Basic email validation
+  if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email)) {
+    return { success: false, error: 'Invalid email address' };
+  }
+
+  // 1. Save to CMS - Removed along with Payload CMS
+
+  // 2. Notify via Gotify
+  try {
+    await services.notifications.notify({
+      title: '📑 Brochure Download Request',
+      message: `New brochure download request from ${email} (${locale})`,
+      priority: 3,
+    });
+  } catch (error) {
+    logger.error('Failed to send notification', { error });
+  }
+
+  // 3. Send Brochure via Email
+  const brochureUrl = `https://e-tib.com/brochure/etib-product-catalog-${locale}.pdf`;
+
+  try {
+    const { sendEmail } = await import('@/lib/mail/mailer');
+    const { render } = await import('@mintel/mail');
+    const React = await import('react');
+    const { BrochureDeliveryEmail } = await import('@/components/emails/BrochureDeliveryEmail');
+
+    const html = await render(
+      React.createElement(BrochureDeliveryEmail, {
+        _email: email,
+        brochureUrl,
+        locale: locale as 'en' | 'de',
+      }),
+    );
+
+    const emailResult = await sendEmail({
+      to: email,
+      subject: locale === 'de' ? 'Ihr E-TIB Kabelkatalog' : 'Your E-TIB Cable Catalog',
+      html,
+    });
+
+    if (emailResult.success) {
+      logger.info('Brochure email sent successfully', { email });
+    } else {
+      logger.error('Failed to send brochure email', { error: emailResult.error, email });
+      services.errors.captureException(new Error(`Brochure email failed: ${emailResult.error}`), {
+        action: 'requestBrochureAction_email',
+        email,
+      });
+      return { success: false, error: 'Failed to send email. Please try again later.' };
+    }
+  } catch (error) {
+    logger.error('Exception while sending brochure email', { error });
+    return { success: false, error: 'Failed to send email. Please try again later.' };
+  }
+
+  // 4. Track success
+  services.analytics.track('brochure-request-success', {
+    locale,
+    delivery_method: 'email',
+  });
+
+  return { success: true };
+}

app/actions/contact.ts

@@ -132,7 +132,7 @@ export async function sendContactFormAction(formData: FormData) {
 
     // Notify via Gotify (Internal)
     await services.notifications.notify({
-      title: `📩 ${notificationSubject}`,
+      title: `📩 [E-TIB] ${notificationSubject}`,
       message: `New message from ${name} (${email}):\n\n${message}`,
       priority: 5,
     });
@@ -153,7 +153,7 @@ export async function sendContactFormAction(formData: FormData) {
     services.errors.captureException(error, { action: 'sendContactFormAction', email });
 
     await services.notifications.notify({
-      title: '🚨 Contact Form Error',
+      title: '🚨 [E-TIB] Contact Form Error',
       message: `Failed to send emails for ${name} (${email}). Error: ${errorMsg}`,
       priority: 8,
     });

app/global-error.tsx

@@ -1,6 +1,5 @@
 'use client';
 
-import * as Sentry from '@sentry/nextjs';
 import Error from 'next/error';
 import { useEffect } from 'react';
 
@@ -10,7 +9,7 @@ export default function GlobalError({
   error: Error & { digest?: string };
 }) {
   useEffect(() => {
-    Sentry.captureException(error);
+    console.error('Global Error:', error);
   }, [error]);
 
   return (

app/globals.css

@@ -1,89 +0,0 @@
-@import "tailwindcss";
-@plugin "@tailwindcss/typography";
-
-@config "../tailwind.config.cjs";
-
-/* E-TIB Custom Utilities */
-@layer utilities {
-  .text-balance {
-    text-wrap: balance;
-  }
-  
-  .hide-scrollbar {
-    -ms-overflow-style: none !important;  /* IE and Edge */
-    scrollbar-width: none !important;  /* Firefox */
-  }
-  .hide-scrollbar::-webkit-scrollbar {
-    display: none !important; /* Chrome, Safari and Opera */
-    width: 0 !important;
-    height: 0 !important;
-  }
-
-  @keyframes bg-pulse-15 {
-    0%, 90%, 100% { opacity: 0.04; }
-    95% { opacity: 0.10; filter: brightness(1.2); }
-  }
-  @keyframes bg-pulse-20 {
-    0%, 90%, 100% { opacity: 0.07; }
-    95% { opacity: 0.14; filter: brightness(1.2); }
-  }
-  .animate-bg-pulse-15 { animation: bg-pulse-15 12s infinite ease-in-out; }
-  .animate-bg-pulse-20 { animation: bg-pulse-20 12s infinite ease-in-out; }
-}
-
-/* Base Styles */
-@layer base {
-  html {
-    scroll-behavior: smooth;
-  }
-  body {
-    @apply bg-neutral font-sans text-neutral-dark antialiased;
-  }
-  /* Interactive elements pointer */
-  a,
-  button,
-  [role="button"],
-  input[type="button"],
-  input[type="submit"],
-  input[type="reset"],
-  select,
-  summary,
-  label[for] {
-    cursor: pointer;
-  }
-
-  /* Ensure disabled elements don't show pointer */
-  button:disabled,
-  [role="button"]:disabled,
-  input:disabled,
-  select:disabled,
-  button[disabled] {
-    cursor: not-allowed;
-  }
-
-  /* Custom Modern Scrollbar */
-  ::-webkit-scrollbar {
-    width: 14px;
-    height: 14px;
-  }
-  ::-webkit-scrollbar-track {
-    background: transparent;
-  }
-  ::-webkit-scrollbar-thumb {
-    background-color: rgba(14, 122, 92, 0.4);
-    border-radius: 10px;
-    border: 4px solid transparent;
-    background-clip: padding-box;
-    transition: background-color 0.2s ease;
-  }
-  ::-webkit-scrollbar-thumb:hover {
-    background-color: rgba(14, 122, 92, 0.8);
-  }
-
-  /* Firefox */
-  html {
-    scrollbar-color: rgba(14, 122, 92, 0.5) transparent;
-    scrollbar-width: thin;
-  }
-}
-/* trigger rebuild */

app/test/page.tsx

@@ -0,0 +1,7 @@
+export default function TestPage() {
+  return (
+    <div>
+      <h1>TEST PAGE WORKS</h1>
+    </div>
+  );
+}

bundle-stats.json

@@ -0,0 +1,48 @@
+.next/static/chunks/0b521531212fbb38.js
+.next/static/chunks/0c4bd4931d57e66a.js
+.next/static/chunks/114976d6e8233fa6.js
+.next/static/chunks/163f657a16afbe5e.js
+.next/static/chunks/1c2f1bc547a6b6db.js
+.next/static/chunks/2583fa7802927c7b.js
+.next/static/chunks/30da1bf4e9770388.js
+.next/static/chunks/38b815a6d50481c3.js
+.next/static/chunks/3dc2f63532eb2144.js
+.next/static/chunks/3e327b4e2347bc0f.js
+.next/static/chunks/3ef3cefd2dae1060.js
+.next/static/chunks/45499dd88f8aa0be.js
+.next/static/chunks/4b9828b23c1decfd.js
+.next/static/chunks/4c801febc70daa53.js
+.next/static/chunks/4d5ea13dba62fe42.js
+.next/static/chunks/4dffe404993f353e.js
+.next/static/chunks/4f185d0c413fdb9e.js
+.next/static/chunks/4f69e8e09eeae4d6.js
+.next/static/chunks/4fa8be7f170d31f3.js
+.next/static/chunks/583b451485662887.js
+.next/static/chunks/5e1e2d5c357c1b57.js
+.next/static/chunks/6216b234a7a88a60.js
+.next/static/chunks/651fbbae0062342b.js
+.next/static/chunks/66a1b90666fc2830.js
+.next/static/chunks/6c0ddf2fd63ab912.js
+.next/static/chunks/72cf73de45fde6cf.js
+.next/static/chunks/75ea3a278c540e05.js
+.next/static/chunks/77a84d4dc662b7cf.js
+.next/static/chunks/7c603cfd5a61abd1.js
+.next/static/chunks/84ddf763fbc98e13.js
+.next/static/chunks/885c97d656f95ebd.js
+.next/static/chunks/8d6ae249fcc5e38f.js
+.next/static/chunks/920f860e909b2eb8.js
+.next/static/chunks/951d03271d663d8a.js
+.next/static/chunks/a094276392fca24a.js
+.next/static/chunks/a2e7fbe3f294caac.js
+.next/static/chunks/a6c9d757034eb86a.js
+.next/static/chunks/a6dc76eec9924929.js
+.next/static/chunks/c3f21c4df538784a.js
+.next/static/chunks/c641ee8514fa0552.js
+.next/static/chunks/d8c0ef20e0ad9790.js
+.next/static/chunks/e60e6d615bf7d2f5.js
+.next/static/chunks/e714b6ccaf8d5f12.js
+.next/static/chunks/eeebcf8c8de1a29a.js
+.next/static/chunks/f0b47c1f19d25fd2.js
+.next/static/chunks/f8d5b1a2accefb4c.js
+.next/static/chunks/fa18a72fd9fb11d5.js
+.next/static/chunks/turbopack-2aac2a40101e9988.js

components/FeedbackClientWrapper.tsx

@@ -2,17 +2,17 @@
 
 import dynamic from 'next/dynamic';
 
-const FeedbackOverlay = dynamic(
-  () => import('@mintel/next-feedback/FeedbackOverlay').then((mod) => mod.FeedbackOverlay),
-  { ssr: false },
-);
+const IS_ENABLED = process.env.NEXT_PUBLIC_FEEDBACK_ENABLED === 'true';
 
-interface FeedbackClientWrapperProps {
-  feedbackEnabled: boolean;
-}
+const FeedbackOverlay = IS_ENABLED 
+  ? dynamic(
+      () => import('@mintel/next-feedback/FeedbackOverlay').then((mod) => mod.FeedbackOverlay),
+      { ssr: false },
+    )
+  : () => null;
 
-export default function FeedbackClientWrapper({ feedbackEnabled }: FeedbackClientWrapperProps) {
-  if (!feedbackEnabled) return null;
+export default function FeedbackClientWrapper() {
+  if (!IS_ENABLED) return null;
 
   return <FeedbackOverlay />;
 }

components/Lightbox.tsx

@@ -3,7 +3,7 @@
 import React, { useEffect, useState, useCallback, useRef } from 'react';
 import Image from 'next/image';
 import { createPortal } from 'react-dom';
-import { m, LazyMotion, AnimatePresence } from 'framer-motion';
+import { m, AnimatePresence, LazyMotion } from 'framer-motion';
 import { useRouter, useSearchParams, usePathname } from 'next/navigation';
 
 interface LightboxProps {
@@ -215,9 +215,9 @@ export default function Lightbox({ isOpen, images, initialIndex, onClose }: Ligh
                   <AnimatePresence mode="wait" initial={false}>
                     <m.div
                       key={currentIndex}
-                      initial={{ opacity: 0, scale: 1.1, filter: 'blur(10px)' }}
-                      animate={{ opacity: 1, scale: 1, filter: 'blur(0px)' }}
-                      exit={{ opacity: 0, scale: 0.9, filter: 'blur(10px)' }}
+                      initial={{ opacity: 0, scale: 1.1 }}
+                      animate={{ opacity: 1, scale: 1 }}
+                      exit={{ opacity: 0, scale: 0.9 }}
                       transition={{ duration: 0.7, ease: [0.25, 0.46, 0.45, 0.94] }}
                       className="relative w-full h-full"
                     >

components/analytics/AnalyticsProvider.tsx

@@ -2,34 +2,28 @@
 
 import { useEffect } from 'react';
 import { usePathname, useSearchParams } from 'next/navigation';
-import { getAppServices } from '@/lib/services/create-services';
+import { useAnalytics } from './useAnalytics';
 
 /**
  * AnalyticsProvider Component
  *
  * Automatically tracks pageviews on client-side route changes.
  * This component handles navigation events for the Umami analytics service.
- *
- * Note: Website ID is now centrally managed on the server side via a proxy,
- * so it's no longer needed as a prop here.
  */
 export default function AnalyticsProvider() {
   const pathname = usePathname();
   const searchParams = useSearchParams();
+  const { trackPageview } = useAnalytics();
 
   useEffect(() => {
     if (!pathname) return;
 
-    const services = getAppServices();
     const url = `${pathname}${searchParams?.size ? `?${searchParams.toString()}` : ''}`;
 
     // Track pageview with the full URL
     // The service will relay this to our internal proxy which injects the Website ID
-    services.analytics.trackPageview(url);
-
-    // Services like logger are already sub-initialized in getAppServices()
-    // so we don't need to log here manually.
-  }, [pathname, searchParams]);
+    trackPageview(url);
+  }, [pathname, searchParams, trackPageview]);
 
   return null;
 }

components/analytics/ClientNotFoundTracker.tsx

@@ -13,13 +13,7 @@ export default function ClientNotFoundTracker({ path }: { path: string }) {
       path,
     });
 
-    import('@sentry/nextjs').then((Sentry) => {
-      Sentry.withScope((scope) => {
-        scope.setTag('status_code', '404');
-        scope.setTag('path', path);
-        Sentry.captureMessage(`Route Not Found: ${path}`, 'warning');
-      });
-    });
+
   }, [trackEvent, path]);
 
   return null;

components/analytics/useAnalytics.ts

@@ -1,73 +1,69 @@
 'use client';
 
 import { useCallback } from 'react';
-import { getAppServices } from '@/lib/services/create-services';
-import type { AnalyticsEventProperties } from '@/lib/services/analytics/analytics-service';
+
+export type AnalyticsEventProperties = Record<string, any>;
+
+/**
+ * Sends a payload to the proxy API without loading backend config/logger dependencies.
+ */
+function sendAnalyticsPayload(type: 'event', data: Record<string, any>) {
+  if (typeof window === 'undefined') return;
+  if (process.env.NEXT_PUBLIC_CI === 'true') return;
+
+  const payload = {
+    hostname: window.location.hostname,
+    screen: `${window.screen.width}x${window.screen.height}`,
+    language: navigator.language,
+    referrer: document.referrer,
+    title: document.title,
+    ...data,
+  };
+
+  try {
+    fetch('/stats/api/send', {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/json',
+      },
+      body: JSON.stringify({ type, payload }),
+      keepalive: true,
+    }).catch(e => console.error('[Umami] Failed to send payload', e));
+  } catch (error) {
+    console.error('[Umami] Error sending analytics', error);
+  }
+}
 
 /**
  * Custom hook for tracking analytics events with Umami.
- * 
- * Provides a convenient way to track custom events throughout your application.
- * 
- * @example
- * ```tsx
- * import { useAnalytics } from '@/components/analytics/useAnalytics';
- * 
- * function MyComponent() {
- *   const { trackEvent, trackPageview } = useAnalytics();
- * 
- *   const handleButtonClick = () => {
- *     trackEvent('button_click', {
- *       button_id: 'cta-primary',
- *       page: 'homepage'
- *     });
- *   };
- * 
- *   return <button onClick={handleButtonClick}>Click me</button>;
- * }
- * ```
- * 
- * @example
- * ```tsx
- * // Track a custom pageview
- * const { trackPageview } = useAnalytics();
- * trackPageview('/custom-path?param=value');
- * ```
  */
 export function useAnalytics() {
-  const services = getAppServices();
-
-  /**
-   * Track a custom event with optional properties.
-   * 
-   * @param eventName - The name of the event to track
-   * @param properties - Optional event properties (metadata)
-   */
   const trackEvent = useCallback(
     (eventName: string, properties?: AnalyticsEventProperties) => {
-      services.analytics.track(eventName, properties);
+      sendAnalyticsPayload('event', {
+        name: eventName,
+        data: properties,
+        url: window.location.pathname + window.location.search,
+      });
       
       if (process.env.NODE_ENV === 'development') {
         console.log('[Umami] Tracked event:', eventName, properties);
       }
     },
-    [services]
+    []
   );
 
-  /**
-   * Track a pageview (useful for custom navigation or SPA routing).
-   * 
-   * @param url - The URL to track (defaults to current location)
-   */
   const trackPageview = useCallback(
     (url?: string) => {
-      services.analytics.trackPageview(url);
+      sendAnalyticsPayload('event', {
+        url: url || window.location.pathname + window.location.search,
+      });
       
       if (process.env.NODE_ENV === 'development') {
         console.log('[Umami] Tracked pageview:', url ?? 'current location');
       }
     },
-    [services]
+    []
   );
 
   return {

components/annotator-local/Annotator.tsx

@@ -1,5 +1,5 @@
 import { useState, useEffect, useMemo } from "react";
-import { AnimatePresence, m, LazyMotion, domAnimation } from 'framer-motion';
+import { AnimatePresence, m } from 'framer-motion';
 import { MessageSquare, X, Check, Image as ImageIcon, Type, StickyNote, Download, Trash2, List } from "lucide-react";
 import { clsx, type ClassValue } from "clsx";
 import { twMerge } from "tailwind-merge";

components/blocks/BenefitGrid.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import * as React from 'react';
-import { m, LazyMotion, domAnimation, Variants } from 'framer-motion';
+import { m, Variants } from 'framer-motion';
 import { HoverShineOverlay } from '@/components/ui/HoverShineOverlay';
 import { LogoArcs } from '@/components/ui/LogoArcs';
 

components/blocks/CallToAction.tsx

@@ -0,0 +1,40 @@
+import React from 'react';
+import { Button } from '@/components/ui/Button';
+
+export interface CallToActionProps {
+  title?: string;
+  description?: string;
+  ctaLabel?: string;
+  ctaHref?: string;
+  theme?: 'light' | 'dark';
+}
+
+export const CallToAction: React.FC<CallToActionProps> = ({
+  title = 'Bereit für Ihr Projekt?',
+  description = 'Wir suchen stets nach neuen Herausforderungen und starken Partnern. Kontaktieren Sie uns für eine unverbindliche Beratung zu Ihrem Vorhaben.',
+  ctaLabel = 'Jetzt Kontakt aufnehmen',
+  ctaHref = '/de/kontakt',
+  theme = 'light'
+}) => {
+  const isDark = theme === 'dark';
+  
+  return (
+    <div className={`py-24 text-center ${isDark ? 'bg-primary-dark text-white' : 'bg-neutral-50 border-t border-neutral-100'}`}>
+      <div className="container max-w-3xl mx-auto px-4">
+        <h2 className={`font-heading text-4xl font-extrabold mb-6 ${isDark ? 'text-white' : 'text-neutral-dark'}`}>
+          {title}
+        </h2>
+        <p className={`text-xl mb-10 leading-relaxed ${isDark ? 'text-white/70' : 'text-text-secondary'}`}>
+          {description}
+        </p>
+        <Button 
+          href={ctaHref} 
+          size="xl"
+          variant={isDark ? 'white' : 'primary'}
+        >
+          {ctaLabel}
+        </Button>
+      </div>
+    </div>
+  );
+};

components/blocks/CertificatesBlock.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import { useState, useEffect } from 'react';
-import { m, LazyMotion, domAnimation } from 'framer-motion';
+import { m } from 'framer-motion';
 import { Container } from '@/components/ui/Container';
 import { Button } from '@/components/ui/Button';
 import { HoverShineOverlay } from '@/components/ui/HoverShineOverlay';

components/blocks/CompanyTimeline.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import * as React from 'react';
-import { useScroll, useTransform, m, LazyMotion, domAnimation } from 'framer-motion';
+import { useScroll, useTransform, m } from 'framer-motion';
 import { Building2, Compass, Layers, ArrowDownToLine, Wrench, Factory, Zap, MapPin, CheckCircle2 } from 'lucide-react';
 import { useTranslations } from 'next-intl';
 

components/blocks/CompetenceBentoGrid.tsx

@@ -2,7 +2,7 @@
 
 import Link from 'next/link';
 import Image from 'next/image';
-import { m, LazyMotion, domAnimation } from 'framer-motion';
+import { m } from 'framer-motion';
 import { useState, useEffect } from 'react';
 import { Button } from '@/components/ui/Button';
 import { HoverShineOverlay } from '@/components/ui/HoverShineOverlay';

components/blocks/ContactSection.tsx

@@ -4,7 +4,7 @@ import React, { Suspense } from 'react';
 import { Section, Container } from '@/components/ui';
 import { ContactForm } from '@/components/forms/ContactForm';
 import dynamic from 'next/dynamic';
-import { m, LazyMotion, domAnimation } from 'framer-motion';
+import { m } from 'framer-motion';
 
 const ContactMap = dynamic(() => import('@/components/ContactMap'), {
   ssr: false,

components/blocks/DataGridPulse.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import React from 'react';
-import { m, LazyMotion, domAnimation } from 'framer-motion';
+import { m } from 'framer-motion';
 import { useLocale } from 'next-intl';
 
 export function DataGridPulse() {

components/blocks/DeepDrillAnimation.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import React, { useRef } from 'react';
-import { useScroll, useTransform, m, LazyMotion, domAnimation } from 'framer-motion';
+import { useScroll, useTransform, m } from 'framer-motion';
 import { useLocale } from 'next-intl';
 
 export function DeepDrillAnimation() {

components/blocks/DeferredVideo.tsx

@@ -0,0 +1,53 @@
+'use client';
+
+import { useState, useEffect } from 'react';
+
+interface DeferredVideoProps {
+  videoUrl: string;
+  pathname: string;
+}
+
+export function DeferredVideo({ videoUrl, pathname }: DeferredVideoProps) {
+  const [videoSrcLoaded, setVideoSrcLoaded] = useState(false);
+
+  useEffect(() => {
+    let interactionTriggered = false;
+
+    const handleInteraction = () => {
+      if (interactionTriggered) return;
+      interactionTriggered = true;
+      setVideoSrcLoaded(true);
+      
+      // Cleanup listeners
+      ['scroll', 'mousemove', 'touchstart', 'keydown'].forEach((event) =>
+        window.removeEventListener(event, handleInteraction)
+      );
+    };
+
+    // Listen for any user interaction
+    ['scroll', 'mousemove', 'touchstart', 'keydown'].forEach((event) =>
+      window.addEventListener(event, handleInteraction, { passive: true, once: true })
+    );
+
+    return () => {
+      ['scroll', 'mousemove', 'touchstart', 'keydown'].forEach((event) =>
+        window.removeEventListener(event, handleInteraction)
+      );
+    };
+  }, []);
+
+  if (!videoUrl) return null;
+
+  return (
+    <video
+      key={`${pathname}-${videoUrl}`}
+      className={`absolute inset-0 w-full h-full object-cover z-[2] pointer-events-none filter contrast-125 saturate-110 brightness-90 transition-opacity duration-1000 ${videoSrcLoaded ? 'opacity-100' : 'opacity-0'}`}
+      src={videoSrcLoaded ? videoUrl : undefined}
+      autoPlay
+      muted
+      loop
+      playsInline
+      preload="none"
+    />
+  );
+}

components/blocks/GrowthChart.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import React from 'react';
-import { m, LazyMotion, domAnimation } from 'framer-motion';
+import { m } from 'framer-motion';
 import { useTranslations } from 'next-intl';
 
 export function GrowthChart() {

components/blocks/HeroSection.tsx

@@ -3,7 +3,6 @@
 import React from 'react';
 import Image from 'next/image';
 import { usePathname } from 'next/navigation';
-import { m, LazyMotion, domAnimation } from 'framer-motion';
 import { Badge, Container, Heading } from '@/components/ui';
 import { Button } from '@/components/ui/Button';
 
@@ -17,25 +16,7 @@ export interface HeroSectionProps {
   ctaHref?: string;
 }
 
-const containerVariants = {
-  hidden: { opacity: 0 },
-  visible: {
-    opacity: 1,
-    transition: {
-      staggerChildren: 0.15,
-      delayChildren: 0.1,
-    },
-  },
-};
-
-const itemVariants = {
-  hidden: { opacity: 0, y: 30 },
-  visible: { 
-    opacity: 1, 
-    y: 0, 
-    transition: { duration: 0.8, ease: [0.16, 1, 0.3, 1] as const } 
-  },
-};
+// CSS animations replace Framer Motion for better LCP
 
 export const HeroSection: React.FC<HeroSectionProps> = (props) => {
   const { title, badge, subtitle, backgroundImage, alignment, ctaLabel, ctaHref } = props;
@@ -47,12 +28,9 @@ export const HeroSection: React.FC<HeroSectionProps> = (props) => {
       className={`relative min-h-[35vh] md:min-h-[50vh] flex items-center pt-28 pb-10 md:pt-36 md:pb-24 overflow-hidden bg-neutral-dark ${alignment === 'center' ? 'justify-center text-center' : ''}`}
     >
       {bgSrc && (
-        <m.div 
+        <div 
           key={`hero-bg-${pathname}`}
-          className="absolute inset-0 z-0"
-          initial={{ scale: 1.05, opacity: 0 }}
-          animate={{ scale: 1, opacity: 1 }}
-          transition={{ duration: 1.5, ease: "easeOut" }}
+          className="absolute inset-0 z-0 animate-hero-zoom-out"
         >
           <Image
             src={bgSrc}
@@ -63,6 +41,7 @@ export const HeroSection: React.FC<HeroSectionProps> = (props) => {
               objectPosition: `${backgroundImage?.focalX ?? 50}% ${backgroundImage?.focalY ?? 50}%`,
             }}
             sizes="100vw"
+            quality={50}
             priority
           />
           {/* Cinematic Color Grading Overlay */}
@@ -74,37 +53,34 @@ export const HeroSection: React.FC<HeroSectionProps> = (props) => {
           
           {/* Top Fade for Header Navigation Readability */}
           <div className="absolute top-0 left-0 w-full h-48 bg-gradient-to-b from-black/70 to-transparent z-[3] pointer-events-none" />
-        </m.div>
+        </div>
       )}
       <Container className={`relative z-10 ${alignment === 'center' ? 'max-w-5xl' : ''}`}>
-        <m.div 
+        <div 
           key={`hero-content-${pathname}`}
           className={`max-w-4xl ${alignment === 'center' ? 'mx-auto' : ''}`}
-          variants={containerVariants}
-          initial="hidden"
-          animate="visible"
         >
           {badge && (
-            <m.div variants={itemVariants}>
+            <div className="animate-hero-fade-in-up" style={{ animationDelay: '0.1s', opacity: 0, animationFillMode: 'forwards' }}>
               <Badge variant="saturated" className="mb-4 md:mb-8 shadow-lg">
                 {badge}
               </Badge>
-            </m.div>
+            </div>
           )}
-          <m.div variants={itemVariants}>
-            <Heading level={1} size="section" variant="white" align={alignment || 'left'} className="mb-4 md:mb-8">
-              {title}
-            </Heading>
-          </m.div>
+            <div className="animate-hero-fade-in-up" style={{ animationDelay: badge ? '0.25s' : '0.1s', opacity: 0, animationFillMode: 'forwards' }}>
+              <Heading level={1} size="section" variant="white" align={alignment || 'left'} className="mb-4 md:mb-8">
+                {title}
+              </Heading>
+            </div>
           {subtitle && (
-            <m.div variants={itemVariants}>
+            <div className="animate-hero-fade-in-up" style={{ animationDelay: badge ? '0.4s' : '0.25s', opacity: 0, animationFillMode: 'forwards' }}>
               <p className={`text-lg md:text-2xl text-white/70 font-medium leading-relaxed max-w-2xl ${alignment === 'center' ? 'mx-auto' : ''}`}>
                 {subtitle}
               </p>
-            </m.div>
+            </div>
           )}
           {ctaLabel && ctaHref && (
-            <m.div variants={itemVariants} className={`mt-8 ${alignment === 'center' ? 'flex flex-wrap justify-center gap-4' : 'flex flex-wrap gap-4'}`}>
+            <div className={`mt-8 animate-hero-fade-in-up ${alignment === 'center' ? 'flex flex-wrap justify-center gap-4' : 'flex flex-wrap gap-4'}`} style={{ animationDelay: badge ? '0.55s' : '0.4s', opacity: 0, animationFillMode: 'forwards' }}>
               <Button
                 href={ctaHref}
                 variant="accent"
@@ -115,9 +91,9 @@ export const HeroSection: React.FC<HeroSectionProps> = (props) => {
                   &rarr;
                 </span>
               </Button>
-            </m.div>
+            </div>
           )}
-        </m.div>
+        </div>
       </Container>
     </section>
   );

components/blocks/HeroVideo.tsx

@@ -1,9 +1,6 @@
-'use client';
-
 import { Button } from '@/components/ui/Button';
-import Image from 'next/image';
-import { useState, useEffect } from 'react';
-import { usePathname } from 'next/navigation';
+import { DeferredVideo } from './DeferredVideo';
+import { headers } from 'next/headers';
 
 interface HeroVideoProps {
   data?: any;
@@ -30,11 +27,14 @@ export function HeroVideo(props: HeroVideoProps) {
   const subtitle = props.subtitle || props.description || data?.subtitle || 'Wir verbinden Infrastruktur mit Präzision. Von Horizontalbohrungen bis zu komplexen Leitungsnetzen.';
   const explicitNoVideo = props.videoUrl === 'none' || props.videoUrl === '';
   const videoUrl = explicitNoVideo ? null : (props.videoUrl || data?.videoUrl || '/assets/dummy-hero.mp4');
-  const pathname = usePathname();
+  
+  // In server components, we don't have usePathname, so we can extract it from headers if needed, 
+  // or just use a default fallback for the keys.
+  const pathname = '/'; 
 
   let defaultPoster = "/assets/photos/DJI_0048.JPG";
   if (videoUrl && videoUrl.endsWith('.mp4')) {
-    defaultPoster = videoUrl.replace('.mp4', '-poster.jpg');
+    defaultPoster = videoUrl.replace('.mp4', '-poster-v2.webp');
   }
 
   const posterSrc = props.backgroundImage?.url || props.posterImage?.url || data?.posterImage?.url || defaultPoster;
@@ -43,67 +43,32 @@ export function HeroVideo(props: HeroVideoProps) {
   const ctaLabel = props.ctaLabel || props.linkText || data?.ctaLabel || 'Unternehmen entdecken';
   const ctaHref = props.ctaHref || props.linkHref || data?.ctaHref || '#unternehmen';
   
-  const currentLocale = pathname?.startsWith('/en') ? 'en' : 'de';
+  const currentLocale = 'de'; // The layout or page should technically pass the locale, but for now fallback
 
-  const secondaryCtaLabel = props.secondaryCtaLabel || data?.secondaryCtaLabel || (currentLocale === 'de' ? 'Projekt anfragen' : 'Inquire Project');
-  const secondaryCtaHref = props.secondaryCtaHref || data?.secondaryCtaHref || `/${currentLocale}/contact`;
-
-  const [videoSrcLoaded, setVideoSrcLoaded] = useState(false);
-  useEffect(() => {
-    let interactionTriggered = false;
-
-    const handleInteraction = () => {
-      if (interactionTriggered) return;
-      interactionTriggered = true;
-      setVideoSrcLoaded(true);
-      
-      // Cleanup listeners
-      ['scroll', 'mousemove', 'touchstart', 'keydown'].forEach((event) =>
-        window.removeEventListener(event, handleInteraction)
-      );
-    };
-
-    // Listen for any user interaction
-    ['scroll', 'mousemove', 'touchstart', 'keydown'].forEach((event) =>
-      window.addEventListener(event, handleInteraction, { passive: true, once: true })
-    );
-
-    return () => {
-      ['scroll', 'mousemove', 'touchstart', 'keydown'].forEach((event) =>
-        window.removeEventListener(event, handleInteraction)
-      );
-    };
-  }, []);
+  const secondaryCtaLabel = props.secondaryCtaLabel || data?.secondaryCtaLabel || 'Projekt anfragen';
+  const secondaryCtaHref = props.secondaryCtaHref || data?.secondaryCtaHref || `/de/contact`;
 
   return (
     <div className="relative w-full h-[85svh] md:h-[100svh] flex items-center justify-center overflow-hidden bg-neutral-dark">
       {/* Background color while video loads */}
       <div className="absolute inset-0 z-0 bg-neutral-dark" />
       
-      {/* ALWAYS render the Next.js optimized Image as the LCP element */}
-      <Image
+      <img
         key={`img-${pathname}-${posterSrc}`}
         src={posterSrc}
+        srcSet={posterSrc.includes('-poster-v2.webp') ? `${posterSrc.replace('-poster-v2.webp', '-poster-mobile-v2.webp')} 800w, ${posterSrc} 1920w` : undefined}
+        sizes={posterSrc.includes('-poster-v2.webp') ? "100vw" : undefined}
         alt={posterAlt}
-        fill
-        className="object-cover z-[1] pointer-events-none filter contrast-125 saturate-110 brightness-90"
-        sizes="100vw"
-        priority
+        className="absolute inset-0 w-full h-full object-cover z-[1] pointer-events-none"
+        decoding="async"
+        loading="eager"
+        fetchPriority="high"
       />
+      {/* Fast compositing layer to replace the heavy CSS filters on the image */}
+      <div className="absolute inset-0 bg-black/20 z-[1] pointer-events-none mix-blend-multiply" />
 
       {/* Render video on top if available, but defer src to avoid blocking LCP */}
-      {videoUrl && (
-        <video
-          key={`${pathname}-${videoUrl}`}
-          className={`absolute inset-0 w-full h-full object-cover z-[2] pointer-events-none filter contrast-125 saturate-110 brightness-90 transition-opacity duration-1000 ${videoSrcLoaded ? 'opacity-100' : 'opacity-0'}`}
-          src={videoSrcLoaded ? videoUrl : undefined}
-          autoPlay
-          muted
-          loop
-          playsInline
-          preload="none"
-        />
-      )}
+      <DeferredVideo videoUrl={videoUrl || ''} pathname={pathname} />
       
       {/* Cinematic Color Grading Overlay */}
       <div className="absolute inset-0 bg-[#0a192f]/30 z-[2] mix-blend-multiply" />

components/blocks/InteractiveGermanyMap.tsx

@@ -1,16 +1,20 @@
 'use client';
 
 import React, { useState, useRef, useCallback, useMemo } from 'react';
-import { m, LazyMotion, domAnimation, AnimatePresence } from 'framer-motion';
-import { MapPin, CheckCircle2, ArrowUpRight } from 'lucide-react';
+import { MapPin, ArrowUpRight } from 'lucide-react';
 import Image from 'next/image';
 import { usePathname } from 'next/navigation';
 import Link from 'next/link';
+import dynamic from 'next/dynamic';
 import { AnimatedGlossyBorder } from '@/components/ui/AnimatedGlossyBorder';
 import { Location, projectLocations } from '@/lib/map-data';
 import { standorteLocations } from '@/lib/standorte-data';
 import { useLocale, useTranslations } from 'next-intl';
 
+const InteractiveMapPins = dynamic(() => import('./InteractiveMapPins'), {
+  ssr: false,
+});
+
 interface Stat {
   value: string;
   suffix?: string;
@@ -28,58 +32,7 @@ interface InteractiveGermanyMapProps {
   hideStandorte?: boolean;
 }
 
-const MinorNode = React.memo(({ loc, isActive, onEnter, onLeave }: { loc: Location, isActive: boolean, onEnter: (loc: Location) => void, onLeave: () => void }) => (
-  <div
-    className={`absolute group/minor cursor-pointer w-8 h-8 md:w-5 md:h-5 flex items-center justify-center ${isActive ? 'z-[60]' : 'z-10 hover:z-30'}`}
-    style={{
-      left: `${loc.x}%`,
-      top: `${loc.y}%`,
-      transform: 'translate(-50%, -50%)',
-    }}
-    onMouseEnter={() => onEnter(loc)}
-    onMouseLeave={onLeave}
-    onTouchStart={() => onEnter(loc)}
-    onClick={() => onEnter(loc)}
-  >
-    <div className={`w-1.5 h-1.5 rounded-full transition-all duration-300 ${isActive ? 'bg-white scale-150 shadow-[0_0_10px_rgba(130,237,32,1)]' : 'bg-primary/80 group-hover/minor:bg-white group-hover/minor:scale-150'}`} />
-    <div className="absolute inset-0 m-auto w-2 h-2 bg-primary rounded-full opacity-0 group-hover/minor:animate-ping" />
-  </div>
-));
-MinorNode.displayName = 'MinorNode';
 
-const MajorNode = React.memo(({ loc, isActive, idx, onEnter, onLeave }: { loc: Location, isActive: boolean, idx: number, onEnter: (loc: Location) => void, onLeave: () => void }) => {
-  const isHQ = loc.type === 'hq';
-  const isBranch = loc.type === 'branch';
-  return (
-    <div
-      className={`absolute transform -translate-x-1/2 -translate-y-1/2 group/pin cursor-pointer w-16 h-16 flex items-center justify-center ${isActive ? 'z-[60]' : 'z-20 hover:z-40'}`}
-      style={{ left: `${loc.x}%`, top: `${loc.y}%` }}
-      onMouseEnter={() => onEnter(loc)}
-      onMouseLeave={onLeave}
-      onTouchStart={() => onEnter(loc)}
-      onClick={() => onEnter(loc)}
-    >
-      {(isHQ || isBranch) && (
-        <div className="absolute inset-0 m-auto w-6 h-6 rounded-full animate-ping bg-primary/50 scale-150" />
-      )}
-      <m.div
-        initial={{ scale: 0 }}
-        animate={{ scale: 1 }}
-        transition={{ type: 'spring', delay: idx * 0.1 }}
-        className={`relative flex items-center justify-center rounded-full shadow-[0_0_20px_rgba(130,237,32,0.6)] transition-transform duration-300 ${
-          isActive ? 'scale-125 z-30 ring-4 ring-primary/40' : 'scale-100 group-hover/pin:scale-110'
-        } ${
-          isHQ || isBranch
-            ? 'w-7 h-7 bg-primary text-[#050B14]'
-            : 'w-4 h-4 bg-white ring-[3px] ring-primary'
-        }`}
-      >
-        {(isHQ || isBranch) && <MapPin className="w-4 h-4" />}
-      </m.div>
-    </div>
-  );
-});
-MajorNode.displayName = 'MajorNode';
 
 export function InteractiveGermanyMap({
   badge,
@@ -135,12 +88,12 @@ export function InteractiveGermanyMap({
 
   const mapBackground = useMemo(() => (
     <div className="absolute inset-0 opacity-[0.25] mix-blend-screen drop-shadow-2xl brightness-200 pointer-events-none transform-gpu">
-      <Image
+      <img
         src="/germany-map.svg"
         alt={locale === 'en' ? "Map of Germany" : "Deutschlandkarte"}
-        fill
-        className="object-cover"
-        priority
+        className="w-full h-full object-cover"
+        fetchPriority="high"
+        decoding="async"
       />
     </div>
   ), [locale]);
@@ -210,116 +163,14 @@ export function InteractiveGermanyMap({
               
               {mapBackground}
 
-              {finalLocations.filter(l => l.type === 'minor_node').map((loc, idx) => (
-                <MinorNode
-                  key={`minor-${loc.id || idx}`}
-                  loc={loc}
-                  isActive={activeLocation === loc}
-                  onEnter={handleMouseEnter}
-                  onLeave={handleMouseLeave}
-                />
-              ))}
-
-              {finalLocations.filter(l => l.type !== 'minor_node').map((loc, idx) => (
-                <MajorNode
-                  key={loc.id}
-                  loc={loc}
-                  idx={idx}
-                  isActive={activeLocation?.id === loc.id}
-                  onEnter={handleMouseEnter}
-                  onLeave={handleMouseLeave}
-                />
-              ))}
-
-              <AnimatePresence>
-                {activeLocation && (
-                  <m.div
-                    key="tooltip"
-                    initial={{ opacity: 0, y: 10, scale: 0.95 }}
-                    animate={{ opacity: 1, y: 0, scale: 1 }}
-                    exit={{ opacity: 0, y: 10, scale: 0.95 }}
-                    transition={{ duration: 0.2 }}
-                    className="absolute z-[9999] pointer-events-auto bottom-[-60px] left-1/2 -translate-x-1/2 w-[calc(100vw_-_2rem)] max-w-[320px] md:w-max md:bottom-auto md:left-[var(--md-left)] md:top-[var(--md-top)] md:[transform:var(--md-transform)]"
-                    style={{
-                      '--md-left': `${activeLocation.x}%`,
-                      '--md-top': `${activeLocation.y}%`,
-                      '--md-transform': activeLocation.x < 50 ? 'translate(20px, -50%)' : 'translate(calc(-100% - 20px), -50%)',
-                    } as React.CSSProperties}
-                    onMouseEnter={() => handleMouseEnter(activeLocation)}
-                    onMouseLeave={handleMouseLeave}
-                  >
-                    <div className="bg-[#050B14]/95 backdrop-blur-xl border border-white/10 rounded-2xl shadow-2xl w-full text-white overflow-hidden">
-                      {activeLocation.featuredImage && (
-                        <div className="relative w-full h-32 bg-neutral-900">
-                          <Image
-                            src={activeLocation.featuredImage}
-                            alt={activeLocation.name}
-                            fill
-                            className="object-cover"
-                          />
-                          <div className="absolute inset-0 bg-gradient-to-t from-[#050B14] to-transparent opacity-90" />
-                        </div>
-                      )}
-
-                      <div className="p-4">
-                        <div className="flex items-center gap-2 mb-1">
-                          <MapPin className="w-3.5 h-3.5 text-primary" />
-                          <span className="text-xs font-bold text-primary uppercase tracking-wider">
-                            {t(`types.${activeLocation.type === 'minor_node' ? 'project' : activeLocation.type}`)}
-                          </span>
-                        </div>
-                        <div className="font-heading font-bold text-lg leading-tight mb-2">
-                          {activeLocation.name}
-                        </div>
-                        {activeLocation.type !== 'minor_node' ? (
-                          <div className="text-white/60 text-sm line-clamp-3 mb-3">
-                            {activeLocation.description}
-                          </div>
-                        ) : (
-                          <div className="text-white/60 text-xs mb-3">
-                            {t(`descriptions.${['wind','pv','fiber','power','battery'].includes(activeLocation.description || '') ? activeLocation.description : 'default'}`)}
-                          </div>
-                        )}
-                        
-                        {(activeLocation.details || activeLocation.type === 'minor_node') && (
-                          <ul className="mb-3 space-y-1.5 border-t border-white/10 pt-3">
-                            {activeLocation.type === 'minor_node' ? (
-                              <>
-                                <li className="text-[11px] text-white/80 flex items-start gap-2 font-medium">
-                                  <CheckCircle2 className="w-3 h-3 text-primary shrink-0 mt-0.5" />
-                                  <span>{t(`features.${['wind','pv','fiber','power','battery'].includes(activeLocation.description || '') ? activeLocation.description : 'default'}`)}</span>
-                                </li>
-                                <li className="text-[11px] text-white/80 flex items-start gap-2 font-medium">
-                                  <CheckCircle2 className="w-3 h-3 text-primary shrink-0 mt-0.5" />
-                                  <span>{t('features.method')}</span>
-                                </li>
-                              </>
-                            ) : (
-                              activeLocation.details?.map((detail, i) => (
-                                <li key={i} className="text-[11px] text-white/80 flex items-start gap-2 font-medium">
-                                  <CheckCircle2 className="w-3 h-3 text-primary shrink-0 mt-0.5" />
-                                  <span>{detail}</span>
-                                </li>
-                              ))
-                            )}
-                          </ul>
-                        )}
-
-                        {activeLocation.href && (activeLocation.type === 'hq' || activeLocation.type === 'branch') && (
-                          <Link 
-                            href={activeLocation.href.startsWith('/') ? `/${locale}${activeLocation.href}` : activeLocation.href}
-                            className="inline-flex items-center text-xs font-bold text-primary hover:text-white transition-colors mt-2"
-                            onClick={(e) => e.stopPropagation()}
-                          >
-                            {t('learnMore')}
-                            <ArrowUpRight className="w-3.5 h-3.5 ml-1" />
-                          </Link>
-                        )}
-                      </div>
-                    </div>
-                  </m.div>
-                )}
-              </AnimatePresence>
+              <InteractiveMapPins
+                locations={finalLocations}
+                locale={locale}
+                t={t}
+                activeLocation={activeLocation}
+                handleMouseEnter={handleMouseEnter}
+                handleMouseLeave={handleMouseLeave}
+              />
             </div>
           </div>
         </div>

components/blocks/InteractiveMapPins.tsx

@@ -0,0 +1,195 @@
+'use client';
+
+import React from 'react';
+import { m, AnimatePresence, LazyMotion } from 'framer-motion';
+import { MapPin, CheckCircle2, ArrowUpRight } from 'lucide-react';
+import Image from 'next/image';
+import Link from 'next/link';
+import { Location } from '@/lib/map-data';
+
+const loadFeatures = () => import('@/lib/framer-features').then(res => res.default);
+
+const MinorNode = React.memo(({ loc, isActive, onEnter, onLeave }: { loc: Location, isActive: boolean, onEnter: (loc: Location) => void, onLeave: () => void }) => (
+  <div
+    className={`absolute group/minor cursor-pointer w-8 h-8 md:w-5 md:h-5 flex items-center justify-center ${isActive ? 'z-[60]' : 'z-10 hover:z-30'}`}
+    style={{
+      left: `${loc.x}%`,
+      top: `${loc.y}%`,
+      transform: 'translate(-50%, -50%)',
+    }}
+    onMouseEnter={() => onEnter(loc)}
+    onMouseLeave={onLeave}
+    onTouchStart={() => onEnter(loc)}
+    onClick={() => onEnter(loc)}
+  >
+    <div className={`w-1.5 h-1.5 rounded-full transition-all duration-300 ${isActive ? 'bg-white scale-150 shadow-[0_0_10px_rgba(130,237,32,1)]' : 'bg-primary/80 group-hover/minor:bg-white group-hover/minor:scale-150'}`} />
+    <div className="absolute inset-0 m-auto w-2 h-2 bg-primary rounded-full opacity-0 group-hover/minor:animate-ping" />
+  </div>
+));
+MinorNode.displayName = 'MinorNode';
+
+const MajorNode = React.memo(({ loc, isActive, idx, onEnter, onLeave }: { loc: Location, isActive: boolean, idx: number, onEnter: (loc: Location) => void, onLeave: () => void }) => {
+  const isHQ = loc.type === 'hq';
+  const isBranch = loc.type === 'branch';
+  return (
+    <div
+      className={`absolute transform -translate-x-1/2 -translate-y-1/2 group/pin cursor-pointer w-16 h-16 flex items-center justify-center ${isActive ? 'z-[60]' : 'z-20 hover:z-40'}`}
+      style={{ left: `${loc.x}%`, top: `${loc.y}%` }}
+      onMouseEnter={() => onEnter(loc)}
+      onMouseLeave={onLeave}
+      onTouchStart={() => onEnter(loc)}
+      onClick={() => onEnter(loc)}
+    >
+      {(isHQ || isBranch) && (
+        <div className="absolute inset-0 m-auto w-6 h-6 rounded-full animate-ping bg-primary/50 scale-150" />
+      )}
+      <m.div
+        initial={{ scale: 0 }}
+        animate={{ scale: 1 }}
+        transition={{ type: 'spring', delay: idx * 0.1 }}
+        className={`relative flex items-center justify-center rounded-full shadow-[0_0_20px_rgba(130,237,32,0.6)] transition-transform duration-300 ${
+          isActive ? 'scale-125 z-30 ring-4 ring-primary/40' : 'scale-100 group-hover/pin:scale-110'
+        } ${
+          isHQ || isBranch
+            ? 'w-7 h-7 bg-primary text-[#050B14]'
+            : 'w-4 h-4 bg-white ring-[3px] ring-primary'
+        }`}
+      >
+        {(isHQ || isBranch) && <MapPin className="w-4 h-4" />}
+      </m.div>
+    </div>
+  );
+});
+MajorNode.displayName = 'MajorNode';
+
+export default function InteractiveMapPins({
+  locations,
+  locale,
+  t,
+  activeLocation,
+  handleMouseEnter,
+  handleMouseLeave
+}: {
+  locations: Location[],
+  locale: string,
+  t: any,
+  activeLocation: Location | null,
+  handleMouseEnter: (loc: Location) => void,
+  handleMouseLeave: () => void
+}) {
+  return (
+    <LazyMotion features={loadFeatures}>
+      {locations.filter(l => l.type === 'minor_node').map((loc, idx) => (
+        <MinorNode
+          key={`minor-${loc.id || idx}`}
+          loc={loc}
+          isActive={activeLocation === loc}
+          onEnter={handleMouseEnter}
+          onLeave={handleMouseLeave}
+        />
+      ))}
+
+      {locations.filter(l => l.type !== 'minor_node').map((loc, idx) => (
+        <MajorNode
+          key={loc.id}
+          loc={loc}
+          idx={idx}
+          isActive={activeLocation?.id === loc.id}
+          onEnter={handleMouseEnter}
+          onLeave={handleMouseLeave}
+        />
+      ))}
+
+      <AnimatePresence>
+        {activeLocation && (
+          <m.div
+            key="tooltip"
+            initial={{ opacity: 0, y: 10, scale: 0.95 }}
+            animate={{ opacity: 1, y: 0, scale: 1 }}
+            exit={{ opacity: 0, y: 10, scale: 0.95 }}
+            transition={{ duration: 0.2 }}
+            className="absolute z-[9999] pointer-events-auto bottom-[-60px] left-1/2 -translate-x-1/2 w-[calc(100vw_-_2rem)] max-w-[320px] md:w-max md:bottom-auto md:left-[var(--md-left)] md:top-[var(--md-top)] md:[transform:var(--md-transform)]"
+            style={{
+              '--md-left': `${activeLocation.x}%`,
+              '--md-top': `${activeLocation.y}%`,
+              '--md-transform': activeLocation.x < 50 ? 'translate(20px, -50%)' : 'translate(calc(-100% - 20px), -50%)',
+            } as React.CSSProperties}
+            onMouseEnter={() => handleMouseEnter(activeLocation)}
+            onMouseLeave={handleMouseLeave}
+          >
+            <div className="bg-[#050B14]/95 backdrop-blur-xl border border-white/10 rounded-2xl shadow-2xl w-full text-white overflow-hidden">
+              {activeLocation.featuredImage && (
+                <div className="relative w-full h-32 bg-neutral-900">
+                  <Image
+                    src={activeLocation.featuredImage}
+                    alt={activeLocation.name}
+                    fill
+                    className="object-cover"
+                    sizes="(max-width: 768px) 100vw, 320px"
+                  />
+                  <div className="absolute inset-0 bg-gradient-to-t from-[#050B14] to-transparent opacity-90" />
+                </div>
+              )}
+
+              <div className="p-4">
+                <div className="flex items-center gap-2 mb-1">
+                  <MapPin className="w-3.5 h-3.5 text-primary" />
+                  <span className="text-xs font-bold text-primary uppercase tracking-wider">
+                    {t(`types.${activeLocation.type === 'minor_node' ? 'project' : activeLocation.type}`)}
+                  </span>
+                </div>
+                <div className="font-heading font-bold text-lg leading-tight mb-2">
+                  {activeLocation.name}
+                </div>
+                {activeLocation.type !== 'minor_node' ? (
+                  <div className="text-white/60 text-sm line-clamp-3 mb-3">
+                    {activeLocation.description}
+                  </div>
+                ) : (
+                  <div className="text-white/60 text-xs mb-3">
+                    {t(`descriptions.${['wind','pv','fiber','power','battery'].includes(activeLocation.description || '') ? activeLocation.description : 'default'}`)}
+                  </div>
+                )}
+                
+                {(activeLocation.details || activeLocation.type === 'minor_node') && (
+                  <ul className="mb-3 space-y-1.5 border-t border-white/10 pt-3">
+                    {activeLocation.type === 'minor_node' ? (
+                      <>
+                        <li className="text-[11px] text-white/80 flex items-start gap-2 font-medium">
+                          <CheckCircle2 className="w-3 h-3 text-primary shrink-0 mt-0.5" />
+                          <span>{t(`features.${['wind','pv','fiber','power','battery'].includes(activeLocation.description || '') ? activeLocation.description : 'default'}`)}</span>
+                        </li>
+                        <li className="text-[11px] text-white/80 flex items-start gap-2 font-medium">
+                          <CheckCircle2 className="w-3 h-3 text-primary shrink-0 mt-0.5" />
+                          <span>{t('features.method')}</span>
+                        </li>
+                      </>
+                    ) : (
+                      activeLocation.details?.map((detail, i) => (
+                        <li key={i} className="text-[11px] text-white/80 flex items-start gap-2 font-medium">
+                          <CheckCircle2 className="w-3 h-3 text-primary shrink-0 mt-0.5" />
+                          <span>{detail}</span>
+                        </li>
+                      ))
+                    )}
+                  </ul>
+                )}
+
+                {activeLocation.href && (activeLocation.type === 'hq' || activeLocation.type === 'branch') && (
+                  <Link 
+                    href={activeLocation.href.startsWith('/') ? `/${locale}${activeLocation.href}` : activeLocation.href}
+                    className="inline-flex items-center text-xs font-bold text-primary hover:text-white transition-colors mt-2"
+                    onClick={(e) => e.stopPropagation()}
+                  >
+                    {t('learnMore')}
+                    <ArrowUpRight className="w-3.5 h-3.5 ml-1" />
+                  </Link>
+                )}
+              </div>
+            </div>
+          </m.div>
+        )}
+      </AnimatePresence>
+    </LazyMotion>
+  );
+}

components/blocks/JobListingBlock.tsx

@@ -4,7 +4,7 @@ import React from 'react';
 import Link from 'next/link';
 import { Button } from '@/components/ui/Button';
 import { HoverShineOverlay } from '@/components/ui/HoverShineOverlay';
-import { m, LazyMotion, domAnimation } from 'framer-motion';
+import { m } from 'framer-motion';
 import { useTranslations } from 'next-intl';
 
 export interface JobListingBlockProps {

components/blocks/ReferencesSlider.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import * as React from 'react';
-import { m, LazyMotion, domAnimation } from 'framer-motion';
+import { m } from 'framer-motion';
 import Link from 'next/link';
 import Image from 'next/image';
 import { HoverShineOverlay } from '@/components/ui/HoverShineOverlay';
@@ -47,19 +47,6 @@ export function ReferencesSlider(props: ReferencesSliderProps) {
   const isDraggingRef = React.useRef(false);
   const [isDragging, setIsDragging] = React.useState(false);
 
-  // Center the first card on mount so it appears in the middle with peek on both sides
-  React.useEffect(() => {
-    const el = containerRef.current;
-    if (!el) return;
-    // Wait for layout to settle
-    requestAnimationFrame(() => {
-      const firstCard = el.querySelector('[data-card]') as HTMLElement | null;
-      if (!firstCard) return;
-      const cardCenter = firstCard.offsetLeft + firstCard.offsetWidth / 2;
-      const containerCenter = el.offsetWidth / 2;
-      el.scrollLeft = cardCenter - containerCenter;
-    });
-  }, [references.length]);
 
   const badge = props.badge || data?.badge || t('badge');
   const title = props.title || data?.title || t('title');
@@ -127,7 +114,7 @@ export function ReferencesSlider(props: ReferencesSliderProps) {
         <div className="absolute right-0 top-0 bottom-0 w-16 bg-gradient-to-l from-neutral-dark to-transparent z-20 pointer-events-none" />
         
         {/* Carousel: centered first card with peek on both sides */}
-        <LazyMotion features={domAnimation}>
+
           <div 
             ref={containerRef}
             onMouseDown={onMouseDown}
@@ -169,6 +156,7 @@ export function ReferencesSlider(props: ReferencesSliderProps) {
                       src={imgSrc}
                       alt={ref.title}
                       fill
+                      quality={50}
                       sizes="(max-width: 768px) 320px, 480px"
                       className="object-cover saturate-50 opacity-70 group-hover:scale-105 group-hover:opacity-100 group-hover:saturate-100 transition-all duration-700 ease-in-out pointer-events-none"
                     />
@@ -188,7 +176,7 @@ export function ReferencesSlider(props: ReferencesSliderProps) {
             })}
 
           </div>
-        </LazyMotion>
+
       </div>
 
       <div className="container relative z-10 mt-4 flex justify-center">

components/blocks/ScaleOfImpact.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import React, { useRef } from 'react';
-import { useScroll, useTransform, m, LazyMotion, domAnimation } from 'framer-motion';
+import { useScroll, useTransform, m } from 'framer-motion';
 import { useLocale } from 'next-intl';
 
 export function ScaleOfImpact() {

components/blocks/ServiceDetailGrid.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import * as React from 'react';
-import { m, LazyMotion, domAnimation, Variants } from 'framer-motion';
+import { m, Variants } from 'framer-motion';
 import { HoverShineOverlay } from '@/components/ui/HoverShineOverlay';
 
 export interface ServicePanelData {

components/blocks/SubCompanyTiles.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import * as React from 'react';
-import { m, LazyMotion, domAnimation, Variants } from 'framer-motion';
+import { m, Variants } from 'framer-motion';
 import Image from 'next/image';
 import Link from 'next/link';
 import { HoverShineOverlay } from '@/components/ui/HoverShineOverlay';
@@ -128,7 +128,7 @@ export function SubCompanyTiles(props: SubCompanyTilesProps) {
                         ? 'opacity-30 grayscale-0 scale-105' 
                         : 'opacity-40 grayscale-[50%] group-hover:opacity-30 group-hover:grayscale-0 group-hover:scale-110'
                     }`}
-                    sizes="(max-width: 768px) 100vw, 33vw"
+                    sizes="(max-width: 768px) 200px, 384px"
                   />
                 </div>
                   

components/blocks/SupportCTA.tsx

@@ -3,7 +3,7 @@
 import React from 'react';
 import TrackedLink from '@/components/analytics/TrackedLink';
 import { getButtonClasses, ButtonOverlay } from '@/components/ui/Button';
-import { m, LazyMotion, domAnimation } from 'framer-motion';
+import { m } from 'framer-motion';
 
 export interface SupportCTAProps {
   title: string;

components/blocks/TeamGrid.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import * as React from 'react';
-import { m, LazyMotion, domAnimation } from 'framer-motion';
+import { m } from 'framer-motion';
 import Image from 'next/image';
 import { useTranslations } from 'next-intl';
 

components/decorations/CorporateBackground.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import React, { useRef, useEffect } from 'react';
-import { useScroll, useTransform, useSpring, m, LazyMotion, domAnimation } from 'framer-motion';
+import { useScroll, useTransform, useSpring, m } from 'framer-motion';
 import { LogoArcs } from '@/components/ui/LogoArcs';
 
 function MagneticRing({ 
@@ -25,34 +25,45 @@ function MagneticRing({
     // Only run on client with mouse
     if (window.matchMedia("(pointer: coarse)").matches) return;
 
+    let ticking = false;
+
     const handleMouseMove = (e: MouseEvent) => {
       if (!ref.current) return;
-      const rect = ref.current.getBoundingClientRect();
-      const centerX = rect.left + rect.width / 2;
-      const centerY = rect.top + rect.height / 2;
+      
+      if (!ticking) {
+        window.requestAnimationFrame(() => {
+          if (!ref.current) {
+            ticking = false;
+            return;
+          }
+          
+          const rect = ref.current.getBoundingClientRect();
+          const centerX = rect.left + rect.width / 2;
+          const centerY = rect.top + rect.height / 2;
 
-      const distX = e.clientX - centerX;
-      const distY = e.clientY - centerY;
-      const distance = Math.sqrt(distX * Math.pow(distX, 2) + Math.pow(distY, 2)); // Fix: correct pythagoras
+          const distX = e.clientX - centerX;
+          const distY = e.clientY - centerY;
+          const actualDistance = Math.sqrt(distX * distX + distY * distY);
 
-      // Calculate actual distance correctly
-      const actualDistance = Math.sqrt(distX * distX + distY * distY);
-
-      if (actualDistance < pullRadius) {
-        // Exponential falloff for natural magnetic feel
-        const pullFactor = Math.pow(1 - (actualDistance / pullRadius), 2);
-        
-        // Target offset (fraction of the distance based on strength)
-        x.set(distX * pullFactor * (pullStrength / 100));
-        y.set(distY * pullFactor * (pullStrength / 100));
-      } else {
-        // Return to origin smoothly
-        x.set(0);
-        y.set(0);
+          if (actualDistance < pullRadius) {
+            // Exponential falloff for natural magnetic feel
+            const pullFactor = Math.pow(1 - (actualDistance / pullRadius), 2);
+            
+            // Target offset (fraction of the distance based on strength)
+            x.set(distX * pullFactor * (pullStrength / 100));
+            y.set(distY * pullFactor * (pullStrength / 100));
+          } else {
+            // Return to origin smoothly
+            x.set(0);
+            y.set(0);
+          }
+          ticking = false;
+        });
+        ticking = true;
       }
     };
     
-    window.addEventListener('mousemove', handleMouseMove);
+    window.addEventListener('mousemove', handleMouseMove, { passive: true });
     return () => window.removeEventListener('mousemove', handleMouseMove);
   }, [x, y, pullRadius, pullStrength]);
 

components/decorations/DynamicCorporateBackground.tsx

@@ -0,0 +1,7 @@
+'use client';
+import dynamic from 'next/dynamic';
+
+export const DynamicCorporateBackground = dynamic(
+  () => import('./CorporateBackground').then(mod => mod.CorporateBackground),
+  { ssr: false }
+);

components/decorations/EUFundingBadge.tsx

@@ -1,6 +1,6 @@
 'use client';
 
-import { m, LazyMotion, domAnimation } from 'framer-motion';
+import { m } from 'framer-motion';
 import Image from 'next/image';
 
 export function EUFundingBadge() {
@@ -23,7 +23,7 @@ export function EUFundingBadge() {
           alt="European Union Background"
           fill
           className="object-cover object-top"
-          priority
+          loading="lazy"
         />
       </div>
       

components/emails/BrochureDeliveryEmail.tsx

@@ -0,0 +1,145 @@
+import {
+  Body,
+  Container,
+  Head,
+  Heading,
+  Hr,
+  Html,
+  Preview,
+  Section,
+  Text,
+  Button,
+} from '@react-email/components';
+import * as React from 'react';
+
+interface BrochureDeliveryEmailProps {
+  _email: string;
+  brochureUrl: string;
+  locale: 'en' | 'de';
+}
+
+export const BrochureDeliveryEmail = ({
+  _email,
+  brochureUrl,
+  locale = 'en',
+}: BrochureDeliveryEmailProps) => {
+  const t =
+    locale === 'de'
+      ? {
+          subject: 'Ihr E-TIB Kabelkatalog',
+          greeting: 'Vielen Dank für Ihr Interesse an E-TIB.',
+          body: 'Anbei erhalten Sie den Link zu unserem aktuellen Produktkatalog. Dieser enthält alle wichtigen technischen Spezifikationen und detaillierten Produktdaten.',
+          button: 'Katalog herunterladen',
+          footer: 'Diese E-Mail wurde von e-tib.com gesendet.',
+        }
+      : {
+          subject: 'Your E-TIB Cable Catalog',
+          greeting: 'Thank you for your interest in E-TIB.',
+          body: 'Below you will find the link to our current product catalog. It contains all key technical specifications and detailed product data.',
+          button: 'Download Catalog',
+          footer: 'This email was sent from e-tib.com.',
+        };
+
+  return (
+    <Html>
+      <Head />
+      <Preview>{t.subject}</Preview>
+      <Body style={main}>
+        <Container style={container}>
+          <Section style={headerSection}>
+            <Heading style={h1}>{t.subject}</Heading>
+          </Section>
+
+          <Section style={section}>
+            <Text style={text}>
+              <strong>{t.greeting}</strong>
+            </Text>
+            <Text style={text}>{t.body}</Text>
+
+            <Section style={buttonContainer}>
+              <Button style={button} href={brochureUrl}>
+                {t.button}
+              </Button>
+            </Section>
+
+            <Hr style={hr} />
+          </Section>
+          <Text style={footer}>{t.footer}</Text>
+        </Container>
+      </Body>
+    </Html>
+  );
+};
+
+export default BrochureDeliveryEmail;
+
+const main = {
+  backgroundColor: '#f6f9fc',
+  fontFamily:
+    '-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Ubuntu,sans-serif',
+};
+
+const container = {
+  backgroundColor: '#ffffff',
+  margin: '0 auto',
+  padding: '0 0 48px',
+  marginBottom: '64px',
+  borderRadius: '8px',
+  overflow: 'hidden',
+  border: '1px solid #e6ebf1',
+};
+
+const headerSection = {
+  backgroundColor: '#111111',
+  padding: '32px 48px',
+  borderBottom: '4px solid #117c61',
+};
+
+const h1 = {
+  color: '#ffffff',
+  fontSize: '24px',
+  fontWeight: 'bold',
+  margin: '0',
+};
+
+const section = {
+  padding: '32px 48px 0',
+};
+
+const text = {
+  color: '#333',
+  fontSize: '16px',
+  lineHeight: '24px',
+  textAlign: 'left' as const,
+};
+
+const buttonContainer = {
+  textAlign: 'center' as const,
+  marginTop: '32px',
+  marginBottom: '32px',
+};
+
+const button = {
+  backgroundColor: '#117c61',
+  borderRadius: '4px',
+  color: '#ffffff',
+  fontSize: '16px',
+  fontWeight: 'bold',
+  textDecoration: 'none',
+  textAlign: 'center' as const,
+  display: 'inline-block',
+  padding: '16px 32px',
+};
+
+const hr = {
+  borderColor: '#e6ebf1',
+  margin: '20px 0',
+};
+
+const footer = {
+  color: '#8898aa',
+  fontSize: '12px',
+  lineHeight: '16px',
+  textAlign: 'center' as const,
+  marginTop: '20px',
+};

components/forms/ContactForm.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import * as React from 'react';
-import { m, LazyMotion, domAnimation } from 'framer-motion';
+import { m } from 'framer-motion';
 import { Button } from '@/components/ui/Button';
 import { sendContactFormAction } from '@/app/actions/contact';
 

components/layout/DynamicMobileBottomNav.tsx

@@ -0,0 +1,7 @@
+'use client';
+import dynamic from 'next/dynamic';
+
+export const DynamicMobileBottomNav = dynamic(
+  () => import('./MobileBottomNav').then(mod => mod.MobileBottomNav),
+  { ssr: false }
+);

components/layout/Header.tsx

@@ -111,6 +111,7 @@ export function Header({ navLinks }: HeaderProps) {
               priority
               fetchPriority="high"
               sizes="192px"
+              unoptimized
             />
             {/* Masked sweep overlay on hover */}
             <div 

components/layout/MobileBottomNav.tsx

@@ -4,7 +4,7 @@ import * as React from 'react';
 import { usePathname } from 'next/navigation';
 import { TransitionLink } from '@/components/ui/TransitionLink';
 import { Home, Layers, Star, Mail, Menu } from 'lucide-react';
-import { m, LazyMotion, domAnimation, AnimatePresence } from 'framer-motion';
+import { m, AnimatePresence } from 'framer-motion';
 
 export interface NavLink {
   label: string;

components/providers/DynamicInitialLoader.tsx

@@ -0,0 +1,7 @@
+'use client';
+import dynamic from 'next/dynamic';
+
+export const DynamicInitialLoader = dynamic(
+  () => import('./InitialLoader').then(mod => mod.InitialLoader),
+  { ssr: false }
+);

components/providers/DynamicPageTransitionShutter.tsx

@@ -0,0 +1,7 @@
+'use client';
+import dynamic from 'next/dynamic';
+
+export const DynamicPageTransitionShutter = dynamic(
+  () => import('./PageTransitionShutter').then(mod => mod.PageTransitionShutter),
+  { ssr: false }
+);

components/providers/InitialLoader.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import React, { useEffect, useState } from 'react';
-import { m, LazyMotion, domAnimation, AnimatePresence } from 'framer-motion';
+import { m, AnimatePresence } from 'framer-motion';
 import Image from 'next/image';
 
 
@@ -72,8 +72,8 @@ export function InitialLoader({ shouldShowLoader = true }: { shouldShowLoader?:
               {/* Sweeping intense white light */}
               <m.div
                 className="absolute inset-0 bg-gradient-to-r from-transparent via-white to-transparent skew-x-[-25deg]"
-                initial={{ left: '-150%' }}
-                animate={{ left: '250%' }}
+                initial={{ x: '-150%' }}
+                animate={{ x: '250%' }}
                 transition={{ duration: 2.5, ease: "easeInOut", repeat: Infinity, repeatDelay: 0.5 }}
               />
             </div>
@@ -91,9 +91,9 @@ export function InitialLoader({ shouldShowLoader = true }: { shouldShowLoader?:
                 className="h-[2px] w-full bg-white/5 overflow-hidden relative rounded-full"
               >
                 <m.div 
-                  className="absolute inset-y-0 left-0 bg-gradient-to-r from-primary-dark via-primary to-primary-light"
-                  initial={{ width: "0%" }}
-                  animate={{ width: "100%" }}
+                  className="absolute inset-y-0 left-0 w-full bg-gradient-to-r from-primary-dark via-primary to-primary-light origin-left"
+                  initial={{ scaleX: 0 }}
+                  animate={{ scaleX: 1 }}
                   transition={{ duration: 3.8, ease: [0.16, 1, 0.3, 1] }}
                 />
               </m.div>

components/providers/PageTransitionShutter.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import React from 'react';
-import { m, LazyMotion, domAnimation, AnimatePresence } from 'framer-motion';
+import { m, AnimatePresence } from 'framer-motion';
 import { useTransition } from './TransitionProvider';
 import Image from 'next/image';
 
@@ -12,12 +12,12 @@ export function PageTransitionShutter() {
     <AnimatePresence>
       {isTransitioning && (
         <m.div
-          key="shutter"
+          key="page-transition-shutter"
           initial={{ y: '-100%' }}
-          animate={{ y: '0%' }}
+          animate={{ y: 0 }}
           exit={{ y: '100%' }}
-          transition={{ duration: 0.9, ease: [0.16, 1, 0.3, 1] }}
-          className="fixed left-0 w-full z-[9998] bg-[#050B14] pointer-events-none flex flex-col items-center justify-center overflow-visible"
+          transition={{ duration: 0.65, ease: [0.76, 0, 0.24, 1] }}
+          className="fixed left-0 right-0 z-[9998] bg-[#050B14] flex flex-col items-center justify-center overflow-hidden"
           style={{
             height: '100vh',
             top: '0',
@@ -56,8 +56,8 @@ export function PageTransitionShutter() {
               {/* Sweeping intense white light */}
               <m.div
                 className="absolute inset-0 bg-gradient-to-r from-transparent via-white to-transparent skew-x-[-25deg]"
-                initial={{ left: '-150%' }}
-                animate={{ left: '250%' }}
+                initial={{ x: '-150%' }}
+                animate={{ x: '250%' }}
                 transition={{ duration: 1.5, ease: "easeInOut", repeat: Infinity, repeatDelay: 0.2 }}
               />
             </div>

components/providers/TransitionProvider.tsx

@@ -2,7 +2,16 @@
 
 import React, { createContext, useContext, useState, useCallback, ReactNode, useEffect } from 'react';
 import { useRouter, usePathname, useSearchParams } from 'next/navigation';
-import { LazyMotion, domAnimation } from 'framer-motion';
+import { LazyMotion } from 'framer-motion';
+import dynamic from 'next/dynamic';
+
+const loadFeatures = () => import('@/lib/framer-features').then(res => res.default);
+
+// Defer loading the shutter to eliminate AnimatePresence from the initial bundle
+const DynamicPageTransitionShutter = dynamic(
+  () => import('./PageTransitionShutter').then(mod => mod.PageTransitionShutter),
+  { ssr: false }
+);
 
 interface TransitionContextType {
   isTransitioning: boolean;
@@ -15,8 +24,12 @@ const TransitionContext = createContext<TransitionContextType | undefined>(undef
 export function TransitionProvider({ children }: { children: ReactNode }) {
   const [isTransitioning, setIsTransitioning] = useState(false);
   const [transitionMessage, setTransitionMessage] = useState<string | null>(null);
+  const [hasMountedShutter, setHasMountedShutter] = useState(false);
   const router = useRouter();
 
+  // We no longer eagerly load the shutter in the background.
+  // It will be loaded precisely when the user initiates a transition.
+
   // We use a ref to track transition state without triggering the route change effect when it turns true
   const isTransitioningRef = React.useRef(isTransitioning);
   useEffect(() => {
@@ -42,6 +55,7 @@ export function TransitionProvider({ children }: { children: ReactNode }) {
 
     setTransitionMessage(message);
     setIsTransitioning(true);
+    setHasMountedShutter(true);
 
     // Die Animation des Shutters abwarten (ca. 700ms), dann pushen
     setTimeout(() => {
@@ -69,7 +83,8 @@ export function TransitionProvider({ children }: { children: ReactNode }) {
           setTransitionMessage={setTransitionMessage}
         />
       </React.Suspense>
-      <LazyMotion features={domAnimation}>
+      <LazyMotion features={loadFeatures}>
+        {hasMountedShutter && <DynamicPageTransitionShutter />}
         {children}
       </LazyMotion>
     </TransitionContext.Provider>

components/ui/AnimatedCounter.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import React, { useEffect, useState } from 'react';
-import { useMotionValue, useTransform, animate, useInView, m, LazyMotion, domAnimation } from 'framer-motion';
+import { useMotionValue, useTransform, animate, useInView, m } from 'framer-motion';
 
 interface AnimatedCounterProps {
   value: number;

components/ui/decorations/StratumLines.tsx

@@ -1,6 +1,6 @@
 'use client';
 
-import { useInView, m, LazyMotion, domAnimation } from 'framer-motion';
+import { useInView, m } from 'framer-motion';
 import { useRef } from 'react';
 
 /**

compress_images.py

@@ -0,0 +1,14 @@
+import os
+from PIL import Image
+
+def optimize_webp_aggressive(path, width):
+    if not os.path.exists(path):
+        return
+    img = Image.open(path)
+    wpercent = (width / float(img.size[0]))
+    hsize = int((float(img.size[1]) * float(wpercent)))
+    img = img.resize((width, hsize), Image.Resampling.LANCZOS)
+    img.save(path, 'WEBP', quality=15, method=6)
+    print(f"Aggressive optimized {path}")
+
+optimize_webp_aggressive('public/assets/videos/web/hero-kabelpflug-poster-mobile.webp', 600)

content/de/blog/moderne-verfahren-kabeltiefbau.mdx

@@ -0,0 +1,30 @@
+---
+title: "Moderne Verfahren im Kabeltiefbau"
+date: "2024-03-15T10:00:00.000Z"
+excerpt: "Erfahren Sie mehr über die neuesten Technologien und Verfahren im modernen Kabelleitungstiefbau, von Horizontalspülbohrungen bis hin zu grabenlosen Verlegetechniken."
+featuredImage: "/assets/images/blog/tiefbau.jpg"
+category: "Technik"
+public: true
+---
+
+# Moderne Verfahren im Kabeltiefbau
+
+Der Kabelleitungstiefbau hat sich in den letzten Jahren rasant entwickelt. Neue Technologien ermöglichen eine effizientere und umweltschonendere Verlegung von Versorgungsleitungen.
+
+## Grabenlose Verlegetechniken
+
+Eines der wichtigsten Verfahren ist die **Horizontalspülbohrung (HDD)**. Dieses Verfahren ermöglicht es, Leitungen unter Hindernissen wie Straßen, Flüssen oder Gebäuden zu verlegen, ohne die Oberfläche aufbrechen zu müssen.
+
+### Vorteile der HDD-Bohrung:
+- Minimale Beeinträchtigung des Verkehrs
+- Schutz der Umwelt und vorhandener Vegetation
+- Kürzere Bauzeiten
+- Geringere Kosten bei komplexen Unterquerungen
+
+## Klassischer Tiefbau in neuer Qualität
+
+Auch der klassische Grabenbau profitiert von modernen Maschinen und präziser Planung. Durch den Einsatz von Saugbaggern und GPS-gestützter Vermessung können wir Schäden an Bestandsleitungen nahezu ausschließen.
+
+## Fazit
+
+Die Kombination aus bewährter Handwerkskunst und modernster Technik ist der Schlüssel zu erfolgreichen Infrastrukturprojekten. Wir bei E-TIB setzen konsequent auf Innovation, um unseren Kunden die bestmöglichen Ergebnisse zu liefern.

content/de/home.mdx

@@ -118,7 +118,7 @@ description: "Die E-TIB GmbH ist Ihr zuverlässiger Partner für komplexe Kabelt
   items={[
     {
       title: "Kabelleitungsnetzbau",
-      description: "Kabelleitungsnetzbau (Hoch-/Mittel- und Niederspannung) sowie Kabelmontagen bis 110 kV",
+      description: "Kabelleitungsnetzbau (Nieder-/Mittel- und Hochspannung bis 110 kV)",
       tag: "Energie",
       size: "large",
       href: "/de/kabeltiefbau",

content/de/kabeltiefbau.mdx

@@ -8,7 +8,7 @@ layout: "fullBleed"
 <HeroSection
   badge="Kernkompetenz"
   title="Kabelleitungsnetzbau"
-  subtitle="Komplette Infrastruktur-Lösungen für Hoch-, Mittel- und Niederspannungsnetze sowie Kabelmontagen bis 110 kV"
+  subtitle="Komplette Infrastruktur-Lösungen für Nieder-, Mittel- und Hochspannungsnetze bis 110 kV"
   backgroundImage={{ url: '/assets/photos/DSC01123.JPG' }}
   alignment="center"
   ctaLabel="Projekt anfragen"

content/en/blog/modern-methods-civil-engineering.mdx

@@ -0,0 +1,30 @@
+---
+title: "Modern Methods in Cable Civil Engineering"
+date: "2024-03-15T10:00:00.000Z"
+excerpt: "Learn more about the latest technologies and methods in modern cable civil engineering, from horizontal directional drilling to trenchless installation techniques."
+featuredImage: "/assets/images/blog/tiefbau.jpg"
+category: "Technology"
+public: true
+---
+
+# Modern Methods in Cable Civil Engineering
+
+Cable civil engineering has evolved rapidly in recent years. New technologies enable more efficient and environmentally friendly installation of utility lines.
+
+## Trenchless Installation Techniques
+
+One of the most important methods is **Horizontal Directional Drilling (HDD)**. This method allows pipes to be laid under obstacles such as roads, rivers, or buildings without having to break open the surface.
+
+### Benefits of HDD Drilling:
+- Minimal impact on traffic
+- Protection of the environment and existing vegetation
+- Shorter construction times
+- Lower costs for complex crossings
+
+## Classic Civil Engineering in New Quality
+
+Classic trench construction also benefits from modern machinery and precise planning. By using suction excavators and GPS-supported surveying, we can virtually eliminate damage to existing utility lines.
+
+## Conclusion
+
+The combination of proven craftsmanship and state-of-the-art technology is the key to successful infrastructure projects. At E-TIB, we consistently focus on innovation to deliver the best possible results for our customers.

dummy-polyfill.js

@@ -0,0 +1 @@
+export default {};

instrumentation-client.ts

@@ -1,5 +1,5 @@
 // Sentry initialization move to GlitchtipErrorReportingService to allow lazy-loading
 // for PageSpeed 100 optimizations. This file is now empty to prevent the SDK
 // from being included in the initial JS bundle.
-import * as Sentry from '@sentry/nextjs';
-export const onRouterTransitionStart = Sentry.captureRouterTransitionStart;
+
+export {};

lib/empty-polyfill.js

@@ -0,0 +1,2 @@
+// Empty polyfill to trick Next.js into not loading legacy polyfills
+export default {};

lib/excel-products.ts

@@ -0,0 +1,388 @@
+/**
+ * Excel Products Module
+ * 
+ * Provides typed access to technical product data from Excel source files.
+ * Reuses the parsing logic from the PDF datasheet generator.
+ */
+
+import * as fs from 'fs';
+import * as path from 'path';
+import * as XLSX from 'xlsx';
+
+// Configuration
+const EXCEL_SOURCE_FILES = [
+  path.join(process.cwd(), 'data/excel/high-voltage.xlsx'),
+  path.join(process.cwd(), 'data/excel/medium-voltage-KM.xlsx'),
+  path.join(process.cwd(), 'data/excel/low-voltage-KM.xlsx'),
+  path.join(process.cwd(), 'data/excel/solar-cables.xlsx'),
+];
+
+// Types
+export type ExcelRow = Record<string, string | number | boolean | Date>;
+
+export interface ExcelMatch {
+  rows: ExcelRow[];
+  units: Record<string, string>;
+}
+
+export interface TechnicalData {
+  configurations: string[];
+  attributes: Array<{
+    name: string;
+    options: string[];
+  }>;
+}
+
+export interface ProductLookupParams {
+  name?: string;
+  slug?: string;
+  sku?: string;
+  translationKey?: string;
+}
+
+// Cache singleton
+let EXCEL_INDEX: Map<string, ExcelMatch> | null = null;
+
+/**
+ * Normalize Excel key to match product identifiers
+ * Examples:
+ * - "NA2XS(FL)2Y" -> "NA2XSFL2Y"
+ * - "na2xsfl2y-3" -> "NA2XSFL2Y"
+ */
+function normalizeExcelKey(value: string): string {
+  return String(value || '')
+    .toUpperCase()
+    .replace(/-\d+$/g, '')
+    .replace(/[^A-Z0-9]+/g, '');
+}
+
+/**
+ * Normalize value (strip HTML, trim whitespace)
+ */
+function normalizeValue(value: string): string {
+  if (!value) return '';
+  return String(value)
+    .replace(/<[^>]*>/g, '')
+    .replace(/\s+/g, ' ')
+    .trim();
+}
+
+/**
+ * Check if value looks numeric
+ */
+function looksNumeric(value: string): boolean {
+  const v = normalizeValue(value).replace(/,/g, '.');
+  return /^-?\d+(?:\.\d+)?$/.test(v);
+}
+
+/**
+ * Load Excel rows from a file using xlsx library
+ */
+function loadExcelRows(filePath: string): ExcelRow[] {
+  if (!fs.existsSync(filePath)) {
+    console.warn(`[excel-products] File not found: ${filePath}`);
+    return [];
+  }
+
+  try {
+    const workbook = XLSX.readFile(filePath, { 
+      cellDates: false,
+      cellNF: false,
+      cellText: false
+    });
+    
+    // Get the first sheet
+    const sheetName = workbook.SheetNames[0];
+    const worksheet = workbook.Sheets[sheetName];
+    
+    // Convert to JSON
+    const rows = XLSX.utils.sheet_to_json(worksheet, {
+      defval: '',
+      raw: false
+    }) as ExcelRow[];
+    
+    return rows;
+  } catch (error) {
+    console.error(`[excel-products] Error reading ${filePath}:`, error);
+    return [];
+  }
+}
+
+/**
+ * Build the Excel index from all source files
+ */
+export function getExcelIndex(): Map<string, ExcelMatch> {
+  if (EXCEL_INDEX) return EXCEL_INDEX;
+  
+  const idx = new Map<string, ExcelMatch>();
+  
+  for (const file of EXCEL_SOURCE_FILES) {
+    const rows = loadExcelRows(file);
+    if (rows.length === 0) continue;
+    
+    // Find units row (if present)
+    const unitsRow = rows.find(r => r && r['Part Number'] === 'Units') || null;
+    const units: Record<string, string> = {};
+    
+    if (unitsRow) {
+      for (const [k, v] of Object.entries(unitsRow)) {
+        if (k === 'Part Number') continue;
+        const unit = normalizeValue(String(v ?? ''));
+        if (unit) units[k] = unit;
+      }
+    }
+    
+    // Index rows by Part Number
+    for (const r of rows) {
+      const pn = r?.['Part Number'];
+      if (!pn || pn === 'Units') continue;
+      
+      const key = normalizeExcelKey(String(pn));
+      if (!key) continue;
+      
+      const cur = idx.get(key);
+      if (!cur) {
+        idx.set(key, { rows: [r], units });
+      } else {
+        cur.rows.push(r);
+        // Keep the most comprehensive units
+        if (Object.keys(cur.units).length < Object.keys(units).length) {
+          cur.units = units;
+        }
+      }
+    }
+  }
+  
+  EXCEL_INDEX = idx;
+  return idx;
+}
+
+/**
+ * Find Excel match for a product using various identifiers
+ */
+function findExcelForProduct(params: ProductLookupParams): ExcelMatch | null {
+  const idx = getExcelIndex();
+  
+  const candidates = [
+    params.name,
+    params.slug ? params.slug.replace(/-\d+$/g, '') : '',
+    params.sku,
+    params.translationKey,
+  ].filter(Boolean) as string[];
+  
+  for (const c of candidates) {
+    const key = normalizeExcelKey(c);
+    const match = idx.get(key);
+    if (match && match.rows.length) return match;
+  }
+  
+  return null;
+}
+
+/**
+ * Guess column key based on patterns
+ */
+function guessColumnKey(row: ExcelRow, patterns: RegExp[]): string | null {
+  const keys = Object.keys(row || {});
+  
+  for (const re of patterns) {
+    const k = keys.find(x => {
+      const key = String(x);
+      
+      // Specific exclusions to prevent wrong matches
+      if (re.test('conductor') && /ross section conductor/i.test(key)) return false;
+      if (re.test('insulation thickness') && /Diameter over insulation/i.test(key)) return false;
+      if (re.test('conductor') && !/^conductor$/i.test(key)) return false;
+      if (re.test('insulation') && !/^insulation$/i.test(key)) return false;
+      if (re.test('sheath') && !/^sheath$/i.test(key)) return false;
+      if (re.test('norm') && !/^norm$/i.test(key)) return false;
+      
+      return re.test(key);
+    });
+    if (k) return k;
+  }
+  return null;
+}
+
+/**
+ * Get unique non-empty values from an array
+ */
+function getUniqueNonEmpty(options: string[]): string[] {
+  const uniq: string[] = [];
+  const seen = new Set<string>();
+  for (const v of options.map(normalizeValue).filter(Boolean)) {
+    const k = v.toLowerCase();
+    if (seen.has(k)) continue;
+    seen.add(k);
+    uniq.push(v);
+  }
+  return uniq;
+}
+
+/**
+ * Get technical data for a product from Excel files
+ */
+export function getExcelTechnicalDataForProduct(params: ProductLookupParams): TechnicalData | null {
+  const match = findExcelForProduct(params);
+  if (!match || match.rows.length === 0) return null;
+  
+  const rows = match.rows;
+  const sample = rows[0];
+  
+  // Find cross-section column
+  const csKey = guessColumnKey(sample, [
+    /number of cores and cross-section/i,
+    /cross.?section/i,
+    /ross section conductor/i,
+  ]);
+  
+  if (!csKey) return null;
+  
+  // Extract configurations
+  const voltageKey = guessColumnKey(sample, [/rated voltage/i, /voltage rating/i, /spannungs/i, /nennspannung/i]);
+  
+  const configurations = rows
+    .map(r => {
+      const cs = normalizeValue(String(r?.[csKey] ?? ''));
+      const v = voltageKey ? normalizeValue(String(r?.[voltageKey] ?? '')) : '';
+      if (!cs) return '';
+      if (!v) return cs;
+      const vHasUnit = /\bkv\b/i.test(v);
+      const vText = vHasUnit ? v : `${v} kV`;
+      return `${cs} - ${vText}`;
+    })
+    .filter(Boolean);
+  
+  if (configurations.length === 0) return null;
+  
+  // Extract technical attributes
+  const attributes: Array<{ name: string; options: string[] }> = [];
+  
+  // Key technical columns
+  const outerKey = guessColumnKey(sample, [/outer diameter\b/i, /outer diameter.*approx/i, /outer diameter of cable/i, /außen/i]);
+  const weightKey = guessColumnKey(sample, [/weight\b/i, /gewicht/i, /cable weight/i]);
+  const dcResKey = guessColumnKey(sample, [/dc resistance/i, /resistance conductor/i, /leiterwiderstand/i]);
+  const ratedVoltKey = voltageKey;
+  const testVoltKey = guessColumnKey(sample, [/test voltage/i, /prüfspannung/i]);
+  const tempRangeKey = guessColumnKey(sample, [/operating temperature range/i, /temperature range/i, /temperaturbereich/i]);
+  const conductorKey = guessColumnKey(sample, [/^conductor$/i]);
+  const insulationKey = guessColumnKey(sample, [/^insulation$/i]);
+  const sheathKey = guessColumnKey(sample, [/^sheath$/i]);
+  const normKey = guessColumnKey(sample, [/^norm$/i, /^standard$/i]);
+  const cprKey = guessColumnKey(sample, [/cpr class/i]);
+  const packagingKey = guessColumnKey(sample, [/^packaging$/i]);
+  const shapeKey = guessColumnKey(sample, [/shape of conductor/i]);
+  const flameKey = guessColumnKey(sample, [/flame retardant/i]);
+  const diamCondKey = guessColumnKey(sample, [/diameter conductor/i]);
+  const diamInsKey = guessColumnKey(sample, [/diameter over insulation/i]);
+  const diamScreenKey = guessColumnKey(sample, [/diameter over screen/i]);
+  const metalScreenKey = guessColumnKey(sample, [/metallic screen/i]);
+  const capacitanceKey = guessColumnKey(sample, [/capacitance/i]);
+  const reactanceKey = guessColumnKey(sample, [/reactance/i]);
+  const electricalStressKey = guessColumnKey(sample, [/electrical stress/i]);
+  const pullingForceKey = guessColumnKey(sample, [/max\. pulling force/i, /pulling force/i]);
+  const heatingTrefoilKey = guessColumnKey(sample, [/heating time constant.*trefoil/i]);
+  const heatingFlatKey = guessColumnKey(sample, [/heating time constant.*flat/i]);
+  const currentAirTrefoilKey = guessColumnKey(sample, [/current ratings in air.*trefoil/i]);
+  const currentAirFlatKey = guessColumnKey(sample, [/current ratings in air.*flat/i]);
+  const currentGroundTrefoilKey = guessColumnKey(sample, [/current ratings in ground.*trefoil/i]);
+  const currentGroundFlatKey = guessColumnKey(sample, [/current ratings in ground.*flat/i]);
+  const scCurrentCondKey = guessColumnKey(sample, [/conductor shortcircuit current/i]);
+  const scCurrentScreenKey = guessColumnKey(sample, [/screen shortcircuit current/i]);
+  const minLayKey = guessColumnKey(sample, [/minimal temperature for laying/i]);
+  const minStoreKey = guessColumnKey(sample, [/minimal storage temperature/i]);
+  const maxOpKey = guessColumnKey(sample, [/maximal operating conductor temperature/i, /max\. operating/i]);
+  const maxScKey = guessColumnKey(sample, [/maximal short-circuit temperature/i, /short\s*circuit\s*temperature/i]);
+  const insThkKey = guessColumnKey(sample, [/nominal insulation thickness/i, /insulation thickness/i]);
+  const sheathThkKey = guessColumnKey(sample, [/nominal sheath thickness/i, /minimum sheath thickness/i]);
+  const maxResKey = guessColumnKey(sample, [/maximum resistance of conductor/i]);
+  const bendKey = guessColumnKey(sample, [/bending radius/i, /min\. bending radius/i]);
+  
+  // Helper to add attribute
+  const addAttr = (name: string, key: string | null, unit?: string) => {
+    if (!key) return;
+    const options = rows
+      .map(r => normalizeValue(String(r?.[key] ?? '')))
+      .map(v => (unit && v && looksNumeric(v) ? `${v} ${unit}` : v))
+      .filter(Boolean);
+    
+    if (options.length === 0) return;
+    
+    const uniqueOptions = getUniqueNonEmpty(options);
+    attributes.push({ name, options: uniqueOptions });
+  };
+  
+  // Add attributes
+  addAttr('Outer diameter', outerKey, 'mm');
+  addAttr('Weight', weightKey, 'kg/km');
+  addAttr('DC resistance at 20 °C', dcResKey, 'Ω/km');
+  addAttr('Rated voltage', ratedVoltKey, '');
+  addAttr('Test voltage', testVoltKey, '');
+  addAttr('Operating temperature range', tempRangeKey, '');
+  addAttr('Minimal temperature for laying', minLayKey, '');
+  addAttr('Minimal storage temperature', minStoreKey, '');
+  addAttr('Maximal operating conductor temperature', maxOpKey, '');
+  addAttr('Maximal short-circuit temperature', maxScKey, '');
+  addAttr('Nominal insulation thickness', insThkKey, 'mm');
+  addAttr('Nominal sheath thickness', sheathThkKey, 'mm');
+  addAttr('Maximum resistance of conductor', maxResKey, 'Ω/km');
+  addAttr('Conductor', conductorKey, '');
+  addAttr('Insulation', insulationKey, '');
+  addAttr('Sheath', sheathKey, '');
+  addAttr('Standard', normKey, '');
+  addAttr('Conductor diameter', diamCondKey, 'mm');
+  addAttr('Insulation diameter', diamInsKey, 'mm');
+  addAttr('Screen diameter', diamScreenKey, 'mm');
+  addAttr('Metallic screen', metalScreenKey, '');
+  addAttr('Max. pulling force', pullingForceKey, '');
+  addAttr('Electrical stress conductor', electricalStressKey, '');
+  addAttr('Electrical stress insulation', electricalStressKey, '');
+  addAttr('Reactance', reactanceKey, '');
+  addAttr('Heating time constant trefoil', heatingTrefoilKey, 's');
+  addAttr('Heating time constant flat', heatingFlatKey, 's');
+  addAttr('Flame retardant', flameKey, '');
+  addAttr('CPR class', cprKey, '');
+  addAttr('Packaging', packagingKey, '');
+  addAttr('Bending radius', bendKey, 'mm');
+  addAttr('Shape of conductor', shapeKey, '');
+  addAttr('Capacitance', capacitanceKey, 'μF/km');
+  addAttr('Current ratings in air, trefoil', currentAirTrefoilKey, 'A');
+  addAttr('Current ratings in air, flat', currentAirFlatKey, 'A');
+  addAttr('Current ratings in ground, trefoil', currentGroundTrefoilKey, 'A');
+  addAttr('Current ratings in ground, flat', currentGroundFlatKey, 'A');
+  addAttr('Conductor shortcircuit current', scCurrentCondKey, 'kA');
+  addAttr('Screen shortcircuit current', scCurrentScreenKey, 'kA');
+  
+  return {
+    configurations,
+    attributes,
+  };
+}
+
+/**
+ * Get raw Excel rows for a product (for detailed inspection)
+ */
+export function getExcelRowsForProduct(params: ProductLookupParams): ExcelRow[] {
+  const match = findExcelForProduct(params);
+  return match?.rows || [];
+}
+
+/**
+ * Clear the Excel index cache (useful for development)
+ */
+export function clearExcelCache(): void {
+  EXCEL_INDEX = null;
+}
+
+/**
+ * Preload Excel data on module initialization
+ * This ensures the cache is built during build time
+ */
+export function preloadExcelData(): void {
+  getExcelIndex();
+}
+
+// Preload when imported
+if (require.main === module) {
+  preloadExcelData();
+}

lib/og-helper.tsx

@@ -5,7 +5,9 @@ import { join } from 'path';
  * Loads the Inter fonts for use in Satori (Next.js OG Image generation).
  * Since we are using runtime = 'nodejs', we can read them from the filesystem.
  */
+let cachedFonts: any[] | null = null;
 export async function getOgFonts() {
+  if (cachedFonts) return cachedFonts;
   const boldFontPath = join(process.cwd(), 'public/fonts/Inter-Bold.woff');
   const regularFontPath = join(process.cwd(), 'public/fonts/Inter-Regular.woff');
 
@@ -28,7 +30,7 @@ export async function getOgFonts() {
       `[OG] Fonts loaded successfully (${boldFont.byteLength} and ${regularFont.byteLength} bytes)`,
     );
 
-    return [
+    cachedFonts = [
       {
         name: 'Inter',
         data: boldFont,
@@ -42,28 +44,35 @@ export async function getOgFonts() {
         style: 'normal' as const,
       },
     ];
+    return cachedFonts;
   } catch (error) {
     console.error(`[OG] Failed to load fonts from ${process.cwd()}:`, error);
     return [];
   }
 }
 
+let cachedBackground: string | null = null;
 export function getOgBackground() {
+  if (cachedBackground) return cachedBackground;
   try {
     const bgPath = join(process.cwd(), 'public/assets/photos/Etib_E-tib_Tiefbau_Guben_Netzanbindung_Energie-100.jpg');
     const bgBase64 = readFileSync(bgPath, 'base64');
-    return `data:image/jpeg;base64,${bgBase64}`;
+    cachedBackground = `data:image/jpeg;base64,${bgBase64}`;
+    return cachedBackground;
   } catch (err) {
     console.error('[OG] Failed to load background', err);
     return undefined;
   }
 }
 
+let cachedLogo: string | null = null;
 export function getOgLogo() {
+  if (cachedLogo) return cachedLogo;
   try {
     const logoPath = join(process.cwd(), 'public/assets/logo-white.png');
     const logoBase64 = readFileSync(logoPath, 'base64');
-    return `data:image/png;base64,${logoBase64}`;
+    cachedLogo = `data:image/png;base64,${logoBase64}`;
+    return cachedLogo;
   } catch (err) {
     console.error('[OG] Failed to load logo', err);
     return undefined;

lib/pdf-page.tsx

@@ -0,0 +1,329 @@
+import * as React from 'react';
+import { Document, Page, View, Text, StyleSheet, Font, Link } from '@react-pdf/renderer';
+
+// Register fonts (using system fonts for now, can be customized)
+Font.register({
+  family: 'Helvetica',
+  fonts: [
+    { src: '/fonts/Helvetica.ttf', fontWeight: 400 },
+    { src: '/fonts/Helvetica-Bold.ttf', fontWeight: 700 },
+  ],
+});
+
+// ─── Brand Tokens (matching datasheet) ──────────────────────────────────
+const C = {
+  navy: '#001a4d',
+  navyDeep: '#000d26',
+  green: '#4da612',
+  greenLight: '#e8f5d8',
+  white: '#FFFFFF',
+  offWhite: '#f8f9fa',
+  gray100: '#f3f4f6',
+  gray200: '#e5e7eb',
+  gray300: '#d1d5db',
+  gray400: '#9ca3af',
+  gray600: '#4b5563',
+  gray900: '#111827',
+};
+
+const MARGIN = 56;
+
+const styles = StyleSheet.create({
+  page: {
+    color: C.gray900,
+    lineHeight: 1.5,
+    backgroundColor: C.white,
+    paddingTop: 0,
+    paddingBottom: 80,
+    fontFamily: 'Helvetica',
+  },
+
+  // Hero-style header
+  hero: {
+    backgroundColor: C.white,
+    paddingTop: 24,
+    paddingBottom: 0,
+    paddingHorizontal: MARGIN,
+    marginBottom: 20,
+    position: 'relative',
+    borderBottomWidth: 0,
+  },
+
+  header: {
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+    alignItems: 'center',
+    marginBottom: 16,
+  },
+
+  logoText: {
+    fontSize: 22,
+    fontWeight: 700,
+    color: C.navyDeep,
+    letterSpacing: 2,
+    textTransform: 'uppercase',
+  },
+
+  docTitle: {
+    fontSize: 8,
+    fontWeight: 700,
+    color: C.green,
+    letterSpacing: 2,
+    textTransform: 'uppercase',
+  },
+
+  // Content Area
+  content: {
+    paddingHorizontal: MARGIN,
+  },
+
+  pageTitle: {
+    fontSize: 24,
+    fontWeight: 700,
+    color: C.navyDeep,
+    marginBottom: 8,
+    marginTop: 10,
+    textTransform: 'uppercase',
+    letterSpacing: -0.5,
+  },
+
+  accentBar: {
+    width: 30,
+    height: 2,
+    backgroundColor: C.green,
+    marginBottom: 20,
+    borderRadius: 1,
+  },
+
+  // Lexical Elements
+  paragraph: {
+    fontSize: 10,
+    color: C.gray600,
+    lineHeight: 1.7,
+    marginBottom: 12,
+  },
+  heading1: {
+    fontSize: 16,
+    fontWeight: 700,
+    color: C.navyDeep,
+    marginTop: 20,
+    marginBottom: 10,
+    textTransform: 'uppercase',
+    letterSpacing: 0.5,
+  },
+  heading2: {
+    fontSize: 12,
+    fontWeight: 700,
+    color: C.navyDeep,
+    marginTop: 16,
+    marginBottom: 8,
+  },
+  heading3: {
+    fontSize: 10,
+    fontWeight: 700,
+    color: C.navyDeep,
+    marginTop: 12,
+    marginBottom: 6,
+  },
+  list: {
+    marginBottom: 12,
+    marginLeft: 8,
+  },
+  listItem: {
+    flexDirection: 'row',
+    marginBottom: 4,
+  },
+  listItemBullet: {
+    width: 12,
+    fontSize: 10,
+    color: C.green,
+    fontWeight: 700,
+  },
+  listItemContent: {
+    flex: 1,
+    fontSize: 10,
+    color: C.gray600,
+    lineHeight: 1.7,
+  },
+  link: {
+    color: C.green,
+    textDecoration: 'none',
+  },
+  textBold: {
+    fontWeight: 700,
+    fontFamily: 'Helvetica-Bold',
+    color: C.navyDeep,
+  },
+  textItalic: {
+    fontStyle: 'italic',
+  },
+
+  // Footer — matches brochure style
+  footer: {
+    position: 'absolute',
+    bottom: 28,
+    left: MARGIN,
+    right: MARGIN,
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+    alignItems: 'center',
+    paddingTop: 12,
+    borderTopWidth: 2,
+    borderTopColor: C.green,
+  },
+
+  footerText: {
+    fontSize: 7,
+    color: C.gray400,
+    fontWeight: 400,
+    textTransform: 'uppercase',
+    letterSpacing: 0.8,
+  },
+
+  footerBrand: {
+    fontSize: 9,
+    fontWeight: 700,
+    color: C.navyDeep,
+    textTransform: 'uppercase',
+    letterSpacing: 1.5,
+  },
+});
+
+// ─── Lexical to React-PDF Renderer ────────────────────────────────
+
+const renderLexicalNode = (node: any, idx: number): React.ReactNode => {
+  if (!node) return null;
+
+  switch (node.type) {
+    case 'text': {
+      const format = node.format || 0;
+      const isBold = (format & 1) !== 0;
+      const isItalic = (format & 2) !== 0;
+
+      let elementStyle: any = {};
+      if (isBold) elementStyle = { ...elementStyle, ...styles.textBold };
+      if (isItalic) elementStyle = { ...elementStyle, ...styles.textItalic };
+
+      return (
+        <Text key={idx} style={elementStyle}>
+          {node.text}
+        </Text>
+      );
+    }
+
+    case 'paragraph': {
+      return (
+        <Text key={idx} style={styles.paragraph}>
+          {node.children?.map((child: any, i: number) => renderLexicalNode(child, i))}
+        </Text>
+      );
+    }
+
+    case 'heading': {
+      let hStyle = styles.heading3;
+      if (node.tag === 'h1') hStyle = styles.heading1;
+      if (node.tag === 'h2') hStyle = styles.heading2;
+
+      return (
+        <Text key={idx} style={hStyle}>
+          {node.children?.map((child: any, i: number) => renderLexicalNode(child, i))}
+        </Text>
+      );
+    }
+
+    case 'list': {
+      return (
+        <View key={idx} style={styles.list}>
+          {node.children?.map((child: any, i: number) => {
+            if (child.type === 'listitem') {
+              return (
+                <View key={i} style={styles.listItem}>
+                  <Text style={styles.listItemBullet}>
+                    {node.listType === 'number' ? `${i + 1}.` : '•'}
+                  </Text>
+                  <Text style={styles.listItemContent}>
+                    {child.children?.map((c: any, ci: number) => renderLexicalNode(c, ci))}
+                  </Text>
+                </View>
+              );
+            }
+            return renderLexicalNode(child, i);
+          })}
+        </View>
+      );
+    }
+
+    case 'link': {
+      const href = node.fields?.url || node.url || '#';
+      return (
+        <Link key={idx} src={href} style={styles.link}>
+          {node.children?.map((child: any, i: number) => renderLexicalNode(child, i))}
+        </Link>
+      );
+    }
+
+    case 'linebreak': {
+      return <Text key={idx}>{'\n'}</Text>;
+    }
+
+    // Ignore payload blocks recursively to avoid crashing
+    case 'block':
+      return null;
+
+    default:
+      if (node.children) {
+        return (
+          <Text key={idx}>
+            {node.children.map((child: any, i: number) => renderLexicalNode(child, i))}
+          </Text>
+        );
+      }
+      return null;
+  }
+};
+
+interface PDFPageProps {
+  page: any;
+  locale?: string;
+}
+
+export const PDFPage: React.FC<PDFPageProps> = ({ page, locale = 'de' }) => {
+  const dateStr = new Date().toLocaleDateString(locale === 'en' ? 'en-US' : 'de-DE', {
+    year: 'numeric',
+    month: 'long',
+    day: 'numeric',
+  });
+
+  return (
+    <Document>
+      <Page size="A4" style={styles.page}>
+        {/* Hero Header */}
+        <View style={styles.hero} fixed>
+          <View style={styles.header}>
+            <View>
+              <Text style={styles.logoText}>KLZ</Text>
+            </View>
+            <Text style={styles.docTitle}>{locale === 'en' ? 'Document' : 'Dokument'}</Text>
+          </View>
+        </View>
+
+        <View style={styles.content}>
+          <Text style={styles.pageTitle}>{page.title}</Text>
+          <View style={styles.accentBar} />
+
+          <View>
+            {page.content?.root?.children?.map((node: any, i: number) =>
+              renderLexicalNode(node, i),
+            )}
+          </View>
+        </View>
+
+        {/* Minimal footer */}
+        <View style={styles.footer} fixed>
+          <Text style={styles.footerBrand}>KLZ CABLES</Text>
+          <Text style={styles.footerText}>{dateStr}</Text>
+        </View>
+      </Page>
+    </Document>
+  );
+};

lib/schema.ts

@@ -1,7 +1,6 @@
 import { config } from './config';
 
 const getSiteUrl = () => {
-  if (process.env.CI) return 'http://etib.localhost';
   return (config.baseUrl as string) || 'https://e-tib.com';
 };
 

lib/services/create-services.ts

@@ -2,7 +2,6 @@ import { AppServices } from './app-services';
 import { NoopAnalyticsService } from './analytics/noop-analytics-service';
 import { UmamiAnalyticsService } from './analytics/umami-analytics-service';
 import { MemoryCacheService } from './cache/memory-cache-service';
-import { GlitchtipErrorReportingService } from './errors/glitchtip-error-reporting-service';
 import { NoopErrorReportingService } from './errors/noop-error-reporting-service';
 import { NoopLoggerService } from './logging/noop-logger-service';
 import { PinoLoggerService } from './logging/pino-logger-service';
@@ -68,17 +67,7 @@ export function getAppServices(): AppServices {
   logger.info('Notification service initialized (noop)');
 
   // Create error reporting service (GlitchTip/Sentry or no-op)
-  const errors = sentryEnabled
-    ? new GlitchtipErrorReportingService(
-        {
-          enabled: true,
-          dsn: config.errors.glitchtip.dsn,
-          tracesSampleRate: 0.1, // Default to 10% sampling
-        },
-        logger,
-        notifications,
-      )
-    : new NoopErrorReportingService();
+  const errors = new NoopErrorReportingService();
 
   if (sentryEnabled) {
     logger.info(

lib/services/errors/glitchtip-error-reporting-service.ts

@@ -73,7 +73,7 @@ export class GlitchtipErrorReportingService implements ErrorReportingService {
       const contextStr = context ? `\nContext: ${JSON.stringify(context, null, 2)}` : '';
 
       await this.notifications.notify({
-        title: '🔥 Critical Error Captured',
+        title: '🔥 [E-TIB] Critical Error Captured',
         message: `Error: ${errorMessage}${contextStr}`,
         priority: 7,
       });
@@ -92,7 +92,7 @@ export class GlitchtipErrorReportingService implements ErrorReportingService {
       (level === 'error' || level === 'fatal' || message.includes('Route Not Found'))
     ) {
       await this.notifications.notify({
-        title: level === 'warning' ? '⚠️ Warning Captured' : '🔥 Critical Message Captured',
+        title: level === 'warning' ? '⚠️ [E-TIB] Warning Captured' : '🔥 [E-TIB] Critical Message Captured',
         message: message,
         priority: level === 'warning' ? 5 : 7,
       });

messages/de.json

@@ -66,6 +66,10 @@
       "role": "Geschäftsführer",
       "description": "Danny Joseph leitet die E-TIB GmbH und koordiniert die strategische Ausrichtung der gesamten Unternehmensgruppe vom Hauptsitz in Guben aus."
     },
+    "gallery": {
+      "title": "Einblicke in unsere Arbeit",
+      "subtitle": "Eindrücke aus dem Arbeitsalltag und Projekten"
+    },
     "groups": {
       "title": "Unsere Unternehmensgruppe",
       "subtitle": "Spezialisierte Einheiten für komplexe Projekte",

messages/en.json

@@ -63,8 +63,12 @@
     },
     "danny": {
       "name": "Danny Joseph",
-      "role": "CEO",
-      "description": "Danny Joseph leads E-TIB GmbH and coordinates the strategic direction of the entire group from its headquarters in Guben."
+      "role": "Managing Director",
+      "description": "Danny Joseph leads E-TIB GmbH and coordinates the strategic direction of the entire corporate group from the headquarters in Guben."
+    },
+    "gallery": {
+      "title": "Insights into our work",
+      "subtitle": "Impressions from daily work and projects"
     },
     "groups": {
       "title": "Our Corporate Group",

next.config.mjs

@@ -1,4 +1,4 @@
-import withMintelConfig from '@mintel/next-config';
+import { baseNextConfig } from '@mintel/next-config';
 import withBundleAnalyzer from '@next/bundle-analyzer';
 import { withSentryConfig } from '@sentry/nextjs';
 
@@ -15,6 +15,7 @@ const nextConfig = {
     pagesBufferLength: 2,
   },
   experimental: {
+    inlineCss: false,
     staleTimes: {
       dynamic: 0,
       static: 30,
@@ -23,7 +24,6 @@ const nextConfig = {
       'lucide-react',
       'framer-motion',
       '@/components/ui',
-      '@sentry/nextjs',
       'react-hook-form',
       'zod',
       'date-fns',
@@ -47,7 +47,18 @@ const nextConfig = {
     NEXT_PUBLIC_APP_VERSION: process.env.NEXT_PUBLIC_APP_VERSION || process.env.npm_package_version || 'dev',
   },
   // Prevent webpack from restarting when .env files are touched via Docker volume mount
-  webpack: (config, { dev }) => {
+  webpack: (config, { dev, isServer }) => {
+    // Completely strip Next.js forced legacy polyfills for modern browser targets
+    if (!isServer) {
+      config.resolve.alias = {
+        ...config.resolve.alias,
+        'next/dist/build/polyfills/polyfill-module': false,
+        'next/dist/build/polyfills/polyfill-nomodule': false,
+        'core-js': false,
+        'regenerator-runtime': false,
+      };
+    }
+    
     if (dev) {
       config.watchOptions = {
         ...config.watchOptions,
@@ -538,14 +549,58 @@ const withAnalyzer = withBundleAnalyzer({
   enabled: process.env.ANALYZE === 'true',
 });
 
-// withMintelConfig internally sets output:'standalone' and wraps with withSentryConfig.
 // In dev mode, standalone triggers @vercel/nft file tracing on every compile through
 // VirtioFS, which hammers CPU. Strip it for dev.
 const withMDX = createMDX({});
-let resolvedConfig = withMDX(withAnalyzer(withMintelConfig(nextConfig)));
+let resolvedConfig = withMDX(withAnalyzer(nextConfig));
+
+// Apply next-intl manually (bypassing withMintelConfig to control Sentry)
+import createNextIntlPlugin from 'next-intl/plugin';
+const withNextIntl = createNextIntlPlugin();
+resolvedConfig = withNextIntl(resolvedConfig);
+
+// Removed withSentryConfig completely to eliminate the 170KB client-side bloat and Array.from legacy polyfill.
+// Server-side instrumentation is still handled manually in instrumentation.ts.
+
+// Manually merge baseNextConfig properties
+const finalConfig = {
+  ...baseNextConfig,
+  ...resolvedConfig,
+  images: {
+    ...baseNextConfig.images,
+    ...(resolvedConfig.images || {}),
+    remotePatterns: [
+      ...(baseNextConfig.images?.remotePatterns || []),
+      ...(resolvedConfig.images?.remotePatterns || [])
+    ]
+  },
+  rewrites: async () => {
+    let baseRewrites = [];
+    if (typeof baseNextConfig.rewrites === 'function') {
+      baseRewrites = await baseNextConfig.rewrites();
+    }
+    let configRewrites = { beforeFiles: [], fallback: [], afterFiles: [] };
+    if (typeof resolvedConfig.rewrites === 'function') {
+      const res = await resolvedConfig.rewrites();
+      if (Array.isArray(res)) {
+        configRewrites.fallback = res;
+      } else {
+        configRewrites = res;
+      }
+    }
+    return {
+      beforeFiles: configRewrites.beforeFiles || [],
+      fallback: [
+        ...(configRewrites.fallback || []),
+        ...baseRewrites
+      ],
+      afterFiles: configRewrites.afterFiles || []
+    };
+  }
+};
 
 if (!isProd) {
-  delete resolvedConfig.output;
+  delete finalConfig.output;
 }
 
-export default resolvedConfig;
+export default finalConfig;

package.json

@@ -1,5 +1,6 @@
 {
   "name": "e-tib-nextjs",
+  "version": "2.4.18",
   "type": "module",
   "private": true,
   "packageManager": "pnpm@10.18.3",
@@ -11,6 +12,7 @@
     "@mintel/next-utils": "1.9.5",
     "@next/mdx": "^16.1.6",
     "@react-email/components": "1.0.8",
+    "@react-pdf/renderer": "^4.5.1",
     "@react-three/drei": "^10.7.7",
     "@react-three/fiber": "^9.5.0",
     "@sentry/nextjs": "^10.39.0",
@@ -105,6 +107,7 @@
     "build": "next build",
     "start": "next start",
     "lint": "eslint .",
+    "postinstall": "echo '' > node_modules/next/dist/build/polyfills/polyfill-module.js && echo '' > node_modules/next/dist/build/polyfills/polyfill-nomodule.js",
     "typecheck": "tsc --noEmit",
     "test": "vitest run --passWithNoTests",
     "test:og": "vitest run tests/og-image.test.ts",
@@ -138,7 +141,6 @@
     "prepare": "husky",
     "preinstall": "npx only-allow pnpm"
   },
-  "version": "2.2.46",
   "pnpm": {
     "onlyBuiltDependencies": [
       "@parcel/watcher",
@@ -149,13 +151,15 @@
     ],
     "overrides": {
       "next": "16.1.6",
-      "minimatch": ">=10.2.2"
+      "minimatch": ">=10.2.2",
+      "framer-motion": "^12.38.0"
     }
   },
   "browserslist": [
-    "last 3 versions",
-    "not dead",
-    "not ie 11"
+    "last 2 chrome versions",
+    "last 2 firefox versions",
+    "last 2 edge versions",
+    "safari >= 15.4"
   ],
   "peerDependencies": {
     "lucide-react": "^0.563.0"

pnpm-lock.yaml

@@ -7,6 +7,7 @@ settings:
 overrides:
   next: 16.1.6
   minimatch: '>=10.2.2'
+  framer-motion: ^12.38.0
 
 importers:
 
@@ -33,6 +34,9 @@ importers:
       '@react-email/components':
         specifier: 1.0.8
         version: 1.0.8(react-dom@19.2.4(react@19.2.4))(react@19.2.4)
+      '@react-pdf/renderer':
+        specifier: ^4.5.1
+        version: 4.5.1(react@19.2.4)
       '@react-three/drei':
         specifier: ^10.7.7
         version: 10.7.7(@react-three/fiber@9.5.0(@types/react@19.2.14)(immer@11.1.4)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(three@0.183.2))(@types/react@19.2.14)(@types/three@0.183.1)(immer@11.1.4)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(three@0.183.2)
@@ -52,7 +56,7 @@ importers:
         specifier: ^2.1.1
         version: 2.1.1
       framer-motion:
-        specifier: ^12.34.0
+        specifier: ^12.38.0
         version: 12.38.0(react-dom@19.2.4(react@19.2.4))(react@19.2.4)
       graphql:
         specifier: ^16.12.0
@@ -2209,6 +2213,49 @@ packages:
       react: ^18.0.0
       react-dom: ^18.0.0
 
+  '@react-pdf/fns@3.1.3':
+    resolution: {integrity: sha512-0I7pApDr1/RLAKbizuLy/IHTEa93LSPy/bEwYniboC3Xqnp6Od8xFJKbKEzGw2wh/5zKFFwl00g4t9RwgIMc3w==}
+
+  '@react-pdf/font@4.0.8':
+    resolution: {integrity: sha512-deNd+emtZAJho1IlzKL9bRoLAGv/6oXOIKO2oZfs4RuXUrK1onLHbJO7e2YoVLPFP/sQxisRTnzdJFtd35iKwA==}
+
+  '@react-pdf/image@3.1.0':
+    resolution: {integrity: sha512-ks7Ry8v711r8NvKWSELehj0BXBNPRihSnWsM09nDD8Ur175zbWBCK217LLwQMKDNYDVpkZaipdoJPom1LGaE9g==}
+
+  '@react-pdf/layout@4.6.1':
+    resolution: {integrity: sha512-gN6PmWoEffvlIkifLfEhMsVucRywVMyH3rnxdyOVOhGy0nWJKKGpHyPc4plbDdpP6EfZ0r8prHXujDSkIG2nSA==}
+
+  '@react-pdf/pdfkit@5.1.1':
+    resolution: {integrity: sha512-wNcdSsNlNYyGHGAgIdt453egBF7fiF9UxpRlklUfVvu8OWCrUppG9xiUrPLVoKiqWet5tMi0w6LmuFUJuYqjEg==}
+
+  '@react-pdf/primitives@4.3.0':
+    resolution: {integrity: sha512-nYXoZ36pvwNzbc54+DbL8RCn15jU7woJ9D/svnh5tpUXekJ+CbI4mZLo6boSv24CvJgychOu6h7gxX03B4ps0A==}
+
+  '@react-pdf/reconciler@2.0.0':
+    resolution: {integrity: sha512-7zaPRujpbHSmCpIrZ+b9HSTJHthcVZzX0Wx7RzvQGsGBUbHP4p6s5itXrAIOuQuPvDepoHGNOvf6xUuMVvdoyw==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
+
+  '@react-pdf/render@4.5.1':
+    resolution: {integrity: sha512-IW/N4HWJWtioBXCf7n02IR24VJJ8gbdS3jGypf+vW/rSErEx3/URRzh9UK6Ma8Fpog9+T/W6GE2NHJ5AAKHhVA==}
+
+  '@react-pdf/renderer@4.5.1':
+    resolution: {integrity: sha512-5r1VQrE6FRLXX5wWUxwZzM24E2BJMo6g8AQWuS8WyPs9ugu5yMnb2g8/RpPYka/Z6J+RUEWc32wty2NoUJF42Q==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
+
+  '@react-pdf/stylesheet@6.2.1':
+    resolution: {integrity: sha512-2+UEk+7e+z8baaWi2l5kPLWmwtJeOI+T5wW9GGeN3iDH7vd3kbTqOpN1yt9mmfNVZFxQsnDHpznFb5v5UF983A==}
+
+  '@react-pdf/svg@1.1.0':
+    resolution: {integrity: sha512-cTIHXiz9x1HrbfqzfxfZP3FRdDwUXG77QWF6Fb5MP/lV3ONxR+g0Z3hwtBatCS9HeGBQCpxX/Lzb8wHE+co1PA==}
+
+  '@react-pdf/textkit@6.3.0':
+    resolution: {integrity: sha512-v6+V8nAcVwm7s2s1jIG2MD3Iw//x/k+XrH1foWOELBE4b32pyDgKyPXN/6KJE0dnX7+fVy27uctLNCLNMvzKzQ==}
+
+  '@react-pdf/types@2.11.1':
+    resolution: {integrity: sha512-i9xQgfaDU9QoeNnbp6rltXCWg1huEh195rpOuN8cE4BZ2FuLdQrsIcb2dhFF9aOxXf+XBA6LOSpIW051MDD/bw==}
+
   '@react-three/drei@10.7.7':
     resolution: {integrity: sha512-ff+J5iloR0k4tC++QtD/j9u3w5fzfgFAWDtAGQah9pF2B1YgOq/5JxqY0/aVoQG5r3xSZz0cv5tk2YuBob4xEQ==}
     peerDependencies:
@@ -3383,6 +3430,9 @@ packages:
     resolution: {integrity: sha512-6/mh1E2u2YgEsCHdY0Yx5oW+61gZU+1vXaoiHHrpKeuRNNgFvS+/jrwHiQhB5apAf5oB7UB7E19ol2R2LKH8hQ==}
     engines: {node: ^14.17.0 || ^16.13.0 || >=18.0.0}
 
+  abs-svg-path@0.1.1:
+    resolution: {integrity: sha512-d8XPSGjfyzlXC3Xx891DJRyZfqk5JU0BJrDQcsWomFIV1/BIzPW5HDH5iDdWpqWaav0YVIEzT1RHTwWr0FFshA==}
+
   accepts@1.3.8:
     resolution: {integrity: sha512-PYAthTa2m2VKxuvSD3DPC/Gy+U+sOA1LAuT8mkmRuvw+NACSaeXEQ+NHcVF7rONl6qcaxV3Uuemwawk+7+SJLw==}
     engines: {node: '>= 0.6'}
@@ -3718,6 +3768,9 @@ packages:
   brotli@1.3.3:
     resolution: {integrity: sha512-oTKjJdShmDuGW94SyyaoQvAjf30dZaHnjJ8uAF+u2/vGJkJbJPJAT1gDiOJP5v1Zb6f9KEyW/1HpuaWIXtGHPg==}
 
+  browserify-zlib@0.2.0:
+    resolution: {integrity: sha512-Z942RysHXmJrhqk88FmKBVq/v5tqmSkDz7p54G/MGyjMnCFFnC79XWNbg+Vta8W6Wb2qtSZTSxIGkJrRpCFEiA==}
+
   browserslist@4.28.2:
     resolution: {integrity: sha512-48xSriZYYg+8qXna9kwqjIVzuQxi+KYWp2+5nCYnYKPTr0LvD89Jqk2Or5ogxz0NUMfIjhh2lIUX/LyX9B4oIg==}
     engines: {node: ^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7}
@@ -3912,6 +3965,14 @@ packages:
   color-name@1.1.4:
     resolution: {integrity: sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==}
 
+  color-name@2.1.0:
+    resolution: {integrity: sha512-1bPaDNFm0axzE4MEAzKPuqKWeRaT43U/hyxKPBdqTfmPF+d6n7FSoTFxLVULUJOmiLp01KjhIPPH+HrXZJN4Rg==}
+    engines: {node: '>=12.20'}
+
+  color-string@2.1.4:
+    resolution: {integrity: sha512-Bb6Cq8oq0IjDOe8wJmi4JeNn763Xs9cfrBcaylK1tPypWzyoy2G3l90v9k64kjphl/ZJjPIShFztenRomi8WTg==}
+    engines: {node: '>=18'}
+
   colorette@2.0.20:
     resolution: {integrity: sha512-IfEDxwoWIjkeXL1eXcDiow4UbKjhLdq6/EuSVR9GMN7KVH3r9gQ83e73hsz1Nd1T3ijd5xv1wcWRYO+D6kCI2w==}
 
@@ -4363,6 +4424,9 @@ packages:
   electron-to-chromium@1.5.330:
     resolution: {integrity: sha512-jFNydB5kFtYUobh4IkWUnXeyDbjf/r9gcUEXe1xcrcUxIGfTdzPXA+ld6zBRbwvgIGVzDll/LTIiDztEtckSnA==}
 
+  emoji-regex-xs@1.0.0:
+    resolution: {integrity: sha512-LRlerrMYoIDrT6jgpeZ2YYl/L8EulRTt5hQcYjy5AInh7HWXKimpqx68aknBFpGL2+/IcogTcaydJEgaTmOpDg==}
+
   emoji-regex@10.6.0:
     resolution: {integrity: sha512-toUI84YS5YmxW219erniWD0CIVOo46xGKColeNQRgOzDorgBi1v4D71/OFzgD9GO2UGKIv1C3Sp8DAn0+j5w7A==}
 
@@ -4843,20 +4907,6 @@ packages:
   fraction.js@5.3.4:
     resolution: {integrity: sha512-1X1NTtiJphryn/uLQz3whtY6jK3fTqoE3ohKs0tT+Ujr1W59oopxmoEh7Lu5p6vBaPbgoM0bzveAW4Qi5RyWDQ==}
 
-  framer-motion@11.18.2:
-    resolution: {integrity: sha512-5F5Och7wrvtLVElIpclDT0CBzMVg3dL22B64aZwHtsIY8RB4mXICLrkajK4G9R+ieSAGcgrLeae2SeUTg2pr6w==}
-    peerDependencies:
-      '@emotion/is-prop-valid': '*'
-      react: ^18.0.0 || ^19.0.0
-      react-dom: ^18.0.0 || ^19.0.0
-    peerDependenciesMeta:
-      '@emotion/is-prop-valid':
-        optional: true
-      react:
-        optional: true
-      react-dom:
-        optional: true
-
   framer-motion@12.38.0:
     resolution: {integrity: sha512-rFYkY/pigbcswl1XQSb7q424kSTQ8q6eAC+YUsSKooHQYuLdzdHjrt6uxUC+PRAO++q5IS7+TamgIw1AphxR+g==}
     peerDependencies:
@@ -5100,6 +5150,12 @@ packages:
     resolution: {integrity: sha512-HRcs+2mr52W0K+x8RzcLzuPPmVIKMSv97RGHy0Ea9y/mpcaK+xTrjICA04KAHi4GRzxliNqNJEFYWHghy3rSfQ==}
     engines: {node: '>= 6.0.0'}
 
+  hsl-to-hex@1.0.0:
+    resolution: {integrity: sha512-K6GVpucS5wFf44X0h2bLVRDsycgJmf9FF2elg+CrqD8GcFU8c6vYhgXn8NjUkFCwj+xDFb70qgLbTUm6sxwPmA==}
+
+  hsl-to-rgb-for-reals@1.1.1:
+    resolution: {integrity: sha512-LgOWAkrN0rFaQpfdWBQlv/VhkOxb5AsBjk6NQVx4yEzWS923T07X0M1Y0VNko2H52HeSpZrZNNMJ0aFqsdVzQg==}
+
   html-encoding-sniffer@6.0.0:
     resolution: {integrity: sha512-CV9TW3Y3f8/wT0BRFc1/KAVQ3TUHiXmaAb6VW9vtiMFf7SLoMd1PdAc4W3KFOFETBJUb90KatHqlsZMWV+R9Gg==}
     engines: {node: ^20.19.0 || ^22.12.0 || >=24.0.0}
@@ -5181,6 +5237,9 @@ packages:
     engines: {node: '>=18'}
     hasBin: true
 
+  hyphen@1.14.1:
+    resolution: {integrity: sha512-kvL8xYl5QMTh+LwohVN72ciOxC0OEV79IPdJSTwEXok9y9QHebXGdFgrED4sWfiax/ODx++CAMk3hMy4XPJPOw==}
+
   i18next-fs-backend@2.6.3:
     resolution: {integrity: sha512-/5aW996nbolGh/qVU9urjAJ2QiXpiyGuhG8x/ZvvZQ3bMlrK+ouUdD6whS4e+sU9CCdUIzl7x/heEjsBh/3xtw==}
 
@@ -5472,6 +5531,9 @@ packages:
     resolution: {integrity: sha512-mE00Gnza5EEB3Ds0HfMyllZzbBrmLOX3vfWoj9A9PEnTfratQ/BcaJOuMhnkhjXvb2+FkY3VuHqtAGpTPmglFQ==}
     engines: {node: '>=18'}
 
+  is-url@1.2.4:
+    resolution: {integrity: sha512-ITvGim8FhRiYe4IQ5uHSkj7pVaPDrCTkNd3yq3cV7iZAcJdHTUMPMEHcqSOy9xZ9qFenQCvi+2wjH9a1nXqHww==}
+
   is-weakmap@2.0.2:
     resolution: {integrity: sha512-K5pXYOm9wqY1RgjpL3YTkF39tni1XajUIkawTLUo9EZEVUFga5gSQJF8nNS7ZwJQ02y+1YCNYcMh+HIf1ZqE+w==}
     engines: {node: '>= 0.4'}
@@ -5513,6 +5575,9 @@ packages:
   jackspeak@3.4.3:
     resolution: {integrity: sha512-OGlZQpz2yfahA/Rd1Y8Cd9SIEsqvXkLVoSw/cgwhnhFMDbsQFeZYoJJ7bIZBS9BcamUW96asq/npPWugM+RQBw==}
 
+  jay-peg@1.1.1:
+    resolution: {integrity: sha512-D62KEuBxz/ip2gQKOEhk/mx14o7eiFRaU+VNNSP4MOiIkwb/D6B3G1Mfas7C/Fit8EsSV2/IWjZElx/Gs6A4ww==}
+
   jest-worker@27.5.1:
     resolution: {integrity: sha512-7vuh85V5cdDofPyxn58nrPjBktZo0u9x1g8WtjQol+jZDaE+fhN+cIvTj11GndBnMnyfrUOG1sZQxCdjKh+DKg==}
     engines: {node: '>= 10.13.0'}
@@ -5946,6 +6011,9 @@ packages:
   mdn-data@2.27.1:
     resolution: {integrity: sha512-9Yubnt3e8A0OKwxYSXyhLymGW4sCufcLG6VdiDdUGVkPhpqLxlvP5vl1983gQjJl3tqbrM731mjaZaP68AgosQ==}
 
+  media-engine@1.0.3:
+    resolution: {integrity: sha512-aa5tG6sDoK+k70B9iEX1NeyfT8ObCKhNDs6lJVpwF6r8vhUfuKMslIcirq6HIUYuuUYLefcEQOn9bSBOvawtwg==}
+
   media-typer@0.3.0:
     resolution: {integrity: sha512-dq+qelQ9akHpcOl/gUVRTxVIOkAJ1wR3QAvb4RsVjS8oVoFjDGTc679wJYmUmknUF5HwMLOgb5O+a3KxfWapPQ==}
     engines: {node: '>= 0.6'}
@@ -6142,15 +6210,9 @@ packages:
   module-details-from-path@1.0.4:
     resolution: {integrity: sha512-EGWKgxALGMgzvxYF1UyGTy0HXX/2vHLkw6+NvDKW2jypWbHpjQuj4UMcqQWXHERJhVGKikolT06G3bcKe4fi7w==}
 
-  motion-dom@11.18.1:
-    resolution: {integrity: sha512-g76KvA001z+atjfxczdRtw/RXOM3OMSdd1f4DL77qCTF/+avrRJiawSG4yDibEQ215sr9kpinSlX2pCTJ9zbhw==}
-
   motion-dom@12.38.0:
     resolution: {integrity: sha512-pdkHLD8QYRp8VfiNLb8xIBJis1byQ9gPT3Jnh2jqfFtAsWUA3dEepDlsWe/xMpO8McV+VdpKVcp+E+TGJEtOoA==}
 
-  motion-utils@11.18.1:
-    resolution: {integrity: sha512-49Kt+HKjtbJKLtgO/LKj9Ld+6vw9BjH5d9sc40R/kVyH8GLAXgT42M2NnuPcJNuA3s9ZfZBUcwIgpmZWGEE+hA==}
-
   motion-utils@12.36.0:
     resolution: {integrity: sha512-eHWisygbiwVvf6PZ1vhaHCLamvkSbPIeAYxWUuL3a2PD/TROgE7FvfHWTIH4vMl798QLfMw15nRqIaRDXTlYRg==}
 
@@ -6292,6 +6354,9 @@ packages:
     resolution: {integrity: sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==}
     engines: {node: '>=0.10.0'}
 
+  normalize-svg-path@1.1.0:
+    resolution: {integrity: sha512-r9KHKG2UUeB5LoTouwDzBy2VxXlHsiM6fyLQvnJa0S5hrhzqElH/CH7TUGhT1fVvIYBIKf3OpY4YJ4CK+iaqHg==}
+
   npm-run-path@4.0.1:
     resolution: {integrity: sha512-S48WzZW777zhNIrn7gxOlISNAqi9ZC/uQFnRdbeIHhZhCA6UqpkOT8T1G7BvfdgP4Er8gF4sUbaS0i7QvIfCWw==}
     engines: {node: '>=8'}
@@ -6438,6 +6503,9 @@ packages:
   pako@0.2.9:
     resolution: {integrity: sha512-NUcwaKxUxWrZLpDG+z/xZaCgQITkA/Dv4V/T6bw7VON6l1Xz/VnrBqrYjZQ12TamKHzITTfOEIYUj48y2KXImA==}
 
+  pako@1.0.11:
+    resolution: {integrity: sha512-4hLB8Py4zZce5s4yd9XzopqwVv/yGNhV1Bl8NTmCq1763HeK2+EwVTv+leGeL13Dnh2wfbqowVPXCIO0z4taYw==}
+
   parent-module@1.0.1:
     resolution: {integrity: sha512-GQ2EWRpQV8/o+Aw8YqtfZZPfNRWZYkbidE9k5rpl/hC3vtHHBfGm2Ifi6qWV+coDGkrUKZAxE3Lot5kcsRlh+g==}
     engines: {node: '>=6'}
@@ -6456,6 +6524,9 @@ packages:
     resolution: {integrity: sha512-ayCKvm/phCGxOkYRSCM82iDwct8/EonSEgCSxWxD7ve6jHggsFl4fZVQBPRNgQoKiuV/odhFrGzQXZwbifC8Rg==}
     engines: {node: '>=8'}
 
+  parse-svg-path@0.1.2:
+    resolution: {integrity: sha512-JyPSBnkTJ0AI8GGJLfMXvKq42cj5c006fnLz6fXy6zfoVjJizi8BNTpu8on8ziI1cKy9d9DGNuY17Ce7wuejpQ==}
+
   parse5-htmlparser2-tree-adapter@7.1.0:
     resolution: {integrity: sha512-ruw5xyKs6lrpo9x9rCZqZZnIUntICjQAd0Wsmp396Ul9lN/h+ifgVV1x1gZHi8euej6wTfpqX8j+BFQxF0NS/g==}
 
@@ -6579,6 +6650,9 @@ packages:
   png-js@1.0.0:
     resolution: {integrity: sha512-k+YsbhpA9e+EFfKjTCH3VW6aoKlyNYI6NYdTfDL4CIvFnvsuO84ttonmZE7rc+v23SLTH8XX+5w/Ak9v0xGY4g==}
 
+  png-js@2.0.0:
+    resolution: {integrity: sha512-GdzJuUMc6ZSpxFJWVxtOH1bzYHym+TOnveqUjb+VJIbZWbZzyiRGFiKhbiielfpYbgMlhHVhsJ0FTazfuRFkMA==}
+
   po-parser@2.1.1:
     resolution: {integrity: sha512-ECF4zHLbUItpUgE3OTtLKlPjeBN+fKEczj2zYjDfCGOzicNs0GK3Vg2IoAYwx7LH/XYw43fZQP6xnZ4TkNxSLQ==}
 
@@ -6723,6 +6797,9 @@ packages:
   queue-microtask@1.2.3:
     resolution: {integrity: sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==}
 
+  queue@6.0.2:
+    resolution: {integrity: sha512-iHZWu+q3IdFZFX36ro/lKBkSvfkztY5Y7HMiPlOUjhupPcG2JMfst2KKEpu5XndviX/3UhFbRngUPNKtgvtZiA==}
+
   quick-format-unescaped@4.0.4:
     resolution: {integrity: sha512-tYC1Q1hgyRuHgloV/YXs2w15unPVh8qfu/qCTfhTYamaw7fyhumKa2yGpdSo87vY32rIclj+4fWYQXUMs9EHvg==}
 
@@ -7016,6 +7093,9 @@ packages:
     resolution: {integrity: sha512-xAg7SOnEhrm5zI3puOOKyy1OMcMlIJZYNJY7xLBwSze0UjhPLnWfj2GF2EpT0jmzaJKIWKHLsaSSajf35bcYnA==}
     engines: {node: '>=v12.22.7'}
 
+  scheduler@0.25.0-rc-603e6108-20241029:
+    resolution: {integrity: sha512-pFwF6H1XrSdYYNLfOcGlM28/j8CGLu8IvdrxqhjWULe2bPcKiKW4CV+OWqR/9fT52mywx65l7ysNkjLKBda7eA==}
+
   scheduler@0.27.0:
     resolution: {integrity: sha512-eNv+WrVbKu1f3vbYJT/xtiF5syA5HPIMtf9IgY/nKg0sWqzAUEvqY/xm7OcZc/qafLx/iO9FgOmeSAp4v5ti/Q==}
 
@@ -7289,6 +7369,9 @@ packages:
     resolution: {integrity: sha512-UXSH262CSZY1tfu3G3Secr6uGLCFVPMhIqHjlgCUtCCcgihYc/xKs9djMTMUOb2j1mVSeU8EU6NWc/iQKU6Gfg==}
     engines: {node: '>= 0.4'}
 
+  string_decoder@1.3.0:
+    resolution: {integrity: sha512-hkRX8U1WjJFd8LsDJ2yQ/wWWxaopEsABU1XfkM8A+j0+85JAGppt16cr1Whg6KIbb4okU6Mql6BOj+uup/wKeA==}
+
   stringify-entities@4.0.4:
     resolution: {integrity: sha512-IwfBptatlO+QCJUo19AqvrPNqlVMpW9YEL2LIVY+Rpv2qsjCGxaDLNRgeGsQWJhfItebuJhsGSLjaBbNSQ+ieg==}
 
@@ -7374,6 +7457,9 @@ packages:
     peerDependencies:
       react: '>=17.0'
 
+  svg-arc-to-cubic-bezier@3.2.0:
+    resolution: {integrity: sha512-djbJ/vZKZO+gPoSDThGNpKDO+o+bAeA4XQKovvkNCqnIS2t+S4qnLAGQhyyrulhCFRl1WWzAp0wUDV8PpTVU3g==}
+
   svg-to-pdfkit@0.1.8:
     resolution: {integrity: sha512-QItiGZBy5TstGy+q8mjQTMGRlDDOARXLxH+sgVm1n/LYeo0zFcQlcCh8m4zi8QxctrxB9Kue/lStc/RD5iLadQ==}
 
@@ -7757,6 +7843,10 @@ packages:
   victory-vendor@37.3.6:
     resolution: {integrity: sha512-SbPDPdDBYp+5MJHhBCAyI7wKM3d5ivekigc2Dk2s7pgbZ9wIgIBYGVw4zGHBml/qTFbexrofXW6Gu4noGxrOwQ==}
 
+  vite-compatible-readable-stream@3.6.1:
+    resolution: {integrity: sha512-t20zYkrSf868+j/p31cRIGN28Phrjm3nRSLR2fyc2tiWi4cZGVdv68yNlwnIINTkMTmPoMiSlc0OadaO7DXZaQ==}
+    engines: {node: '>= 6'}
+
   vite@8.0.3:
     resolution: {integrity: sha512-B9ifbFudT1TFhfltfaIPgjo9Z3mDynBTJSUYxTjOQruf/zHH+ezCQKcoqO+h7a9Pw9Nm/OtlXAiGT1axBgwqrQ==}
     engines: {node: ^20.19.0 || >=22.12.0}
@@ -8095,6 +8185,9 @@ packages:
     resolution: {integrity: sha512-CzhO+pFNo8ajLM2d2IW/R93ipy99LWjtwblvC1RsoSUMZgyLbYFr221TnSNT7GjGdYui6P459mw9JH/g/zW2ug==}
     engines: {node: '>=18'}
 
+  yoga-layout@3.2.1:
+    resolution: {integrity: sha512-0LPOt3AxKqMdFBZA3HBAt/t/8vIKq7VaQYbuA8WxCgung+p9TVyKRYdpvCb80HcdTN2NkbIKbhNwKUfm3tQywQ==}
+
   zod-validation-error@4.0.2:
     resolution: {integrity: sha512-Q6/nZLe6jxuU80qb/4uJ4t5v2VEZ44lzQjPDhYJNztRQ4wyWc6VF3D3Kb/fAuPetZQnhS3hnajCf9CsWesghLQ==}
     engines: {node: '>=18.0.0'}
@@ -9246,7 +9339,7 @@ snapshots:
     dependencies:
       '@medv/finder': 4.0.2
       clsx: 2.1.1
-      framer-motion: 11.18.2(react-dom@19.2.4(react@19.2.4))(react@19.2.4)
+      framer-motion: 12.38.0(react-dom@19.2.4(react@19.2.4))(react@19.2.4)
       html2canvas: 1.4.1
       lucide-react: 0.441.0(react@19.2.4)
       next: 16.1.6(@babel/core@7.29.0)(@opentelemetry/api@1.9.1)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(sass@1.98.0)
@@ -10017,6 +10110,110 @@ snapshots:
       react: 19.2.4
       react-dom: 19.2.4(react@19.2.4)
 
+  '@react-pdf/fns@3.1.3': {}
+
+  '@react-pdf/font@4.0.8':
+    dependencies:
+      '@react-pdf/pdfkit': 5.1.1
+      '@react-pdf/types': 2.11.1
+      fontkit: 2.0.4
+      is-url: 1.2.4
+
+  '@react-pdf/image@3.1.0':
+    dependencies:
+      '@react-pdf/svg': 1.1.0
+      jay-peg: 1.1.1
+      png-js: 2.0.0
+
+  '@react-pdf/layout@4.6.1':
+    dependencies:
+      '@react-pdf/fns': 3.1.3
+      '@react-pdf/image': 3.1.0
+      '@react-pdf/primitives': 4.3.0
+      '@react-pdf/stylesheet': 6.2.1
+      '@react-pdf/textkit': 6.3.0
+      '@react-pdf/types': 2.11.1
+      emoji-regex-xs: 1.0.0
+      queue: 6.0.2
+      yoga-layout: 3.2.1
+
+  '@react-pdf/pdfkit@5.1.1':
+    dependencies:
+      '@babel/runtime': 7.29.2
+      '@noble/ciphers': 1.3.0
+      '@noble/hashes': 1.8.0
+      browserify-zlib: 0.2.0
+      fontkit: 2.0.4
+      jay-peg: 1.1.1
+      js-md5: 0.8.3
+      linebreak: 1.1.0
+      png-js: 2.0.0
+      vite-compatible-readable-stream: 3.6.1
+
+  '@react-pdf/primitives@4.3.0': {}
+
+  '@react-pdf/reconciler@2.0.0(react@19.2.4)':
+    dependencies:
+      object-assign: 4.1.1
+      react: 19.2.4
+      scheduler: 0.25.0-rc-603e6108-20241029
+
+  '@react-pdf/render@4.5.1':
+    dependencies:
+      '@babel/runtime': 7.29.2
+      '@react-pdf/fns': 3.1.3
+      '@react-pdf/primitives': 4.3.0
+      '@react-pdf/textkit': 6.3.0
+      '@react-pdf/types': 2.11.1
+      abs-svg-path: 0.1.1
+      color-string: 2.1.4
+      normalize-svg-path: 1.1.0
+      parse-svg-path: 0.1.2
+      svg-arc-to-cubic-bezier: 3.2.0
+
+  '@react-pdf/renderer@4.5.1(react@19.2.4)':
+    dependencies:
+      '@babel/runtime': 7.29.2
+      '@react-pdf/fns': 3.1.3
+      '@react-pdf/font': 4.0.8
+      '@react-pdf/layout': 4.6.1
+      '@react-pdf/pdfkit': 5.1.1
+      '@react-pdf/primitives': 4.3.0
+      '@react-pdf/reconciler': 2.0.0(react@19.2.4)
+      '@react-pdf/render': 4.5.1
+      '@react-pdf/types': 2.11.1
+      events: 3.3.0
+      object-assign: 4.1.1
+      prop-types: 15.8.1
+      queue: 6.0.2
+      react: 19.2.4
+
+  '@react-pdf/stylesheet@6.2.1':
+    dependencies:
+      '@react-pdf/fns': 3.1.3
+      '@react-pdf/types': 2.11.1
+      color-string: 2.1.4
+      hsl-to-hex: 1.0.0
+      media-engine: 1.0.3
+      postcss-value-parser: 4.2.0
+
+  '@react-pdf/svg@1.1.0':
+    dependencies:
+      '@react-pdf/primitives': 4.3.0
+
+  '@react-pdf/textkit@6.3.0':
+    dependencies:
+      '@react-pdf/fns': 3.1.3
+      bidi-js: 1.0.3
+      hyphen: 1.14.1
+      unicode-properties: 1.4.1
+
+  '@react-pdf/types@2.11.1':
+    dependencies:
+      '@react-pdf/font': 4.0.8
+      '@react-pdf/primitives': 4.3.0
+      '@react-pdf/stylesheet': 6.2.1
+
   '@react-three/drei@10.7.7(@react-three/fiber@9.5.0(@types/react@19.2.14)(immer@11.1.4)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(three@0.183.2))(@types/react@19.2.14)(@types/three@0.183.1)(immer@11.1.4)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(three@0.183.2)':
     dependencies:
       '@babel/runtime': 7.29.2
@@ -11195,6 +11392,8 @@ snapshots:
 
   abbrev@2.0.0: {}
 
+  abs-svg-path@0.1.1: {}
+
   accepts@1.3.8:
     dependencies:
       mime-types: 2.1.35
@@ -11515,6 +11714,10 @@ snapshots:
     dependencies:
       base64-js: 1.5.1
 
+  browserify-zlib@0.2.0:
+    dependencies:
+      pako: 1.0.11
+
   browserslist@4.28.2:
     dependencies:
       baseline-browser-mapping: 2.10.13
@@ -11729,6 +11932,12 @@ snapshots:
 
   color-name@1.1.4: {}
 
+  color-name@2.1.0: {}
+
+  color-string@2.1.4:
+    dependencies:
+      color-name: 2.1.0
+
   colorette@2.0.20: {}
 
   combined-stream@1.0.8:
@@ -12206,6 +12415,8 @@ snapshots:
 
   electron-to-chromium@1.5.330: {}
 
+  emoji-regex-xs@1.0.0: {}
+
   emoji-regex@10.6.0: {}
 
   emoji-regex@8.0.0: {}
@@ -12941,15 +13152,6 @@ snapshots:
 
   fraction.js@5.3.4: {}
 
-  framer-motion@11.18.2(react-dom@19.2.4(react@19.2.4))(react@19.2.4):
-    dependencies:
-      motion-dom: 11.18.1
-      motion-utils: 11.18.1
-      tslib: 2.8.1
-    optionalDependencies:
-      react: 19.2.4
-      react-dom: 19.2.4(react@19.2.4)
-
   framer-motion@12.38.0(react-dom@19.2.4(react@19.2.4))(react@19.2.4):
     dependencies:
       motion-dom: 12.38.0
@@ -13267,6 +13469,12 @@ snapshots:
 
   hoopy@0.1.4: {}
 
+  hsl-to-hex@1.0.0:
+    dependencies:
+      hsl-to-rgb-for-reals: 1.1.1
+
+  hsl-to-rgb-for-reals@1.1.1: {}
+
   html-encoding-sniffer@6.0.0(@noble/hashes@1.8.0):
     dependencies:
       '@exodus/bytes': 1.15.0(@noble/hashes@1.8.0)
@@ -13365,6 +13573,8 @@ snapshots:
 
   husky@9.1.7: {}
 
+  hyphen@1.14.1: {}
+
   i18next-fs-backend@2.6.3: {}
 
   i18next@25.10.10(typescript@5.9.3):
@@ -13653,6 +13863,8 @@ snapshots:
 
   is-unicode-supported@2.1.0: {}
 
+  is-url@1.2.4: {}
+
   is-weakmap@2.0.2: {}
 
   is-weakref@1.1.1:
@@ -13703,6 +13915,10 @@ snapshots:
     optionalDependencies:
       '@pkgjs/parseargs': 0.11.0
 
+  jay-peg@1.1.1:
+    dependencies:
+      restructure: 3.0.2
+
   jest-worker@27.5.1:
     dependencies:
       '@types/node': 22.19.15
@@ -14251,6 +14467,8 @@ snapshots:
 
   mdn-data@2.27.1: {}
 
+  media-engine@1.0.3: {}
+
   media-typer@0.3.0: {}
 
   meow@13.2.0: {}
@@ -14577,16 +14795,10 @@ snapshots:
 
   module-details-from-path@1.0.4: {}
 
-  motion-dom@11.18.1:
-    dependencies:
-      motion-utils: 11.18.1
-
   motion-dom@12.38.0:
     dependencies:
       motion-utils: 12.36.0
 
-  motion-utils@11.18.1: {}
-
   motion-utils@12.36.0: {}
 
   mri@1.2.0: {}
@@ -14717,6 +14929,10 @@ snapshots:
 
   normalize-path@3.0.0: {}
 
+  normalize-svg-path@1.1.0:
+    dependencies:
+      svg-arc-to-cubic-bezier: 3.2.0
+
   npm-run-path@4.0.1:
     dependencies:
       path-key: 3.1.1
@@ -14927,6 +15143,8 @@ snapshots:
 
   pako@0.2.9: {}
 
+  pako@1.0.11: {}
+
   parent-module@1.0.1:
     dependencies:
       callsites: 3.1.0
@@ -14954,6 +15172,8 @@ snapshots:
       json-parse-even-better-errors: 2.3.1
       lines-and-columns: 1.2.4
 
+  parse-svg-path@0.1.2: {}
+
   parse5-htmlparser2-tree-adapter@7.1.0:
     dependencies:
       domhandler: 5.0.3
@@ -15096,6 +15316,10 @@ snapshots:
 
   png-js@1.0.0: {}
 
+  png-js@2.0.0:
+    dependencies:
+      fflate: 0.8.2
+
   po-parser@2.1.1: {}
 
   possible-typed-array-names@1.1.0: {}
@@ -15253,6 +15477,10 @@ snapshots:
 
   queue-microtask@1.2.3: {}
 
+  queue@6.0.2:
+    dependencies:
+      inherits: 2.0.4
+
   quick-format-unescaped@4.0.4: {}
 
   range-parser@1.2.1: {}
@@ -15671,6 +15899,8 @@ snapshots:
     dependencies:
       xmlchars: 2.2.0
 
+  scheduler@0.25.0-rc-603e6108-20241029: {}
+
   scheduler@0.27.0: {}
 
   schema-dts@1.1.5: {}
@@ -16059,6 +16289,10 @@ snapshots:
       define-properties: 1.2.1
       es-object-atoms: 1.1.1
 
+  string_decoder@1.3.0:
+    dependencies:
+      safe-buffer: 5.2.1
+
   stringify-entities@4.0.4:
     dependencies:
       character-entities-html4: 2.1.0
@@ -16129,6 +16363,8 @@ snapshots:
     dependencies:
       react: 19.2.4
 
+  svg-arc-to-cubic-bezier@3.2.0: {}
+
   svg-to-pdfkit@0.1.8:
     dependencies:
       pdfkit: 0.18.0
@@ -16597,6 +16833,12 @@ snapshots:
       d3-time: 3.1.0
       d3-timer: 3.0.1
 
+  vite-compatible-readable-stream@3.6.1:
+    dependencies:
+      inherits: 2.0.4
+      string_decoder: 1.3.0
+      util-deprecate: 1.0.2
+
   vite@8.0.3(@emnapi/core@1.9.1)(@emnapi/runtime@1.9.1)(@types/node@22.19.15)(esbuild@0.27.4)(jiti@2.6.1)(sass@1.98.0)(terser@5.46.1)(tsx@4.21.0)(yaml@2.8.3):
     dependencies:
       lightningcss: 1.32.0
@@ -16928,6 +17170,8 @@ snapshots:
 
   yoctocolors@2.1.2: {}
 
+  yoga-layout@3.2.1: {}
+
   zod-validation-error@4.0.2(zod@3.25.76):
     dependencies:
       zod: 3.25.76

psi-standorte.json

@@ -0,0 +1,39 @@
+{
+  "error": {
+    "code": 429,
+    "message": "Quota exceeded for quota metric 'Queries' and limit 'Queries per day' of service 'pagespeedonline.googleapis.com' for consumer 'project_number:583797351490'.",
+    "errors": [
+      {
+        "message": "Quota exceeded for quota metric 'Queries' and limit 'Queries per day' of service 'pagespeedonline.googleapis.com' for consumer 'project_number:583797351490'.",
+        "domain": "global",
+        "reason": "rateLimitExceeded"
+      }
+    ],
+    "status": "RESOURCE_EXHAUSTED",
+    "details": [
+      {
+        "@type": "type.googleapis.com/google.rpc.ErrorInfo",
+        "reason": "RATE_LIMIT_EXCEEDED",
+        "domain": "googleapis.com",
+        "metadata": {
+          "service": "pagespeedonline.googleapis.com",
+          "quota_location": "global",
+          "quota_limit_value": "0",
+          "consumer": "projects/583797351490",
+          "quota_metric": "pagespeedonline.googleapis.com/default",
+          "quota_limit": "defaultPerDayPerProject",
+          "quota_unit": "1/d/{project}"
+        }
+      },
+      {
+        "@type": "type.googleapis.com/google.rpc.Help",
+        "links": [
+          {
+            "description": "Request a higher quota limit.",
+            "url": "https://cloud.google.com/docs/quotas/help/request_increase"
+          }
+        ]
+      }
+    ]
+  }
+}