Update How It Works 3D page

src/modules/how-it-works-3d/components/TruckAnimation.jsx

@@ -32,10 +32,8 @@ export default function TruckAnimation({ truckRef, wheelRefs }) {
   // Track wheel rotation accumulation
   const accumulatedRotationRef = useRef(0)
   const lastDampedProgressRef = useRef(0)
-
-
-
   useFrame((state, delta) => {
+
     if (!truckRef.current) return
 
     // r3f can emit delta === 0 (coincident frames, the first frame, or after a
@@ -78,10 +76,12 @@ export default function TruckAnimation({ truckRef, wheelRefs }) {
     // Run one-time state initialization for progress trackers
     if (!initialized.current) {
       dampedProgressRef.current = truckProgress
+      dampedProgressRef.current_velocity = 0
       lastDampedProgressRef.current = truckProgress
       lastScrollProgressRef.current = scrollProgress
       isReversingRef.current = false
       extraRotationRef.current = 0
+      extraRotationRef.current_velocity = 0
 
       const position = truckPath.getPoint(dampedProgressRef.current)
       let lookAtTargetVector
@@ -146,6 +146,13 @@ export default function TruckAnimation({ truckRef, wheelRefs }) {
     // Smoothly damp the extra rotation angle directly (prevents pitch/roll glitches or 3D target collapse)
     easing.damp(extraRotationRef, 'current', targetExtraRotation, 0.20, dt)
 
+    // Defensive: reset extra rotation if it becomes NaN
+    if (!Number.isFinite(extraRotationRef.current)) {
+      extraRotationRef.current = targetExtraRotation
+      extraRotationRef.current_velocity = 0
+      if (extraRotationRef.__damp) extraRotationRef.__damp = {}
+    }
+
     // Apply the yaw pivot around the local vertical axis
     truckRef.current.rotateY(extraRotationRef.current)