fix: refactor ComparisonSlider to use imported images for production

src/components/ComparisonSlider.jsx

@@ -1,5 +1,7 @@
 import React, { useState, useRef, useEffect } from 'react';
 import { MoveHorizontal } from 'lucide-react';
+import CompareNew from '../assets/images/compare-new.png';
+import CompareOld from '../assets/images/compare-old.png';
 
 export const ComparisonSlider = () => {
     const [sliderPos, setSliderPos] = useState(50);
@@ -41,7 +43,7 @@ export const ComparisonSlider = () => {
                 {/* AFTER IMAGE (New Way) - Background */}
                 <div className="absolute inset-0 w-full h-full">
                     <img
-                        src="/src/assets/images/compare-new.png"
+                        src={CompareNew}
                         alt="The New Way"
                         className="w-full h-full object-cover"
                     />
@@ -73,7 +75,7 @@ export const ComparisonSlider = () => {
                     style={{ width: `${sliderPos}%` }}
                 >
                     <img
-                        src="/src/assets/images/compare-old.png"
+                        src={CompareOld}
                         alt="The Old Way"
                         className="w-full h-full object-cover max-w-none grayscale sepia-[0.3]"
                         style={{ width: containerRef.current?.offsetWidth }}