From 2a4c605a771614eddf42e375aa29f17d7a162d57 Mon Sep 17 00:00:00 2001
From: Marc Mintel <marc@mintel.me>
Date: Tue, 23 Jun 2026 00:27:20 +0200
Subject: [PATCH] Fix: Add robust flex spacer for carousel padding, remove
 optimizeCss which broke LCP, and fix video opacity overlay

---
 components/blocks/HeroVideo.tsx        | 2 +-
 components/blocks/ReferencesSlider.tsx | 8 +++++---
 next.config.mjs                        | 1 -
 3 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/components/blocks/HeroVideo.tsx b/components/blocks/HeroVideo.tsx
index ca2bb26f4..009cf9373 100644
--- a/components/blocks/HeroVideo.tsx
+++ b/components/blocks/HeroVideo.tsx
@@ -98,7 +98,7 @@ export function HeroVideo(props: HeroVideoProps) {
       {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"
+          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
diff --git a/components/blocks/ReferencesSlider.tsx b/components/blocks/ReferencesSlider.tsx
index 627ed47c3..64ee42360 100644
--- a/components/blocks/ReferencesSlider.tsx
+++ b/components/blocks/ReferencesSlider.tsx
@@ -131,9 +131,11 @@ export function ReferencesSlider(props: ReferencesSliderProps) {
           onMouseLeave={onMouseLeave}
           onMouseUp={onMouseUp}
           onMouseMove={onMouseMove}
-          style={{ paddingLeft: paddingX, paddingRight: paddingX }}
-          className={`select-none flex gap-6 overflow-x-auto pb-8 pt-4 [scrollbar-width:none] [-ms-overflow-style:none] [&::-webkit-scrollbar]:hidden ${isDragging ? 'cursor-grabbing snap-none' : 'cursor-grab snap-x snap-mandatory'}`}
+          className={`select-none flex overflow-x-auto pb-8 pt-4 [scrollbar-width:none] [-ms-overflow-style:none] [&::-webkit-scrollbar]:hidden ${isDragging ? 'cursor-grabbing snap-none' : 'cursor-grab snap-x snap-mandatory'}`}
         >
+          {/* Robust Left Spacer for Pixel-Perfect Alignment */}
+          <div style={{ minWidth: paddingX }} className="flex-shrink-0 pointer-events-none" aria-hidden="true" />
+
           {references.map((ref, i) => {
             const imgSrc = ref.image 
               ? (typeof ref.image === 'string' ? ref.image : ref.image.url) 
@@ -146,7 +148,7 @@ export function ReferencesSlider(props: ReferencesSliderProps) {
                 whileInView={{ opacity: 1, x: 0 }}
                 viewport={{ once: true, margin: "-50px" }}
                 transition={{ delay: i * 0.1, duration: 1.0, ease: [0.16, 1, 0.3, 1] }}
-                className="flex-shrink-0 w-[320px] md:w-[480px] snap-start group pointer-events-auto"
+                className="flex-shrink-0 w-[320px] md:w-[480px] snap-start group pointer-events-auto mr-6"
               >
                 <Link
                   href={`/${locale}/referenzen#${ref.slug}`}
diff --git a/next.config.mjs b/next.config.mjs
index 2c141a319..f79a25db5 100644
--- a/next.config.mjs
+++ b/next.config.mjs
@@ -15,7 +15,6 @@ const nextConfig = {
     pagesBufferLength: 2,
   },
   experimental: {
-    optimizeCss: true,
     staleTimes: {
       dynamic: 0,
       static: 30,