New: Model template

assets/js/main.js

@@ -1,6 +1,63 @@
+const isMobile = window.innerWidth < 992;
+
 AOS.init({
-      once: true,
-      offset: 100,
-      easing: 'ease',
-      duration: 1200
+    useClassNames: false, 
+    disableMutationObserver: false,
+    
+    offset: isMobile ? 50 : 120,
+    duration: 800,
+    once: true,
+});
+
+if (isMobile) {
+    document.querySelectorAll('[data-aos="fade-left"], [data-aos="fade-right"]').forEach(el => {
+        el.setAttribute('data-aos', 'fade-up');
     });
+}
+
+document.addEventListener("DOMContentLoaded", function() {
+  const observerOptions = {
+      root: null,
+      rootMargin: '0px',
+      threshold: 0.3 
+  };
+
+  const observer = new IntersectionObserver((entries, observer) => {
+      entries.forEach(entry => {
+          if (entry.isIntersecting) {
+              entry.target.classList.add('is-visible');
+          }
+      });
+  }, observerOptions);
+
+  const targets = document.querySelectorAll('.scroll-trigger, .scroll-draw-svg, .modellen-sectie');
+  targets.forEach(target => observer.observe(target));
+});
+
+document.addEventListener('DOMContentLoaded', function () {
+    var splide = new Splide('#model-splide', {
+        type   : 'loop',
+        perPage: 2,
+        focus  : 'center',
+        perMove: 1,
+        padding: '1rem',
+        gap    : '2rem',
+        autoplay: true,
+        interval: 4000,
+        arrows : false,
+        pagination: true,
+        breakpoints: {
+            1200: {
+                perPage: 2,
+                padding: '1rem',
+            },
+            768: {
+                perPage: 1,
+                padding: '2rem',
+                gap: '1rem',
+            }
+        }
+    });
+
+    splide.mount();
+});