Untitled

import { useState, useEffect } from "react"; import { motion } from "framer-motion"; import { MessageCircle, Moon, Sun } from "lucide-react"; import { Button } from "@/components/ui/button"; import { Card, CardContent } from "@/components/ui/card";

export default function LabelzAIWebsite() { const [dark, setDark] = useState(false);

useEffect(() => { if (dark) document.documentElement.classList.add("dark"); else document.documentElement.classList.remove("dark"); }, [dark]);

return ( <div className="min-h-screen bg-slate-50 dark:bg-slate-950 text-slate-800 dark:text-slate-100"> {/* NAVBAR */} <header className="sticky top-0 z-50 backdrop-blur bg-white/70 dark:bg-slate-900/70 border-b"> <div className="max-w-7xl mx-auto px-6 py-4 flex justify-between items-center"> <h1 className="text-2xl font-bold text-blue-600">LabelzAI</h1>

<div className="flex items-center gap-4">
        <Button
                  variant="outline"
                            size="icon"
                                      onClick={() => setDark(!dark)}
                                              >
                                                        {dark ? <Sun size={18} /> : <Moon size={18} />}
                                                                </Button>
                                                                
                                                                        <Button className="rounded-2xl">Get Quote</Button>
                                                                              </div>
                                                                                  </div>
                                                                                    </header>
                                                                                    
                                                                                      {/* HERO */}
                                                                                        <section className="relative overflow-hidden">
                                                                                            <div className="absolute inset-0 opacity-20">
                                                                                                  <div className="absolute w-96 h-96 bg-blue-500 rounded-full blur-3xl -top-20 -left-20" />
                                                                                                        <div className="absolute w-96 h-96 bg-teal-400 rounded-full blur-3xl bottom-0 right-0" />
                                                                                                            </div>
                                                                                                            
                                                                                                                <div className="max-w-7xl mx-auto px-6 py-24 grid md:grid-cols-2 gap-10 items-center relative">
                                                                                                                      <motion.div
                                                                                                                              initial={{ opacity: 0, y: 40 }}
                                                                                                                                      animate={{ opacity: 1, y: 0 }}
                                                                                                                                              transition={{ duration: 0.6 }}
                                                                                                                                                    >
                                                                                                                                                            <h2 className="text-4xl md:text-5xl font-bold leading-tight mb-6">
                                                                                                                                                                      Next-Gen <span className="text-blue-600">Data Annotation</span>
                                                                                                                                                                                <br /> for Scalable AI
                                                                                                                                                                                        </h2>
                                                                                                                                                                                        
                                                                                                                                                                                                <p className="text-lg text-slate-600 dark:text-slate-300 mb-8">
                                                                                                                                                                                                          Enterprise-grade image, text, and video labeling with 99%+
                                                                                                                                                                                                                    accuracy, secure pipelines, and lightning-fast turnaround.
                                                                                                                                                                                                                            </p>
                                                                                                                                                                                                                            
                                                                                                                                                                                                                                    <div className="flex gap-4">
                                                                                                                                                                                                                                              <Button className="rounded-2xl px-8 py-6 text-lg">
                                                                                                                                                                                                                                                          Get Free Quote
                                                                                                                                                                                                                                                                    </Button>
                                                                                                                                                                                                                                                                              <Button variant="outline" className="rounded-2xl px-8 py-6">
                                                                                                                                                                                                                                                                                          View Services
                                                                                                                                                                                                                                                                                                    </Button>
                                                                                                                                                                                                                                                                                                            </div>
                                                                                                                                                                                                                                                                                                                  </motion.div>
                                                                                                                                                                                                                                                                                                                  
                                                                                                                                                                                                                                                                                                                        <motion.div
                                                                                                                                                                                                                                                                                                                                initial={{ opacity: 0, scale: 0.9 }}
                                                                                                                                                                                                                                                                                                                                        animate={{ opacity: 1, scale: 1 }}
                                                                                                                                                                                                                                                                                                                                                transition={{ duration: 0.6, delay: 0.2 }}
                                                                                                                                                                                                                                                                                                                                                      >
                                                                                                                                                                                                                                                                                                                                                              <Card className="rounded-3xl shadow-2xl">
                                                                                                                                                                                                                                                                                                                                                                        <CardContent className="p-12 text-center">
                                                                                                                                                                                                                                                                                                                                                                                    <div className="text-5xl font-bold text-blue-600 mb-4">
                                                                                                                                                                                                                                                                                                                                                                                                  99%+
                                                                                                                                                                                                                                                                                                                                                                                                              </div>
                                                                                                                                                                                                                                                                                                                                                                                                                          <p className="text-slate-500">Annotation Accuracy</p>
                                                                                                                                                                                                                                                                                                                                                                                                                                    </CardContent>
                                                                                                                                                                                                                                                                                                                                                                                                                                            </Card>
                                                                                                                                                                                                                                                                                                                                                                                                                                                  </motion.div>
                                                                                                                                                                                                                                                                                                                                                                                                                                                      </div>
                                                                                                                                                                                                                                                                                                                                                                                                                                                        </section>
                                                                                                                                                                                                                                                                                                                                                                                                                                                        
                                                                                                                                                                                                                                                                                                                                                                                                                                                          {/* SERVICES */}
                                                                                                                                                                                                                                                                                                                                                                                                                                                            <section className="py-24">
                                                                                                                                                                                                                                                                                                                                                                                                                                                                <div className="max-w-7xl mx-auto px-6 text-center">
                                                                                                                                                                                                                                                                                                                                                                                                                                                                      <h3 className="text-3xl font-bold mb-14">Premium Services</h3>
                                                                                                                                                                                                                                                                                                                                                                                                                                                                      
                                                                                                                                                                                                                                                                                                                                                                                                                                                                            <div className="grid md:grid-cols-3 gap-8">
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    {[
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                  {
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                title: "Image Annotation",
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            desc: "Bounding box, polygon, segmentation, keypoints.",
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                  },
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            {
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            title: "Text Annotation",
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                        desc: "NER, sentiment, classification, intent tagging.",
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            },
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                      {
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    title: "Video Annotation",
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                desc: "Object tracking and frame-level labeling.",
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                      },
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    ].map((s, i) => (
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                  <motion.div
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    ))
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                      }
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            }
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                  }
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    ]})}