components/Hero.jsx

import React from 'react';

const Hero = () => {
  return (
    <section className="bg-gradient-to-br from-primary-50 to-white py-20">
      <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
        <div className="text-center">
          <h1 className="text-4xl md:text-6xl font-bold text-gray-900 mb-6">
            Premium Data for 
            <span className="text-primary-600"> Large Language Models</span>
          </h1>
          <p className="text-xl text-gray-600 mb-8 max-w-3xl mx-auto">
            Access curated, high-quality datasets specifically designed for training and fine-tuning 
            state-of-the-art language models. Scale your AI projects with reliable, diverse data.
          </p>
          <div className="flex flex-col sm:flex-row gap-4 justify-center">
            <button className="bg-primary-600 text-white px-8 py-3 rounded-lg hover:bg-primary-700 transition-colors text-lg font-semibold">
              Explore Datasets
            </button>
            <button className="border border-gray-300 text-gray-700 px-8 py-3 rounded-lg hover:bg-gray-50 transition-colors text-lg font-semibold">
              Schedule Demo
            </button>
          </div>
        </div>
      </div>
    </section>
  );
};

export default Hero;