Improve hub page: new RouteStepper, HubProductCard with ApexCharts

- Redesign RouteStepper: nodes connected by lines with distance on line
- Add HubProductCard component with sparkline chart background
- Auto-select first product when hub page loads
- Remove placeholder with package-x icon
- Add ApexCharts plugin for charts
- Pass startName/endName to RouteStepper for route visualization

app/components/catalog/OfferResultCard.vue

@@ -12,7 +12,12 @@
     </div>
 
     <!-- Route stepper -->
-    <RouteStepper v-if="stages.length > 0" :stages="stages" />
+    <RouteStepper
+      v-if="stages.length > 0"
+      :stages="stages"
+      :start-name="startName"
+      :end-name="endName"
+    />
   </Card>
 </template>
 
@@ -26,6 +31,8 @@ const props = withDefaults(defineProps<{
   currency?: string | null
   unit?: string | null
   stages?: RouteStage[]
+  startName?: string
+  endName?: string
 }>(), {
   stages: () => []
 })