From 5ab99659bc1e184567762ca0d97fc3b6191a42bc Mon Sep 17 00:00:00 2001
From: sirpiglr <49359077-sirpiglr@users.noreply.replit.com>
Date: Mon, 15 Dec 2025 23:31:22 +0000
Subject: [PATCH] Add an admin page to manage applications and resolve alerts

Introduces a new admin page for managing applications and includes functionality to resolve alerts.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 279f1558-c0e3-40e4-8217-be7e9f4c6eca
Replit-Commit-Checkpoint-Type: intermediate_checkpoint
Replit-Commit-Event-Id: 34bed664-a459-48b3-b4bd-fe1aeb4a6f47
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/b984cb14-1d19-4944-922b-bc79e821ed35/279f1558-c0e3-40e4-8217-be7e9f4c6eca/GoEZTAy
Replit-Helium-Checkpoint-Created: true
---
 client/src/App.tsx                      |   2 +
 client/src/pages/admin-aegis.tsx        |  33 +-
 client/src/pages/admin-applications.tsx | 324 +++++++++++++++++
 client/src/pages/admin.tsx              |   3 +-
 client/src/pages/home.tsx               | 451 ++++++++++++++++--------
 client/src/pages/pitch.tsx              | 238 ++++++++++++-
 server/routes.ts                        |  26 ++
 server/storage.ts                       |  42 +++
 8 files changed, 961 insertions(+), 158 deletions(-)
 create mode 100644 client/src/pages/admin-applications.tsx

diff --git a/client/src/App.tsx b/client/src/App.tsx
index 7b7fe41..efd03ec 100644
--- a/client/src/App.tsx
+++ b/client/src/App.tsx
@@ -19,6 +19,7 @@ import AdminAegis from "@/pages/admin-aegis";
 import AdminSites from "@/pages/admin-sites";
 import AdminLogs from "@/pages/admin-logs";
 import AdminAchievements from "@/pages/admin-achievements";
+import AdminApplications from "@/pages/admin-applications";
 
 function Router() {
   return (
@@ -37,6 +38,7 @@ function Router() {
       <Route path="/admin/sites" component={AdminSites} />
       <Route path="/admin/logs" component={AdminLogs} />
       <Route path="/admin/achievements" component={AdminAchievements} />
+      <Route path="/admin/applications" component={AdminApplications} />
       <Route path="/pitch" component={Pitch} />
       <Route component={NotFound} />
     </Switch>
diff --git a/client/src/pages/admin-aegis.tsx b/client/src/pages/admin-aegis.tsx
index 285ed04..709d3e5 100644
--- a/client/src/pages/admin-aegis.tsx
+++ b/client/src/pages/admin-aegis.tsx
@@ -1,15 +1,16 @@
 import { useEffect } from "react";
 import { Link, useLocation } from "wouter";
-import { useQuery } from "@tanstack/react-query";
+import { useQuery, useMutation, useQueryClient } from "@tanstack/react-query";
 import { useAuth } from "@/lib/auth";
 import { 
   Users, FileCode, Shield, Activity, LogOut, 
-  BarChart3, User, AlertTriangle, CheckCircle, XCircle, Eye, Globe, Award, Key
+  BarChart3, User, AlertTriangle, CheckCircle, XCircle, Globe, Award, Key, Inbox
 } from "lucide-react";
 
 export default function AdminAegis() {
   const { user, isAuthenticated, isLoading: authLoading, logout } = useAuth();
   const [, setLocation] = useLocation();
+  const queryClient = useQueryClient();
 
   useEffect(() => {
     if (!authLoading && !isAuthenticated) {
@@ -37,6 +38,21 @@ export default function AdminAegis() {
     enabled: isAuthenticated,
   });
 
+  const resolveAlertMutation = useMutation({
+    mutationFn: async ({ id, is_resolved }: { id: string; is_resolved: boolean }) => {
+      const res = await fetch(`/api/alerts/${id}`, {
+        method: "PATCH",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ is_resolved }),
+      });
+      if (!res.ok) throw new Error("Failed to update alert");
+      return res.json();
+    },
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ["alerts"] });
+    },
+  });
+
   if (authLoading || !isAuthenticated) {
     return (
       <div className="min-h-screen bg-background flex items-center justify-center">
@@ -130,6 +146,18 @@ export default function AdminAegis() {
                       }`}>
                         {alert.is_resolved ? 'resolved' : 'active'}
                       </span>
+                      <button
+                        onClick={() => resolveAlertMutation.mutate({ id: alert.id, is_resolved: !alert.is_resolved })}
+                        disabled={resolveAlertMutation.isPending}
+                        className={`px-3 py-1 text-xs font-bold uppercase transition-colors ${
+                          alert.is_resolved 
+                            ? 'bg-yellow-500/10 text-yellow-500 hover:bg-yellow-500/20'
+                            : 'bg-green-500/10 text-green-500 hover:bg-green-500/20'
+                        }`}
+                        data-testid={`button-resolve-${alert.id}`}
+                      >
+                        {alert.is_resolved ? 'Reopen' : 'Resolve'}
+                      </button>
                     </div>
                   </div>
                 ))}
@@ -179,6 +207,7 @@ function Sidebar({ user, onLogout, active }: { user: any; onLogout: () => void;
       <nav className="flex-1 p-4 space-y-2">
         <NavItem icon={<BarChart3 className="w-4 h-4" />} label="Dashboard" href="/admin" active={active === 'dashboard'} />
         <NavItem icon={<Users className="w-4 h-4" />} label="Architects" href="/admin/architects" active={active === 'architects'} />
+        <NavItem icon={<Inbox className="w-4 h-4" />} label="Applications" href="/admin/applications" active={active === 'applications'} />
         <NavItem icon={<Award className="w-4 h-4" />} label="Achievements" href="/admin/achievements" active={active === 'achievements'} />
         <NavItem icon={<FileCode className="w-4 h-4" />} label="Credentials" href="/admin/credentials" active={active === 'credentials'} />
         <NavItem icon={<Activity className="w-4 h-4" />} label="Projects" href="/admin/projects" active={active === 'projects'} />
diff --git a/client/src/pages/admin-applications.tsx b/client/src/pages/admin-applications.tsx
new file mode 100644
index 0000000..4be28ff
--- /dev/null
+++ b/client/src/pages/admin-applications.tsx
@@ -0,0 +1,324 @@
+import { useEffect, useState } from "react";
+import { motion } from "framer-motion";
+import { Link, useLocation } from "wouter";
+import { useQuery, useMutation, useQueryClient } from "@tanstack/react-query";
+import { useAuth } from "@/lib/auth";
+import { 
+  Users, FileCode, Shield, Activity, LogOut, 
+  BarChart3, User, Globe, Award, Key, Inbox, 
+  CheckCircle, XCircle, Clock, Eye, Mail, Briefcase
+} from "lucide-react";
+
+export default function AdminApplications() {
+  const { user, isAuthenticated, isLoading: authLoading, logout } = useAuth();
+  const [, setLocation] = useLocation();
+  const [selectedApp, setSelectedApp] = useState<any>(null);
+  const queryClient = useQueryClient();
+
+  useEffect(() => {
+    if (!authLoading && !isAuthenticated) {
+      setLocation("/login");
+    }
+  }, [authLoading, isAuthenticated, setLocation]);
+
+  const { data: applications, isLoading } = useQuery({
+    queryKey: ["applications"],
+    queryFn: async () => {
+      const res = await fetch("/api/applications");
+      if (!res.ok) throw new Error("Failed to fetch applications");
+      return res.json();
+    },
+    enabled: isAuthenticated,
+  });
+
+  const updateApplicationMutation = useMutation({
+    mutationFn: async ({ id, status }: { id: string; status: string }) => {
+      const res = await fetch(`/api/applications/${id}`, {
+        method: "PATCH",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ status }),
+      });
+      if (!res.ok) throw new Error("Failed to update application");
+      return res.json();
+    },
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ["applications"] });
+      setSelectedApp(null);
+    },
+  });
+
+  if (authLoading || !isAuthenticated) {
+    return (
+      <div className="min-h-screen bg-background flex items-center justify-center">
+        <div className="text-primary animate-pulse">Loading...</div>
+      </div>
+    );
+  }
+
+  const handleLogout = async () => {
+    await logout();
+    setLocation("/");
+  };
+
+  const getStatusColor = (status: string) => {
+    switch (status?.toLowerCase()) {
+      case 'approved': case 'accepted': return 'bg-green-500/10 text-green-500';
+      case 'rejected': case 'declined': return 'bg-destructive/10 text-destructive';
+      case 'pending': case 'review': return 'bg-yellow-500/10 text-yellow-500';
+      default: return 'bg-white/5 text-muted-foreground';
+    }
+  };
+
+  const getStatusIcon = (status: string) => {
+    switch (status?.toLowerCase()) {
+      case 'approved': case 'accepted': return <CheckCircle className="w-4 h-4" />;
+      case 'rejected': case 'declined': return <XCircle className="w-4 h-4" />;
+      default: return <Clock className="w-4 h-4" />;
+    }
+  };
+
+  const pendingCount = applications?.filter((a: any) => a.status === 'pending' || !a.status).length || 0;
+
+  return (
+    <div className="min-h-screen bg-background text-foreground font-mono flex">
+      <Sidebar user={user} onLogout={handleLogout} active="applications" />
+
+      <div className="flex-1 overflow-auto">
+        <div className="p-8">
+          <div className="mb-8">
+            <h2 className="text-2xl font-display font-bold text-white uppercase tracking-wider">
+              Applications
+            </h2>
+            <p className="text-muted-foreground text-sm mt-1">
+              {applications?.length || 0} total applications • {pendingCount} pending review
+            </p>
+          </div>
+
+          <div className="bg-card/50 border border-white/10 overflow-hidden">
+            <table className="w-full">
+              <thead>
+                <tr className="border-b border-white/10 text-left">
+                  <th className="p-4 text-xs text-muted-foreground uppercase tracking-wider font-bold">Applicant</th>
+                  <th className="p-4 text-xs text-muted-foreground uppercase tracking-wider font-bold">Position</th>
+                  <th className="p-4 text-xs text-muted-foreground uppercase tracking-wider font-bold">Status</th>
+                  <th className="p-4 text-xs text-muted-foreground uppercase tracking-wider font-bold">Submitted</th>
+                  <th className="p-4 text-xs text-muted-foreground uppercase tracking-wider font-bold">Actions</th>
+                </tr>
+              </thead>
+              <tbody>
+                {isLoading ? (
+                  <tr>
+                    <td colSpan={5} className="p-8 text-center text-muted-foreground">Loading...</td>
+                  </tr>
+                ) : applications?.length === 0 ? (
+                  <tr>
+                    <td colSpan={5} className="p-8 text-center text-muted-foreground">No applications found</td>
+                  </tr>
+                ) : (
+                  applications?.map((app: any) => (
+                    <tr key={app.id} className="border-b border-white/5 hover:bg-white/5 transition-colors">
+                      <td className="p-4">
+                        <div className="flex items-center gap-3">
+                          <div className="w-8 h-8 bg-primary/20 rounded-full flex items-center justify-center">
+                            <User className="w-4 h-4 text-primary" />
+                          </div>
+                          <div>
+                            <div className="text-sm text-white font-bold">{app.name || app.applicant_name || 'Unknown'}</div>
+                            <div className="text-xs text-muted-foreground">{app.email || app.applicant_email || 'No email'}</div>
+                          </div>
+                        </div>
+                      </td>
+                      <td className="p-4">
+                        <span className="text-sm text-white">{app.position || app.role || 'General'}</span>
+                      </td>
+                      <td className="p-4">
+                        <span className={`inline-flex items-center gap-1 text-xs px-2 py-1 rounded uppercase font-bold ${getStatusColor(app.status)}`}>
+                          {getStatusIcon(app.status)}
+                          {app.status || 'pending'}
+                        </span>
+                      </td>
+                      <td className="p-4 text-xs text-muted-foreground">
+                        {app.submitted_at ? new Date(app.submitted_at).toLocaleDateString() : 'N/A'}
+                      </td>
+                      <td className="p-4">
+                        <div className="flex items-center gap-2">
+                          <button
+                            onClick={() => setSelectedApp(app)}
+                            className="text-muted-foreground hover:text-white p-1"
+                            data-testid={`button-view-${app.id}`}
+                          >
+                            <Eye className="w-4 h-4" />
+                          </button>
+                          {(!app.status || app.status === 'pending') && (
+                            <>
+                              <button
+                                onClick={() => updateApplicationMutation.mutate({ id: app.id, status: 'approved' })}
+                                disabled={updateApplicationMutation.isPending}
+                                className="text-green-500 hover:bg-green-500/10 p-1 rounded"
+                                data-testid={`button-approve-${app.id}`}
+                              >
+                                <CheckCircle className="w-4 h-4" />
+                              </button>
+                              <button
+                                onClick={() => updateApplicationMutation.mutate({ id: app.id, status: 'rejected' })}
+                                disabled={updateApplicationMutation.isPending}
+                                className="text-destructive hover:bg-destructive/10 p-1 rounded"
+                                data-testid={`button-reject-${app.id}`}
+                              >
+                                <XCircle className="w-4 h-4" />
+                              </button>
+                            </>
+                          )}
+                        </div>
+                      </td>
+                    </tr>
+                  ))
+                )}
+              </tbody>
+            </table>
+          </div>
+        </div>
+      </div>
+
+      {selectedApp && (
+        <div className="fixed inset-0 bg-black/80 flex items-center justify-center z-50 p-4">
+          <motion.div 
+            initial={{ opacity: 0, scale: 0.95 }}
+            animate={{ opacity: 1, scale: 1 }}
+            className="bg-card border border-white/10 w-full max-w-2xl max-h-[80vh] overflow-auto"
+          >
+            <div className="p-6 border-b border-white/10 flex justify-between items-start">
+              <div>
+                <h3 className="text-xl font-display text-white uppercase">Application Details</h3>
+                <p className="text-muted-foreground text-sm mt-1">
+                  Submitted {selectedApp.submitted_at ? new Date(selectedApp.submitted_at).toLocaleString() : 'Unknown'}
+                </p>
+              </div>
+              <button onClick={() => setSelectedApp(null)} className="text-muted-foreground hover:text-white">
+                ✕
+              </button>
+            </div>
+            
+            <div className="p-6 space-y-6">
+              <div className="grid grid-cols-2 gap-6">
+                <div>
+                  <label className="text-xs text-muted-foreground uppercase tracking-wider">Name</label>
+                  <div className="text-white font-bold">{selectedApp.name || selectedApp.applicant_name || 'Unknown'}</div>
+                </div>
+                <div>
+                  <label className="text-xs text-muted-foreground uppercase tracking-wider">Email</label>
+                  <div className="text-white">{selectedApp.email || selectedApp.applicant_email || 'No email'}</div>
+                </div>
+                <div>
+                  <label className="text-xs text-muted-foreground uppercase tracking-wider">Position</label>
+                  <div className="text-white">{selectedApp.position || selectedApp.role || 'General'}</div>
+                </div>
+                <div>
+                  <label className="text-xs text-muted-foreground uppercase tracking-wider">Status</label>
+                  <div className={`inline-flex items-center gap-1 ${getStatusColor(selectedApp.status)}`}>
+                    {getStatusIcon(selectedApp.status)}
+                    {selectedApp.status || 'pending'}
+                  </div>
+                </div>
+              </div>
+              
+              {(selectedApp.message || selectedApp.cover_letter || selectedApp.description) && (
+                <div>
+                  <label className="text-xs text-muted-foreground uppercase tracking-wider">Message</label>
+                  <div className="text-white mt-2 p-4 bg-black/20 border border-white/5">
+                    {selectedApp.message || selectedApp.cover_letter || selectedApp.description}
+                  </div>
+                </div>
+              )}
+              
+              {selectedApp.resume_url && (
+                <div>
+                  <label className="text-xs text-muted-foreground uppercase tracking-wider">Resume</label>
+                  <a 
+                    href={selectedApp.resume_url} 
+                    target="_blank" 
+                    rel="noopener noreferrer"
+                    className="text-primary hover:underline text-sm mt-1 block"
+                  >
+                    View Resume
+                  </a>
+                </div>
+              )}
+            </div>
+            
+            <div className="p-6 border-t border-white/10 flex justify-end gap-4">
+              <button onClick={() => setSelectedApp(null)} className="px-4 py-2 text-muted-foreground hover:text-white">
+                Close
+              </button>
+              {(!selectedApp.status || selectedApp.status === 'pending') && (
+                <>
+                  <button 
+                    onClick={() => updateApplicationMutation.mutate({ id: selectedApp.id, status: 'rejected' })}
+                    disabled={updateApplicationMutation.isPending}
+                    className="px-4 py-2 bg-destructive/10 text-destructive hover:bg-destructive/20 font-bold uppercase"
+                  >
+                    Reject
+                  </button>
+                  <button 
+                    onClick={() => updateApplicationMutation.mutate({ id: selectedApp.id, status: 'approved' })}
+                    disabled={updateApplicationMutation.isPending}
+                    className="px-4 py-2 bg-green-500/10 text-green-500 hover:bg-green-500/20 font-bold uppercase"
+                  >
+                    Approve
+                  </button>
+                </>
+              )}
+            </div>
+          </motion.div>
+        </div>
+      )}
+    </div>
+  );
+}
+
+function Sidebar({ user, onLogout, active }: { user: any; onLogout: () => void; active: string }) {
+  return (
+    <div className="w-64 bg-card border-r border-white/10 flex flex-col">
+      <div className="p-6 border-b border-white/10">
+        <h1 className="text-xl font-display font-bold text-white uppercase tracking-wider">AeThex</h1>
+        <p className="text-xs text-primary mt-1">Command Center</p>
+      </div>
+      <nav className="flex-1 p-4 space-y-2">
+        <NavItem icon={<BarChart3 className="w-4 h-4" />} label="Dashboard" href="/admin" active={active === 'dashboard'} />
+        <NavItem icon={<Users className="w-4 h-4" />} label="Architects" href="/admin/architects" active={active === 'architects'} />
+        <NavItem icon={<Inbox className="w-4 h-4" />} label="Applications" href="/admin/applications" active={active === 'applications'} />
+        <NavItem icon={<Award className="w-4 h-4" />} label="Achievements" href="/admin/achievements" active={active === 'achievements'} />
+        <NavItem icon={<FileCode className="w-4 h-4" />} label="Credentials" href="/admin/credentials" active={active === 'credentials'} />
+        <NavItem icon={<Activity className="w-4 h-4" />} label="Projects" href="/admin/projects" active={active === 'projects'} />
+        <NavItem icon={<Globe className="w-4 h-4" />} label="Sites" href="/admin/sites" active={active === 'sites'} />
+        <NavItem icon={<Key className="w-4 h-4" />} label="Auth Logs" href="/admin/logs" active={active === 'logs'} />
+        <NavItem icon={<Shield className="w-4 h-4" />} label="Aegis Monitor" href="/admin/aegis" active={active === 'aegis'} />
+      </nav>
+      <div className="p-4 border-t border-white/10">
+        <div className="flex items-center gap-3 mb-4">
+          <div className="w-8 h-8 bg-primary/20 rounded-full flex items-center justify-center">
+            <User className="w-4 h-4 text-primary" />
+          </div>
+          <div>
+            <div className="text-sm text-white font-bold">{user?.username}</div>
+            <div className="text-xs text-muted-foreground">{user?.isAdmin ? "Administrator" : "Member"}</div>
+          </div>
+        </div>
+        <button onClick={onLogout} className="w-full flex items-center gap-2 text-muted-foreground hover:text-white text-sm py-2 px-3 hover:bg-white/5 transition-colors">
+          <LogOut className="w-4 h-4" /> Sign Out
+        </button>
+      </div>
+    </div>
+  );
+}
+
+function NavItem({ icon, label, href, active = false }: { icon: React.ReactNode; label: string; href: string; active?: boolean }) {
+  return (
+    <Link href={href}>
+      <div className={`flex items-center gap-3 px-3 py-2 text-sm transition-colors cursor-pointer ${active ? 'bg-primary/10 text-primary border-l-2 border-primary' : 'text-muted-foreground hover:text-white hover:bg-white/5'}`}>
+        {icon}
+        {label}
+      </div>
+    </Link>
+  );
+}
diff --git a/client/src/pages/admin.tsx b/client/src/pages/admin.tsx
index f9fc33a..552067a 100644
--- a/client/src/pages/admin.tsx
+++ b/client/src/pages/admin.tsx
@@ -5,7 +5,7 @@ import { useQuery } from "@tanstack/react-query";
 import { useAuth } from "@/lib/auth";
 import { 
   Users, FileCode, Shield, Activity, LogOut, 
-  Home, BarChart3, Settings, ChevronRight, User, Globe, Award, Key
+  Home, BarChart3, Settings, ChevronRight, User, Globe, Award, Key, Inbox
 } from "lucide-react";
 import gridBg from '@assets/generated_images/dark_subtle_digital_grid_texture.png';
 
@@ -77,6 +77,7 @@ export default function Admin() {
         <nav className="flex-1 p-4 space-y-2">
           <NavItem icon={<BarChart3 className="w-4 h-4" />} label="Dashboard" href="/admin" active />
           <NavItem icon={<Users className="w-4 h-4" />} label="Architects" href="/admin/architects" />
+          <NavItem icon={<Inbox className="w-4 h-4" />} label="Applications" href="/admin/applications" />
           <NavItem icon={<Award className="w-4 h-4" />} label="Achievements" href="/admin/achievements" />
           <NavItem icon={<FileCode className="w-4 h-4" />} label="Credentials" href="/admin/credentials" />
           <NavItem icon={<Activity className="w-4 h-4" />} label="Projects" href="/admin/projects" />
diff --git a/client/src/pages/home.tsx b/client/src/pages/home.tsx
index 8c8b5b3..948f178 100644
--- a/client/src/pages/home.tsx
+++ b/client/src/pages/home.tsx
@@ -1,7 +1,11 @@
 import { motion } from "framer-motion";
 import { Link } from "wouter";
 import { useQuery } from "@tanstack/react-query";
-import { Shield, FileCode, Terminal as TerminalIcon, ChevronRight, BarChart3, Network, ExternalLink, Lock } from "lucide-react";
+import { 
+  Shield, FileCode, Terminal as TerminalIcon, ChevronRight, BarChart3, Network, 
+  ExternalLink, Lock, Zap, Users, Globe, CheckCircle, ArrowRight, Star,
+  Award, Cpu, Building
+} from "lucide-react";
 import gridBg from '@assets/generated_images/dark_subtle_digital_grid_texture.png';
 
 export default function Home() {
@@ -15,7 +19,6 @@ export default function Home() {
 
   return (
     <div className="min-h-screen bg-background text-foreground font-mono selection:bg-primary selection:text-background relative overflow-hidden">
-      {/* Background Texture */}
       <div 
         className="absolute inset-0 opacity-20 pointer-events-none z-0"
         style={{ backgroundImage: `url(${gridBg})`, backgroundSize: 'cover' }}
@@ -31,7 +34,7 @@ export default function Home() {
             href="https://aethex.foundation" 
             target="_blank" 
             rel="noopener noreferrer"
-            className="text-sm text-muted-foreground hover:text-white transition-colors flex items-center gap-1"
+            className="text-sm text-muted-foreground hover:text-white transition-colors flex items-center gap-1 hidden md:flex"
           >
             Foundation <ExternalLink className="w-3 h-3" />
           </a>
@@ -39,168 +42,338 @@ export default function Home() {
             href="https://aethex.studio" 
             target="_blank" 
             rel="noopener noreferrer"
-            className="text-sm text-muted-foreground hover:text-white transition-colors flex items-center gap-1"
+            className="text-sm text-muted-foreground hover:text-white transition-colors flex items-center gap-1 hidden md:flex"
           >
             Studio <ExternalLink className="w-3 h-3" />
           </a>
+          <Link href="/pitch">
+            <button className="text-sm text-muted-foreground hover:text-primary transition-colors" data-testid="button-investors">
+              Investors
+            </button>
+          </Link>
           <Link href="/login">
-            <button className="text-sm bg-white/5 border border-white/10 px-4 py-2 text-white hover:bg-white/10 transition-colors flex items-center gap-2" data-testid="button-admin-login">
+            <button className="text-sm bg-primary/10 border border-primary/30 px-4 py-2 text-primary hover:bg-primary/20 transition-colors flex items-center gap-2" data-testid="button-admin-login">
               <Lock className="w-3 h-3" /> Admin
             </button>
           </Link>
         </div>
       </nav>
       
-      <div className="relative z-10 container mx-auto px-4 py-20 flex flex-col items-center justify-center">
+      <div className="relative z-10">
         
-        {/* Header */}
-        <motion.div 
-          initial={{ opacity: 0, y: -20 }}
-          animate={{ opacity: 1, y: 0 }}
-          className="text-center mb-16 space-y-4"
-        >
-          <div className="inline-block border border-primary/30 px-3 py-1 text-xs text-primary tracking-widest uppercase mb-4 bg-primary/5">
-            The Operating System for the Metaverse
-          </div>
-          <h1 className="text-6xl md:text-8xl font-display font-bold tracking-tighter uppercase text-white mb-2 text-glow">
-            AeThex
-          </h1>
-          <p className="text-muted-foreground text-lg md:text-xl max-w-2xl mx-auto font-tech">
-            We train Architects. We build the Shield. We define the Law.
-          </p>
-        </motion.div>
-
-        {/* Live Metrics */}
-        {metrics && (
+        {/* Hero Section */}
+        <div className="container mx-auto px-4 py-20 flex flex-col items-center justify-center">
           <motion.div 
-            initial={{ opacity: 0 }}
-            animate={{ opacity: 1 }}
-            transition={{ delay: 0.2 }}
-            className="grid grid-cols-2 md:grid-cols-4 gap-6 mb-16 w-full max-w-4xl"
+            initial={{ opacity: 0, y: -20 }}
+            animate={{ opacity: 1, y: 0 }}
+            className="text-center mb-16 space-y-4"
           >
-            <div className="text-center p-4 border border-white/5 bg-card/30">
-              <div className="text-3xl font-display font-bold text-primary">{metrics.totalProfiles}</div>
-              <div className="text-xs text-muted-foreground uppercase tracking-wider">Architects</div>
+            <div className="inline-block border border-primary/30 px-3 py-1 text-xs text-primary tracking-widest uppercase mb-4 bg-primary/5">
+              The Operating System for the Metaverse
             </div>
-            <div className="text-center p-4 border border-white/5 bg-card/30">
-              <div className="text-3xl font-display font-bold text-secondary">{metrics.totalProjects}</div>
-              <div className="text-xs text-muted-foreground uppercase tracking-wider">Projects</div>
-            </div>
-            <div className="text-center p-4 border border-white/5 bg-card/30">
-              <div className="text-3xl font-display font-bold text-green-500">{metrics.onlineUsers}</div>
-              <div className="text-xs text-muted-foreground uppercase tracking-wider">Online Now</div>
-            </div>
-            <div className="text-center p-4 border border-white/5 bg-card/30">
-              <div className="text-3xl font-display font-bold text-white">{metrics.totalXP?.toLocaleString()}</div>
-              <div className="text-xs text-muted-foreground uppercase tracking-wider">Total XP</div>
+            <h1 className="text-6xl md:text-8xl font-display font-bold tracking-tighter uppercase text-white mb-2 text-glow">
+              AeThex
+            </h1>
+            <p className="text-muted-foreground text-lg md:text-xl max-w-2xl mx-auto font-tech">
+              We train Architects. We build the Shield. We define the Law.
+            </p>
+            
+            <div className="flex flex-col sm:flex-row gap-4 justify-center pt-8">
+              <Link href="/pitch">
+                <button className="bg-primary text-background px-8 py-4 font-bold uppercase tracking-wider hover:bg-primary/90 transition-colors flex items-center gap-2" data-testid="button-learn-more">
+                  Learn More <ArrowRight className="w-4 h-4" />
+                </button>
+              </Link>
+              <a href="https://aethex.foundation" target="_blank" rel="noopener noreferrer">
+                <button className="border border-white/20 text-white px-8 py-4 font-bold uppercase tracking-wider hover:bg-white/5 transition-colors flex items-center gap-2">
+                  Join Foundation <ExternalLink className="w-4 h-4" />
+                </button>
+              </a>
             </div>
           </motion.div>
-        )}
+
+          {/* Live Metrics */}
+          {metrics && (
+            <motion.div 
+              initial={{ opacity: 0 }}
+              animate={{ opacity: 1 }}
+              transition={{ delay: 0.2 }}
+              className="grid grid-cols-2 md:grid-cols-4 gap-6 mb-16 w-full max-w-4xl"
+            >
+              <div className="text-center p-4 border border-white/5 bg-card/30 hover:border-primary/30 transition-colors">
+                <div className="text-3xl font-display font-bold text-primary">{metrics.totalProfiles}</div>
+                <div className="text-xs text-muted-foreground uppercase tracking-wider">Architects</div>
+              </div>
+              <div className="text-center p-4 border border-white/5 bg-card/30 hover:border-secondary/30 transition-colors">
+                <div className="text-3xl font-display font-bold text-secondary">{metrics.totalProjects}</div>
+                <div className="text-xs text-muted-foreground uppercase tracking-wider">Projects</div>
+              </div>
+              <div className="text-center p-4 border border-white/5 bg-card/30 hover:border-green-500/30 transition-colors">
+                <div className="text-3xl font-display font-bold text-green-500">{metrics.onlineUsers}</div>
+                <div className="text-xs text-muted-foreground uppercase tracking-wider">Online Now</div>
+              </div>
+              <div className="text-center p-4 border border-white/5 bg-card/30 hover:border-white/30 transition-colors">
+                <div className="text-3xl font-display font-bold text-white">{metrics.totalXP?.toLocaleString()}</div>
+                <div className="text-xs text-muted-foreground uppercase tracking-wider">Total XP</div>
+              </div>
+            </motion.div>
+          )}
+        </div>
 
         {/* The Trinity Cards */}
-        <div className="grid md:grid-cols-3 gap-6 w-full max-w-6xl">
-          
-          {/* Axiom -> Pitch */}
-          <Link href="/pitch">
-            <motion.div 
-              initial={{ opacity: 0, y: 20 }}
-              animate={{ opacity: 1, y: 0 }}
-              transition={{ delay: 0.1 }}
-              className="group relative border border-white/10 bg-card/50 p-8 hover:border-primary/50 transition-colors duration-300 cursor-pointer overflow-hidden h-full"
-            >
-              <div className="absolute top-0 left-0 w-full h-1 bg-gradient-to-r from-transparent via-primary/50 to-transparent opacity-0 group-hover:opacity-100 transition-opacity" />
-              <div className="flex justify-between items-start mb-6">
-                <Shield className="w-12 h-12 text-muted-foreground group-hover:text-primary transition-colors" />
-                <BarChart3 className="w-6 h-6 text-muted-foreground/30 group-hover:text-primary/50 transition-colors" />
-              </div>
-              <h2 className="text-2xl font-display text-white mb-4">Axiom</h2>
-              <p className="text-muted-foreground text-sm leading-relaxed mb-6">
-                <span className="text-primary font-bold">The Law.</span> Our dual-entity protocol creates a self-sustaining ecosystem. The Foundation trains; the Corporation secures.
-              </p>
-              <div className="flex items-center text-primary hover:text-primary/80 text-sm font-bold uppercase tracking-wider mt-auto">
-                View Investor Pitch <ChevronRight className="w-4 h-4 ml-1" />
-              </div>
-            </motion.div>
-          </Link>
+        <div className="container mx-auto px-4 pb-20">
+          <div className="grid md:grid-cols-3 gap-6 w-full max-w-6xl mx-auto">
+            
+            <Link href="/pitch">
+              <motion.div 
+                initial={{ opacity: 0, y: 20 }}
+                animate={{ opacity: 1, y: 0 }}
+                transition={{ delay: 0.1 }}
+                className="group relative border border-white/10 bg-card/50 p-8 hover:border-primary/50 transition-colors duration-300 cursor-pointer overflow-hidden h-full"
+              >
+                <div className="absolute top-0 left-0 w-full h-1 bg-gradient-to-r from-transparent via-primary/50 to-transparent opacity-0 group-hover:opacity-100 transition-opacity" />
+                <div className="flex justify-between items-start mb-6">
+                  <Shield className="w-12 h-12 text-muted-foreground group-hover:text-primary transition-colors" />
+                  <BarChart3 className="w-6 h-6 text-muted-foreground/30 group-hover:text-primary/50 transition-colors" />
+                </div>
+                <h2 className="text-2xl font-display text-white mb-4">Axiom</h2>
+                <p className="text-muted-foreground text-sm leading-relaxed mb-6">
+                  <span className="text-primary font-bold">The Law.</span> Our dual-entity protocol creates a self-sustaining ecosystem. The Foundation trains; the Corporation secures.
+                </p>
+                <div className="flex items-center text-primary hover:text-primary/80 text-sm font-bold uppercase tracking-wider mt-auto">
+                  View Investor Pitch <ChevronRight className="w-4 h-4 ml-1" />
+                </div>
+              </motion.div>
+            </Link>
 
-          {/* Codex -> Foundation */}
-          <a href="https://aethex.foundation" target="_blank" rel="noopener noreferrer" className="block">
-            <motion.div 
-              initial={{ opacity: 0, y: 20 }}
-              animate={{ opacity: 1, y: 0 }}
-              transition={{ delay: 0.2 }}
-              className="group relative border border-white/10 bg-card/50 p-8 hover:border-secondary/50 transition-colors duration-300 cursor-pointer overflow-hidden h-full"
-            >
-              <div className="absolute top-0 left-0 w-full h-1 bg-gradient-to-r from-transparent via-secondary/50 to-transparent opacity-0 group-hover:opacity-100 transition-opacity" />
-              <div className="flex justify-between items-start mb-6">
-                <FileCode className="w-12 h-12 text-muted-foreground group-hover:text-secondary transition-colors" />
-                <Network className="w-6 h-6 text-muted-foreground/30 group-hover:text-secondary/50 transition-colors" />
-              </div>
-              <h2 className="text-2xl font-display text-white mb-4">Codex</h2>
-              <p className="text-muted-foreground text-sm leading-relaxed mb-6">
-                <span className="text-secondary font-bold">The Standard.</span> Elite training through gamified curriculum. Certifications that employers trust. The Passport to the Metaverse.
-              </p>
-              <div className="flex items-center text-secondary hover:text-secondary/80 text-sm font-bold uppercase tracking-wider mt-auto">
-                Enter Foundation <ExternalLink className="w-4 h-4 ml-1" />
-              </div>
-            </motion.div>
-          </a>
+            <a href="https://aethex.foundation" target="_blank" rel="noopener noreferrer" className="block">
+              <motion.div 
+                initial={{ opacity: 0, y: 20 }}
+                animate={{ opacity: 1, y: 0 }}
+                transition={{ delay: 0.2 }}
+                className="group relative border border-white/10 bg-card/50 p-8 hover:border-secondary/50 transition-colors duration-300 cursor-pointer overflow-hidden h-full"
+              >
+                <div className="absolute top-0 left-0 w-full h-1 bg-gradient-to-r from-transparent via-secondary/50 to-transparent opacity-0 group-hover:opacity-100 transition-opacity" />
+                <div className="flex justify-between items-start mb-6">
+                  <FileCode className="w-12 h-12 text-muted-foreground group-hover:text-secondary transition-colors" />
+                  <Network className="w-6 h-6 text-muted-foreground/30 group-hover:text-secondary/50 transition-colors" />
+                </div>
+                <h2 className="text-2xl font-display text-white mb-4">Codex</h2>
+                <p className="text-muted-foreground text-sm leading-relaxed mb-6">
+                  <span className="text-secondary font-bold">The Standard.</span> Elite training through gamified curriculum. Certifications that employers trust. The Passport to the Metaverse.
+                </p>
+                <div className="flex items-center text-secondary hover:text-secondary/80 text-sm font-bold uppercase tracking-wider mt-auto">
+                  Enter Foundation <ExternalLink className="w-4 h-4 ml-1" />
+                </div>
+              </motion.div>
+            </a>
 
-          {/* Aegis -> Studio */}
-          <a href="https://aethex.studio" target="_blank" rel="noopener noreferrer" className="block">
-            <motion.div 
-              initial={{ opacity: 0, y: 20 }}
-              animate={{ opacity: 1, y: 0 }}
-              transition={{ delay: 0.3 }}
-              className="group relative border border-white/10 bg-card/50 p-8 hover:border-destructive/50 transition-colors duration-300 cursor-pointer overflow-hidden h-full"
-            >
-              <div className="absolute top-0 left-0 w-full h-1 bg-gradient-to-r from-transparent via-destructive/50 to-transparent opacity-0 group-hover:opacity-100 transition-opacity" />
-              <TerminalIcon className="w-12 h-12 text-muted-foreground group-hover:text-destructive mb-6 transition-colors" />
-              <h2 className="text-2xl font-display text-white mb-4">Aegis</h2>
-              <p className="text-muted-foreground text-sm leading-relaxed mb-6">
-                <span className="text-destructive font-bold">The Shield.</span> Real-time security for the build environment. PII scrubbing. Threat intervention. Protection for every line of code.
-              </p>
-              <div className="flex items-center text-destructive hover:text-destructive/80 text-sm font-bold uppercase tracking-wider mt-auto">
-                Launch Studio <ExternalLink className="w-4 h-4 ml-1" />
-              </div>
-            </motion.div>
-          </a>
+            <a href="https://aethex.studio" target="_blank" rel="noopener noreferrer" className="block">
+              <motion.div 
+                initial={{ opacity: 0, y: 20 }}
+                animate={{ opacity: 1, y: 0 }}
+                transition={{ delay: 0.3 }}
+                className="group relative border border-white/10 bg-card/50 p-8 hover:border-destructive/50 transition-colors duration-300 cursor-pointer overflow-hidden h-full"
+              >
+                <div className="absolute top-0 left-0 w-full h-1 bg-gradient-to-r from-transparent via-destructive/50 to-transparent opacity-0 group-hover:opacity-100 transition-opacity" />
+                <TerminalIcon className="w-12 h-12 text-muted-foreground group-hover:text-destructive mb-6 transition-colors" />
+                <h2 className="text-2xl font-display text-white mb-4">Aegis</h2>
+                <p className="text-muted-foreground text-sm leading-relaxed mb-6">
+                  <span className="text-destructive font-bold">The Shield.</span> Real-time security for the build environment. PII scrubbing. Threat intervention. Protection for every line of code.
+                </p>
+                <div className="flex items-center text-destructive hover:text-destructive/80 text-sm font-bold uppercase tracking-wider mt-auto">
+                  Launch Studio <ExternalLink className="w-4 h-4 ml-1" />
+                </div>
+              </motion.div>
+            </a>
 
+          </div>
+        </div>
+
+        {/* Features Section */}
+        <div className="border-y border-white/5 bg-card/20 py-20">
+          <div className="container mx-auto px-4">
+            <motion.div 
+              initial={{ opacity: 0 }}
+              whileInView={{ opacity: 1 }}
+              viewport={{ once: true }}
+              className="text-center mb-16"
+            >
+              <h2 className="text-sm font-bold text-muted-foreground uppercase tracking-widest mb-4">Why AeThex</h2>
+              <p className="text-3xl font-display text-white uppercase">Built for the Future</p>
+            </motion.div>
+            
+            <div className="grid md:grid-cols-2 lg:grid-cols-4 gap-8 max-w-6xl mx-auto">
+              <motion.div 
+                initial={{ opacity: 0, y: 20 }}
+                whileInView={{ opacity: 1, y: 0 }}
+                viewport={{ once: true }}
+                className="text-center"
+              >
+                <div className="w-16 h-16 bg-primary/10 rounded-full flex items-center justify-center mx-auto mb-4">
+                  <Zap className="w-8 h-8 text-primary" />
+                </div>
+                <h3 className="font-display text-white uppercase mb-2">Real-Time Protection</h3>
+                <p className="text-xs text-muted-foreground">Aegis monitors every interaction, scrubbing PII and blocking threats before they reach users.</p>
+              </motion.div>
+              
+              <motion.div 
+                initial={{ opacity: 0, y: 20 }}
+                whileInView={{ opacity: 1, y: 0 }}
+                viewport={{ once: true }}
+                transition={{ delay: 0.1 }}
+                className="text-center"
+              >
+                <div className="w-16 h-16 bg-secondary/10 rounded-full flex items-center justify-center mx-auto mb-4">
+                  <Award className="w-8 h-8 text-secondary" />
+                </div>
+                <h3 className="font-display text-white uppercase mb-2">Verified Credentials</h3>
+                <p className="text-xs text-muted-foreground">Codex certifications are blockchain-verifiable and recognized across the industry.</p>
+              </motion.div>
+              
+              <motion.div 
+                initial={{ opacity: 0, y: 20 }}
+                whileInView={{ opacity: 1, y: 0 }}
+                viewport={{ once: true }}
+                transition={{ delay: 0.2 }}
+                className="text-center"
+              >
+                <div className="w-16 h-16 bg-blue-500/10 rounded-full flex items-center justify-center mx-auto mb-4">
+                  <Globe className="w-8 h-8 text-blue-500" />
+                </div>
+                <h3 className="font-display text-white uppercase mb-2">Platform Agnostic</h3>
+                <p className="text-xs text-muted-foreground">Works with any engine, any platform, any virtual world. One standard for all.</p>
+              </motion.div>
+              
+              <motion.div 
+                initial={{ opacity: 0, y: 20 }}
+                whileInView={{ opacity: 1, y: 0 }}
+                viewport={{ once: true }}
+                transition={{ delay: 0.3 }}
+                className="text-center"
+              >
+                <div className="w-16 h-16 bg-green-500/10 rounded-full flex items-center justify-center mx-auto mb-4">
+                  <Users className="w-8 h-8 text-green-500" />
+                </div>
+                <h3 className="font-display text-white uppercase mb-2">Elite Community</h3>
+                <p className="text-xs text-muted-foreground">Join a network of certified Metaverse Architects building the future together.</p>
+              </motion.div>
+            </div>
+          </div>
+        </div>
+
+        {/* Dual Entity Highlight */}
+        <div className="py-20">
+          <div className="container mx-auto px-4">
+            <div className="grid md:grid-cols-2 gap-12 max-w-5xl mx-auto items-center">
+              <motion.div 
+                initial={{ opacity: 0, x: -20 }}
+                whileInView={{ opacity: 1, x: 0 }}
+                viewport={{ once: true }}
+              >
+                <div className="text-xs text-secondary uppercase tracking-widest font-bold mb-2">Non-Profit Arm</div>
+                <h2 className="text-3xl font-display text-white uppercase mb-4">The Foundation</h2>
+                <p className="text-muted-foreground mb-6">
+                  We believe the Metaverse should be built by trained professionals. The Foundation provides free education, 
+                  gamified learning paths, and verifiable certifications to anyone with the drive to become an Architect.
+                </p>
+                <ul className="space-y-3">
+                  <li className="flex items-center gap-3 text-sm text-muted-foreground">
+                    <CheckCircle className="w-4 h-4 text-secondary" /> Free curriculum access
+                  </li>
+                  <li className="flex items-center gap-3 text-sm text-muted-foreground">
+                    <CheckCircle className="w-4 h-4 text-secondary" /> XP-based progression
+                  </li>
+                  <li className="flex items-center gap-3 text-sm text-muted-foreground">
+                    <CheckCircle className="w-4 h-4 text-secondary" /> Industry-recognized certifications
+                  </li>
+                </ul>
+              </motion.div>
+              
+              <motion.div 
+                initial={{ opacity: 0, x: 20 }}
+                whileInView={{ opacity: 1, x: 0 }}
+                viewport={{ once: true }}
+              >
+                <div className="text-xs text-primary uppercase tracking-widest font-bold mb-2">For-Profit Arm</div>
+                <h2 className="text-3xl font-display text-white uppercase mb-4">The Corporation</h2>
+                <p className="text-muted-foreground mb-6">
+                  Security shouldn't be an afterthought. The Corporation builds Aegis - the enterprise security layer 
+                  that protects builders and users alike. Real-time threat detection, PII scrubbing, and intervention systems.
+                </p>
+                <ul className="space-y-3">
+                  <li className="flex items-center gap-3 text-sm text-muted-foreground">
+                    <CheckCircle className="w-4 h-4 text-primary" /> Enterprise licensing
+                  </li>
+                  <li className="flex items-center gap-3 text-sm text-muted-foreground">
+                    <CheckCircle className="w-4 h-4 text-primary" /> 24/7 threat monitoring
+                  </li>
+                  <li className="flex items-center gap-3 text-sm text-muted-foreground">
+                    <CheckCircle className="w-4 h-4 text-primary" /> API integration
+                  </li>
+                </ul>
+              </motion.div>
+            </div>
+          </div>
         </div>
 
         {/* Demo Links */}
-        <motion.div 
-          initial={{ opacity: 0 }}
-          animate={{ opacity: 1 }}
-          transition={{ delay: 0.5 }}
-          className="mt-16 flex flex-wrap justify-center gap-4"
-        >
-          <Link href="/passport">
-            <button className="text-sm border border-white/10 px-6 py-3 text-muted-foreground hover:text-white hover:border-white/30 transition-colors">
-              View Sample Passport
-            </button>
-          </Link>
-          <Link href="/terminal">
-            <button className="text-sm border border-white/10 px-6 py-3 text-muted-foreground hover:text-white hover:border-white/30 transition-colors">
-              Try Terminal Demo
-            </button>
-          </Link>
-          <Link href="/curriculum">
-            <button className="text-sm border border-white/10 px-6 py-3 text-muted-foreground hover:text-white hover:border-white/30 transition-colors">
-              Explore Tech Tree
-            </button>
-          </Link>
-        </motion.div>
+        <div className="border-t border-white/5 py-20">
+          <div className="container mx-auto px-4">
+            <motion.div 
+              initial={{ opacity: 0 }}
+              whileInView={{ opacity: 1 }}
+              viewport={{ once: true }}
+              className="text-center mb-12"
+            >
+              <h2 className="text-sm font-bold text-muted-foreground uppercase tracking-widest mb-4">Explore</h2>
+              <p className="text-2xl font-display text-white uppercase">See It In Action</p>
+            </motion.div>
+            
+            <div className="flex flex-wrap justify-center gap-4">
+              <Link href="/passport">
+                <button className="text-sm border border-white/10 px-6 py-3 text-muted-foreground hover:text-white hover:border-white/30 transition-colors" data-testid="button-sample-passport">
+                  View Sample Passport
+                </button>
+              </Link>
+              <Link href="/terminal">
+                <button className="text-sm border border-white/10 px-6 py-3 text-muted-foreground hover:text-white hover:border-white/30 transition-colors" data-testid="button-terminal-demo">
+                  Try Terminal Demo
+                </button>
+              </Link>
+              <Link href="/curriculum">
+                <button className="text-sm border border-white/10 px-6 py-3 text-muted-foreground hover:text-white hover:border-white/30 transition-colors" data-testid="button-tech-tree">
+                  Explore Tech Tree
+                </button>
+              </Link>
+              <Link href="/pitch">
+                <button className="text-sm border border-primary/30 px-6 py-3 text-primary hover:bg-primary/10 transition-colors" data-testid="button-investor-deck">
+                  Investor Deck
+                </button>
+              </Link>
+            </div>
+          </div>
+        </div>
 
         {/* Footer */}
-        <motion.div 
-          initial={{ opacity: 0 }}
-          animate={{ opacity: 1 }}
-          transition={{ delay: 0.6 }}
-          className="mt-24 text-center text-xs text-muted-foreground/50 uppercase tracking-widest"
-        >
-          AeThex Foundry © 2025 // Building the Future of the Metaverse
-        </motion.div>
+        <div className="border-t border-white/5 py-12">
+          <div className="container mx-auto px-4">
+            <div className="flex flex-col md:flex-row justify-between items-center gap-6">
+              <div className="text-xl font-display font-bold text-white uppercase tracking-widest">
+                AeThex
+              </div>
+              <div className="flex items-center gap-8 text-xs text-muted-foreground">
+                <a href="https://aethex.foundation" target="_blank" rel="noopener noreferrer" className="hover:text-white transition-colors">Foundation</a>
+                <a href="https://aethex.studio" target="_blank" rel="noopener noreferrer" className="hover:text-white transition-colors">Studio</a>
+                <Link href="/pitch"><span className="hover:text-white transition-colors cursor-pointer">Investors</span></Link>
+                <Link href="/login"><span className="hover:text-white transition-colors cursor-pointer">Admin</span></Link>
+              </div>
+              <div className="text-xs text-muted-foreground/50 uppercase tracking-widest">
+                © 2025 AeThex Foundry
+              </div>
+            </div>
+          </div>
+        </div>
 
       </div>
     </div>
diff --git a/client/src/pages/pitch.tsx b/client/src/pages/pitch.tsx
index bb69aa7..995c6f9 100644
--- a/client/src/pages/pitch.tsx
+++ b/client/src/pages/pitch.tsx
@@ -1,9 +1,28 @@
 import { motion } from "framer-motion";
 import { Link } from "wouter";
 import { useQuery } from "@tanstack/react-query";
-import { ArrowLeft, Shield, FileCode, Terminal, ChevronRight, Building, GraduationCap, Users, Activity } from "lucide-react";
+import { ArrowLeft, Shield, FileCode, Terminal, ChevronRight, Building, GraduationCap, Users, Activity, TrendingUp, Target, Zap, Globe, DollarSign, CheckCircle } from "lucide-react";
+import { AreaChart, Area, BarChart, Bar, XAxis, YAxis, CartesianGrid, Tooltip, ResponsiveContainer, PieChart, Pie, Cell } from "recharts";
 import gridBg from '@assets/generated_images/dark_subtle_digital_grid_texture.png';
 
+const growthData = [
+  { month: 'Jan', architects: 12, projects: 3 },
+  { month: 'Feb', architects: 28, projects: 7 },
+  { month: 'Mar', architects: 45, projects: 12 },
+  { month: 'Apr', architects: 67, projects: 18 },
+  { month: 'May', architects: 89, projects: 24 },
+  { month: 'Jun', architects: 120, projects: 31 },
+];
+
+const revenueStreams = [
+  { name: 'Aegis Licenses', value: 45 },
+  { name: 'Enterprise Support', value: 25 },
+  { name: 'Certification Fees', value: 20 },
+  { name: 'API Access', value: 10 },
+];
+
+const COLORS = ['#eab308', '#22c55e', '#3b82f6', '#8b5cf6'];
+
 export default function Pitch() {
   const { data: metrics } = useQuery({
     queryKey: ["metrics"],
@@ -20,10 +39,10 @@ export default function Pitch() {
         style={{ backgroundImage: `url(${gridBg})`, backgroundSize: 'cover' }}
       />
 
-      <div className="relative z-10 container mx-auto px-4 py-12 max-w-5xl">
+      <div className="relative z-10 container mx-auto px-4 py-12 max-w-6xl">
         
         <Link href="/">
-          <button className="text-muted-foreground hover:text-primary transition-colors flex items-center gap-2 uppercase text-xs tracking-widest mb-12">
+          <button className="text-muted-foreground hover:text-primary transition-colors flex items-center gap-2 uppercase text-xs tracking-widest mb-12" data-testid="button-return-home">
             <ArrowLeft className="w-4 h-4" /> Return Home
           </button>
         </Link>
@@ -52,7 +71,6 @@ export default function Pitch() {
           transition={{ delay: 0.2 }}
           className="grid md:grid-cols-2 gap-8 mb-20"
         >
-          {/* Foundation */}
           <div className="bg-card/50 border border-secondary/30 p-8 relative overflow-hidden group hover:border-secondary/50 transition-colors">
             <div className="absolute top-0 left-0 w-full h-1 bg-secondary/50" />
             <div className="flex items-center gap-4 mb-6">
@@ -80,7 +98,6 @@ export default function Pitch() {
             </div>
           </div>
 
-          {/* Corporation */}
           <div className="bg-card/50 border border-primary/30 p-8 relative overflow-hidden group hover:border-primary/50 transition-colors">
             <div className="absolute top-0 left-0 w-full h-1 bg-primary/50" />
             <div className="flex items-center gap-4 mb-6">
@@ -139,11 +156,117 @@ export default function Pitch() {
           </div>
         </motion.div>
 
-        {/* The Pitch Quote */}
+        {/* Growth Charts */}
+        <motion.div 
+          initial={{ opacity: 0 }}
+          animate={{ opacity: 1 }}
+          transition={{ delay: 0.35 }}
+          className="mb-20"
+        >
+          <h2 className="text-center text-sm font-bold text-muted-foreground uppercase tracking-widest mb-8">
+            <TrendingUp className="w-4 h-4 inline mr-2" />
+            Growth Trajectory
+          </h2>
+          
+          <div className="grid md:grid-cols-2 gap-8">
+            <div className="bg-card/50 border border-white/10 p-6">
+              <h3 className="text-xs text-muted-foreground uppercase tracking-widest mb-4">Architect Enrollment</h3>
+              <ResponsiveContainer width="100%" height={200}>
+                <AreaChart data={growthData}>
+                  <defs>
+                    <linearGradient id="colorArchitects" x1="0" y1="0" x2="0" y2="1">
+                      <stop offset="5%" stopColor="#22c55e" stopOpacity={0.3}/>
+                      <stop offset="95%" stopColor="#22c55e" stopOpacity={0}/>
+                    </linearGradient>
+                  </defs>
+                  <CartesianGrid strokeDasharray="3 3" stroke="#333" />
+                  <XAxis dataKey="month" stroke="#666" fontSize={10} />
+                  <YAxis stroke="#666" fontSize={10} />
+                  <Tooltip 
+                    contentStyle={{ background: '#1a1a1a', border: '1px solid #333' }}
+                    labelStyle={{ color: '#fff' }}
+                  />
+                  <Area type="monotone" dataKey="architects" stroke="#22c55e" fillOpacity={1} fill="url(#colorArchitects)" />
+                </AreaChart>
+              </ResponsiveContainer>
+            </div>
+            
+            <div className="bg-card/50 border border-white/10 p-6">
+              <h3 className="text-xs text-muted-foreground uppercase tracking-widest mb-4">Protected Projects</h3>
+              <ResponsiveContainer width="100%" height={200}>
+                <BarChart data={growthData}>
+                  <CartesianGrid strokeDasharray="3 3" stroke="#333" />
+                  <XAxis dataKey="month" stroke="#666" fontSize={10} />
+                  <YAxis stroke="#666" fontSize={10} />
+                  <Tooltip 
+                    contentStyle={{ background: '#1a1a1a', border: '1px solid #333' }}
+                    labelStyle={{ color: '#fff' }}
+                  />
+                  <Bar dataKey="projects" fill="#eab308" />
+                </BarChart>
+              </ResponsiveContainer>
+            </div>
+          </div>
+        </motion.div>
+
+        {/* Revenue Model */}
         <motion.div 
           initial={{ opacity: 0 }}
           animate={{ opacity: 1 }}
           transition={{ delay: 0.4 }}
+          className="mb-20"
+        >
+          <h2 className="text-center text-sm font-bold text-muted-foreground uppercase tracking-widest mb-8">
+            <DollarSign className="w-4 h-4 inline mr-2" />
+            Revenue Model
+          </h2>
+          
+          <div className="grid md:grid-cols-2 gap-8 items-center">
+            <div className="bg-card/50 border border-white/10 p-6">
+              <ResponsiveContainer width="100%" height={250}>
+                <PieChart>
+                  <Pie
+                    data={revenueStreams}
+                    cx="50%"
+                    cy="50%"
+                    innerRadius={60}
+                    outerRadius={100}
+                    fill="#8884d8"
+                    paddingAngle={5}
+                    dataKey="value"
+                    label={({ name, percent }) => `${name} ${(percent * 100).toFixed(0)}%`}
+                    labelLine={false}
+                  >
+                    {revenueStreams.map((entry, index) => (
+                      <Cell key={`cell-${index}`} fill={COLORS[index % COLORS.length]} />
+                    ))}
+                  </Pie>
+                  <Tooltip 
+                    contentStyle={{ background: '#1a1a1a', border: '1px solid #333' }}
+                  />
+                </PieChart>
+              </ResponsiveContainer>
+            </div>
+            
+            <div className="space-y-4">
+              {revenueStreams.map((stream, i) => (
+                <div key={stream.name} className="flex items-center gap-4 p-4 bg-card/30 border border-white/5">
+                  <div className="w-3 h-3 rounded-full" style={{ background: COLORS[i] }} />
+                  <div className="flex-1">
+                    <div className="text-white font-bold">{stream.name}</div>
+                    <div className="text-xs text-muted-foreground">{stream.value}% of projected revenue</div>
+                  </div>
+                </div>
+              ))}
+            </div>
+          </div>
+        </motion.div>
+
+        {/* The Pitch Quote */}
+        <motion.div 
+          initial={{ opacity: 0 }}
+          animate={{ opacity: 1 }}
+          transition={{ delay: 0.45 }}
           className="bg-primary/5 border border-primary/30 p-10 mb-20"
         >
           <blockquote className="text-xl md:text-2xl text-white leading-relaxed font-display italic">
@@ -152,12 +275,48 @@ export default function Pitch() {
           </blockquote>
         </motion.div>
 
+        {/* Why Invest */}
+        <motion.div 
+          initial={{ opacity: 0 }}
+          animate={{ opacity: 1 }}
+          transition={{ delay: 0.5 }}
+          className="mb-20"
+        >
+          <h2 className="text-center text-sm font-bold text-muted-foreground uppercase tracking-widest mb-8">
+            <Target className="w-4 h-4 inline mr-2" />
+            Why Invest
+          </h2>
+          
+          <div className="grid md:grid-cols-2 lg:grid-cols-4 gap-6">
+            <div className="p-6 border border-white/10 bg-card/30">
+              <Zap className="w-8 h-8 text-primary mb-4" />
+              <h3 className="font-display text-white uppercase mb-2 text-sm">First Mover</h3>
+              <p className="text-xs text-muted-foreground">Building the security standard before the Metaverse matures.</p>
+            </div>
+            <div className="p-6 border border-white/10 bg-card/30">
+              <Users className="w-8 h-8 text-secondary mb-4" />
+              <h3 className="font-display text-white uppercase mb-2 text-sm">Talent Pipeline</h3>
+              <p className="text-xs text-muted-foreground">Self-sustaining workforce trained on proprietary methods.</p>
+            </div>
+            <div className="p-6 border border-white/10 bg-card/30">
+              <Globe className="w-8 h-8 text-blue-500 mb-4" />
+              <h3 className="font-display text-white uppercase mb-2 text-sm">Platform Agnostic</h3>
+              <p className="text-xs text-muted-foreground">Works across any metaverse, game engine, or virtual world.</p>
+            </div>
+            <div className="p-6 border border-white/10 bg-card/30">
+              <Shield className="w-8 h-8 text-destructive mb-4" />
+              <h3 className="font-display text-white uppercase mb-2 text-sm">B2B Revenue</h3>
+              <p className="text-xs text-muted-foreground">Enterprise licensing model with recurring revenue.</p>
+            </div>
+          </div>
+        </motion.div>
+
         {/* Live Metrics */}
         {metrics && (
           <motion.div 
             initial={{ opacity: 0 }}
             animate={{ opacity: 1 }}
-            transition={{ delay: 0.5 }}
+            transition={{ delay: 0.55 }}
             className="mb-20"
           >
             <h2 className="text-center text-sm font-bold text-muted-foreground uppercase tracking-widest mb-8">
@@ -177,29 +336,76 @@ export default function Pitch() {
                 <div className="text-xs text-muted-foreground uppercase mt-2">Total XP</div>
               </div>
               <div className="text-center p-6 border border-white/10 bg-card/30">
-                <div className="text-4xl font-display font-bold text-green-500">{metrics.onlineUsers}</div>
-                <div className="text-xs text-muted-foreground uppercase mt-2">Online Now</div>
+                <div className="text-4xl font-display font-bold text-green-500">{metrics.verifiedUsers}</div>
+                <div className="text-xs text-muted-foreground uppercase mt-2">Verified</div>
               </div>
             </div>
           </motion.div>
         )}
 
-        {/* CTA */}
+        {/* Team Section */}
         <motion.div 
           initial={{ opacity: 0 }}
           animate={{ opacity: 1 }}
           transition={{ delay: 0.6 }}
+          className="mb-20"
+        >
+          <h2 className="text-center text-sm font-bold text-muted-foreground uppercase tracking-widest mb-8">
+            Leadership Team
+          </h2>
+          
+          <div className="grid md:grid-cols-3 gap-8">
+            <div className="text-center p-6 border border-white/10 bg-card/30">
+              <div className="w-20 h-20 bg-primary/20 rounded-full mx-auto mb-4 flex items-center justify-center">
+                <span className="text-2xl font-display text-primary">MP</span>
+              </div>
+              <h3 className="font-display text-white uppercase mb-1">MrPigLr</h3>
+              <div className="text-xs text-primary uppercase tracking-wider mb-3">Founder & CEO</div>
+              <p className="text-xs text-muted-foreground">Visionary behind the AeThex ecosystem. 10+ years in game development and metaverse architecture.</p>
+            </div>
+            <div className="text-center p-6 border border-white/10 bg-card/30">
+              <div className="w-20 h-20 bg-secondary/20 rounded-full mx-auto mb-4 flex items-center justify-center">
+                <span className="text-2xl font-display text-secondary">AX</span>
+              </div>
+              <h3 className="font-display text-white uppercase mb-1">Axiom Lead</h3>
+              <div className="text-xs text-secondary uppercase tracking-wider mb-3">Chief Architect</div>
+              <p className="text-xs text-muted-foreground">Protocol design and ecosystem governance. Former enterprise software architect.</p>
+            </div>
+            <div className="text-center p-6 border border-white/10 bg-card/30">
+              <div className="w-20 h-20 bg-destructive/20 rounded-full mx-auto mb-4 flex items-center justify-center">
+                <span className="text-2xl font-display text-destructive">AG</span>
+              </div>
+              <h3 className="font-display text-white uppercase mb-1">Aegis Lead</h3>
+              <div className="text-xs text-destructive uppercase tracking-wider mb-3">Head of Security</div>
+              <p className="text-xs text-muted-foreground">Security engineering and threat intelligence. Background in cybersecurity and AI.</p>
+            </div>
+          </div>
+        </motion.div>
+
+        {/* CTA */}
+        <motion.div 
+          initial={{ opacity: 0 }}
+          animate={{ opacity: 1 }}
+          transition={{ delay: 0.65 }}
           className="text-center"
         >
           <p className="text-muted-foreground mb-6">
             Ready to learn more about investment opportunities?
           </p>
-          <a 
-            href="mailto:invest@aethex.dev" 
-            className="inline-block bg-primary text-background px-8 py-4 font-bold uppercase tracking-wider hover:bg-primary/90 transition-colors"
-          >
-            Contact Our Team
-          </a>
+          <div className="flex flex-col sm:flex-row gap-4 justify-center">
+            <a 
+              href="mailto:invest@aethex.dev" 
+              className="inline-block bg-primary text-background px-8 py-4 font-bold uppercase tracking-wider hover:bg-primary/90 transition-colors"
+              data-testid="button-contact-team"
+            >
+              Contact Our Team
+            </a>
+            <Link href="/terminal">
+              <button className="inline-block border border-white/20 text-white px-8 py-4 font-bold uppercase tracking-wider hover:bg-white/5 transition-colors" data-testid="button-see-aegis">
+                See Aegis Demo
+              </button>
+            </Link>
+          </div>
         </motion.div>
 
       </div>
diff --git a/server/routes.ts b/server/routes.ts
index fbd40ed..e4698bc 100644
--- a/server/routes.ts
+++ b/server/routes.ts
@@ -269,6 +269,32 @@ export async function registerRoutes(
       res.status(500).json({ error: err.message });
     }
   });
+  
+  // Resolve alert (admin only)
+  app.patch("/api/alerts/:id", requireAdmin, async (req, res) => {
+    try {
+      const alert = await storage.updateAlert(req.params.id, req.body);
+      if (!alert) {
+        return res.status(404).json({ error: "Alert not found" });
+      }
+      res.json(alert);
+    } catch (err: any) {
+      res.status(500).json({ error: err.message });
+    }
+  });
+  
+  // Update application status (admin only)
+  app.patch("/api/applications/:id", requireAdmin, async (req, res) => {
+    try {
+      const application = await storage.updateApplication(req.params.id, req.body);
+      if (!application) {
+        return res.status(404).json({ error: "Application not found" });
+      }
+      res.json(application);
+    } catch (err: any) {
+      res.status(500).json({ error: err.message });
+    }
+  });
 
   return httpServer;
 }
diff --git a/server/storage.ts b/server/storage.ts
index b1383c6..32a3330 100644
--- a/server/storage.ts
+++ b/server/storage.ts
@@ -30,9 +30,11 @@ export interface IStorage {
   
   // Applications
   getApplications(): Promise<any[]>;
+  updateApplication(id: string, updates: any): Promise<any>;
   
   // Alerts
   getAlerts(): Promise<any[]>;
+  updateAlert(id: string, updates: any): Promise<any>;
   
   // Metrics
   getMetrics(): Promise<{
@@ -197,6 +199,46 @@ export class SupabaseStorage implements IStorage {
     return data || [];
   }
   
+  async updateAlert(id: string, updates: any): Promise<any> {
+    const updateData: any = {};
+    if ('is_resolved' in updates) {
+      updateData.is_resolved = updates.is_resolved;
+    }
+    
+    const { data, error } = await supabase
+      .from('aethex_alerts')
+      .update(updateData)
+      .eq('id', id)
+      .select()
+      .single();
+    
+    if (error) {
+      console.error('Update alert error:', error);
+      throw new Error(error.message);
+    }
+    return data;
+  }
+  
+  async updateApplication(id: string, updates: any): Promise<any> {
+    const updateData: any = {};
+    if ('status' in updates) {
+      updateData.status = updates.status;
+    }
+    
+    const { data, error } = await supabase
+      .from('applications')
+      .update(updateData)
+      .eq('id', id)
+      .select()
+      .single();
+    
+    if (error) {
+      console.error('Update application error:', error);
+      throw new Error(error.message);
+    }
+    return data;
+  }
+  
   async getMetrics(): Promise<{
     totalProfiles: number;
     totalProjects: number;