undefined - Follow Up Deployment

index.html

@@ -6,6 +6,10 @@
     <title>The Milestone Foundation - Ethical Lawsuit Funding</title>
     <script src="https://cdn.tailwindcss.com"></script>
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
+    
+<script src="https://unpkg.com/[email protected]/dist/aos.js"></script>
+<link href="https://unpkg.com/[email protected]/dist/aos.css" rel="stylesheet" />
+
       <style>
         @import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700&display=swap');
 
@@ -127,7 +131,9 @@
 
     </style>
   
-    <script>
+
+
+<script>
         window.addEventListener('scroll', function () {
             const bar = document.querySelector('.sticky-trust-bar');
             if (window.scrollY > 100) {
@@ -156,6 +162,37 @@
         }
     ];
 
+
+
+
+document.addEventListener('DOMContentLoaded', () => {
+
+    let currentTestimonial = 0;
+
+    function updateTestimonial() {
+      const testimonial = testimonials[currentTestimonial];
+      const image = document.getElementById('testimonial-image');
+      const text = document.getElementById('testimonial-text');
+
+      // Animate fade out
+      document.getElementById('testimonial-container').classList.remove('opacity-100');
+      document.getElementById('testimonial-container').classList.add('opacity-0');
+
+      setTimeout(() => {
+        image.src = testimonial.image;
+        text.textContent = testimonial.text;
+
+        // Animate fade in
+        document.getElementById('testimonial-container').classList.remove('opacity-0');
+        document.getElementById('testimonial-container').classList.add('opacity-100');
+
+        currentTestimonial = (currentTestimonial + 1) % testimonials.length;
+      }, 500);
+    }
+
+    setInterval(updateTestimonial, 6000); // Change every 6 seconds
+
+  // Your slider setup
   const amountSlider = document.getElementById('funding-amount');
   const durationSlider = document.getElementById('case-duration');
   const amountValue = document.getElementById('funding-amount-value');
@@ -164,24 +201,21 @@
   const milestoneCost = document.getElementById('milestone-cost');
   const savings = document.getElementById('savings');
 
-function animateNumber(el, start, end) {
-  const duration = 400;
-  const startTimestamp = performance.now();
-
-  function step(currentTime) {
-    const elapsed = currentTime - startTimestamp;
-    const progress = Math.min(elapsed / duration, 1);
-    const value = Math.floor(start + (end - start) * progress);
-    el.textContent = `$${value.toLocaleString()}`;
-    if (progress < 1) {
-      requestAnimationFrame(step);
+  function animateNumber(el, start, end) {
+    const duration = 400;
+    const startTimestamp = performance.now();
+    function step(currentTime) {
+      const elapsed = currentTime - startTimestamp;
+      const progress = Math.min(elapsed / duration, 1);
+      const value = Math.floor(start + (end - start) * progress);
+      el.textContent = `$${value.toLocaleString()}`;
+      if (progress < 1) {
+        requestAnimationFrame(step);
+      }
     }
+    requestAnimationFrame(step);
   }
 
-  requestAnimationFrame(step);
-}
-
-
   let lastTraditional = 0;
   let lastMilestone = 0;
   let lastSavings = 0;
@@ -210,25 +244,25 @@ function animateNumber(el, start, end) {
 
   amountSlider.addEventListener('input', updateCalculator);
   durationSlider.addEventListener('input', updateCalculator);
-  window.addEventListener('DOMContentLoaded', updateCalculator);
+  updateCalculator();
 
+  // Accordion
   document.querySelectorAll('.accordion-toggle').forEach(button => {
     button.addEventListener('click', () => {
       const content = button.nextElementSibling;
       const icon = button.querySelector('i');
-
       button.classList.toggle('active');
       content.classList.toggle('max-h-0');
       content.classList.toggle('max-h-[500px]');
-
-      // Toggle icon direction if you use one
       if (icon) icon.classList.toggle('fa-chevron-down'), icon.classList.toggle('fa-chevron-up');
     });
   });
-                     
+});
   AOS.init({ duration: 800, once: true });
+
 </script>
 
+
 </head>
 <body class="bg-transparent">
     <div class="sticky-trust-bar">
@@ -776,8 +810,6 @@ function animateNumber(el, start, end) {
 </section>
 
 <!-- Vertical Timeline -->
-<section class="py-16 px-4 bg-white">
-  <h2 class="text-3xl font-bold text-center text-teal-700 mb-12">How It Works (Vertical)</h2>
   <div class="max-w-4xl mx-auto space-y-10 relative">
     <div class="relative flex items-center" data-aos="fade-up">
       <div class="w-1/3 flex justify-end pr-4">
@@ -837,7 +869,6 @@ function animateNumber(el, start, end) {
           <i class="fas fa-smile-beam text-teal-600 text-xl"></i>
         </div>
         <p class="mt-2 text-gray-700">No win, no repayment. We're aligned with your outcome — always.</p>
-      </div>
     </div>
   </div>