diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx
index 4906806..8dda534 100644
--- a/src/components/Footer.tsx
+++ b/src/components/Footer.tsx
@@ -2,14 +2,14 @@ import SmartLink from './SmartLink';
 
 export default function Footer() {
   return (
-    <footer role="contentinfo" className="border-t border-white/5 bg-void-950">
-      <div className="mx-auto flex max-w-7xl flex-col items-center gap-4 px-4 py-8 text-sm text-slate-500 sm:flex-row sm:justify-between sm:px-6 lg:px-8">
-        <p className="font-mono text-xs">&copy; {new Date().getFullYear()} James De Raja</p>
+    <footer role="contentinfo" className="border-t border-[#CBD5E1] bg-[#F8FAFC]">
+      <div className="mx-auto flex max-w-7xl flex-col items-center gap-4 px-4 py-8 text-sm text-[#64748B] sm:flex-row sm:justify-between sm:px-6 lg:px-8">
+        <p className="text-xs">&copy; {new Date().getFullYear()} James De Raja</p>
         <div className="flex items-center gap-6">
-          <SmartLink href="mailto:jamesderaja@gmail.com" className="transition hover:text-neon">Email</SmartLink>
-          <SmartLink href="https://www.linkedin.com/in/james-de-raja/" className="transition hover:text-neon">LinkedIn</SmartLink>
-          <SmartLink href="https://github.com/JamesDeRaja" className="transition hover:text-neon">GitHub</SmartLink>
-          <SmartLink href="/resume/viewer.html?file=JamesDeRaja_Resume.pdf" className="transition hover:text-neon">Resume</SmartLink>
+          <SmartLink href="mailto:jamesderaja@gmail.com" className="transition hover:text-[#1D4ED8]">Email</SmartLink>
+          <SmartLink href="https://www.linkedin.com/in/james-de-raja/" className="transition hover:text-[#1D4ED8]">LinkedIn</SmartLink>
+          <SmartLink href="https://github.com/JamesDeRaja" className="transition hover:text-[#1D4ED8]">GitHub</SmartLink>
+          <SmartLink href="/resume/viewer.html?file=JamesDeRaja_Resume_Unity-Rendering-Performance.pdf" className="transition hover:text-[#1D4ED8]">Resume</SmartLink>
         </div>
       </div>
     </footer>
diff --git a/src/components/Navbar.tsx b/src/components/Navbar.tsx
index 5f49aef..52fb465 100644
--- a/src/components/Navbar.tsx
+++ b/src/components/Navbar.tsx
@@ -5,11 +5,10 @@ import { motion, AnimatePresence } from 'framer-motion';
 import SmartLink from './SmartLink';
 
 const navItems = [
-  { label: 'Games', hash: 'shipped-titles' },
-  { label: 'Performance Wins', hash: 'problems-solved' },
-  { label: 'Case Studies', hash: 'work' },
-  { label: 'XR Lab', hash: 'xr-lab' },
-  { label: 'About', hash: 'about' },
+  { label: 'Impact', hash: 'impact' },
+  { label: 'Experience', hash: 'experience' },
+  { label: 'Featured Proof', hash: 'featured-proof' },
+  { label: 'Skills', hash: 'skills' },
   { label: 'Contact', hash: 'contact' },
 ];
 
@@ -39,52 +38,47 @@ export default function Navbar() {
 
   return (
     <header
-      className={`sticky top-0 z-50 transition-all duration-500 ${
-        scrolled
-          ? 'border-b border-neon/10 bg-void-950/80 backdrop-blur-xl'
-          : 'bg-transparent'
+      className={`sticky top-0 z-50 transition-all duration-300 ${
+        scrolled ? 'border-b border-[#CBD5E1] bg-[#F8FAFC]/95 backdrop-blur' : 'bg-[#F8FAFC]'
       }`}
     >
       <nav
         aria-label="Main navigation"
         className="mx-auto flex w-full max-w-7xl items-center justify-between px-4 py-4 sm:px-6 lg:px-8"
       >
-        {/* Logo */}
         <Link to="/" className="group flex items-center gap-2">
-          <div className="flex h-8 w-8 items-center justify-center rounded-lg border border-neon/20 bg-neon/5">
-            <span className="font-mono text-sm font-bold text-neon">JD</span>
+          <div className="flex h-8 w-8 items-center justify-center rounded-lg border border-[#CBD5E1] bg-white">
+            <span className="text-sm font-bold text-[#0F172A]">JD</span>
           </div>
-          <span className="text-sm font-semibold tracking-tight text-white/90 transition group-hover:text-neon">
+          <span className="text-sm font-semibold tracking-tight text-[#0F172A] transition group-hover:text-[#1D4ED8]">
             James De Raja
           </span>
         </Link>
 
-        {/* Desktop nav */}
         <div className="hidden items-center gap-1 md:flex">
           {navItems.map((item) => (
             <button
               key={item.label}
               type="button"
               onClick={() => handleNavClick(item.hash)}
-              className="rounded-lg px-3 py-2 text-sm text-slate-400 transition-colors hover:bg-white/5 hover:text-neon"
+              className="rounded-lg px-3 py-2 text-sm text-[#334155] transition-colors hover:bg-[#EFF6FF] hover:text-[#1D4ED8]"
             >
               {item.label}
             </button>
           ))}
         </div>
 
-        {/* Actions */}
         <div className="flex items-center gap-2">
           <SmartLink
-            href="/resume/viewer.html?file=JamesDeRaja_Resume.pdf"
-            className="btn-primary hidden rounded-lg px-4 py-2 text-sm font-medium sm:inline-flex"
+            href="/resume/viewer.html?file=JamesDeRaja_Resume_Unity-Rendering-Performance.pdf"
+            className="hidden rounded-lg bg-[#1D4ED8] px-4 py-2 text-sm font-semibold text-white hover:bg-[#1E40AF] sm:inline-flex"
           >
             View Resume
           </SmartLink>
           <a
-            href="/resume/JamesDeRaja_Resume.pdf"
+            href="/resume/JamesDeRaja_Resume_Unity-Rendering-Performance.pdf"
             download
-            className="rounded-lg border border-white/10 p-2 text-slate-400 transition hover:border-neon/30 hover:text-neon"
+            className="rounded-lg border border-[#CBD5E1] p-2 text-[#334155] transition hover:bg-white hover:text-[#1D4ED8]"
             aria-label="Download resume PDF"
           >
             <Download size={16} />
@@ -92,7 +86,7 @@ export default function Navbar() {
           <button
             type="button"
             onClick={() => setMobileOpen(!mobileOpen)}
-            className="rounded-lg p-2 text-slate-400 hover:bg-white/5 hover:text-neon md:hidden"
+            className="rounded-lg p-2 text-[#334155] hover:bg-white hover:text-[#1D4ED8] md:hidden"
             aria-label={mobileOpen ? 'Close menu' : 'Open menu'}
             aria-expanded={mobileOpen}
           >
@@ -101,22 +95,21 @@ export default function Navbar() {
         </div>
       </nav>
 
-      {/* Mobile menu */}
       <AnimatePresence>
         {mobileOpen && (
           <motion.div
             initial={{ opacity: 0, height: 0 }}
             animate={{ opacity: 1, height: 'auto' }}
             exit={{ opacity: 0, height: 0 }}
-            className="overflow-hidden border-t border-white/5 bg-void-950/95 backdrop-blur-xl md:hidden"
+            className="overflow-hidden border-t border-[#CBD5E1] bg-[#F8FAFC] md:hidden"
           >
-            <div className="px-4 py-4 space-y-1">
+            <div className="space-y-1 px-4 py-4">
               {navItems.map((item) => (
                 <button
                   key={item.label}
                   type="button"
                   onClick={() => handleNavClick(item.hash)}
-                  className="block w-full rounded-lg px-3 py-3 text-left text-sm text-slate-300 transition hover:bg-white/5 hover:text-neon"
+                  className="block w-full rounded-lg px-3 py-3 text-left text-sm text-[#334155] transition hover:bg-white hover:text-[#1D4ED8]"
                 >
                   {item.label}
                 </button>
diff --git a/src/layouts/SiteLayout.tsx b/src/layouts/SiteLayout.tsx
index 3739a2f..2857022 100644
--- a/src/layouts/SiteLayout.tsx
+++ b/src/layouts/SiteLayout.tsx
@@ -4,8 +4,8 @@ import Footer from '../components/Footer';
 
 export default function SiteLayout() {
   return (
-    <div className="min-h-screen bg-void-950 text-slate-200">
-      <a href="#main" className="sr-only focus:not-sr-only focus:fixed focus:left-4 focus:top-4 focus:z-[100] focus:rounded-lg focus:bg-neon/20 focus:px-4 focus:py-2 focus:text-neon">
+    <div className="min-h-screen bg-[#F8FAFC] text-[#0F172A]">
+      <a href="#main" className="sr-only focus:not-sr-only focus:fixed focus:left-4 focus:top-4 focus:z-[100] focus:rounded-lg focus:bg-[#1D4ED8] focus:px-4 focus:py-2 focus:text-white">
         Skip to main content
       </a>
       <Navbar />
diff --git a/src/pages/HomePage.tsx b/src/pages/HomePage.tsx
index 82bce5d..07552de 100644
--- a/src/pages/HomePage.tsx
+++ b/src/pages/HomePage.tsx
@@ -1,15 +1,42 @@
 import { useEffect } from 'react';
 import { useLocation } from 'react-router-dom';
-import AboutSection from '../sections/AboutSection';
-import ContactSection from '../sections/ContactSection';
-import HeroSection from '../sections/HeroSection';
-import WorkSection from '../sections/WorkSection';
-import WritingSection from '../sections/WritingSection';
-import XRLabSection from '../sections/XRLabSection';
-import ShippedTitlesSection from '../sections/ShippedTitlesSection';
-import ProblemsSolvedSection from '../sections/ProblemsSolvedSection';
-import ParticleField from '../components/ParticleField';
 import { Seo } from '../components/Seo';
+import SmartLink from '../components/SmartLink';
+
+const impactMetrics = [
+  { value: '13+ years', label: 'Unity performance engineering' },
+  { value: '72/90 Hz', label: 'XR frame budget discipline' },
+  { value: '100+', label: 'Rapid prototypes delivered' },
+];
+
+const skills = [
+  'Unity',
+  'C#',
+  'Rendering Optimization',
+  'XR / VR / AR',
+  'Frame Pacing',
+  'Unity Profiler',
+  'Frame Debugger',
+  'CPU/GPU Bottleneck Isolation',
+  'Overdraw Analysis',
+  'MSAA',
+  'URP',
+  'Performance Benchmarking',
+  'Mobile Optimization',
+];
+
+const experience = [
+  {
+    role: 'Independent Unity Rendering Performance Engineer',
+    company: 'Independent',
+    date: '2024–Present',
+  },
+  {
+    role: 'Senior Unity Engineer (Mobile + Real-Time Rendering)',
+    company: 'Company pending',
+    date: '2014–2024',
+  },
+];
 
 export default function HomePage() {
   const location = useLocation();
@@ -25,37 +52,157 @@ export default function HomePage() {
   }, [location.hash]);
 
   return (
-    <div className="relative min-h-screen bg-void-950 text-slate-200">
+    <div className="min-h-screen bg-[#F8FAFC] text-[#0F172A]">
       <Seo
-        title="James De Raja — Real-Time Performance Engineer | Unity Rendering & Frame Stability"
-        description="Real-time performance engineer with 13+ years in Unity and 100+ shipped titles. XR/VR optimization, GPU/CPU bottleneck isolation, and frame pacing research. Profiler-validated measurements backing every claim."
-        url="https://jamesderaja.com/"
-        keywords="real-time performance engineer, Unity rendering, XR optimization, frame pacing, GPU bottleneck, mobile game optimization, Unity profiler, shipped games, James De Raja"
+        title="James De Raja — Senior Unity Developer | Performance Optimization, AR/VR/XR"
+        description="Recruiter-first performance resume for James De Raja: Unity rendering optimization, XR frame stability, profiler-led diagnostics, and proof-based case studies."
+        url="https://james.alphaden.club/"
+        keywords="James De Raja, senior unity developer, unity performance optimization, xr frame pacing, rendering optimization, unity profiler"
       />
 
-      {/* Particle background */}
-      <ParticleField />
-
-      {/* Grid overlay */}
-      <div className="pointer-events-none fixed inset-0 z-0 bg-grid-overlay" aria-hidden="true" />
-
-      {/* Content flow: who you are → what you shipped → what you fixed → how you think → frontier research → writing → bio → contact */}
-      <main className="relative z-10">
-        <HeroSection />
-        <div className="divider-glow mx-auto max-w-7xl" />
-        <ShippedTitlesSection />
-        <div className="divider-glow mx-auto max-w-7xl" />
-        <ProblemsSolvedSection />
-        <div className="divider-glow mx-auto max-w-7xl" />
-        <WorkSection />
-        <div className="divider-glow mx-auto max-w-7xl" />
-        <XRLabSection />
-        <div className="divider-glow mx-auto max-w-7xl" />
-        <WritingSection />
-        <div className="divider-glow mx-auto max-w-7xl" />
-        <AboutSection />
-        <div className="divider-glow mx-auto max-w-7xl" />
-        <ContactSection />
+      <main className="mx-auto max-w-7xl px-4 py-10 sm:px-6 lg:px-8">
+        <div className="grid grid-cols-1 gap-6 lg:grid-cols-12">
+          <section id="hero" className="rounded-2xl border border-[#CBD5E1] bg-white p-6 lg:col-span-8 lg:p-8">
+            <p className="text-sm font-semibold text-[#1D4ED8]">Recruiter-first performance resume</p>
+            <h1 className="mt-3 text-3xl font-bold tracking-tight sm:text-4xl">James De Raja</h1>
+            <p className="mt-3 text-lg font-semibold text-[#0F172A]">
+              Senior Unity Developer — Performance Optimization, AR/VR/XR, Rendering, Frame Stability
+            </p>
+            <p className="mt-4 max-w-3xl text-base leading-7 text-[#334155]">
+              Senior Unity performance engineer with 13+ years optimizing Unity rendering pipelines, frame pacing,
+              and CPU/GPU bottlenecks for mobile and XR under strict 11 ms / 72–90 Hz budgets.
+            </p>
+
+            <div className="mt-6 flex flex-wrap gap-3" id="contact">
+              <a
+                href="/resume/JamesDeRaja_Resume_Unity-Rendering-Performance.pdf"
+                download
+                className="inline-flex items-center rounded-lg bg-[#1D4ED8] px-4 py-2.5 text-sm font-semibold text-white hover:bg-[#1E40AF]"
+              >
+                Download Resume PDF
+              </a>
+              <a
+                href="#featured-proof"
+                className="inline-flex items-center rounded-lg border border-[#CBD5E1] bg-white px-4 py-2.5 text-sm font-semibold text-[#0F172A] hover:bg-[#F1F5F9]"
+              >
+                View Case Studies
+              </a>
+              <SmartLink href="mailto:jamesderaja@gmail.com" className="inline-flex items-center rounded-lg border border-[#CBD5E1] px-4 py-2.5 text-sm font-medium text-[#0F172A] hover:bg-[#F1F5F9]">Email</SmartLink>
+              <SmartLink href="https://www.linkedin.com/in/james-de-raja/" className="inline-flex items-center rounded-lg border border-[#CBD5E1] px-4 py-2.5 text-sm font-medium text-[#0F172A] hover:bg-[#F1F5F9]">LinkedIn</SmartLink>
+              <SmartLink href="https://github.com/JamesDeRaja" className="inline-flex items-center rounded-lg border border-[#CBD5E1] px-4 py-2.5 text-sm font-medium text-[#0F172A] hover:bg-[#F1F5F9]">GitHub</SmartLink>
+            </div>
+          </section>
+
+          <section id="impact" className="rounded-2xl border border-[#CBD5E1] bg-[#EFF6FF] p-6 lg:col-span-4 lg:p-8">
+            <h2 className="text-lg font-semibold">Impact Metrics</h2>
+            <div className="mt-5 space-y-4">
+              {impactMetrics.map((metric) => (
+                <article key={metric.value} className="rounded-xl border border-[#CBD5E1] bg-white p-4">
+                  <p className="text-xl font-bold text-[#0F172A]">{metric.value}</p>
+                  <p className="text-sm text-[#475569]">{metric.label}</p>
+                </article>
+              ))}
+            </div>
+          </section>
+
+          <section id="experience" className="rounded-2xl border border-[#CBD5E1] bg-white p-6 lg:col-span-6">
+            <h2 className="text-lg font-semibold">Experience Timeline</h2>
+            <ol className="mt-5 space-y-4">
+              {experience.map((item) => (
+                <li key={item.role} className="rounded-xl border border-[#CBD5E1] p-4">
+                  <p className="text-base font-semibold">{item.role}</p>
+                  <p className="text-sm text-[#475569]">{item.company}</p>
+                  <p className="text-sm text-[#64748B]">{item.date}</p>
+                </li>
+              ))}
+            </ol>
+          </section>
+
+          <section id="featured-proof" className="rounded-2xl border border-[#CBD5E1] bg-white p-6 lg:col-span-6">
+            <h2 className="text-lg font-semibold">XR Performance Stress Lab</h2>
+            <p className="mt-1 text-sm text-[#475569]">Profiler-led XR frame-budget isolation and frame pacing analysis.</p>
+            <dl className="mt-4 space-y-3 text-sm leading-6">
+              <div>
+                <dt className="font-semibold text-[#0F172A]">Problem</dt>
+                <dd className="text-[#334155]">XR rendering scenarios can exceed strict 11 ms / 72–90 Hz frame budgets when overdraw, transparency, MSAA, or submission overhead increases.</dd>
+              </div>
+              <div>
+                <dt className="font-semibold text-[#0F172A]">Diagnosis</dt>
+                <dd className="text-[#334155]">Unity Profiler, Frame Debugger, CPU/GPU frame timing, overdraw validation.</dd>
+              </div>
+              <div>
+                <dt className="font-semibold text-[#0F172A]">Action</dt>
+                <dd className="text-[#334155]">Controlled stress tests, bottleneck classification, visibility-aware control, rendering-cost isolation.</dd>
+              </div>
+              <div>
+                <dt className="font-semibold text-[#0F172A]">Result</dt>
+                <dd className="text-[#334155]">Verified +7.27 ms GPU RenderLoop growth isolated under layered transparency stress conditions.</dd>
+              </div>
+            </dl>
+            <SmartLink href="/case-studies/xr-stress-lab" className="mt-4 inline-flex text-sm font-semibold text-[#1D4ED8] underline underline-offset-2">Open case study</SmartLink>
+          </section>
+
+          <section id="work" className="rounded-2xl border border-[#CBD5E1] bg-white p-6 lg:col-span-6">
+            <h2 className="text-lg font-semibold">SoftMaskPro — UI Rendering Cost Study</h2>
+            <p className="mt-1 text-sm text-[#475569]">UI masking, fill-rate cost isolation, redraw-path reduction, and predictable cost under load.</p>
+            <dl className="mt-4 space-y-3 text-sm leading-6">
+              <div>
+                <dt className="font-semibold text-[#0F172A]">Problem</dt>
+                <dd className="text-[#334155]">Fill-rate-heavy UI scenes and masking paths can create expensive passes and unnecessary redraw work.</dd>
+              </div>
+              <div>
+                <dt className="font-semibold text-[#0F172A]">Diagnosis</dt>
+                <dd className="text-[#334155]">Profiler-guided UI rendering analysis, Frame Debugger pass inspection, URP rendering review.</dd>
+              </div>
+              <div>
+                <dt className="font-semibold text-[#0F172A]">Action</dt>
+                <dd className="text-[#334155]">Targeted update logic, mask-cost isolation, redraw reduction, and controlled profiling.</dd>
+              </div>
+              <div>
+                <dt className="font-semibold text-[#0F172A]">Result</dt>
+                <dd className="text-[#334155]">Measured result pending.</dd>
+              </div>
+            </dl>
+            <SmartLink href="/case-studies/softmaskpro" className="mt-4 inline-flex text-sm font-semibold text-[#1D4ED8] underline underline-offset-2">Open case study</SmartLink>
+          </section>
+
+          <section id="skills" className="rounded-2xl border border-[#CBD5E1] bg-white p-6 lg:col-span-6">
+            <h2 className="text-lg font-semibold">Skills & Profiler Stack</h2>
+            <div className="mt-4 flex flex-wrap gap-2">
+              {skills.map((skill) => (
+                <span key={skill} className="rounded-full border border-[#CBD5E1] bg-[#F8FAFC] px-3 py-1.5 text-xs font-medium text-[#0F172A]">
+                  {skill}
+                </span>
+              ))}
+            </div>
+          </section>
+
+          <section id="selected-work" className="rounded-2xl border border-[#CBD5E1] bg-white p-6 lg:col-span-6">
+            <h2 className="text-lg font-semibold">Selected Work</h2>
+            <ul className="mt-4 space-y-4 text-sm text-[#334155]">
+              <li className="rounded-xl border border-[#CBD5E1] p-4">
+                <p className="font-semibold text-[#0F172A]">Rapid Prototyping at Scale</p>
+                <p>100+ rapid prototypes for major hyper-casual publishers.</p>
+              </li>
+              <li className="rounded-xl border border-[#CBD5E1] p-4">
+                <p className="font-semibold text-[#0F172A]">Sneaky Warrior 3D</p>
+                <p>Skinned-mesh chunking, visibility gating, and workload control for enemy-heavy scenarios.</p>
+              </li>
+            </ul>
+          </section>
+
+          <section id="cta" className="rounded-2xl border border-[#CBD5E1] bg-[#EFF6FF] p-6 lg:col-span-12">
+            <h2 className="text-lg font-semibold">Ready for deep Unity performance ownership?</h2>
+            <p className="mt-2 max-w-3xl text-sm text-[#334155]">
+              For senior Unity performance, rendering optimization, and XR frame-budget reliability work, reach out directly.
+            </p>
+            <div className="mt-4 flex flex-wrap gap-3">
+              <SmartLink href="mailto:jamesderaja@gmail.com" className="inline-flex items-center rounded-lg bg-[#0F766E] px-4 py-2.5 text-sm font-semibold text-white hover:bg-[#115E59]">Email James</SmartLink>
+              <SmartLink href="https://www.linkedin.com/in/james-de-raja/" className="inline-flex items-center rounded-lg border border-[#CBD5E1] px-4 py-2.5 text-sm font-medium text-[#0F172A] hover:bg-white">Message on LinkedIn</SmartLink>
+              <SmartLink href="https://github.com/JamesDeRaja" className="inline-flex items-center rounded-lg border border-[#CBD5E1] px-4 py-2.5 text-sm font-medium text-[#0F172A] hover:bg-white">Review GitHub</SmartLink>
+            </div>
+          </section>
+        </div>
       </main>
     </div>
   );