From 0c5d119bb0c3f250b53ed2b90451c61182ccac78 Mon Sep 17 00:00:00 2001
From: avi <hahamailme@proton.me>
Date: Sat, 9 May 2026 21:07:10 -0500
Subject: [PATCH] Save point: Buttons renamed to CREATOR/BUILDER/DEVELOPER,
 WHERE DO YOU FIT IN? fades in split second after buttons

---
 index.html | 65 ++++++++++++++++++++++++++++++++++++++++--------------
 1 file changed, 48 insertions(+), 17 deletions(-)

diff --git a/index.html b/index.html
index 06cd6e4..7f6e2ad 100644
--- a/index.html
+++ b/index.html
@@ -169,6 +169,18 @@
             transform: translateX(-50%);
         }
 
+        #scene3FitInText {
+            position: absolute;
+            bottom: 42%;
+            left: 50%;
+            transform: translateX(-50%);
+            font-size: 1.2rem;
+            color: #00ff00;
+            opacity: 0;
+            visibility: hidden;
+            transition: opacity 1s ease;
+        }
+
         #scene2Lines {
             display: none;
             flex-direction: column;
@@ -311,9 +323,10 @@
                 <span id="scene3RecruitText4"></span>
             </div>
         </div>
-        <button id="creatorBtn" class="choiceBtn">CREATORS</button>
-        <button id="builderBtn" class="choiceBtn">BUILDERS</button>
-        <button id="developerBtn" class="choiceBtn">DEVELOPERS</button>
+        <div id="scene3FitInText"></div>
+        <button id="creatorBtn" class="choiceBtn">CREATOR</button>
+        <button id="builderBtn" class="choiceBtn">BUILDER</button>
+        <button id="developerBtn" class="choiceBtn">DEVELOPER</button>
     </div>
 
     <div id="sceneCreator" class="scene">
@@ -754,20 +767,34 @@
                             blinkCursor(cursor, 3, () => {
                                 typeCalmly(rt1, "THE LAB IS CONNECTING WITH PEOPLE WHO SEE WHAT'S HAPPENING — WHO KNOW CHANGE ISN'T OPTIONAL ANYMORE. WE'RE LOOKING FOR THOSE READY TO STEP IN AND SHAPE THE FUTURE.", () => {
                                     setTimeout(() => {
-                                        choiceBtns.forEach(btn => {
-                                            btn.style.display = 'block';
-                                            btn.style.visibility = 'visible';
-                                            let btnOpacity = 0;
-                                            const btnFadeIn = setInterval(() => {
-                                                btnOpacity += 0.02;
-                                                if (btnOpacity >= 1) {
-                                                    btnOpacity = 1;
-                                                    clearInterval(btnFadeIn);
-                                                    btn.style.pointerEvents = 'auto';
-                                                }
-                                                btn.style.opacity = btnOpacity;
-                                            }, 30);
-                                        });
+                        choiceBtns.forEach(btn => {
+                            btn.style.display = 'block';
+                            btn.style.visibility = 'visible';
+                            let btnOpacity = 0;
+                            const btnFadeIn = setInterval(() => {
+                                btnOpacity += 0.02;
+                                if (btnOpacity >= 1) {
+                                    btnOpacity = 1;
+                                    clearInterval(btnFadeIn);
+                                    btn.style.pointerEvents = 'auto';
+                                }
+                                btn.style.opacity = btnOpacity;
+                            }, 30);
+                        });
+                        setTimeout(() => {
+                            const fitInText = document.getElementById('scene3FitInText');
+                            fitInText.textContent = 'WHERE DO YOU FIT IN?';
+                            fitInText.style.visibility = 'visible';
+                            let fiOpacity = 0;
+                            const fiFadeIn = setInterval(() => {
+                                fiOpacity += 0.05;
+                                if (fiOpacity >= 1) {
+                                    fiOpacity = 1;
+                                    clearInterval(fiFadeIn);
+                                }
+                                fitInText.style.opacity = fiOpacity;
+                            }, 30);
+                        }, 500);
                                     }, 3000);
                                 }, 20, 50);
                             });
@@ -852,6 +879,10 @@
                         btn.style.opacity = '1';
                         btn.style.pointerEvents = 'auto';
                     });
+                    const fitInText = document.getElementById('scene3FitInText');
+                    fitInText.textContent = 'WHERE DO YOU FIT IN?';
+                    fitInText.style.visibility = 'visible';
+                    fitInText.style.opacity = '1';
                 }
             }