website refactor

apps/website/ui/StepProgressRail.tsx

@@ -0,0 +1,22 @@
+import { Box } from '@/ui/Box';
+import { motion } from 'framer-motion';
+
+interface StepProgressRailProps {
+  currentStep: number;
+  totalSteps: number;
+}
+
+export function StepProgressRail({ currentStep, totalSteps }: StepProgressRailProps) {
+  const progress = (currentStep / totalSteps) * 100;
+
+  return (
+    <Box w="full" h="1" bg="bg-iron-gray" rounded="full" overflow="hidden" mb={8}>
+      <motion.div
+        className="h-full bg-primary-blue"
+        initial={{ width: 0 }}
+        animate={{ width: `${progress}%` }}
+        transition={{ duration: 0.5, ease: 'easeOut' }}
+      />
+    </Box>
+  );
+}