updates to unified page

animations.js

@@ -532,13 +532,13 @@ gsap.to("#about", {
     duration: 1
 });
 
-// Simplified ScrollTrigger for the about section transition
+// Update the ScrollTrigger for a smoother transition
 gsap.to(".fixed-elements", {
     scrollTrigger: {
         trigger: "#about",
-        start: "top 80%",
-        end: "top 20%",
-        scrub: true,
+        start: "top 80%", // Start earlier
+        end: "top 20%",   // End later
+        scrub: 1,         // Smooth scrubbing effect
         onEnter: () => {
             document.querySelector('.fixed-elements').classList.add('fade-out');
         },
@@ -548,14 +548,41 @@ gsap.to(".fixed-elements", {
     }
 });
 
-// Add entrance animation for about content
+// Add a parallel animation for the dark overlay
+gsap.to(".dark-overlay", {
+    scrollTrigger: {
+        trigger: "#about",
+        start: "top 90%", // Start even earlier
+        end: "top 50%",   // End sooner
+        scrub: 1,
+        opacity: 0,       // Fade out the overlay first
+    }
+});
+
+// Fade in the about content
 gsap.from(".about-content", {
     scrollTrigger: {
         trigger: "#about",
-        start: "top center",
+        start: "top 60%", // Start fading in while overlay is still fading out
         toggleActions: "play none none reverse"
     },
     y: 50,
     opacity: 0,
     duration: 1
+});
+
+// Add menu button animation
+gsap.to(".menu-button", {
+    scrollTrigger: {
+        trigger: "#scene4",
+        start: "top center",
+        end: "top 20%",
+        scrub: true,
+        onEnter: () => {
+            document.querySelector('.menu-button').classList.add('active');
+        },
+        onLeaveBack: () => {
+            document.querySelector('.menu-button').classList.remove('active');
+        }
+    }
 });

index.html

@@ -131,7 +131,18 @@ <h1>On Reclaiming Human Agency</h1>
                     <li>Enable positive-sum value creation</li>
                 </ul>
 
-                <!-- ... rest of the about content ... -->
+
+                <p>Our first step toward this vision is <a href="https://github.com/sodal-project/cartographer">Cartographer</a> — an open-source tool for agency discovery and collaboration management. It enables communities to:</p>
+
+                <ul class="bullet-list capabilities">
+                    <li>Understand how their systems and resources are actually used</li>
+                    <li>See how people and teams really work together</li>
+                    <li>Discover critical capabilities and dependencies</li>
+                    <li>Take action to achieve better outcomes</li>
+                </ul>
+
+                <p>We've partnered with businesses, open source projects, and service providers to craft the first version of Cartographer, which is currently under active development.</p>
+
 
                 <div class="contact-section">
                     <p>Contact <a href="mailto:[email protected]">[email protected]</a> to learn more.</p>