perf: site-wide performance optimizations including image delivery and hero overhaul

components/home/MeetTheTeam.tsx

@@ -11,43 +11,53 @@ export default function MeetTheTeam() {
   return (
     <Section className="relative py-32 md:py-48 overflow-hidden">
       <div className="absolute inset-0 z-0">
-        <Image 
-          src="/uploads/2024/12/DSC08036-Large.webp" 
-          alt={t('subtitle')} 
+        <Image
+          src="/uploads/2024/12/DSC08036-Large.webp"
+          alt={t('subtitle')}
           fill
           className="object-cover scale-105 animate-slow-zoom"
-          unoptimized
+          sizes="100vw"
         />
         <div className="absolute inset-0 bg-primary/70 mix-blend-multiply" />
         <div className="absolute inset-0 bg-gradient-to-t from-primary via-primary/20 to-transparent" />
       </div>
-      
+
       <Container className="relative z-10">
         <div className="max-w-3xl text-white animate-slide-up">
           <Heading level={2} subtitle={t('subtitle')} className="text-white mb-8">
             <span className="text-white">{t('title')}</span>
           </Heading>
-          
+
           <div className="relative mb-12">
             <div className="absolute -left-8 top-0 bottom-0 w-1 bg-accent rounded-full" />
             <p className="text-xl md:text-2xl leading-relaxed font-medium italic text-white/90 pl-8">
               "{t('description')}"
             </p>
           </div>
-          
+
           <div className="flex flex-wrap gap-8 items-center">
             <Button href={`/${locale}/team`} variant="accent" size="xl" className="group">
               {t('cta')}
               <span className="ml-3 transition-transform group-hover:translate-x-2">&rarr;</span>
             </Button>
-            
+
             <div className="flex items-center gap-4">
               <div className="flex -space-x-4">
                 <div className="w-14 h-14 rounded-full border-4 border-primary overflow-hidden relative">
-                  <Image src="/uploads/2024/12/DSC07768-Large.webp" alt={teamT('michael.name')} fill className="object-cover" />
+                  <Image
+                    src="/uploads/2024/12/DSC07768-Large.webp"
+                    alt={teamT('michael.name')}
+                    fill
+                    className="object-cover"
+                  />
                 </div>
                 <div className="w-14 h-14 rounded-full border-4 border-primary overflow-hidden relative">
-                  <Image src="/uploads/2024/12/DSC07963-Large.webp" alt={teamT('klaus.name')} fill className="object-cover" />
+                  <Image
+                    src="/uploads/2024/12/DSC07963-Large.webp"
+                    alt={teamT('klaus.name')}
+                    fill
+                    className="object-cover"
+                  />
                 </div>
               </div>
               <span className="text-white/60 font-bold text-xs md:text-sm uppercase tracking-widest">