final-aboutus

src/assets/css/aboutus-responsive.css

@@ -287,10 +287,12 @@ line-height: 1.5;
        .picteam-mobile-wrapper {
         display: block;
       }
+/* .picteam-mobile-caption{
+  opacity: 1;
+} */
 }
 @media screen and (max-width: 576px) {
 .hero-section {
-    padding-top: 24px;
     padding-bottom: 32px;
   }
 

src/assets/css/aboutus.css

@@ -493,7 +493,7 @@
 .goal-container {
   max-width: 1200px;
   margin: 0 auto;
-  padding: 0 40px;
+  padding: 0 20px;
 }
 
 .goal-header {
@@ -1175,7 +1175,8 @@
 
 .picteam-mobile-caption.visible {
   opacity: 1;
-  /* transform: translateY(0); */
+  transform: translateY(0);
+  
 }
 
 .picteam-mobile-slide .picteam-accent-line {

src/assets/js/aboutus.js

@@ -474,11 +474,8 @@ document.querySelectorAll('.slider-track').forEach((track) => {
     return Math.max(0, totalCards() - visibleCount());
   }
 
-  /* RTL: positive translate moves content right (shows earlier cards).
-       We invert: moving "next" (newer) shifts track to the right => translateX positive */
   function applyTransform() {
     const shift = currentIndex * getCardWidth();
-    // RTL: shifting positive moves older cards into view (goes left visually)
     track.style.transform = `translateX(${shift}px)`;
   }
 
@@ -580,7 +577,6 @@ document.querySelectorAll('.slider-track').forEach((track) => {
 
   /* ── init ── */
   updateButtons();
-  // Run after fonts/layout settle
   if (document.fonts && document.fonts.ready) {
     document.fonts.ready.then(initToggleVisibility);
   } else {
@@ -748,9 +744,12 @@ function updateMobile() {
   // captions
   const mobileCaptions = mobileTrack.querySelectorAll('.picteam-mobile-caption');
 mobileCaptions.forEach((c, i) => {
-    c.className = 'picteam-mobile-caption';
-    if (i === current && captionVisible) {
-      setTimeout(() => c.classList.add('visible'), 150);
+  c.classList.remove('visible');
+
+  if (i === current) {
+    setTimeout(() => {
+      c.classList.add('visible');
+    }, 150);
   }
 });
 }
@@ -776,10 +775,8 @@ mobileWrapper.addEventListener(
     const diff = touchStartX - touchEndX;
     if (Math.abs(diff) > 40) {
       if (diff > 0) {
-        // swipe left → next (in LTR terms) → in RTL = previous slide
         current = mod(current - 1, total);
       } else {
-        // swipe right → prev (in LTR terms) → in RTL = next slide
         current = mod(current + 1, total);
       }
       updateMobile();
@@ -794,9 +791,6 @@ const observer = new IntersectionObserver(
   (entries) => {
     entries.forEach((entry) => {
       if (entry.isIntersecting && !captionVisible) {
-        // captionVisible = true;
-        // updateDesktop(false);
-        // updateMobile();
         observer.unobserve(entry.target);
       }
     });