import React from 'react';

// Bottom Features Component (No Cards)
const BottomFeaturesSection = () => {
  return (
    <section className="py-16 bg-gray-50">
      <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
        <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-8">
          <div className="text-center space-y-2">
            <h3 className="text-lg font-semibold text-gray-700">Free Trials</h3>
            <p className="text-sm text-gray-600">30+ featured cloud products</p>
          </div>

          <div className="text-center space-y-2">
            <h3 className="text-lg font-semibold text-gray-700">Cloud Data Center</h3>
            <p className="text-sm text-gray-600">Accelerate asset cloud adoption</p>
          </div>

          <div className="text-center space-y-2">
            <h3 className="text-lg font-semibold text-gray-700">3engine Cloud</h3>
            <p className="text-sm text-gray-600">Everything as a Service</p>
          </div>

          <div className="text-center space-y-2">
            <h3 className="text-lg font-semibold text-gray-700">Developer Center</h3>
            <p className="text-sm text-gray-600">Creating a thriving ecosystem</p>
          </div>
        </div>
      </div>
    </section>
  );
};

export default BottomFeaturesSection;