footer

src/components/HeroPage.tsx

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