diff --git a/src/components/sections/Process.tsx b/src/components/sections/Process.tsx
index 3a78cee..27c726e 100644
--- a/src/components/sections/Process.tsx
+++ b/src/components/sections/Process.tsx
@@ -2,8 +2,6 @@
import { motion, type Variants } from 'framer-motion';
import { useTranslations } from 'next-intl';
-import type { LucideIcon } from 'lucide-react';
-import { Search, LayoutDashboard, PenTool, Rocket } from 'lucide-react';
import { cn } from '@/lib/utils';
import {
staggerContainerWide,
@@ -17,16 +15,15 @@ import SectionHeader from '@/components/ui/SectionHeader';
interface Step {
numeral: string;
key: 'discovery' | 'strategy' | 'build' | 'launch';
- Icon: LucideIcon;
}
// ─── Data ─────────────────────────────────────────────────────────────────────
const STEPS: Step[] = [
- { numeral: '01', key: 'discovery', Icon: Search },
- { numeral: '02', key: 'strategy', Icon: LayoutDashboard },
- { numeral: '03', key: 'build', Icon: PenTool },
- { numeral: '04', key: 'launch', Icon: Rocket },
+ { numeral: '01', key: 'discovery' },
+ { numeral: '02', key: 'strategy' },
+ { numeral: '03', key: 'build' },
+ { numeral: '04', key: 'launch' },
];
// ─── Variants ─────────────────────────────────────────────────────────────────
@@ -44,9 +41,134 @@ const numeralScaleVariants: Variants = {
},
};
+// ─── Animated blueprint network (desktop only) ───────────────────────────────
+
+function FlowNetwork() {
+ // Radial constellation — center hub with curved spokes to outer nodes
+ const cx = 130, cy = 100; // center
+ const nodes = [
+ { x: 50, y: 30 }, // top-left
+ { x: 210, y: 25 }, // top-right
+ { x: 240, y: 110 }, // right
+ { x: 195, y: 180 }, // bottom-right
+ { x: 55, y: 170 }, // bottom-left
+ { x: 20, y: 95 }, // left
+ ];
+
+ return (
+
+
+
+
+ );
+}
+
// ─── Sub-components ───────────────────────────────────────────────────────────
-function StepCard({ numeral, stepKey, Icon }: { numeral: string; stepKey: string; Icon: LucideIcon }) {
+function StepCard({ numeral, stepKey }: { numeral: string; stepKey: string }) {
const t = useTranslations();
const title = t(`process.steps.${stepKey}.title`);
const description = t(`process.steps.${stepKey}.description`);
@@ -94,7 +216,16 @@ export default function Process() {
const t = useTranslations();
return (
-
+
{/*
@@ -121,59 +252,22 @@ export default function Process() {
align="left"
/>
+