"use client"; import React from "react"; import { motion } from "framer-motion"; import { Dna, Settings, ShieldCheck, ArrowDown, Activity } from "lucide-react"; import { clsx, type ClassValue } from "clsx"; import { twMerge } from "tailwind-merge"; function cn(...inputs: ClassValue[]) { return twMerge(clsx(inputs)); } const steps = [ { id: "01", phase: "Discovery", title: "Genetic Analysis", description: "Extraction and sequencing of core brand DNA to identify unique market markers and competitive advantages.", icon: Dna, metric: "4.8PB Data Scanned" }, { id: "02", phase: "Development", title: "Neural Architect", description: "Building scalable logic structures that adapt to user behavior patterns and high-velocity environments.", icon: Settings, metric: "99.9% Sync Accuracy" }, { id: "03", phase: "Deployment", title: "Encrypted Launch", description: "Hardened deployment protocols ensuring zero-downtime transition and absolute data integrity.", icon: ShieldCheck, metric: "AES-256 Quantum-Safe" } ]; export function FeatureStickyScrollPath() { return (

{/* Background Grid Pattern */}

{/* Intro Section */}

Sequential Protocol

System
Evolution.

A linear progression through our core operational phases, designed for maximum clarity and technical precision.

Scroll to track

{/* Path Content */}

{/* Vertical Technical Line */}

{steps.map((step, index) => ( {/* Visual Marker */}

{/* Content Card */}

P-{step.id} // {step.phase}

{step.title}

{step.description}

{step.metric}

{[1, 2, 3].map(i =>

)}

{/* Offset spacer for the other side of the path */}

))}

{/* Technical Footer */}

Lat: 34.0522° N Lon: 118.2437° W

SYSTEM_PROTOCOL_TERMINATED_SUCCESSFULLY

); } export default function FeatureStickyScrollPathDemo() { return ; }

System Evolution.

{step.title}

System
Evolution.