components/Features.jsx

import React from 'react';
import FeatureCard from './FeatureCard';
import { ShieldCheck, Zap, Globe, Lock, Server, BarChart } from 'lucide-react';

export default function Features() {
  const features = [
    {
      icon: Globe,
      title: "Multilingual Corpus",
      description: "Access diverse datasets spanning 100+ languages, carefully curated to reduce bias and improve global model performance."
    },
    {
      icon: Zap,
      title: "Low Latency Access",
      description: "Direct connect via our global edge network ensures your GPUs never wait for data. Optimized for high-throughput training."
    },
    {
      icon: ShieldCheck,
      title: "Cleaned & Tokenized",
      description: "Save months of preprocessing. Our data comes pre-cleaned, deduped, and optionally pre-tokenized for major architectures."
    },
    {
      icon: Lock,
      title: "Enterprise Security",
      description: "End-to-end encryption, VPC peering, and strict access controls. Your proprietary data remains yours, always."
    },
    {
      icon: Server,
      title: "Dedicated Hardware",
      description: "Option to reserve dedicated storage clusters for massive-scale training runs requiring petabytes of hot storage."
    },
    {
      icon: BarChart,
      title: "Data Versioning",
      description: "Full lineage tracking and immutable versioning for every dataset, ensuring reproducibility in your experiments."
    }
  ];

  return (
    <section id="features" className="py-24 bg-brand-dark relative">
      <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
        <div className="text-center mb-16">
          <h2 className="text-brand-accent font-semibold tracking-wide uppercase text-sm">Why NeuroData?</h2>
          <p className="mt-2 text-3xl font-extrabold text-white sm:text-4xl">
            Infrastructure built for the Intelligence Age
          </p>
          <p className="mt-4 max-w-2xl text-xl text-gray-400 mx-auto">
            We handle the data engineering complexity so you can focus on architecture and training.
          </p>
        </div>
        
        <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
          {features.map((feature, index) => (
            <FeatureCard 
              key={index}
              icon={feature.icon}
              title={feature.title}
              description={feature.description}
            />
          ))}
        </div>
      </div>
    </section>
  );
}