feat: refine responsive automotive storefront

assets/js/theme.js

@@ -25,9 +25,93 @@
     });
   }
 
+  function initRevealMotion() {
+    var reducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches;
+    var compactMotion = window.matchMedia('(max-width: 768px)').matches;
+    if (reducedMotion || !('IntersectionObserver' in window)) return;
+
+    var revealItems = [];
+
+    function prepareGroup(containerSelector, itemSelector, delayStep) {
+      document.querySelectorAll(containerSelector).forEach(function (container) {
+        container.querySelectorAll(itemSelector).forEach(function (item, index) {
+          var effectiveStep = compactMotion ? 40 : delayStep;
+          var maximumDelay = compactMotion ? 200 : 300;
+          var delay = Math.min(index * effectiveStep, maximumDelay);
+          item.classList.add('reveal-item');
+          item.style.setProperty('--reveal-delay', delay + 'ms');
+          revealItems.push(item);
+        });
+      });
+    }
+
+    prepareGroup(
+      '.b2b-hero',
+      '.section-eyebrow, h1, .b2b-hero-lead, .d-flex.flex-wrap, .hero-proof-list',
+      80
+    );
+    prepareGroup('.trust-strip .row', '.trust-metric', 60);
+    prepareGroup('.capability-grid', '.capability-card', 60);
+    prepareGroup('.case-grid', '.case-card', 60);
+    prepareGroup('.factory-gallery', 'figure', 60);
+    prepareGroup('.credentials-grid', '.credential-card', 60);
+    prepareGroup('.document-grid', 'article', 60);
+    prepareGroup('.contact-detail-grid', '.contact-detail-card', 60);
+    prepareGroup('.service-content, .case-content', ':scope > *', 40);
+
+    document.querySelectorAll(
+      [
+        '.section-heading',
+        '.factory-proof .col-lg-5',
+        '.factory-video-card',
+        '.faq-section .col-lg-4',
+        '.faq-section .accordion',
+        '.contact-hero-copy',
+        '.contact-store-media',
+        '.contact-map-heading',
+        '.contact-map-panel',
+        '.cta-section .container',
+        '.about-cta .container',
+        '.page-header'
+      ].join(', ')
+    ).forEach(function (item) {
+      if (item.classList.contains('reveal-item')) return;
+      item.classList.add('reveal-item');
+      item.style.setProperty('--reveal-delay', '0ms');
+      revealItems.push(item);
+    });
+
+    if (!revealItems.length) return;
+
+    document.documentElement.classList.add('motion-ready');
+
+    var observer = new IntersectionObserver(
+      function (entries) {
+        entries.forEach(function (entry) {
+          if (!entry.isIntersecting) return;
+          entry.target.classList.add('is-visible');
+          observer.unobserve(entry.target);
+        });
+      },
+      {
+        threshold: 0.12,
+        rootMargin: '0px'
+      }
+    );
+
+    window.requestAnimationFrame(function () {
+      window.requestAnimationFrame(function () {
+        revealItems.forEach(function (item) {
+          observer.observe(item);
+        });
+      });
+    });
+  }
+
   function initTheme() {
     initStickyHeader();
     initNavigation();
+    initRevealMotion();
   }
 
   if (document.readyState === 'loading') {