Sync: implement scroll-reveal animations for cards with responsive visibility adjustments

theme/assets/js/main.js

@@ -134,17 +134,31 @@ document.addEventListener('DOMContentLoaded', () => {
   const cards = document.querySelectorAll('.oribi-card, .feature-card, .industry-card, .pricing-card, .value-card, .platform-row');
   if (cards.length && 'IntersectionObserver' in window &&
       !window.matchMedia('(prefers-reduced-motion: reduce)').matches) {
-    cards.forEach(c => { c.style.opacity = '0'; c.style.transform = 'translateY(24px)'; c.style.transition = 'opacity .5s ease, transform .5s ease'; });
-    const io = new IntersectionObserver((entries) => {
-      entries.forEach(entry => {
-        if (entry.isIntersecting) {
-          entry.target.style.opacity   = '1';
-          entry.target.style.transform = 'translateY(0)';
-          io.unobserve(entry.target);
+    cards.forEach(c => c.classList.add('scroll-hidden'));
+    /* Use rAF to ensure the class is applied before observing – avoids
+       Safari quirk where elements already in-viewport don't fire. */
+    requestAnimationFrame(() => {
+      const io = new IntersectionObserver((entries) => {
+        entries.forEach(entry => {
+          if (entry.isIntersecting) {
+            entry.target.classList.remove('scroll-hidden');
+            entry.target.classList.add('scroll-visible');
+            io.unobserve(entry.target);
+          }
+        });
+      }, { threshold: 0.05, rootMargin: '0px 0px 80px 0px' });
+      cards.forEach(c => io.observe(c));
+    });
+    /* Safety net: reveal any still-hidden elements after 4 s so content
+       is never permanently invisible (e.g. iOS Safari edge-cases). */
+    setTimeout(() => {
+      cards.forEach(c => {
+        if (c.classList.contains('scroll-hidden')) {
+          c.classList.remove('scroll-hidden');
+          c.classList.add('scroll-visible');
         }
       });
-    }, { threshold: 0.1, rootMargin: '0px 0px 60px 0px' });
-    cards.forEach(c => io.observe(c));
+    }, 4000);
   }
 });