145 lines
7.2 KiB
TypeScript
145 lines
7.2 KiB
TypeScript
"use client";
|
|
|
|
import { motion } from 'framer-motion';
|
|
import { ArrowRight, Crosshair, Brain, BellRing, Ghost } from 'lucide-react';
|
|
import Link from 'next/link';
|
|
import GlitchText from '@/components/GlitchText';
|
|
|
|
const features = [
|
|
{
|
|
icon: Crosshair,
|
|
title: "Always-On Radar",
|
|
description: "Monitors dozens of auction sites simultaneously. The engine never sleeps, so you never miss an ending lot.",
|
|
},
|
|
{
|
|
icon: Brain,
|
|
title: "AI-Grade Filtering",
|
|
description: "External LLMs score and filter every lot against your precise custom targets. We drop the noise and show only true deals.",
|
|
},
|
|
{
|
|
icon: BellRing,
|
|
title: "Real-Time Comms",
|
|
description: "Instant alerts delivered via Telegram, Discord, or Email the minute a high-value lot appears or is about to close.",
|
|
},
|
|
{
|
|
icon: Ghost,
|
|
title: "Stealth Engine",
|
|
description: "Human-like browsing algorithms bypass standard detection, ensuring reliable intelligence gathering from any platform.",
|
|
}
|
|
];
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<div className="relative overflow-hidden w-full">
|
|
{/* Hero Section */}
|
|
<section className="container mx-auto px-4 pt-32 pb-24 text-center relative z-10">
|
|
<motion.div
|
|
initial={{ opacity: 0, y: 20 }}
|
|
animate={{ opacity: 1, y: 0 }}
|
|
transition={{ duration: 0.8 }}
|
|
className="max-w-4xl mx-auto"
|
|
>
|
|
<div className="mb-6 inline-flex items-center gap-2 px-3 py-1 rounded-full bg-primary/10 border border-primary/30 text-primary text-sm font-mono uppercase">
|
|
<span className="w-2 h-2 rounded-full bg-primary animate-pulse"></span>
|
|
System v4 Deployed
|
|
</div>
|
|
<h1 className="text-5xl md:text-7xl font-bold mb-6 tracking-tight">
|
|
The AI Sniper That <br />
|
|
<span className="text-primary neon-text-primary"><GlitchText text="NEVER SLEEPS" /></span>
|
|
</h1>
|
|
<p className="text-xl md:text-2xl text-muted-foreground mb-10 max-w-2xl mx-auto">
|
|
BidWraith watches every global auction site, scores every lot with AI, and alerts you the moment a real deal drops.
|
|
</p>
|
|
|
|
<div className="flex flex-col sm:flex-row gap-4 justify-center">
|
|
<Link href="/dashboard" className="inline-flex items-center justify-center gap-2 bg-primary hover:bg-primary/90 text-primary-foreground px-8 py-4 rounded-md font-bold text-lg transition-all shadow-[0_0_20px_rgba(0,255,136,0.3)] hover:shadow-[0_0_30px_rgba(0,255,136,0.5)]">
|
|
Initialize Console <ArrowRight className="w-5 h-5" />
|
|
</Link>
|
|
<Link href="#features" className="inline-flex items-center justify-center gap-2 bg-card hover:bg-card/80 border border-border px-8 py-4 rounded-md font-bold text-lg transition-colors">
|
|
Read Briefing
|
|
</Link>
|
|
</div>
|
|
</motion.div>
|
|
</section>
|
|
|
|
{/* Stats Strip */}
|
|
<section className="border-y border-border bg-card/50 backdrop-blur-sm py-8 relative z-10">
|
|
<div className="container mx-auto px-4">
|
|
<div className="grid grid-cols-2 md:grid-cols-4 gap-8 text-center font-mono">
|
|
<div>
|
|
<div className="text-3xl font-bold text-primary mb-1">24/7</div>
|
|
<div className="text-sm text-muted-foreground">Uptime</div>
|
|
</div>
|
|
<div>
|
|
<div className="text-3xl font-bold text-accent mb-1">< 1s</div>
|
|
<div className="text-sm text-muted-foreground">Alert Latency</div>
|
|
</div>
|
|
<div>
|
|
<div className="text-3xl font-bold text-primary mb-1">42</div>
|
|
<div className="text-sm text-muted-foreground">API Endpoints</div>
|
|
</div>
|
|
<div>
|
|
<div className="text-3xl font-bold text-accent mb-1">100%</div>
|
|
<div className="text-sm text-muted-foreground">Stealth Rate</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
{/* Features Section */}
|
|
<section id="features" className="py-24 relative z-10">
|
|
<div className="container mx-auto px-4">
|
|
<div className="text-center mb-16">
|
|
<h2 className="text-3xl md:text-5xl font-bold mb-4">Core <span className="text-primary">Directives</span></h2>
|
|
<p className="text-muted-foreground text-lg max-w-2xl mx-auto">Advanced architecture designed to give you an unfair advantage in the global market.</p>
|
|
</div>
|
|
|
|
<div className="grid md:grid-cols-2 gap-8 max-w-5xl mx-auto">
|
|
{features.map((feature, idx) => (
|
|
<motion.div
|
|
key={idx}
|
|
initial={{ opacity: 0, y: 20 }}
|
|
whileInView={{ opacity: 1, y: 0 }}
|
|
viewport={{ once: true }}
|
|
transition={{ delay: idx * 0.1 }}
|
|
className="p-8 rounded-xl bg-card border border-border hover:border-primary/50 transition-colors group relative overflow-hidden"
|
|
>
|
|
<div className="absolute top-0 left-0 w-full h-1 bg-gradient-to-r from-transparent via-primary/50 to-transparent opacity-0 group-hover:opacity-100 transition-opacity" />
|
|
<feature.icon className="w-12 h-12 text-primary mb-6" />
|
|
<h3 className="text-2xl font-bold mb-3">{feature.title}</h3>
|
|
<p className="text-muted-foreground leading-relaxed">
|
|
{feature.description}
|
|
</p>
|
|
</motion.div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
{/* Diagram Section */}
|
|
<section className="py-24 bg-card/30 border-t border-border relative z-10">
|
|
<div className="container mx-auto px-4 text-center">
|
|
<h2 className="text-3xl md:text-4xl font-bold mb-12">The <span className="text-accent">Execution</span> Pipeline</h2>
|
|
<div className="flex flex-col md:flex-row items-center justify-center gap-4 md:gap-8 text-lg font-mono">
|
|
<div className="p-4 border border-border rounded bg-card w-48 shadow-[0_0_15px_rgba(251,191,36,0.1)]">Targets & Rules</div>
|
|
<ArrowRight className="w-6 h-6 text-muted-foreground rotate-90 md:rotate-0" />
|
|
<div className="p-4 border border-primary/50 rounded bg-primary/5 w-48 shadow-[0_0_15px_rgba(0,255,136,0.2)] text-primary">Ghost Scraper</div>
|
|
<ArrowRight className="w-6 h-6 text-muted-foreground rotate-90 md:rotate-0" />
|
|
<div className="p-4 border border-border rounded bg-card w-48 shadow-[0_0_15px_rgba(251,191,36,0.1)]">AI Analysis</div>
|
|
<ArrowRight className="w-6 h-6 text-muted-foreground rotate-90 md:rotate-0" />
|
|
<div className="p-4 border border-accent/50 rounded bg-accent/5 w-48 shadow-[0_0_15px_rgba(251,191,36,0.2)] text-accent">Real-time Alerts</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
{/* Footer CTA */}
|
|
<section className="py-32 text-center relative z-10">
|
|
<h2 className="text-4xl md:text-5xl font-bold mb-8">Ready to dominate the market?</h2>
|
|
<Link href="/dashboard" className="inline-flex items-center gap-2 text-primary hover:text-accent font-mono text-xl transition-colors">
|
|
> ACCESS_SYSTEM_NOW <span className="animate-pulse">_</span>
|
|
</Link>
|
|
</section>
|
|
</div>
|
|
);
|
|
}
|