diff --git a/app/globals.css b/app/globals.css
index 17e8344..e2cf49d 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -3,8 +3,8 @@
 @theme {
   --color-background: #0a0a0a;
   --color-foreground: #ededed;
-  --color-neon: #ff9eb5;
-  --color-neon-hover: #ff7da0;
+  --color-neon: #00f3ff;
+  --color-neon-hover: #00c2cc;
   --color-surface: #111111;
   --color-surface-highlight: #1a1a1a;
   --color-charcoal: #18181b;
diff --git a/app/layout.tsx b/app/layout.tsx
index ded1d5b..24184e4 100644
--- a/app/layout.tsx
+++ b/app/layout.tsx
@@ -26,10 +26,18 @@ export const metadata: Metadata = {
   openGraph: {
     type: "website",
     locale: "en_GB",
-    url: "https://luinbytes.dev",
+    url: "https://luinbytes.github.io",
     title: "Lu | Software Engineer",
-    description: "Self-taught software engineer in the UK.",
+    description: "Self-taught software engineer building AI tools, Raycast extensions, and PC-gaming utilities.",
     siteName: "Luinbytes",
+    images: [
+      {
+        url: "https://luinbytes.github.io/og-image.png",
+        width: 1200,
+        height: 630,
+        alt: "Lu | Software Engineer",
+      },
+    ],
   },
   keywords: ["Software Engineer", "Raycast Extensions", "Next.js", "Brutalist Design", "TypeScript"],
 };
diff --git a/app/not-found.tsx b/app/not-found.tsx
new file mode 100644
index 0000000..64f161a
--- /dev/null
+++ b/app/not-found.tsx
@@ -0,0 +1,55 @@
+"use client";
+
+import Link from "next/link";
+import { Home, Terminal } from "lucide-react";
+
+export default function NotFound() {
+    return (
+        <div className="min-h-screen flex items-center justify-center bg-background px-4">
+            <div className="text-center max-w-2xl">
+                {/* Big 404 */}
+                <div className="relative mb-8">
+                    <h1 className="text-[12rem] md:text-[16rem] font-bold tracking-tighter text-white/5 leading-none">
+                        404
+                    </h1>
+                    <div className="absolute inset-0 flex items-center justify-center">
+                        <Terminal className="w-24 h-24 md:w-32 md:h-32 text-neon animate-pulse" />
+                    </div>
+                </div>
+
+                {/* Message */}
+                <h2 className="text-3xl md:text-4xl font-bold tracking-tight text-white mb-4">
+                    Page Not Found
+                </h2>
+                <p className="text-xl text-gray-400 mb-8 max-w-md mx-auto">
+                    The page you're looking for doesn't exist or has been moved.
+                    <span className="block mt-2 text-neon">
+                        Maybe I deleted it. Who knows.
+                    </span>
+                </p>
+
+                {/* Debug-style info */}
+                <div className="bg-surface border border-white/10 rounded-lg p-4 mb-8 text-left font-mono text-sm">
+                    <div className="text-gray-500">
+                        <span className="text-red-400">Error:</span> 404 - Not Found
+                    </div>
+                    <div className="text-gray-500">
+                        <span className="text-yellow-400">Path:</span> {typeof window !== 'undefined' ? window.location.pathname : 'unknown'}
+                    </div>
+                    <div className="text-gray-500">
+                        <span className="text-neon">Hint:</span> Check the URL or go home
+                    </div>
+                </div>
+
+                {/* Back to Home */}
+                <Link
+                    href="/"
+                    className="inline-flex items-center gap-2 px-8 py-4 bg-neon text-black font-bold rounded-full hover:bg-neon/90 transition-colors"
+                >
+                    <Home className="w-4 h-4" />
+                    Back to Home
+                </Link>
+            </div>
+        </div>
+    );
+}
diff --git a/app/page.tsx b/app/page.tsx
index 599a25d..ca96630 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -1,5 +1,7 @@
 import { Hero } from "@/components/sections/hero";
 import { About } from "@/components/sections/about";
+import { Now } from "@/components/sections/now";
+import { Skills } from "@/components/sections/skills";
 import { Projects } from "@/components/sections/projects";
 import { Activity } from "@/components/sections/activity";
 import { AutomationPlayground } from "@/components/sections/automation-playground";
@@ -12,6 +14,8 @@ export default function Home() {
       <Hero />
       <div className="h-16" />
       <About />
+      <Now />
+      <Skills />
       <Projects />
       <SectionErrorBoundary>
         <AutomationPlayground />
diff --git a/components/sections/hero.tsx b/components/sections/hero.tsx
index 89bfcc5..8292e03 100644
--- a/components/sections/hero.tsx
+++ b/components/sections/hero.tsx
@@ -40,10 +40,6 @@ export function Hero() {
                 <div className="flex flex-col sm:flex-row gap-4 w-full sm:w-auto">
                     <Link
                         href="#projects"
-                        onClick={(e) => {
-                            e.preventDefault();
-                            document.getElementById('projects')?.scrollIntoView({ behavior: 'smooth' });
-                        }}
                         className="group px-8 py-4 bg-white text-black hover:bg-neon transition-all duration-300 font-bold rounded-full flex items-center justify-center gap-2"
                     >
                         View Projects
@@ -51,10 +47,6 @@ export function Hero() {
                     </Link>
                     <Link
                         href="#contact"
-                        onClick={(e) => {
-                            e.preventDefault();
-                            document.getElementById('contact')?.scrollIntoView({ behavior: 'smooth' });
-                        }}
                         className="px-8 py-4 bg-transparent border border-white/20 hover:border-white transition-colors text-white font-bold rounded-full flex items-center justify-center"
                     >
                         Request a Tool
diff --git a/components/sections/now.tsx b/components/sections/now.tsx
new file mode 100644
index 0000000..366ddfd
--- /dev/null
+++ b/components/sections/now.tsx
@@ -0,0 +1,42 @@
+"use client";
+
+// Easy to update data - just change these values
+const currentStatus = {
+    building: "file-deduplicator v3.1 (TUI mode)",
+    learning: "Advanced Go patterns and system programming",
+    obsessed: "Building tools that save 5 seconds in 5 hours",
+    reading: "The Pragmatic Programmer",
+};
+
+export function Now() {
+    return (
+        <section id="now" className="py-24 relative border-t border-white/5">
+            <div className="container px-4 mx-auto max-w-4xl">
+                <div className="mb-12">
+                    <h2 className="text-4xl md:text-5xl font-bold tracking-tighter mb-6 flex items-center gap-3">
+                        <span className="text-neon">/</span> Now
+                    </h2>
+                </div>
+
+                <div className="space-y-4 font-mono">
+                    <p className="text-gray-300">
+                        <span className="text-gray-500">→</span> Building: <span className="text-white">{currentStatus.building}</span>
+                    </p>
+                    <p className="text-gray-300">
+                        <span className="text-gray-500">→</span> Learning: <span className="text-white">{currentStatus.learning}</span>
+                    </p>
+                    <p className="text-gray-300">
+                        <span className="text-gray-500">→</span> Obsessed with: <span className="text-white">{currentStatus.obsessed}</span>
+                    </p>
+                    <p className="text-gray-300">
+                        <span className="text-gray-500">→</span> Reading: <span className="text-white">{currentStatus.reading}</span>
+                    </p>
+                </div>
+
+                <p className="mt-12 text-sm text-gray-600">
+                    Last updated: Feb 2025
+                </p>
+            </div>
+        </section>
+    );
+}
diff --git a/components/sections/projects.tsx b/components/sections/projects.tsx
index 8def60e..07130ed 100644
--- a/components/sections/projects.tsx
+++ b/components/sections/projects.tsx
@@ -1,12 +1,29 @@
 "use client";
 
 import { useState } from "react";
-import { projects, Project } from "@/lib/data";
+import { projects, Project, ProjectType } from "@/lib/data";
 import { X, Github, ExternalLink, Terminal } from "lucide-react";
 import { cn } from "@/lib/utils";
 
+type FilterCategory = "All" | "Raycast" | "Web" | "CLI" | "Discord";
+
+const filterMap: Record<FilterCategory, ProjectType[] | null> = {
+    All: null,
+    Raycast: ["Raycast Extension"],
+    Web: ["Web App"],
+    CLI: ["CLI Tool"],
+    Discord: ["Discord Utility"],
+};
+
+const filterButtons: FilterCategory[] = ["All", "Raycast", "Web", "CLI", "Discord"];
+
 export function Projects() {
     const [selectedProject, setSelectedProject] = useState<Project | null>(null);
+    const [activeFilter, setActiveFilter] = useState<FilterCategory>("All");
+
+    const filteredProjects = activeFilter === "All" 
+        ? projects 
+        : projects.filter(p => filterMap[activeFilter]?.includes(p.type));
 
     return (
         <section id="projects" className="py-24 relative border-t border-white/5">
@@ -21,8 +38,26 @@ export function Projects() {
                     </p>
                 </div>
 
+                {/* Filter Buttons */}
+                <div className="flex flex-wrap gap-3 mb-12">
+                    {filterButtons.map((filter) => (
+                        <button
+                            key={filter}
+                            onClick={() => setActiveFilter(filter)}
+                            className={cn(
+                                "px-4 py-2 text-sm font-mono font-bold uppercase tracking-wider border-2 transition-all duration-200 rounded-full",
+                                activeFilter === filter
+                                    ? "bg-neon text-black border-neon"
+                                    : "bg-transparent text-gray-400 border-white/20 hover:border-neon hover:text-neon"
+                            )}
+                        >
+                            {filter}
+                        </button>
+                    ))}
+                </div>
+
                 <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
-                    {projects.map((project) => (
+                    {filteredProjects.map((project) => (
                         <div
                             key={project.id}
                             onClick={() => setSelectedProject(project)}
diff --git a/components/sections/skills.tsx b/components/sections/skills.tsx
new file mode 100644
index 0000000..9a57daf
--- /dev/null
+++ b/components/sections/skills.tsx
@@ -0,0 +1,47 @@
+"use client";
+
+const skillCategories = [
+    {
+        title: "Languages",
+        skills: ["TypeScript", "Go", "Python", "JavaScript", "SQL"],
+    },
+    {
+        title: "Frameworks",
+        skills: ["Next.js", "React", "Node.js", "Tailwind CSS", "Discord.js"],
+    },
+    {
+        title: "Tools",
+        skills: ["Git", "Docker", "Linux", "Raycast API", "GitHub Actions"],
+    },
+];
+
+export function Skills() {
+    return (
+        <section id="skills" className="py-24 relative border-t border-white/5">
+            <div className="container px-4 mx-auto max-w-4xl">
+                <div className="mb-12">
+                    <h2 className="text-4xl md:text-5xl font-bold tracking-tighter mb-6 flex items-center gap-3">
+                        <span className="text-neon">/</span> Stack
+                    </h2>
+                </div>
+
+                <div className="space-y-8">
+                    {skillCategories.map((category) => (
+                        <div key={category.title}>
+                            <h3 className="text-sm font-mono text-gray-500 uppercase tracking-wider mb-3">
+                                {category.title}
+                            </h3>
+                            <div className="flex flex-wrap gap-x-4 gap-y-2">
+                                {category.skills.map((skill) => (
+                                    <span key={skill} className="text-gray-300">
+                                        {skill}
+                                    </span>
+                                ))}
+                            </div>
+                        </div>
+                    ))}
+                </div>
+            </div>
+        </section>
+    );
+}
diff --git a/package-lock.json b/package-lock.json
index c4fc3af..5feb9b3 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -74,7 +74,6 @@
       "integrity": "sha512-e7jT4DxYvIDLk1ZHmU/m/mB19rex9sv0c2ftBtjSBv+kVM/902eh0fINUzD7UwLLNR+jU585GxUJ8/EBfAM5fw==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@babel/code-frame": "^7.27.1",
         "@babel/generator": "^7.28.5",
@@ -2063,7 +2062,6 @@
       "integrity": "sha512-MWtvHrGZLFttgeEj28VXHxpmwYbor/ATPYbBfSFZEIRK0ecCFLl2Qo55z52Hss+UV9CRN7trSeq1zbgx7YDWWg==",
       "devOptional": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "csstype": "^3.2.2"
       }
@@ -2074,7 +2072,6 @@
       "integrity": "sha512-jp2L/eY6fn+KgVVQAOqYItbF0VY/YApe5Mz2F0aykSO8gx31bYCZyvSeYxCHKvzHG5eZjc+zyaS5BrBWya2+kQ==",
       "devOptional": true,
       "license": "MIT",
-      "peer": true,
       "peerDependencies": {
         "@types/react": "^19.2.0"
       }
@@ -2124,7 +2121,6 @@
       "integrity": "sha512-N9lBGA9o9aqb1hVMc9hzySbhKibHmB+N3IpoShyV6HyQYRGIhlrO5rQgttypi+yEeKsKI4idxC8Jw6gXKD4THA==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@typescript-eslint/scope-manager": "8.49.0",
         "@typescript-eslint/types": "8.49.0",
@@ -2624,7 +2620,6 @@
       "integrity": "sha512-NZyJarBfL7nWwIq+FDL6Zp/yHEhePMNnnJ0y3qfieCrmNvYct8uvtiV41UvlSe6apAfk0fY1FbWx+NwfmpvtTg==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "bin": {
         "acorn": "bin/acorn"
       },
@@ -2978,7 +2973,6 @@
         }
       ],
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "baseline-browser-mapping": "^2.9.0",
         "caniuse-lite": "^1.0.30001759",
@@ -3587,7 +3581,6 @@
       "integrity": "sha512-BhHmn2yNOFA9H9JmmIVKJmd288g9hrVRDkdoIgRCRuSySRUHH7r/DI6aAXW9T1WwUuY3DFgrcaqB+deURBLR5g==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@eslint-community/eslint-utils": "^4.8.0",
         "@eslint-community/regexpp": "^4.12.1",
@@ -3773,7 +3766,6 @@
       "integrity": "sha512-whOE1HFo/qJDyX4SnXzP4N6zOWn79WhnCUY/iDR0mPfQZO8wcYE4JClzI2oZrhBnnMUCBCHZhO6VQyoBU95mZA==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@rtsao/scc": "^1.1.0",
         "array-includes": "^3.1.9",
@@ -6005,7 +5997,6 @@
       "resolved": "https://registry.npmjs.org/react/-/react-19.2.1.tgz",
       "integrity": "sha512-DGrYcCWK7tvYMnWh79yrPHt+vdx9tY+1gPZa7nJQtO/p8bLTDaHp4dzwEhQB7pZ4Xe3ok4XKuEPrVuc+wlpkmw==",
       "license": "MIT",
-      "peer": true,
       "engines": {
         "node": ">=0.10.0"
       }
@@ -6028,7 +6019,6 @@
       "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.2.1.tgz",
       "integrity": "sha512-ibrK8llX2a4eOskq1mXKu/TGZj9qzomO+sNfO98M6d9zIPOEhlBkMkBUBLd1vgS0gQsLDBzA+8jJBVXDnfHmJg==",
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "scheduler": "^0.27.0"
       },
@@ -6802,7 +6792,6 @@
       "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "engines": {
         "node": ">=12"
       },
@@ -6965,7 +6954,6 @@
       "integrity": "sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==",
       "dev": true,
       "license": "Apache-2.0",
-      "peer": true,
       "bin": {
         "tsc": "bin/tsc",
         "tsserver": "bin/tsserver"
@@ -7284,7 +7272,6 @@
       "integrity": "sha512-AvvthqfqrAhNH9dnfmrfKzX5upOdjUVJYFqNSlkmGf64gRaTzlPwz99IHYnVs28qYAybvAlBV+H7pn0saFY4Ig==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "funding": {
         "url": "https://github.com/sponsors/colinhacks"
       }