Add photo overlay feature and update biography section

script.js

@@ -1,6 +1,6 @@
 document.addEventListener('DOMContentLoaded', function() {
+    // Scroll-reveal effect
     const sections = document.querySelectorAll('.scroll-section');
-
     const observer = new IntersectionObserver(entries => {
         entries.forEach(entry => {
             if (entry.isIntersecting) {
@@ -10,8 +10,28 @@ document.addEventListener('DOMContentLoaded', function() {
     }, {
         threshold: 0.1
     });
-
     sections.forEach(section => {
         observer.observe(section);
     });
+
+    // Photo overlay
+    const profilePic = document.querySelector('.profile-pic');
+    const photoOverlay = document.getElementById('photo-overlay');
+    const closeBtn = document.querySelector('.close-btn');
+
+    if (profilePic && photoOverlay && closeBtn) {
+        profilePic.addEventListener('click', () => {
+            photoOverlay.classList.add('show');
+        });
+
+        closeBtn.addEventListener('click', () => {
+            photoOverlay.classList.remove('show');
+        });
+
+        photoOverlay.addEventListener('click', (e) => {
+            if (e.target === photoOverlay) {
+                photoOverlay.classList.remove('show');
+            }
+        });
+    }
 });