footer

src/components/HeroPage.tsx

@@ -256,25 +256,19 @@ function LogosSection({ isDark }: { isDark: boolean }) {
       </p>
 
       {/* Marquee track */}
-      <div className="relative flex overflow-hidden">
+<div style={{ overflow: 'hidden', width: '100%' }}>
-        <div
+  <div style={{ display: 'flex', width: 'max-content', animation: 'marquee 25s linear infinite' }}>
-          className="flex gap-12 items-center"
+    {[...LOGOS, ...LOGOS, ...LOGOS, ...LOGOS].map((l, i) => (
-          style={{
+      <img
-            animation: 'marquee 20s linear infinite',
+        key={i}
-            whiteSpace: 'nowrap',
+        src={l.src}
-          }}
+        alt={l.alt}
-        >
+        className={cn('h-5 w-auto flex-shrink-0 transition-all', logoFilter)}
-          {/* Duplicate logos for seamless loop */}
+        style={{ marginRight: 64 }}
-          {[...LOGOS, ...LOGOS].map((l, i) => (
+      />
-            <img
+    ))}
-              key={i}
+  </div>
-              src={l.src}
+</div>
-              alt={l.alt}
-              className={cn('h-5 w-auto flex-shrink-0 transition-all', logoFilter)}
-            />
-          ))}
-        </div>
-      </div>
 
       <style>{`
         @keyframes marquee {