components/Hero.jsx

export default function Hero() {
  return (
    <section className="bg-marine-light py-20">
      <div className="container mx-auto px-4 text-center">
        <h1 className="text-4xl md:text-6xl font-bold text-marine-blue mb-6">
          Explore the Depths with SABMARINE
        </h1>
        <p className="text-xl text-marine-blue mb-8 max-w-3xl mx-auto">
          Leading provider of submarine solutions and marine technology services.
        </p>
        <button className="bg-marine-teal hover:bg-marine-blue text-white font-bold py-3 px-8 rounded-lg transition-colors">
          Learn More
        </button>
      </div>
    </section>
  );
}