src/app/page.tsx

@@ -19,73 +19,74 @@ export default function LandingPage() {
 
   useEffect(() => {
     // Register ScrollTrigger plugin
-    const { default: ScrollTrigger } = require('gsap/ScrollTrigger');
-    gsap.registerPlugin(ScrollTrigger);
+    import('gsap/ScrollTrigger').then(({ default: ScrollTrigger }) => {
+      gsap.registerPlugin(ScrollTrigger);
 
-    // Animate contact section on scroll
-    if (contactRef.current) {
-      const ctx = gsap.context(() => {
-        // Title animation
-        gsap.from('[data-contact-title]', {
-          scrollTrigger: {
-            trigger: contactRef.current,
-            start: 'top 60%',
-            end: 'top 30%',
-            scrub: 1,
-            markers: false,
-          },
-          opacity: 0,
-          y: 50,
-          duration: 1,
-        });
+      // Animate contact section on scroll
+      if (contactRef.current) {
+        const ctx = gsap.context(() => {
+          // Title animation
+          gsap.from('[data-contact-title]', {
+            scrollTrigger: {
+              trigger: contactRef.current,
+              start: 'top 60%',
+              end: 'top 30%',
+              scrub: 1,
+              markers: false,
+            },
+            opacity: 0,
+            y: 50,
+            duration: 1,
+          });
 
-        // Description animation with stagger
-        gsap.from('[data-contact-description]', {
-          scrollTrigger: {
-            trigger: contactRef.current,
-            start: 'top 55%',
-            end: 'top 25%',
-            scrub: 1,
-            markers: false,
-          },
-          opacity: 0,
-          y: 40,
-          duration: 1,
-          delay: 0.2,
-        });
+          // Description animation with stagger
+          gsap.from('[data-contact-description]', {
+            scrollTrigger: {
+              trigger: contactRef.current,
+              start: 'top 55%',
+              end: 'top 25%',
+              scrub: 1,
+              markers: false,
+            },
+            opacity: 0,
+            y: 40,
+            duration: 1,
+            delay: 0.2,
+          });
 
-        // Button animation
-        gsap.from('[data-contact-button]', {
-          scrollTrigger: {
-            trigger: contactRef.current,
-            start: 'top 50%',
-            end: 'top 20%',
-            scrub: 1,
-            markers: false,
-          },
-          opacity: 0,
-          scale: 0.8,
-          duration: 1,
-          delay: 0.4,
-        });
+          // Button animation
+          gsap.from('[data-contact-button]', {
+            scrollTrigger: {
+              trigger: contactRef.current,
+              start: 'top 50%',
+              end: 'top 20%',
+              scrub: 1,
+              markers: false,
+            },
+            opacity: 0,
+            scale: 0.8,
+            duration: 1,
+            delay: 0.4,
+          });
 
-        // Background animated elements
-        gsap.to('[data-contact-bg-element]', {
-          scrollTrigger: {
-            trigger: contactRef.current,
-            start: 'top center',
-            end: 'bottom center',
-            scrub: 2,
-            markers: false,
-          },
-          rotation: 360,
-          duration: 20,
-          repeat: -1,
-        });
-      }, contactRef);
+          // Background animated elements
+          gsap.to('[data-contact-bg-element]', {
+            scrollTrigger: {
+              trigger: contactRef.current,
+              start: 'top center',
+              end: 'bottom center',
+              scrub: 2,
+              markers: false,
+            },
+            rotation: 360,
+            duration: 20,
+            repeat: -1,
+          });
+        }, contactRef);
 
-      return () => ctx.revert();
-    }
+        return () => ctx.revert();
+      }
+    });
   }, []);
 
   return (