export const GlobalNetwork = () => {
  return (
    <section className="bg-slate-950 py-24">
      <div className="container max-w-screen-xl mx-auto px-4">
        <div className="flex flex-col md:flex-row items-center justify-between gap-12">
          {/* Left Side */}
          <div className="flex-1 text-white">
            <h1 className="text-4xl md:text-5xl font-bold mb-6 leading-tight">
              What are you waiting for?
              <br />
              <span className="text-blue-500">Start today!</span>
            </h1>
            <p className="text-xl text-gray-300 mb-8 leading-relaxed">
            Deploy your server on our global low-latency network, engineered for peak performance and uptime. With strategically placed locations worldwide, your players stay connected and your setup stays solid—built for gamers, optimized for tech enthusiasts.
            </p>
            <div className="flex flex-wrap gap-4">
              <a
                href="/games"
                className="bg-blue-600 hover:bg-blue-700 text-white px-8 py-3 rounded-md font-medium transition-all duration-200 border border-transparent"
              >
                Explore Our Games
              </a>
              <a
                href="/vps"
                className="bg-gray-900 text-white px-8 py-3 rounded-md font-medium transition-all duration-200"
              >
                Deploy a VPS
              </a>
            </div>
          </div>

          {/* Right Side */}
          <div className="flex-1">
            <div className="bg-slate-950 rounded-md">
              <img
                src="/images/power-on.jpg"
                alt="Global Network"
                className="rounded-md w-full h-auto"
              />
            </div>
          </div>
        </div>
      </div>
    </section>
  );
};

export default GlobalNetwork;
