From 80bf29e2aa9d86d1a29beae2499fd284c15e5ecb Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Mon, 2 Feb 2026 18:27:06 +0000
Subject: [PATCH 1/2] chore: bump version to trigger Vercel deployment

https://claude.ai/code/session_011NWj4qHMpnJqseDYB5et8R
---
 web/package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/web/package.json b/web/package.json
index e67b94a..92dac0c 100644
--- a/web/package.json
+++ b/web/package.json
@@ -1,6 +1,6 @@
 {
   "name": "web",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "private": true,
   "scripts": {
     "dev": "next dev",

From ed41acbce1511ba0fc3b9072610a4cc47de6cf36 Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Mon, 2 Feb 2026 18:45:43 +0000
Subject: [PATCH 2/2] feat(ui): restore AstroTinyML design matching larun.space

- Updated homepage with Google-inspired minimal aesthetic
- AstroTinyML branding with blue accent colors
- 4-column How It Works section with numbered cards
- 6-feature grid highlighting TinyML 81.8% accuracy
- Target audience tags section
- Fixed header navigation
- Dark CTA section
- Clean footer

https://claude.ai/code/session_011NWj4qHMpnJqseDYB5et8R
---
 web/src/app/layout.tsx |   6 +-
 web/src/app/page.tsx   | 612 +++++++++++++++++++++++------------------
 2 files changed, 350 insertions(+), 268 deletions(-)

diff --git a/web/src/app/layout.tsx b/web/src/app/layout.tsx
index 2381ba1..3de8a01 100644
--- a/web/src/app/layout.tsx
+++ b/web/src/app/layout.tsx
@@ -3,9 +3,9 @@ import "./globals.css";
 import { AuthProvider } from "@/lib/auth-provider";
 
 export const metadata: Metadata = {
-  title: "LARUN - Discover Exoplanets with AI",
-  description: "AI-powered light curve analysis for exoplanet discovery. Upload your astronomical data and let machine learning find hidden worlds.",
-  keywords: ["exoplanet", "astronomy", "AI", "light curve", "transit detection", "machine learning"],
+  title: "AstroTinyML - Discover Exoplanets with AI",
+  description: "TinyML-powered exoplanet detection achieving 81.8% accuracy. Upload light curve data from Kepler, TESS, or ground-based telescopes.",
+  keywords: ["exoplanet", "astronomy", "AI", "TinyML", "light curve", "transit detection", "Kepler", "TESS"],
 };
 
 export default function RootLayout({
diff --git a/web/src/app/page.tsx b/web/src/app/page.tsx
index 382108a..d3c99c3 100644
--- a/web/src/app/page.tsx
+++ b/web/src/app/page.tsx
@@ -1,331 +1,413 @@
 import Link from 'next/link';
-import Button from '@/components/ui/Button';
-import { Card, CardHeader, CardTitle, CardDescription, CardContent } from '@/components/ui/Card';
 
 export default function HomePage() {
   return (
-    <div className="flex flex-col">
-      {/* Hero Section */}
-      <section className="relative overflow-hidden bg-gradient-to-br from-slate-900 via-indigo-950 to-slate-900 text-white">
-        {/* Background stars effect */}
-        <div className="absolute inset-0 overflow-hidden">
-          <div className="absolute top-1/4 left-1/4 w-2 h-2 bg-white rounded-full opacity-60 animate-pulse" />
-          <div className="absolute top-1/3 right-1/3 w-1 h-1 bg-white rounded-full opacity-40 animate-pulse delay-100" />
-          <div className="absolute top-2/3 left-1/2 w-1.5 h-1.5 bg-white rounded-full opacity-50 animate-pulse delay-200" />
-          <div className="absolute top-1/2 right-1/4 w-1 h-1 bg-white rounded-full opacity-30 animate-pulse delay-300" />
-          <div className="absolute bottom-1/4 left-1/3 w-2 h-2 bg-indigo-400 rounded-full opacity-40 animate-pulse delay-150" />
-          <div className="absolute top-1/5 right-1/2 w-1 h-1 bg-purple-300 rounded-full opacity-50 animate-pulse delay-250" />
-        </div>
+    <div className="flex flex-col min-h-screen">
+      {/* Header Navigation */}
+      <header className="fixed top-0 left-0 right-0 bg-white border-b border-gray-200 z-50">
+        <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+          <div className="flex items-center justify-between h-16">
+            {/* Logo */}
+            <Link href="/" className="flex items-center gap-2">
+              <div className="w-8 h-8 bg-blue-600 rounded-lg flex items-center justify-center">
+                <svg className="w-5 h-5 text-white" fill="currentColor" viewBox="0 0 24 24">
+                  <circle cx="12" cy="12" r="3" />
+                  <path d="M12 2a10 10 0 100 20 10 10 0 000-20zm0 18a8 8 0 110-16 8 8 0 010 16z" opacity="0.3" />
+                </svg>
+              </div>
+              <span className="text-xl font-semibold text-gray-900">AstroTinyML</span>
+            </Link>
 
-        <div className="relative max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-24 md:py-32 lg:py-40">
-          <div className="text-center max-w-4xl mx-auto">
-            <h1 className="text-4xl md:text-5xl lg:text-6xl font-bold tracking-tight mb-6">
-              Discover Exoplanets
-              <span className="block text-transparent bg-clip-text bg-gradient-to-r from-indigo-400 to-purple-400">
-                with AI
-              </span>
-            </h1>
-            <p className="text-lg md:text-xl text-slate-300 mb-8 max-w-2xl mx-auto">
-              Upload your light curve data and let our advanced machine learning models
-              detect planetary transits with unprecedented accuracy. Find hidden worlds
-              in your astronomical observations.
-            </p>
-            <div className="flex flex-col sm:flex-row gap-4 justify-center">
-              <Link href="/auth/register">
-                <Button size="lg" className="bg-indigo-500 hover:bg-indigo-600">
-                  Start Free Trial
-                </Button>
+            {/* Center Navigation */}
+            <nav className="hidden md:flex items-center gap-8">
+              <Link href="/dashboard" className="text-gray-600 hover:text-gray-900 text-sm font-medium">
+                Dashboard
               </Link>
-              <Link href="#features">
-                <Button size="lg" variant="outline" className="border-white/30 text-white hover:bg-white/10">
-                  Learn More
-                </Button>
+              <Link href="#pricing" className="text-gray-600 hover:text-gray-900 text-sm font-medium">
+                Pricing
+              </Link>
+              <Link href="#features" className="text-gray-600 hover:text-gray-900 text-sm font-medium">
+                Docs
+              </Link>
+              <Link href="/analyze" className="text-gray-600 hover:text-gray-900 text-sm font-medium">
+                Download
+              </Link>
+            </nav>
+
+            {/* Auth Buttons */}
+            <div className="flex items-center gap-3">
+              <Link
+                href="/auth/login"
+                className="text-gray-600 hover:text-gray-900 text-sm font-medium"
+              >
+                Sign In
+              </Link>
+              <Link
+                href="/auth/register"
+                className="bg-blue-600 hover:bg-blue-700 text-white text-sm font-medium px-4 py-2 rounded-md transition-colors"
+              >
+                Get Started
               </Link>
             </div>
-            <p className="mt-6 text-sm text-slate-400">
-              No credit card required. 3 free analyses included.
-            </p>
           </div>
         </div>
+      </header>
 
-        {/* Wave divider */}
-        <div className="absolute bottom-0 left-0 right-0">
-          <svg viewBox="0 0 1440 120" fill="none" xmlns="http://www.w3.org/2000/svg">
-            <path d="M0 120L60 110C120 100 240 80 360 70C480 60 600 60 720 65C840 70 960 80 1080 85C1200 90 1320 90 1380 90L1440 90V120H1380C1320 120 1200 120 1080 120C960 120 840 120 720 120C600 120 480 120 360 120C240 120 120 120 60 120H0Z" fill="white"/>
-          </svg>
+      {/* Hero Section */}
+      <section className="pt-32 pb-20 bg-white">
+        <div className="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
+          <h1 className="text-4xl md:text-5xl lg:text-6xl font-bold text-gray-900 mb-6">
+            AstroTinyML
+          </h1>
+          <p className="text-xl md:text-2xl text-gray-600 mb-8">
+            Discover exoplanets with AI
+          </p>
+          <p className="text-gray-500 max-w-2xl mx-auto mb-10">
+            Upload your light curve data and let our TinyML-powered detection models
+            find planetary transits with 81.8% accuracy. Built for researchers,
+            students, and astronomy enthusiasts.
+          </p>
+          <div className="flex flex-col sm:flex-row gap-4 justify-center">
+            <Link
+              href="/auth/register"
+              className="bg-blue-600 hover:bg-blue-700 text-white font-medium px-8 py-3 rounded-md transition-colors"
+            >
+              Start Exploring - Free
+            </Link>
+            <Link
+              href="/analyze"
+              className="bg-white hover:bg-gray-50 text-gray-700 font-medium px-8 py-3 rounded-md border border-gray-300 transition-colors"
+            >
+              Try Demo
+            </Link>
+          </div>
         </div>
       </section>
 
       {/* How It Works Section */}
-      <section id="features" className="py-20 md:py-28 bg-white">
+      <section className="py-20 bg-gray-50">
         <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
-          <div className="text-center mb-16">
-            <h2 className="text-3xl md:text-4xl font-bold text-slate-900 mb-4">
-              How It Works
-            </h2>
-            <p className="text-lg text-slate-600 max-w-2xl mx-auto">
-              From raw data to discovered planets in three simple steps
-            </p>
-          </div>
+          <h2 className="text-3xl font-bold text-gray-900 text-center mb-4">
+            How It Works
+          </h2>
+          <p className="text-gray-600 text-center mb-12 max-w-2xl mx-auto">
+            From raw telescope data to discovered planets in four simple steps
+          </p>
 
-          <div className="grid md:grid-cols-3 gap-8 lg:gap-12">
+          <div className="grid md:grid-cols-4 gap-6">
             {/* Step 1 */}
-            <div className="text-center">
-              <div className="w-16 h-16 bg-indigo-100 rounded-2xl flex items-center justify-center mx-auto mb-6">
-                <svg className="w-8 h-8 text-indigo-600" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                  <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-8l-4-4m0 0L8 8m4-4v12" />
-                </svg>
-              </div>
-              <div className="inline-block px-3 py-1 bg-indigo-50 text-indigo-600 text-sm font-medium rounded-full mb-4">
-                Step 1
+            <div className="bg-white rounded-lg p-6 shadow-sm hover:shadow-md transition-shadow">
+              <div className="w-10 h-10 bg-blue-100 text-blue-600 rounded-full flex items-center justify-center font-bold text-lg mb-4">
+                1
               </div>
-              <h3 className="text-xl font-semibold text-slate-900 mb-3">Upload Your Data</h3>
-              <p className="text-slate-600">
-                Upload light curve data in CSV, FITS, or standard astronomical formats.
-                We support data from Kepler, TESS, and ground-based observatories.
+              <h3 className="text-lg font-semibold text-gray-900 mb-2">Upload Data</h3>
+              <p className="text-gray-600 text-sm">
+                Upload light curve data in CSV or FITS format from Kepler, TESS, or ground-based telescopes.
               </p>
             </div>
 
             {/* Step 2 */}
+            <div className="bg-white rounded-lg p-6 shadow-sm hover:shadow-md transition-shadow">
+              <div className="w-10 h-10 bg-blue-100 text-blue-600 rounded-full flex items-center justify-center font-bold text-lg mb-4">
+                2
+              </div>
+              <h3 className="text-lg font-semibold text-gray-900 mb-2">Preprocess</h3>
+              <p className="text-gray-600 text-sm">
+                Automatic noise reduction, normalization, and outlier removal prepares your data for analysis.
+              </p>
+            </div>
+
+            {/* Step 3 */}
+            <div className="bg-white rounded-lg p-6 shadow-sm hover:shadow-md transition-shadow">
+              <div className="w-10 h-10 bg-blue-100 text-blue-600 rounded-full flex items-center justify-center font-bold text-lg mb-4">
+                3
+              </div>
+              <h3 className="text-lg font-semibold text-gray-900 mb-2">AI Detection</h3>
+              <p className="text-gray-600 text-sm">
+                TinyML models analyze patterns to detect planetary transit signals with high precision.
+              </p>
+            </div>
+
+            {/* Step 4 */}
+            <div className="bg-white rounded-lg p-6 shadow-sm hover:shadow-md transition-shadow">
+              <div className="w-10 h-10 bg-blue-100 text-blue-600 rounded-full flex items-center justify-center font-bold text-lg mb-4">
+                4
+              </div>
+              <h3 className="text-lg font-semibold text-gray-900 mb-2">Get Results</h3>
+              <p className="text-gray-600 text-sm">
+                Receive detailed reports with candidate planets, orbital parameters, and visualizations.
+              </p>
+            </div>
+          </div>
+        </div>
+      </section>
+
+      {/* Features Section */}
+      <section id="features" className="py-20 bg-white">
+        <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+          <h2 className="text-3xl font-bold text-gray-900 text-center mb-4">
+            Features
+          </h2>
+          <p className="text-gray-600 text-center mb-12 max-w-2xl mx-auto">
+            Powerful tools for exoplanet detection and analysis
+          </p>
+
+          <div className="grid md:grid-cols-3 gap-8">
+            {/* Feature 1 */}
             <div className="text-center">
-              <div className="w-16 h-16 bg-purple-100 rounded-2xl flex items-center justify-center mx-auto mb-6">
-                <svg className="w-8 h-8 text-purple-600" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+              <div className="w-14 h-14 bg-blue-100 rounded-xl flex items-center justify-center mx-auto mb-4">
+                <svg className="w-7 h-7 text-blue-600" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                   <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9.663 17h4.673M12 3v1m6.364 1.636l-.707.707M21 12h-1M4 12H3m3.343-5.657l-.707-.707m2.828 9.9a5 5 0 117.072 0l-.548.547A3.374 3.374 0 0014 18.469V19a2 2 0 11-4 0v-.531c0-.895-.356-1.754-.988-2.386l-.548-.547z" />
                 </svg>
               </div>
-              <div className="inline-block px-3 py-1 bg-purple-50 text-purple-600 text-sm font-medium rounded-full mb-4">
-                Step 2
+              <h3 className="text-lg font-semibold text-gray-900 mb-2">TinyML Detection</h3>
+              <p className="text-gray-600 text-sm">
+                Edge-optimized models achieving <strong>81.8% accuracy</strong> in transit detection
+              </p>
+            </div>
+
+            {/* Feature 2 */}
+            <div className="text-center">
+              <div className="w-14 h-14 bg-green-100 rounded-xl flex items-center justify-center mx-auto mb-4">
+                <svg className="w-7 h-7 text-green-600" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                  <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M19.428 15.428a2 2 0 00-1.022-.547l-2.387-.477a6 6 0 00-3.86.517l-.318.158a6 6 0 01-3.86.517L6.05 15.21a2 2 0 00-1.806.547M8 4h8l-1 1v5.172a2 2 0 00.586 1.414l5 5c1.26 1.26.367 3.414-1.415 3.414H4.828c-1.782 0-2.674-2.154-1.414-3.414l5-5A2 2 0 009 10.172V5L8 4z" />
+                </svg>
               </div>
-              <h3 className="text-xl font-semibold text-slate-900 mb-3">AI Analysis</h3>
-              <p className="text-slate-600">
-                Our deep learning models analyze your data using Box Least Squares (BLS)
-                and neural network ensemble methods to detect transit signals.
+              <h3 className="text-lg font-semibold text-gray-900 mb-2">NASA TESS/Kepler Data</h3>
+              <p className="text-gray-600 text-sm">
+                Direct integration with NASA mission archives for seamless data access
               </p>
             </div>
 
-            {/* Step 3 */}
+            {/* Feature 3 */}
             <div className="text-center">
-              <div className="w-16 h-16 bg-emerald-100 rounded-2xl flex items-center justify-center mx-auto mb-6">
-                <svg className="w-8 h-8 text-emerald-600" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+              <div className="w-14 h-14 bg-purple-100 rounded-xl flex items-center justify-center mx-auto mb-4">
+                <svg className="w-7 h-7 text-purple-600" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                   <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z" />
                 </svg>
               </div>
-              <div className="inline-block px-3 py-1 bg-emerald-50 text-emerald-600 text-sm font-medium rounded-full mb-4">
-                Step 3
+              <h3 className="text-lg font-semibold text-gray-900 mb-2">Interactive Visualizations</h3>
+              <p className="text-gray-600 text-sm">
+                Explore light curves, phase-folded transits, and orbital diagrams interactively
+              </p>
+            </div>
+
+            {/* Feature 4 */}
+            <div className="text-center">
+              <div className="w-14 h-14 bg-orange-100 rounded-xl flex items-center justify-center mx-auto mb-4">
+                <svg className="w-7 h-7 text-orange-600" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                  <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M13 10V3L4 14h7v7l9-11h-7z" />
+                </svg>
+              </div>
+              <h3 className="text-lg font-semibold text-gray-900 mb-2">Fast Processing</h3>
+              <p className="text-gray-600 text-sm">
+                Analyze thousands of light curves in minutes with optimized algorithms
+              </p>
+            </div>
+
+            {/* Feature 5 */}
+            <div className="text-center">
+              <div className="w-14 h-14 bg-red-100 rounded-xl flex items-center justify-center mx-auto mb-4">
+                <svg className="w-7 h-7 text-red-600" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                  <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-4l-4 4m0 0l-4-4m4 4V4" />
+                </svg>
+              </div>
+              <h3 className="text-lg font-semibold text-gray-900 mb-2">Export Results</h3>
+              <p className="text-gray-600 text-sm">
+                Download reports in CSV, JSON, or PDF format for further analysis
+              </p>
+            </div>
+
+            {/* Feature 6 */}
+            <div className="text-center">
+              <div className="w-14 h-14 bg-teal-100 rounded-xl flex items-center justify-center mx-auto mb-4">
+                <svg className="w-7 h-7 text-teal-600" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                  <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M12 6V4m0 2a2 2 0 100 4m0-4a2 2 0 110 4m-6 8a2 2 0 100-4m0 4a2 2 0 110-4m0 4v2m0-6V4m6 6v10m6-2a2 2 0 100-4m0 4a2 2 0 110-4m0 4v2m0-6V4" />
+                </svg>
               </div>
-              <h3 className="text-xl font-semibold text-slate-900 mb-3">Get Results</h3>
-              <p className="text-slate-600">
-                Receive detailed reports with candidate planets, orbital parameters,
-                confidence scores, and interactive visualizations of your discoveries.
+              <h3 className="text-lg font-semibold text-gray-900 mb-2">API Access</h3>
+              <p className="text-gray-600 text-sm">
+                Integrate detection capabilities into your own applications via REST API
               </p>
             </div>
           </div>
         </div>
       </section>
 
-      {/* Pricing Section */}
-      <section id="pricing" className="py-20 md:py-28 bg-slate-50">
-        <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
-          <div className="text-center mb-16">
-            <h2 className="text-3xl md:text-4xl font-bold text-slate-900 mb-4">
-              Simple, Transparent Pricing
-            </h2>
-            <p className="text-lg text-slate-600 max-w-2xl mx-auto">
-              Start free, then choose the plan that fits your research needs
-            </p>
+      {/* Target Audience Section */}
+      <section className="py-16 bg-gray-50">
+        <div className="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
+          <h2 className="text-2xl font-bold text-gray-900 mb-8">
+            Built For
+          </h2>
+          <div className="flex flex-wrap justify-center gap-3">
+            <span className="bg-white text-gray-700 px-4 py-2 rounded-full text-sm font-medium shadow-sm border border-gray-200">
+              Researchers
+            </span>
+            <span className="bg-white text-gray-700 px-4 py-2 rounded-full text-sm font-medium shadow-sm border border-gray-200">
+              Students
+            </span>
+            <span className="bg-white text-gray-700 px-4 py-2 rounded-full text-sm font-medium shadow-sm border border-gray-200">
+              Amateur Astronomers
+            </span>
+            <span className="bg-white text-gray-700 px-4 py-2 rounded-full text-sm font-medium shadow-sm border border-gray-200">
+              Educators
+            </span>
+            <span className="bg-white text-gray-700 px-4 py-2 rounded-full text-sm font-medium shadow-sm border border-gray-200">
+              Enthusiasts
+            </span>
           </div>
+        </div>
+      </section>
+
+      {/* Pricing Section */}
+      <section id="pricing" className="py-20 bg-white">
+        <div className="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8">
+          <h2 className="text-3xl font-bold text-gray-900 text-center mb-4">
+            Simple Pricing
+          </h2>
+          <p className="text-gray-600 text-center mb-12">
+            Start free, upgrade when you need more
+          </p>
 
-          <div className="grid md:grid-cols-3 gap-8 max-w-5xl mx-auto">
-            {/* Free Tier */}
-            <Card variant="bordered" padding="lg" className="relative">
-              <CardHeader>
-                <CardTitle>Free</CardTitle>
-                <CardDescription>Perfect for trying out LARUN</CardDescription>
-              </CardHeader>
-              <CardContent>
-                <div className="mb-6">
-                  <span className="text-4xl font-bold text-slate-900">$0</span>
-                  <span className="text-slate-500">/forever</span>
-                </div>
-                <ul className="space-y-3 mb-8">
-                  <li className="flex items-center gap-2 text-slate-600">
-                    <svg className="w-5 h-5 text-emerald-500" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                      <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M5 13l4 4L19 7" />
-                    </svg>
-                    3 analyses included
-                  </li>
-                  <li className="flex items-center gap-2 text-slate-600">
-                    <svg className="w-5 h-5 text-emerald-500" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                      <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M5 13l4 4L19 7" />
-                    </svg>
-                    Basic transit detection
-                  </li>
-                  <li className="flex items-center gap-2 text-slate-600">
-                    <svg className="w-5 h-5 text-emerald-500" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                      <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M5 13l4 4L19 7" />
-                    </svg>
-                    CSV export
-                  </li>
-                </ul>
-                <Link href="/auth/register">
-                  <Button variant="outline" fullWidth>
-                    Get Started
-                  </Button>
-                </Link>
-              </CardContent>
-            </Card>
+          <div className="grid md:grid-cols-3 gap-8">
+            {/* Free */}
+            <div className="bg-white border border-gray-200 rounded-lg p-6">
+              <h3 className="text-lg font-semibold text-gray-900 mb-2">Free</h3>
+              <p className="text-gray-500 text-sm mb-4">For getting started</p>
+              <div className="text-3xl font-bold text-gray-900 mb-6">$0</div>
+              <ul className="space-y-3 mb-6 text-sm text-gray-600">
+                <li className="flex items-center gap-2">
+                  <svg className="w-4 h-4 text-green-500" fill="currentColor" viewBox="0 0 20 20">
+                    <path fillRule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clipRule="evenodd" />
+                  </svg>
+                  3 analyses
+                </li>
+                <li className="flex items-center gap-2">
+                  <svg className="w-4 h-4 text-green-500" fill="currentColor" viewBox="0 0 20 20">
+                    <path fillRule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clipRule="evenodd" />
+                  </svg>
+                  Basic detection
+                </li>
+                <li className="flex items-center gap-2">
+                  <svg className="w-4 h-4 text-green-500" fill="currentColor" viewBox="0 0 20 20">
+                    <path fillRule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clipRule="evenodd" />
+                  </svg>
+                  CSV export
+                </li>
+              </ul>
+              <Link href="/auth/register" className="block text-center bg-gray-100 hover:bg-gray-200 text-gray-700 font-medium py-2 rounded-md transition-colors">
+                Get Started
+              </Link>
+            </div>
 
-            {/* Monthly Plan */}
-            <Card variant="elevated" padding="lg" className="relative border-2 border-indigo-500 ring-4 ring-indigo-500/10">
-              <div className="absolute -top-4 left-1/2 -translate-x-1/2">
-                <span className="bg-indigo-500 text-white text-sm font-medium px-4 py-1 rounded-full">
-                  Most Popular
-                </span>
+            {/* Monthly */}
+            <div className="bg-blue-600 text-white rounded-lg p-6 relative">
+              <div className="absolute -top-3 left-1/2 -translate-x-1/2 bg-orange-400 text-white text-xs font-medium px-3 py-1 rounded-full">
+                Popular
               </div>
-              <CardHeader>
-                <CardTitle>Monthly</CardTitle>
-                <CardDescription>For active researchers</CardDescription>
-              </CardHeader>
-              <CardContent>
-                <div className="mb-6">
-                  <span className="text-4xl font-bold text-slate-900">$9</span>
-                  <span className="text-slate-500">/month</span>
-                </div>
-                <ul className="space-y-3 mb-8">
-                  <li className="flex items-center gap-2 text-slate-600">
-                    <svg className="w-5 h-5 text-emerald-500" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                      <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M5 13l4 4L19 7" />
-                    </svg>
-                    50 analyses/month
-                  </li>
-                  <li className="flex items-center gap-2 text-slate-600">
-                    <svg className="w-5 h-5 text-emerald-500" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                      <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M5 13l4 4L19 7" />
-                    </svg>
-                    Advanced AI models
-                  </li>
-                  <li className="flex items-center gap-2 text-slate-600">
-                    <svg className="w-5 h-5 text-emerald-500" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                      <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M5 13l4 4L19 7" />
-                    </svg>
-                    Priority processing
-                  </li>
-                  <li className="flex items-center gap-2 text-slate-600">
-                    <svg className="w-5 h-5 text-emerald-500" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                      <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M5 13l4 4L19 7" />
-                    </svg>
-                    Interactive visualizations
-                  </li>
-                </ul>
-                <Link href="/auth/register">
-                  <Button fullWidth>
-                    Subscribe Now
-                  </Button>
-                </Link>
-              </CardContent>
-            </Card>
+              <h3 className="text-lg font-semibold mb-2">Monthly</h3>
+              <p className="text-blue-100 text-sm mb-4">For active users</p>
+              <div className="text-3xl font-bold mb-6">$9<span className="text-lg font-normal">/mo</span></div>
+              <ul className="space-y-3 mb-6 text-sm">
+                <li className="flex items-center gap-2">
+                  <svg className="w-4 h-4" fill="currentColor" viewBox="0 0 20 20">
+                    <path fillRule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clipRule="evenodd" />
+                  </svg>
+                  50 analyses/month
+                </li>
+                <li className="flex items-center gap-2">
+                  <svg className="w-4 h-4" fill="currentColor" viewBox="0 0 20 20">
+                    <path fillRule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clipRule="evenodd" />
+                  </svg>
+                  Advanced AI models
+                </li>
+                <li className="flex items-center gap-2">
+                  <svg className="w-4 h-4" fill="currentColor" viewBox="0 0 20 20">
+                    <path fillRule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clipRule="evenodd" />
+                  </svg>
+                  Priority processing
+                </li>
+              </ul>
+              <Link href="/auth/register" className="block text-center bg-white hover:bg-gray-100 text-blue-600 font-medium py-2 rounded-md transition-colors">
+                Subscribe
+              </Link>
+            </div>
 
-            {/* Annual Plan */}
-            <Card variant="bordered" padding="lg" className="relative">
-              <div className="absolute -top-4 left-1/2 -translate-x-1/2">
-                <span className="bg-emerald-500 text-white text-sm font-medium px-4 py-1 rounded-full">
-                  Save 17%
-                </span>
-              </div>
-              <CardHeader>
-                <CardTitle>Annual</CardTitle>
-                <CardDescription>Best value for teams</CardDescription>
-              </CardHeader>
-              <CardContent>
-                <div className="mb-6">
-                  <span className="text-4xl font-bold text-slate-900">$89</span>
-                  <span className="text-slate-500">/year</span>
-                </div>
-                <ul className="space-y-3 mb-8">
-                  <li className="flex items-center gap-2 text-slate-600">
-                    <svg className="w-5 h-5 text-emerald-500" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                      <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M5 13l4 4L19 7" />
-                    </svg>
-                    Unlimited analyses
-                  </li>
-                  <li className="flex items-center gap-2 text-slate-600">
-                    <svg className="w-5 h-5 text-emerald-500" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                      <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M5 13l4 4L19 7" />
-                    </svg>
-                    All AI models
-                  </li>
-                  <li className="flex items-center gap-2 text-slate-600">
-                    <svg className="w-5 h-5 text-emerald-500" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                      <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M5 13l4 4L19 7" />
-                    </svg>
-                    API access
-                  </li>
-                  <li className="flex items-center gap-2 text-slate-600">
-                    <svg className="w-5 h-5 text-emerald-500" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                      <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M5 13l4 4L19 7" />
-                    </svg>
-                    Dedicated support
-                  </li>
-                </ul>
-                <Link href="/auth/register">
-                  <Button variant="secondary" fullWidth>
-                    Subscribe Now
-                  </Button>
-                </Link>
-              </CardContent>
-            </Card>
+            {/* Annual */}
+            <div className="bg-white border border-gray-200 rounded-lg p-6">
+              <h3 className="text-lg font-semibold text-gray-900 mb-2">Annual</h3>
+              <p className="text-gray-500 text-sm mb-4">Best value</p>
+              <div className="text-3xl font-bold text-gray-900 mb-6">$89<span className="text-lg font-normal text-gray-500">/yr</span></div>
+              <ul className="space-y-3 mb-6 text-sm text-gray-600">
+                <li className="flex items-center gap-2">
+                  <svg className="w-4 h-4 text-green-500" fill="currentColor" viewBox="0 0 20 20">
+                    <path fillRule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clipRule="evenodd" />
+                  </svg>
+                  Unlimited analyses
+                </li>
+                <li className="flex items-center gap-2">
+                  <svg className="w-4 h-4 text-green-500" fill="currentColor" viewBox="0 0 20 20">
+                    <path fillRule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clipRule="evenodd" />
+                  </svg>
+                  All AI models
+                </li>
+                <li className="flex items-center gap-2">
+                  <svg className="w-4 h-4 text-green-500" fill="currentColor" viewBox="0 0 20 20">
+                    <path fillRule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clipRule="evenodd" />
+                  </svg>
+                  API access
+                </li>
+              </ul>
+              <Link href="/auth/register" className="block text-center bg-gray-100 hover:bg-gray-200 text-gray-700 font-medium py-2 rounded-md transition-colors">
+                Subscribe
+              </Link>
+            </div>
           </div>
         </div>
       </section>
 
       {/* CTA Section */}
-      <section id="about" className="py-20 md:py-28 bg-gradient-to-br from-indigo-600 to-purple-700 text-white">
-        <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
+      <section className="py-20 bg-gray-900 text-white">
+        <div className="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
           <h2 className="text-3xl md:text-4xl font-bold mb-6">
-            Ready to Discover New Worlds?
+            Start Exploring - Free
           </h2>
-          <p className="text-lg text-indigo-100 max-w-2xl mx-auto mb-8">
-            Join thousands of astronomers and citizen scientists using LARUN to
-            analyze light curves and discover exoplanets. Start your journey today.
+          <p className="text-gray-400 mb-8 max-w-2xl mx-auto">
+            Join researchers and astronomy enthusiasts discovering new worlds with AI-powered analysis. No credit card required.
           </p>
-          <div className="flex flex-col sm:flex-row gap-4 justify-center">
-            <Link href="/auth/register">
-              <Button size="lg" className="bg-white text-indigo-600 hover:bg-indigo-50">
-                Create Free Account
-              </Button>
-            </Link>
-            <Link href="/analyze">
-              <Button size="lg" variant="outline" className="border-white/30 text-white hover:bg-white/10">
-                Try Demo Analysis
-              </Button>
-            </Link>
-          </div>
+          <Link
+            href="/auth/register"
+            className="inline-block bg-blue-600 hover:bg-blue-700 text-white font-medium px-8 py-3 rounded-md transition-colors"
+          >
+            Create Free Account
+          </Link>
         </div>
       </section>
 
-      {/* Stats Section */}
-      <section className="py-16 bg-white border-t border-slate-100">
+      {/* Footer */}
+      <footer className="py-8 bg-gray-50 border-t border-gray-200">
         <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
-          <div className="grid grid-cols-2 md:grid-cols-4 gap-8 text-center">
-            <div>
-              <div className="text-3xl md:text-4xl font-bold text-indigo-600">10K+</div>
-              <div className="text-slate-600 mt-1">Light Curves Analyzed</div>
-            </div>
-            <div>
-              <div className="text-3xl md:text-4xl font-bold text-indigo-600">250+</div>
-              <div className="text-slate-600 mt-1">Candidates Found</div>
-            </div>
-            <div>
-              <div className="text-3xl md:text-4xl font-bold text-indigo-600">98%</div>
-              <div className="text-slate-600 mt-1">Detection Accuracy</div>
+          <div className="flex flex-col md:flex-row items-center justify-between gap-4">
+            <div className="flex items-center gap-2">
+              <div className="w-6 h-6 bg-blue-600 rounded flex items-center justify-center">
+                <svg className="w-4 h-4 text-white" fill="currentColor" viewBox="0 0 24 24">
+                  <circle cx="12" cy="12" r="3" />
+                </svg>
+              </div>
+              <span className="text-sm text-gray-600">AstroTinyML</span>
             </div>
-            <div>
-              <div className="text-3xl md:text-4xl font-bold text-indigo-600">5K+</div>
-              <div className="text-slate-600 mt-1">Active Users</div>
+            <div className="flex items-center gap-6 text-sm text-gray-500">
+              <Link href="#" className="hover:text-gray-700">Privacy</Link>
+              <Link href="#" className="hover:text-gray-700">Terms</Link>
+              <Link href="#" className="hover:text-gray-700">Contact</Link>
             </div>
+            <p className="text-sm text-gray-500">
+              &copy; {new Date().getFullYear()} AstroTinyML. All rights reserved.
+            </p>
           </div>
         </div>
-      </section>
+      </footer>
     </div>
   );
 }