the slider on thep 3 goes from 0%=0 hours to 100% 50hours

src/components/cost-estimator/step-3-project-stage.tsx

@@ -14,39 +14,22 @@ type Step3Props = {
 };
 
 const stageLabels = [
-    "From scratch", // 0
-    "Idea & concept", // 10
-    "Prototype ready", // 20
-    "Design ready", // 30
-    "In development", // 40
-    "MVP ready", // 50
-    "Live product", // 60
-    "Re-design", // 70
-    "Adding features", // 80
-    "Ongoing support", // 90
+    "0%", // 0
+    "10%", // 10
+    "20%", // 20
+    "30%", // 30
+    "40%", // 40
+    "50%", // 50
+    "60%", // 60
+    "70%", // 70
+    "80%", // 80
+    "90%", // 90
+    "100%", // 100
 ];
 
-const calculateHours = (projectType: FormData['projectType'], serviceType: FormData['serviceType'], projectStage: number): number => {
-    let baseHours = 0;
-    switch (projectType) {
-        case 'website': baseHours = 100; break;
-        case 'mobile-app': baseHours = 200; break;
-        case 'platform': baseHours = 400; break;
-        default: baseHours = 50;
-    }
-
-    switch (serviceType) {
-        case 'entire-project': baseHours *= 1; break;
-        case 'development': baseHours *= 0.6; break;
-        case 'ui-ux-design': baseHours *= 0.3; break;
-        case 'identity-branding': baseHours *= 0.1; break;
-    }
-
-    // A higher projectStage means less work, so we reduce the hours.
-    // The logic here is that if a project is 90% complete, only 10% of work remains.
-    const completionMultiplier = 1 - (projectStage / 100);
-
-    return Math.max(52, Math.round(baseHours * completionMultiplier));
+const calculateHours = (projectStage: number): number => {
+    // Scale hours linearly from 0 to 50 as projectStage goes from 0 to 100.
+    return Math.round((projectStage / 100) * 50);
 };
 
 export function Step3ProjectStage({ onNext, onBack, onUpdateData, formData }: Step3Props) {
@@ -63,8 +46,8 @@ export function Step3ProjectStage({ onNext, onBack, onUpdateData, formData }: St
   }, [value]);
 
   const estimatedHours = useMemo(() => {
-      return calculateHours(formData.projectType, formData.serviceType, value[0]);
-  }, [formData.projectType, formData.serviceType, value]);
+      return calculateHours(value[0]);
+  }, [value]);
 
   return (
     <div className="flex flex-col items-start">
@@ -72,12 +55,12 @@ export function Step3ProjectStage({ onNext, onBack, onUpdateData, formData }: St
       <div className="mt-16 w-full">
         <div className="flex justify-between items-center mb-4">
             <p className="font-medium">{currentLabel}</p>
-            <p className="text-muted-foreground">{value[0] === 90 ? "90+%" : `${value[0]}%`}</p>
+            <p className="text-muted-foreground">{value[0]}%</p>
         </div>
         <Slider
           defaultValue={value}
           onValueChange={handleSliderChange}
-          max={90}
+          max={100}
           step={10}
           className="w-full"
         />
@@ -89,7 +72,7 @@ export function Step3ProjectStage({ onNext, onBack, onUpdateData, formData }: St
       <div className="mt-16 flex w-full items-center justify-between">
         <div className="flex items-center gap-2">
             <Gauge className="h-6 w-6 text-primary" />
-            <span className="font-headline text-lg font-bold">{estimatedHours}+ hours</span>
+            <span className="font-headline text-lg font-bold">{estimatedHours} hours</span>
         </div>
         <div className="flex items-center gap-4">
             <Button variant="ghost" onClick={onBack}>Go Back</Button>