Implemented motion and removed framer motion

src/app/about/page.tsx

@@ -22,8 +22,7 @@ import {
   SiDocker,
   SiLinux,
 } from "@icons-pack/react-simple-icons";
-import { cn } from "@/lib/utils";
-import { motion } from "framer-motion";
+import { motion } from "motion/react";
 import {
   staggerContainer,
   fadeInUp,
@@ -33,6 +32,7 @@ import {
   timelineItemRight,
   slowFloat,
 } from "@/lib/animations";
+import { cn } from "@/lib/utils";
 
 const timeline = [
   {

src/app/pricing/page.tsx

@@ -2,7 +2,7 @@
 
 import { Check, ArrowRight, Zap, Crown, Rocket } from "lucide-react";
 import { useState } from "react";
-import { motion } from "framer-motion";
+import { motion } from "motion/react";
 import {
   staggerContainer,
   fadeInUp,

src/components/home/HeroSection.tsx

@@ -2,7 +2,7 @@
 
 import { ArrowRight, Github, Linkedin, Youtube } from "lucide-react";
 import Link from "next/link";
-import { motion } from "framer-motion";
+import { motion } from "motion/react";
 import { staggerContainer, fadeInUp, slowFloat } from "@/lib/animations";
 
 export function HeroSection() {

src/components/home/ProjectsSection.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 import { BookOpen, ExternalLink, Github, Star } from "lucide-react";
-import { motion } from "framer-motion";
+import { motion } from "motion/react";
 import { fadeInUp, staggerContainer } from "@/lib/animations";
 
 const projects = [

src/components/home/SkillsSection.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { motion } from "framer-motion";
+import { motion } from "motion/react";
 import { fadeInUp, staggerContainer } from "@/lib/animations";
 
 const skills = [
@@ -21,7 +21,7 @@ const skills = [
       { name: "React", level: 95 },
       { name: "Next.js", level: 85 },
       { name: "Tailwind CSS", level: 80 },
-      { name: "Framer Motion", level: 80 },
+      { name: "Motion", level: 80 },
     ],
   },
   {

src/components/layout/Navbar.tsx

@@ -5,7 +5,7 @@ import { CoffeeIcon, Github, Menu, X } from "lucide-react";
 import Link from "next/link";
 import { usePathname } from "next/navigation";
 import { useState } from "react";
-import { motion } from "framer-motion";
+import { motion } from "motion/react";
 
 const navLinks = [
   { href: "/", label: "Home" },

src/lib/animations.ts

@@ -1,4 +1,4 @@
-import { Variants } from "framer-motion";
+import { stagger, Variants } from "motion/react";
 
 /**
  * Container
@@ -7,8 +7,7 @@ export const staggerContainer: Variants = {
   hidden: {},
   visible: {
     transition: {
-      staggerChildren: 0.15,
-      delayChildren: 0.05,
+      delayChildren: stagger(0.15),
     },
   },
 };