diff --git a/backend/src/index.ts b/backend/src/index.ts
index c612959..8b6d355 100644
--- a/backend/src/index.ts
+++ b/backend/src/index.ts
@@ -1,5 +1,11 @@
 import dotenv from "dotenv";
-dotenv.config();
+import path from "path";
+console.log("Current working directory:", process.cwd());
+const result = dotenv.config();
+if (result.error) {
+  console.error("Dotenv config error:", result.error);
+}
+console.log("Environment variables loaded:", result.parsed ? Object.keys(result.parsed) : "None");
 import app from "./app";
 import { connectDB } from "./config/db";
 
diff --git a/frontend/package-lock.json b/frontend/package-lock.json
index 63b55cb..48a666d 100644
--- a/frontend/package-lock.json
+++ b/frontend/package-lock.json
@@ -11,9 +11,10 @@
         "@tailwindcss/vite": "^4.1.18",
         "class-variance-authority": "^0.7.1",
         "clsx": "^2.1.1",
+        "framer-motion": "^11.18.2",
         "lucide-react": "^0.562.0",
-        "react": "^19.2.0",
-        "react-dom": "^19.2.0",
+        "react": "^18.2.0",
+        "react-dom": "^18.2.0",
         "react-router-dom": "^6.14.1",
         "tailwind-merge": "^3.4.0",
         "tailwindcss": "^4.1.18"
@@ -2059,9 +2060,6 @@
       }
     },
     "node_modules/caniuse-lite": {
-      "version": "1.0.30001762",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001762.tgz",
-      "integrity": "sha512-PxZwGNvH7Ak8WX5iXzoK1KPZttBXNPuaOvI2ZYU7NrlM+d9Ov+TUvlLOBNGzVXAntMSMMlJPd+jY6ovrVjSmUw==",
       "version": "1.0.30001762",
       "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001762.tgz",
       "integrity": "sha512-PxZwGNvH7Ak8WX5iXzoK1KPZttBXNPuaOvI2ZYU7NrlM+d9Ov+TUvlLOBNGzVXAntMSMMlJPd+jY6ovrVjSmUw==",
@@ -2433,9 +2431,6 @@
       }
     },
     "node_modules/esquery": {
-      "version": "1.7.0",
-      "resolved": "https://registry.npmjs.org/esquery/-/esquery-1.7.0.tgz",
-      "integrity": "sha512-Ap6G0WQwcU/LHsvLwON1fAQX9Zp0A2Y6Y/cJBl9r/JbW90Zyg4/zbG6zzKa2OTALELarYHmKu0GhpM5EO+7T0g==",
       "version": "1.7.0",
       "resolved": "https://registry.npmjs.org/esquery/-/esquery-1.7.0.tgz",
       "integrity": "sha512-Ap6G0WQwcU/LHsvLwON1fAQX9Zp0A2Y6Y/cJBl9r/JbW90Zyg4/zbG6zzKa2OTALELarYHmKu0GhpM5EO+7T0g==",
@@ -2570,6 +2565,33 @@
       "dev": true,
       "license": "ISC"
     },
+    "node_modules/framer-motion": {
+      "version": "11.18.2",
+      "resolved": "https://registry.npmjs.org/framer-motion/-/framer-motion-11.18.2.tgz",
+      "integrity": "sha512-5F5Och7wrvtLVElIpclDT0CBzMVg3dL22B64aZwHtsIY8RB4mXICLrkajK4G9R+ieSAGcgrLeae2SeUTg2pr6w==",
+      "license": "MIT",
+      "dependencies": {
+        "motion-dom": "^11.18.1",
+        "motion-utils": "^11.18.1",
+        "tslib": "^2.4.0"
+      },
+      "peerDependencies": {
+        "@emotion/is-prop-valid": "*",
+        "react": "^18.0.0 || ^19.0.0",
+        "react-dom": "^18.0.0 || ^19.0.0"
+      },
+      "peerDependenciesMeta": {
+        "@emotion/is-prop-valid": {
+          "optional": true
+        },
+        "react": {
+          "optional": true
+        },
+        "react-dom": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/fsevents": {
       "version": "2.3.3",
       "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
@@ -2733,7 +2755,6 @@
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
       "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==",
-      "dev": true,
       "license": "MIT"
     },
     "node_modules/js-yaml": {
@@ -3092,6 +3113,18 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/loose-envify": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz",
+      "integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==",
+      "license": "MIT",
+      "dependencies": {
+        "js-tokens": "^3.0.0 || ^4.0.0"
+      },
+      "bin": {
+        "loose-envify": "cli.js"
+      }
+    },
     "node_modules/lru-cache": {
       "version": "5.1.1",
       "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-5.1.1.tgz",
@@ -3133,6 +3166,21 @@
         "node": "*"
       }
     },
+    "node_modules/motion-dom": {
+      "version": "11.18.1",
+      "resolved": "https://registry.npmjs.org/motion-dom/-/motion-dom-11.18.1.tgz",
+      "integrity": "sha512-g76KvA001z+atjfxczdRtw/RXOM3OMSdd1f4DL77qCTF/+avrRJiawSG4yDibEQ215sr9kpinSlX2pCTJ9zbhw==",
+      "license": "MIT",
+      "dependencies": {
+        "motion-utils": "^11.18.1"
+      }
+    },
+    "node_modules/motion-utils": {
+      "version": "11.18.1",
+      "resolved": "https://registry.npmjs.org/motion-utils/-/motion-utils-11.18.1.tgz",
+      "integrity": "sha512-49Kt+HKjtbJKLtgO/LKj9Ld+6vw9BjH5d9sc40R/kVyH8GLAXgT42M2NnuPcJNuA3s9ZfZBUcwIgpmZWGEE+hA==",
+      "license": "MIT"
+    },
     "node_modules/ms": {
       "version": "2.1.3",
       "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz",
@@ -3322,24 +3370,28 @@
       }
     },
     "node_modules/react": {
-      "version": "19.2.3",
-      "resolved": "https://registry.npmjs.org/react/-/react-19.2.3.tgz",
-      "integrity": "sha512-Ku/hhYbVjOQnXDZFv2+RibmLFGwFdeeKHFcOTlrt7xplBnya5OGn/hIRDsqDiSUcfORsDC7MPxwork8jBwsIWA==",
+      "version": "18.3.1",
+      "resolved": "https://registry.npmjs.org/react/-/react-18.3.1.tgz",
+      "integrity": "sha512-wS+hAgJShR0KhEvPJArfuPVN1+Hz1t0Y6n5jLrGQbkb4urgPE/0Rve+1kMB1v/oWgHgm4WIcV+i7F2pTVj+2iQ==",
       "license": "MIT",
+      "dependencies": {
+        "loose-envify": "^1.1.0"
+      },
       "engines": {
         "node": ">=0.10.0"
       }
     },
     "node_modules/react-dom": {
-      "version": "19.2.3",
-      "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.2.3.tgz",
-      "integrity": "sha512-yELu4WmLPw5Mr/lmeEpox5rw3RETacE++JgHqQzd2dg+YbJuat3jH4ingc+WPZhxaoFzdv9y33G+F7Nl5O0GBg==",
+      "version": "18.3.1",
+      "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz",
+      "integrity": "sha512-5m4nQKp+rZRb09LNH59GM4BxTh9251/ylbKIbpe7TpGxfJ+9kv6BLkLBXIjjspbgbnIBNqlI23tRnTWT0snUIw==",
       "license": "MIT",
       "dependencies": {
-        "scheduler": "^0.27.0"
+        "loose-envify": "^1.1.0",
+        "scheduler": "^0.23.2"
       },
       "peerDependencies": {
-        "react": "^19.2.3"
+        "react": "^18.3.1"
       }
     },
     "node_modules/react-refresh": {
@@ -3436,10 +3488,13 @@
       }
     },
     "node_modules/scheduler": {
-      "version": "0.27.0",
-      "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.27.0.tgz",
-      "integrity": "sha512-eNv+WrVbKu1f3vbYJT/xtiF5syA5HPIMtf9IgY/nKg0sWqzAUEvqY/xm7OcZc/qafLx/iO9FgOmeSAp4v5ti/Q==",
-      "license": "MIT"
+      "version": "0.23.2",
+      "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.2.tgz",
+      "integrity": "sha512-UOShsPwz7NrMUqhR6t0hWjFduvOzbtv7toDH1/hIrfRNIDBnnBWd0CwJTGvTpngVlmwGCdP9/Zl/tVrDqcuYzQ==",
+      "license": "MIT",
+      "dependencies": {
+        "loose-envify": "^1.1.0"
+      }
     },
     "node_modules/semver": {
       "version": "6.3.1",
@@ -3555,9 +3610,6 @@
       }
     },
     "node_modules/ts-api-utils": {
-      "version": "2.4.0",
-      "resolved": "https://registry.npmjs.org/ts-api-utils/-/ts-api-utils-2.4.0.tgz",
-      "integrity": "sha512-3TaVTaAv2gTiMB35i3FiGJaRfwb3Pyn/j3m/bfAvGe8FB7CF6u+LMYqYlDh7reQf7UNvoTvdfAqHGmPGOSsPmA==",
       "version": "2.4.0",
       "resolved": "https://registry.npmjs.org/ts-api-utils/-/ts-api-utils-2.4.0.tgz",
       "integrity": "sha512-3TaVTaAv2gTiMB35i3FiGJaRfwb3Pyn/j3m/bfAvGe8FB7CF6u+LMYqYlDh7reQf7UNvoTvdfAqHGmPGOSsPmA==",
@@ -3570,6 +3622,12 @@
         "typescript": ">=4.8.4"
       }
     },
+    "node_modules/tslib": {
+      "version": "2.8.1",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz",
+      "integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==",
+      "license": "0BSD"
+    },
     "node_modules/tw-animate-css": {
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/tw-animate-css/-/tw-animate-css-1.4.0.tgz",
diff --git a/frontend/public/post.jpg b/frontend/public/post.jpg
new file mode 100644
index 0000000..694b087
Binary files /dev/null and b/frontend/public/post.jpg differ
diff --git a/frontend/public/postgrid.jpg b/frontend/public/postgrid.jpg
new file mode 100644
index 0000000..3bca0a5
Binary files /dev/null and b/frontend/public/postgrid.jpg differ
diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index 10a555c..81dd1a0 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -18,9 +18,10 @@ function App() {
 
       <Routes>
         {/* Landing Page */}
-        <Route path="/" element={<LandingPage />} />
+        <Route path="/landing" element={<LandingPage />} />
         <Route path="/signin" element={<Background />} />
         {/* Profile Page */}
+        <Route path="/" element={<ProfilePage />} />
         <Route path="/profile" element={<ProfilePage />} />
       </Routes>
     </BrowserRouter>
diff --git a/frontend/src/pages/Profile/ProfileContent.tsx b/frontend/src/pages/Profile/ProfileContent.tsx
new file mode 100644
index 0000000..7b9e9dc
--- /dev/null
+++ b/frontend/src/pages/Profile/ProfileContent.tsx
@@ -0,0 +1,96 @@
+import React, { useState } from "react";
+import { LayoutGrid, Clapperboard, Bookmark, Users } from "lucide-react";
+
+const ProfileContent: React.FC = () => {
+  const [activeTab, setActiveTab] = useState("posts");
+
+  const initialPosts = [
+    { id: 1, image: "/post.jpg" },
+    { id: 2, image: "/post.jpg" },
+    { id: 3, image: "/post.jpg" },
+    { id: 4, image: "/post.jpg" },
+    { id: 5, image: "/postgrid.jpg" },
+    { id: 6, image: "/postgrid.jpg" },
+    { id: 7, image: "/postgrid.jpg" },
+    { id: 8, image: "/postgrid.jpg" },
+    { id: 9, image: "/postgrid.jpg" },
+    { id: 10, image: "/postgrid.jpg" },
+    { id: 11, image: "/postgrid.jpg" },
+    { id: 12, image: "/postgrid.jpg" },
+  ];
+
+  const [posts, setPosts] = useState(initialPosts);
+
+  const handleLoadMore = () => {
+    const nextBatch = initialPosts.map((post) => ({
+      ...post,
+      id: posts.length + post.id,
+    }));
+    setPosts([...posts, ...nextBatch]);
+  };
+
+  const tabs = [
+    { id: "posts", icon: <LayoutGrid size={22} /> },
+    { id: "reels", icon: <Clapperboard size={22} /> },
+    { id: "saved", icon: <Bookmark size={22} /> },
+    { id: "tagged", icon: <Users size={22} /> },
+  ];
+
+  return (
+    <div className="mt-6 w-full pb-20">
+      {/* Tabs */}
+      <div className="flex justify-center border border-white/20 rounded-xl bg-[#000722]/80 backdrop-blur-xl overflow-hidden mb-8">
+        {tabs.map((tab) => (
+          <button
+            key={tab.id}
+            onClick={() => setActiveTab(tab.id)}
+            className={`flex-1 flex justify-center py-5 relative transition-colors duration-200 cursor-pointer ${
+              activeTab === tab.id ? "text-[#3B82F6]" : "text-white/50 hover:text-white"
+            }`}
+          >
+            {tab.icon}
+            {activeTab === tab.id && (
+              <div className="absolute bottom-0 left-0 right-0 h-[3px] bg-[#3B82F6] shadow-[0_0_12px_rgba(59,130,246,0.8)] mx-1 rounded-t-full" />
+            )}
+          </button>
+        ))}
+      </div>
+
+      {/* Post Grid */}
+      <div className="grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-4 gap-4">
+        {posts.map((post) => (
+          <div 
+            key={post.id} 
+            className="aspect-square rounded-2xl overflow-hidden group cursor-pointer relative border border-white/5"
+          >
+            <img 
+              src={post.image} 
+              alt="post" 
+              className="w-full h-full object-cover transition-transform duration-500 group-hover:scale-110" 
+            />
+            <div className="absolute inset-0 bg-black/20 opacity-0 group-hover:opacity-100 transition-opacity duration-300" />
+          </div>
+        ))}
+      </div>
+
+      {/* Load More Button */}
+      <div className="mt-16 flex justify-center">
+        <button 
+          onClick={handleLoadMore}
+          className="
+          px-12 py-3.5 rounded-full 
+          border border-[#3B82F6]/30 
+          bg-[#000722]/80 text-white font-medium 
+          hover:bg-[#000722] hover:border-[#3B82F6]/60 
+          transition-all duration-300 
+          shadow-[0_0_20px_rgba(0,0,0,0.4)]
+          active:scale-95 cursor-pointer
+        ">
+          Load More
+        </button>
+      </div>
+    </div>
+  );
+};
+
+export default ProfileContent;
diff --git a/frontend/src/pages/Profile/ProfilePage.tsx b/frontend/src/pages/Profile/ProfilePage.tsx
index 18c456f..69a0f91 100644
--- a/frontend/src/pages/Profile/ProfilePage.tsx
+++ b/frontend/src/pages/Profile/ProfilePage.tsx
@@ -1,14 +1,16 @@
 import ProfileTopbar from "./ProfileTopbar";
 import ProfileHeader from "./ProfileHeader";
 import ProfileBackground from "./ProfileBackgound";
+import ProfileContent from "./ProfileContent";
 
 const ProfilePage = () => {
   return (<>
     <ProfileBackground />
-    <div className="min-h-screen h-700 ">
+    <div className="min-h-screen h-auto relative z-10">
       <div className="w-[85%] mx-auto">
         <ProfileTopbar />
         <ProfileHeader />
+        <ProfileContent />
       </div>
     </div>
   </>
diff --git a/node_modules/.package-lock.json b/node_modules/.package-lock.json
index 9dda3ce..6c8271c 100644
--- a/node_modules/.package-lock.json
+++ b/node_modules/.package-lock.json
@@ -1,5 +1,5 @@
 {
-  "name": "K-Folio",
+  "name": "K-Folio-main",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
diff --git a/package-lock.json b/package-lock.json
index 7fe2dc9..c59d277 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,5 +1,5 @@
 {
-  "name": "K-Folio",
+  "name": "K-Folio-main",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {