diff --git a/client/pages/labs/LabsAbout.tsx b/client/pages/labs/LabsAbout.tsx
new file mode 100644
index 00000000..337c00a2
--- /dev/null
+++ b/client/pages/labs/LabsAbout.tsx
@@ -0,0 +1,128 @@
+import Layout from "@/components/Layout";
+import { Button } from "@/components/ui/button";
+import { Badge } from "@/components/ui/badge";
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+import { Zap, Target, Users, BookOpen } from "lucide-react";
+import { useNavigate } from "react-router-dom";
+
+export default function LabsAbout() {
+  const navigate = useNavigate();
+
+  return (
+    <Layout>
+      <div className="relative min-h-screen bg-black text-white overflow-hidden">
+        {/* Animated backgrounds */}
+        <div className="pointer-events-none absolute inset-0 opacity-[0.12] [background-image:radial-gradient(circle_at_top,#fbbf24_0,rgba(0,0,0,0.45)_55%,rgba(0,0,0,0.9)_100%)]" />
+        <div className="pointer-events-none absolute inset-0 bg-[linear-gradient(transparent_0,transparent_calc(100%-1px),rgba(251,191,36,0.05)_calc(100%-1px))] bg-[length:100%_32px]" />
+        <div className="pointer-events-none absolute inset-0 opacity-[0.08] [background-image:linear-gradient(90deg,rgba(251,191,36,0.1)_1px,transparent_1px),linear-gradient(0deg,rgba(251,191,36,0.1)_1px,transparent_1px)] [background-size:50px_50px] animate-pulse" />
+        <div className="pointer-events-none absolute top-20 left-10 w-72 h-72 bg-yellow-500/20 rounded-full blur-3xl animate-blob" />
+        <div className="pointer-events-none absolute bottom-20 right-10 w-72 h-72 bg-yellow-600/10 rounded-full blur-3xl animate-blob" />
+
+        <main className="relative z-10">
+          {/* Header */}
+          <section className="relative overflow-hidden py-12 lg:py-16">
+            <div className="container mx-auto max-w-6xl px-4">
+              <Button
+                onClick={() => navigate("/labs")}
+                variant="ghost"
+                className="text-yellow-300 hover:bg-yellow-500/10 mb-8"
+              >
+                ← Back to Labs
+              </Button>
+
+              <h1 className="text-4xl font-black tracking-tight text-yellow-300 sm:text-5xl mb-4">
+                About AeThex Labs
+              </h1>
+              <p className="text-lg text-yellow-100/80 max-w-2xl">
+                Pushing the boundaries of what's possible in game development
+              </p>
+            </div>
+          </section>
+
+          {/* Mission */}
+          <section className="py-12 lg:py-16">
+            <div className="container mx-auto max-w-4xl px-4">
+              <div className="rounded-lg border border-yellow-400/30 bg-yellow-950/20 p-8 mb-12">
+                <h2 className="text-2xl font-bold text-yellow-300 mb-4">Our Mission</h2>
+                <p className="text-yellow-200/80 text-lg leading-relaxed">
+                  AeThex Labs is dedicated to advancing the state of game development through cutting-edge research, 
+                  comprehensive documentation, and community education. We believe in the power of collaborative innovation 
+                  and are committed to making game development more accessible and efficient for creators everywhere.
+                </p>
+              </div>
+
+              {/* Values */}
+              <div className="grid grid-cols-1 md:grid-cols-2 gap-6 mb-12">
+                <Card className="bg-yellow-950/20 border-yellow-400/30">
+                  <CardHeader>
+                    <Zap className="h-8 w-8 text-yellow-400 mb-2" />
+                    <CardTitle className="text-yellow-300">Innovation</CardTitle>
+                  </CardHeader>
+                  <CardContent>
+                    <p className="text-yellow-200/70">
+                      Constantly exploring new techniques and frameworks to push creative boundaries
+                    </p>
+                  </CardContent>
+                </Card>
+                <Card className="bg-yellow-950/20 border-yellow-400/30">
+                  <CardHeader>
+                    <Target className="h-8 w-8 text-yellow-400 mb-2" />
+                    <CardTitle className="text-yellow-300">Excellence</CardTitle>
+                  </CardHeader>
+                  <CardContent>
+                    <p className="text-yellow-200/70">
+                      Maintaining the highest standards in our research and educational initiatives
+                    </p>
+                  </CardContent>
+                </Card>
+                <Card className="bg-yellow-950/20 border-yellow-400/30">
+                  <CardHeader>
+                    <Users className="h-8 w-8 text-yellow-400 mb-2" />
+                    <CardTitle className="text-yellow-300">Collaboration</CardTitle>
+                  </CardHeader>
+                  <CardContent>
+                    <p className="text-yellow-200/70">
+                      Working together with developers, studios, and tools like Dev-Link to grow the ecosystem
+                    </p>
+                  </CardContent>
+                </Card>
+                <Card className="bg-yellow-950/20 border-yellow-400/30">
+                  <CardHeader>
+                    <BookOpen className="h-8 w-8 text-yellow-400 mb-2" />
+                    <CardTitle className="text-yellow-300">Education</CardTitle>
+                  </CardHeader>
+                  <CardContent>
+                    <p className="text-yellow-200/70">
+                      Creating resources and knowledge that empower the next generation of developers
+                    </p>
+                  </CardContent>
+                </Card>
+              </div>
+
+              {/* Dev-Link Connection */}
+              <div className="rounded-lg border border-yellow-400/30 bg-yellow-950/20 p-8">
+                <Badge className="border-yellow-400/40 bg-yellow-500/10 text-yellow-300 mb-4">
+                  Ecosystem
+                </Badge>
+                <h3 className="text-2xl font-bold text-yellow-300 mb-4">
+                  Partnering with Dev-Link
+                </h3>
+                <p className="text-yellow-200/80 mb-4">
+                  AeThex Labs works closely with Dev-Link, our professional network platform for Roblox developers, 
+                  to ensure our research and innovations directly benefit the developer community. Through Dev-Link, 
+                  we connect researchers with talented developers who can implement and refine our findings.
+                </p>
+                <Button
+                  onClick={() => navigate("/dev-link/waitlist")}
+                  className="bg-yellow-400 text-black hover:bg-yellow-300"
+                >
+                  Join Dev-Link
+                </Button>
+              </div>
+            </div>
+          </section>
+        </main>
+      </div>
+    </Layout>
+  );
+}
diff --git a/client/pages/labs/LabsCaseStudies.tsx b/client/pages/labs/LabsCaseStudies.tsx
new file mode 100644
index 00000000..032c7a53
--- /dev/null
+++ b/client/pages/labs/LabsCaseStudies.tsx
@@ -0,0 +1,187 @@
+import Layout from "@/components/Layout";
+import { Button } from "@/components/ui/button";
+import { Badge } from "@/components/ui/badge";
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+import { ArrowRight, TrendingUp } from "lucide-react";
+import { useNavigate } from "react-router-dom";
+
+const CASE_STUDIES = [
+  {
+    title: "Scaling Game Performance",
+    studio: "MegaStudios Inc.",
+    challenge:
+      "Handling 10,000+ concurrent players while maintaining 60fps performance",
+    solution:
+      "Implemented Labs optimization framework and distributed architecture patterns",
+    results: ["99.8% uptime", "2x performance improvement", "30% cost reduction"],
+    image: "🚀",
+  },
+  {
+    title: "Dev-Link Integration",
+    studio: "TalentFlow Collective",
+    challenge:
+      "Recruiting and retaining top Roblox developers across multiple timezones",
+    solution:
+      "Adopted Dev-Link platform for community building and skill matching, combined with Labs training resources",
+    results: [
+      "150% increase in quality hires",
+      "40% faster onboarding",
+      "Enhanced developer satisfaction",
+    ],
+    image: "🌐",
+    highlighted: true,
+  },
+  {
+    title: "Framework Modernization",
+    studio: "InnovateGames Ltd.",
+    challenge: "Upgrading legacy codebase while maintaining live product",
+    solution:
+      "Used Labs best practices and graduated migration strategy to modernize framework",
+    results: [
+      "Zero production downtime",
+      "50% code reduction",
+      "Modern architecture established",
+    ],
+    image: "⚙️",
+  },
+  {
+    title: "Team Growth & Development",
+    studio: "GrowthLabs Studio",
+    challenge:
+      "Building a world-class engineering team from junior developers",
+    solution:
+      "Leveraged Labs educational resources and Dev-Link community for talent discovery and mentorship",
+    results: [
+      "10 developers trained and promoted",
+      "Internal innovation projects launched",
+      "Industry recognition achieved",
+    ],
+    image: "👥",
+  },
+];
+
+export default function LabsCaseStudies() {
+  const navigate = useNavigate();
+
+  return (
+    <Layout>
+      <div className="relative min-h-screen bg-black text-white overflow-hidden">
+        {/* Animated backgrounds */}
+        <div className="pointer-events-none absolute inset-0 opacity-[0.12] [background-image:radial-gradient(circle_at_top,#fbbf24_0,rgba(0,0,0,0.45)_55%,rgba(0,0,0,0.9)_100%)]" />
+        <div className="pointer-events-none absolute inset-0 bg-[linear-gradient(transparent_0,transparent_calc(100%-1px),rgba(251,191,36,0.05)_calc(100%-1px))] bg-[length:100%_32px]" />
+        <div className="pointer-events-none absolute inset-0 opacity-[0.08] [background-image:linear-gradient(90deg,rgba(251,191,36,0.1)_1px,transparent_1px),linear-gradient(0deg,rgba(251,191,36,0.1)_1px,transparent_1px)] [background-size:50px_50px] animate-pulse" />
+        <div className="pointer-events-none absolute top-20 left-10 w-72 h-72 bg-yellow-500/20 rounded-full blur-3xl animate-blob" />
+        <div className="pointer-events-none absolute bottom-20 right-10 w-72 h-72 bg-yellow-600/10 rounded-full blur-3xl animate-blob" />
+
+        <main className="relative z-10">
+          {/* Header */}
+          <section className="relative overflow-hidden py-12 lg:py-16">
+            <div className="container mx-auto max-w-6xl px-4">
+              <Button
+                onClick={() => navigate("/labs")}
+                variant="ghost"
+                className="text-yellow-300 hover:bg-yellow-500/10 mb-8"
+              >
+                ← Back to Labs
+              </Button>
+
+              <h1 className="text-4xl font-black tracking-tight text-yellow-300 sm:text-5xl mb-4">
+                Case Studies
+              </h1>
+              <p className="text-lg text-yellow-100/80 max-w-2xl">
+                See how leading studios use AeThex Labs and Dev-Link to achieve their goals
+              </p>
+            </div>
+          </section>
+
+          {/* Case Studies */}
+          <section className="py-12 lg:py-16">
+            <div className="container mx-auto max-w-6xl px-4">
+              <div className="space-y-8">
+                {CASE_STUDIES.map((study) => (
+                  <Card
+                    key={study.title}
+                    className={`border transition-all ${
+                      study.highlighted
+                        ? "bg-yellow-950/40 border-yellow-400 ring-2 ring-yellow-400/50"
+                        : "bg-yellow-950/20 border-yellow-400/30 hover:border-yellow-400/60"
+                    }`}
+                  >
+                    <CardHeader>
+                      <div className="flex items-start justify-between mb-4">
+                        <div className="flex-1">
+                          <CardTitle className="text-yellow-300 mb-2">
+                            {study.title}
+                          </CardTitle>
+                          <p className="text-sm text-yellow-200/70">{study.studio}</p>
+                        </div>
+                        <div className="text-4xl">{study.image}</div>
+                      </div>
+                      {study.highlighted && (
+                        <Badge className="border-yellow-400/40 bg-yellow-500/10 text-yellow-300 w-fit">
+                          <TrendingUp className="h-3 w-3 mr-2" />
+                          Featured
+                        </Badge>
+                      )}
+                    </CardHeader>
+                    <CardContent className="space-y-4">
+                      <div>
+                        <h4 className="font-semibold text-yellow-300 mb-2">
+                          Challenge
+                        </h4>
+                        <p className="text-yellow-200/70">{study.challenge}</p>
+                      </div>
+                      <div>
+                        <h4 className="font-semibold text-yellow-300 mb-2">
+                          Solution
+                        </h4>
+                        <p className="text-yellow-200/70">{study.solution}</p>
+                      </div>
+                      <div>
+                        <h4 className="font-semibold text-yellow-300 mb-2">
+                          Results
+                        </h4>
+                        <div className="flex flex-wrap gap-2">
+                          {study.results.map((result) => (
+                            <Badge
+                              key={result}
+                              className="bg-yellow-500/20 text-yellow-300 border-0"
+                            >
+                              ✓ {result}
+                            </Badge>
+                          ))}
+                        </div>
+                      </div>
+                    </CardContent>
+                  </Card>
+                ))}
+              </div>
+
+              {/* CTA */}
+              <div className="mt-12 rounded-lg border border-yellow-400/30 bg-yellow-950/20 p-8 text-center">
+                <h2 className="text-2xl font-bold text-yellow-300 mb-4">
+                  Ready to Write Your Success Story?
+                </h2>
+                <p className="text-yellow-200/80 mb-6 max-w-2xl mx-auto">
+                  Combine AeThex Labs research with Dev-Link's professional community to accelerate your growth
+                </p>
+                <div className="flex gap-4 justify-center flex-wrap">
+                  <Button className="bg-yellow-400 text-black hover:bg-yellow-300">
+                    Get Started with Labs
+                  </Button>
+                  <Button
+                    variant="outline"
+                    className="border-yellow-400/60 text-yellow-300 hover:bg-yellow-500/10"
+                    onClick={() => navigate("/dev-link/waitlist")}
+                  >
+                    Join Dev-Link <ArrowRight className="h-4 w-4 ml-2" />
+                  </Button>
+                </div>
+              </div>
+            </div>
+          </section>
+        </main>
+      </div>
+    </Layout>
+  );
+}
diff --git a/client/pages/labs/LabsPricing.tsx b/client/pages/labs/LabsPricing.tsx
new file mode 100644
index 00000000..67727939
--- /dev/null
+++ b/client/pages/labs/LabsPricing.tsx
@@ -0,0 +1,176 @@
+import Layout from "@/components/Layout";
+import { Button } from "@/components/ui/button";
+import { Badge } from "@/components/ui/badge";
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+import { Check } from "lucide-react";
+import { useNavigate } from "react-router-dom";
+
+const PRICING_TIERS = [
+  {
+    name: "Starter",
+    description: "Perfect for indie developers",
+    price: "Free",
+    features: [
+      "Access to documentation",
+      "Community forums",
+      "Monthly research updates",
+      "Basic tools and templates",
+    ],
+    cta: "Get Started",
+    highlighted: false,
+  },
+  {
+    name: "Professional",
+    description: "For growing studios",
+    price: "$49",
+    period: "/month",
+    features: [
+      "Everything in Starter",
+      "Advanced optimization guides",
+      "Priority support",
+      "Exclusive research previews",
+      "API access",
+      "Custom consulting hours",
+    ],
+    cta: "Start Free Trial",
+    highlighted: true,
+  },
+  {
+    name: "Enterprise",
+    description: "For large-scale operations",
+    price: "Custom",
+    features: [
+      "Everything in Professional",
+      "Dedicated support team",
+      "Custom research projects",
+      "On-site training",
+      "API SLA guarantee",
+      "Custom integrations",
+    ],
+    cta: "Contact Sales",
+    highlighted: false,
+  },
+];
+
+export default function LabsPricing() {
+  const navigate = useNavigate();
+
+  return (
+    <Layout>
+      <div className="relative min-h-screen bg-black text-white overflow-hidden">
+        {/* Animated backgrounds */}
+        <div className="pointer-events-none absolute inset-0 opacity-[0.12] [background-image:radial-gradient(circle_at_top,#fbbf24_0,rgba(0,0,0,0.45)_55%,rgba(0,0,0,0.9)_100%)]" />
+        <div className="pointer-events-none absolute inset-0 bg-[linear-gradient(transparent_0,transparent_calc(100%-1px),rgba(251,191,36,0.05)_calc(100%-1px))] bg-[length:100%_32px]" />
+        <div className="pointer-events-none absolute inset-0 opacity-[0.08] [background-image:linear-gradient(90deg,rgba(251,191,36,0.1)_1px,transparent_1px),linear-gradient(0deg,rgba(251,191,36,0.1)_1px,transparent_1px)] [background-size:50px_50px] animate-pulse" />
+        <div className="pointer-events-none absolute top-20 left-10 w-72 h-72 bg-yellow-500/20 rounded-full blur-3xl animate-blob" />
+        <div className="pointer-events-none absolute bottom-20 right-10 w-72 h-72 bg-yellow-600/10 rounded-full blur-3xl animate-blob" />
+
+        <main className="relative z-10">
+          {/* Header */}
+          <section className="relative overflow-hidden py-12 lg:py-16">
+            <div className="container mx-auto max-w-6xl px-4">
+              <Button
+                onClick={() => navigate("/labs")}
+                variant="ghost"
+                className="text-yellow-300 hover:bg-yellow-500/10 mb-8"
+              >
+                ← Back to Labs
+              </Button>
+
+              <h1 className="text-4xl font-black tracking-tight text-yellow-300 sm:text-5xl mb-4">
+                Labs Pricing
+              </h1>
+              <p className="text-lg text-yellow-100/80 max-w-2xl">
+                Invest in your development journey with flexible pricing plans
+              </p>
+            </div>
+          </section>
+
+          {/* Pricing Cards */}
+          <section className="py-12 lg:py-16">
+            <div className="container mx-auto max-w-6xl px-4">
+              <div className="grid grid-cols-1 md:grid-cols-3 gap-8">
+                {PRICING_TIERS.map((tier) => (
+                  <Card
+                    key={tier.name}
+                    className={`border transition-all ${
+                      tier.highlighted
+                        ? "bg-yellow-950/40 border-yellow-400 ring-2 ring-yellow-400/50"
+                        : "bg-yellow-950/20 border-yellow-400/30 hover:border-yellow-400/60"
+                    }`}
+                  >
+                    <CardHeader>
+                      <CardTitle className="text-yellow-300">{tier.name}</CardTitle>
+                      <p className="text-sm text-yellow-200/70 mt-2">{tier.description}</p>
+                    </CardHeader>
+                    <CardContent className="space-y-6">
+                      <div>
+                        <div className="text-3xl font-bold text-yellow-300">
+                          {tier.price}
+                        </div>
+                        {tier.period && (
+                          <p className="text-sm text-yellow-200/70">{tier.period}</p>
+                        )}
+                      </div>
+
+                      <ul className="space-y-3">
+                        {tier.features.map((feature) => (
+                          <li key={feature} className="flex items-start gap-3">
+                            <Check className="h-5 w-5 text-yellow-400 flex-shrink-0 mt-0.5" />
+                            <span className="text-yellow-200/80">{feature}</span>
+                          </li>
+                        ))}
+                      </ul>
+
+                      <Button
+                        className={
+                          tier.highlighted
+                            ? "w-full bg-yellow-400 text-black hover:bg-yellow-300"
+                            : "w-full border-yellow-400/60 text-yellow-300 hover:bg-yellow-500/10"
+                        }
+                        variant={tier.highlighted ? "default" : "outline"}
+                      >
+                        {tier.cta}
+                      </Button>
+                    </CardContent>
+                  </Card>
+                ))}
+              </div>
+            </div>
+          </section>
+
+          {/* FAQ Section */}
+          <section className="py-12 lg:py-16">
+            <div className="container mx-auto max-w-4xl px-4">
+              <h2 className="text-2xl font-bold text-yellow-300 mb-8">Frequently Asked Questions</h2>
+              <div className="space-y-4">
+                {[
+                  {
+                    q: "Can I change plans anytime?",
+                    a: "Yes, upgrade or downgrade your plan at any time.",
+                  },
+                  {
+                    q: "Do you offer discounts for annual billing?",
+                    a: "Yes, save 20% with annual plans on Professional and Enterprise tiers.",
+                  },
+                  {
+                    q: "Is there a free trial?",
+                    a: "Professional tier includes a 14-day free trial. No credit card required.",
+                  },
+                ].map((item) => (
+                  <div
+                    key={item.q}
+                    className="rounded-lg border border-yellow-400/30 bg-yellow-950/20 p-4"
+                  >
+                    <h3 className="font-semibold text-yellow-300 mb-2">{item.q}</h3>
+                    <p className="text-yellow-200/70">{item.a}</p>
+                  </div>
+                ))}
+              </div>
+            </div>
+          </section>
+        </main>
+      </div>
+    </Layout>
+  );
+}
diff --git a/client/pages/labs/LabsTeams.tsx b/client/pages/labs/LabsTeams.tsx
new file mode 100644
index 00000000..e9317dc1
--- /dev/null
+++ b/client/pages/labs/LabsTeams.tsx
@@ -0,0 +1,145 @@
+import Layout from "@/components/Layout";
+import { Button } from "@/components/ui/button";
+import { Badge } from "@/components/ui/badge";
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+import { Users, Github, Mail, Linkedin } from "lucide-react";
+import { useNavigate } from "react-router-dom";
+
+const TEAM_MEMBERS = [
+  {
+    name: "Dr. Sarah Chen",
+    role: "Head of Research",
+    bio: "Leading innovation in game development frameworks",
+    avatar: "https://api.dicebear.com/7.x/avataaars/svg?seed=Sarah",
+    skills: ["Research", "Architecture", "Leadership"],
+    social: { github: "#", linkedin: "#", email: "#" },
+  },
+  {
+    name: "Marcus Johnson",
+    role: "Senior Engineer",
+    bio: "Expert in Roblox optimization and scaling",
+    avatar: "https://api.dicebear.com/7.x/avataaars/svg?seed=Marcus",
+    skills: ["Engineering", "Performance", "DevOps"],
+    social: { github: "#", linkedin: "#", email: "#" },
+  },
+  {
+    name: "Emma Rodriguez",
+    role: "Product Manager",
+    bio: "Driving Labs initiatives and collaboration",
+    avatar: "https://api.dicebear.com/7.x/avataaars/svg?seed=Emma",
+    skills: ["Product", "Strategy", "Design"],
+    social: { github: "#", linkedin: "#", email: "#" },
+  },
+  {
+    name: "James Lee",
+    role: "Documentation Lead",
+    bio: "Creating comprehensive learning resources",
+    avatar: "https://api.dicebear.com/7.x/avataaars/svg?seed=James",
+    skills: ["Documentation", "Education", "Content"],
+    social: { github: "#", linkedin: "#", email: "#" },
+  },
+];
+
+export default function LabsTeams() {
+  const navigate = useNavigate();
+
+  return (
+    <Layout>
+      <div className="relative min-h-screen bg-black text-white overflow-hidden">
+        {/* Animated backgrounds */}
+        <div className="pointer-events-none absolute inset-0 opacity-[0.12] [background-image:radial-gradient(circle_at_top,#fbbf24_0,rgba(0,0,0,0.45)_55%,rgba(0,0,0,0.9)_100%)]" />
+        <div className="pointer-events-none absolute inset-0 bg-[linear-gradient(transparent_0,transparent_calc(100%-1px),rgba(251,191,36,0.05)_calc(100%-1px))] bg-[length:100%_32px]" />
+        <div className="pointer-events-none absolute inset-0 opacity-[0.08] [background-image:linear-gradient(90deg,rgba(251,191,36,0.1)_1px,transparent_1px),linear-gradient(0deg,rgba(251,191,36,0.1)_1px,transparent_1px)] [background-size:50px_50px] animate-pulse" />
+        <div className="pointer-events-none absolute top-20 left-10 w-72 h-72 bg-yellow-500/20 rounded-full blur-3xl animate-blob" />
+        <div className="pointer-events-none absolute bottom-20 right-10 w-72 h-72 bg-yellow-600/10 rounded-full blur-3xl animate-blob" />
+
+        <main className="relative z-10">
+          {/* Header */}
+          <section className="relative overflow-hidden py-12 lg:py-16">
+            <div className="container mx-auto max-w-6xl px-4">
+              <Button
+                onClick={() => navigate("/labs")}
+                variant="ghost"
+                className="text-yellow-300 hover:bg-yellow-500/10 mb-8"
+              >
+                ← Back to Labs
+              </Button>
+
+              <div className="mb-12">
+                <Badge className="border-yellow-400/40 bg-yellow-500/10 text-yellow-300 mb-4">
+                  <Users className="h-4 w-4 mr-2" />
+                  Our Team
+                </Badge>
+                <h1 className="text-4xl font-black tracking-tight text-yellow-300 sm:text-5xl mb-4">
+                  Meet the AeThex Labs Team
+                </h1>
+                <p className="text-lg text-yellow-100/80 max-w-2xl">
+                  Passionate researchers and engineers dedicated to advancing game development
+                </p>
+              </div>
+            </div>
+          </section>
+
+          {/* Team Grid */}
+          <section className="py-12 lg:py-16">
+            <div className="container mx-auto max-w-6xl px-4">
+              <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6 mb-12">
+                {TEAM_MEMBERS.map((member) => (
+                  <Card
+                    key={member.name}
+                    className="bg-yellow-950/20 border-yellow-400/30 hover:border-yellow-400/60 hover:bg-yellow-950/30 transition-all"
+                  >
+                    <CardHeader className="text-center">
+                      <img
+                        src={member.avatar}
+                        alt={member.name}
+                        className="w-20 h-20 rounded-full mx-auto mb-4 border-2 border-yellow-400/50"
+                      />
+                      <CardTitle className="text-yellow-300">{member.name}</CardTitle>
+                      <p className="text-sm text-yellow-200/70 mt-1">{member.role}</p>
+                    </CardHeader>
+                    <CardContent className="space-y-4">
+                      <p className="text-sm text-yellow-200/70">{member.bio}</p>
+                      <div className="flex flex-wrap gap-2">
+                        {member.skills.map((skill) => (
+                          <Badge
+                            key={skill}
+                            className="bg-yellow-500/20 text-yellow-300 border-0 text-xs"
+                          >
+                            {skill}
+                          </Badge>
+                        ))}
+                      </div>
+                      <div className="flex gap-3 pt-2">
+                        <a href={member.social.github} className="text-yellow-400 hover:text-yellow-300">
+                          <Github className="h-5 w-5" />
+                        </a>
+                        <a href={member.social.linkedin} className="text-yellow-400 hover:text-yellow-300">
+                          <Linkedin className="h-5 w-5" />
+                        </a>
+                        <a href={member.social.email} className="text-yellow-400 hover:text-yellow-300">
+                          <Mail className="h-5 w-5" />
+                        </a>
+                      </div>
+                    </CardContent>
+                  </Card>
+                ))}
+              </div>
+
+              {/* Hiring Section */}
+              <div className="rounded-lg border border-yellow-400/30 bg-yellow-950/20 p-8 text-center">
+                <h2 className="text-2xl font-bold text-yellow-300 mb-4">Join Our Team</h2>
+                <p className="text-yellow-200/80 mb-6 max-w-2xl mx-auto">
+                  We're always looking for talented researchers, engineers, and educators to join AeThex Labs
+                </p>
+                <Button className="bg-yellow-400 text-black hover:bg-yellow-300">
+                  View Open Positions
+                </Button>
+              </div>
+            </div>
+          </section>
+        </main>
+      </div>
+    </Layout>
+  );
+}