diff --git a/resources/js/app.js b/resources/js/app.js
index 276cf53..d3710f9 100644
--- a/resources/js/app.js
+++ b/resources/js/app.js
@@ -1,57 +1,6 @@
 import menuInit from './header';
-
+import initFooterShapes from './footer';
 window.addEventListener('load', function () {
   menuInit();
-
-  gsap.to('.shape.square', {
-    scrollTrigger: {
-      trigger: '.branding',
-      start: 'top bottom',
-      end: 'bottom top',
-      markers: true,
-      scrub: 0.2,
-    },
-    y: '300%',
-    duration: 2,
-    ease: 'none',
-  });
-
-  gsap.to('.shape.circle', {
-    scrollTrigger: {
-      trigger: '.branding',
-      start: 'top bottom',
-      end: 'bottom top',
-      markers: true,
-      scrub: 0.4,
-    },
-    y: '175%',
-    duration: 2,
-    ease: 'none',
-  });
-
-  gsap.to('.shape.rectangle-rotated', {
-    scrollTrigger: {
-      trigger: '.branding',
-      start: 'top bottom',
-      end: 'bottom top',
-      markers: true,
-      scrub: 0.6,
-    },
-    y: '340%',
-    duration: 2,
-    ease: 'none',
-  });
-
-  gsap.to('.shape.rectangle-vertical', {
-    scrollTrigger: {
-      trigger: '.branding',
-      start: 'top bottom',
-      end: 'bottom top',
-      markers: true,
-      scrub: 0.3,
-    },
-    y: '150%',
-    duration: 2,
-    ease: 'none',
-  });
+  initFooterShapes();
 });
diff --git a/resources/js/footer.js b/resources/js/footer.js
new file mode 100644
index 0000000..ac1b034
--- /dev/null
+++ b/resources/js/footer.js
@@ -0,0 +1,78 @@
+export default function initFooterShapes() {
+  gsap.fromTo(
+    '.shape.square',
+    {
+      y: '-60%',
+      rotation: 0,
+    },
+    {
+      scrollTrigger: {
+        trigger: '.branding',
+        start: 'top bottom',
+        end: 'bottom top',
+        markers: true,
+        scrub: 0.2,
+      },
+      y: '80%',
+      duration: 2,
+      ease: 'none',
+    }
+  );
+
+  gsap.fromTo(
+    '.shape.circle',
+    {
+      y: '-60%',
+    },
+    {
+      scrollTrigger: {
+        trigger: '.branding',
+        start: 'top bottom',
+        end: 'bottom top',
+        markers: true,
+        scrub: 0.4,
+      },
+      y: '30%',
+      duration: 2,
+      ease: 'none',
+    }
+  );
+
+  gsap.fromTo(
+    '.shape.rectangle-rotated',
+    {
+      y: '-60%',
+    },
+    {
+      scrollTrigger: {
+        trigger: '.branding',
+        start: 'top bottom',
+        end: 'bottom top',
+        markers: true,
+        scrub: 0.6,
+      },
+      y: '30%',
+      duration: 2,
+      ease: 'none',
+    }
+  );
+
+  gsap.fromTo(
+    '.shape.rectangle-vertical',
+    {
+      y: '-60%',
+    },
+    {
+      scrollTrigger: {
+        trigger: '.branding',
+        start: 'top bottom',
+        end: 'bottom top',
+        markers: true,
+        scrub: 0.3,
+      },
+      y: '60%',
+      duration: 2,
+      ease: 'none',
+    }
+  );
+}