import React from 'react';

const AboutPage: React.FC = () => {
  return (
    <div className="py-16 bg-white">
      <div className="container mx-auto px-4">
        <div className="max-w-4xl mx-auto">
          <div className="text-center">
            <h1 className="text-4xl md:text-5xl font-extrabold text-gray-800">আমাদের সম্পর্কে</h1>
            <p className="mt-4 text-lg text-gray-600">
              আমাদের পরিচয় এবং কেন আমরাই আপনার অনলাইন সেবার সেরা সহযোগী।
            </p>
          </div>

          <div className="mt-12 text-lg text-gray-700 space-y-6 leading-relaxed">
            <p>
              <span className="font-bold text-green-600">সব সেবা .শপ</span>-এ আপনাকে স্বাগতম! আমাদের প্রধান লক্ষ্য হলো বাংলাদেশের সাধারণ মানুষের জন্য সরকারি ও বেসরকারি অনলাইন সেবাসমূহকে সহজলভ্য এবং নির্বিঘ্ন করা। আমরা উপলব্ধি করি, এই ডিজিটাল যুগেও অনেকের কাছে অনলাইন আবেদন প্রক্রিয়াটি বেশ জটিল ও সময়সাপেক্ষ। এই সমস্যার কার্যকর সমাধান প্রদানের লক্ষ্যেই আমাদের পথচলা।
            </p>
            <p>
              আমরা একটি স্বতন্ত্র সহায়তাকারী প্রতিষ্ঠান। আমাদের অভিজ্ঞ দল ভূমি, নাগরিক, কর প্রদান-সহ অন্যান্য জরুরি অনলাইন আবেদন প্রক্রিয়ায় আপনাকে ধাপে ধাপে সহায়তা প্রদানের জন্য সর্বদা প্রস্তুত। আমাদের মূল উদ্দেশ্য হলো আপনার মূল্যবান সময় সাশ্রয় করা এবং নির্ভুলভাবে আপনার কাঙ্ক্ষিত সেবাটি সম্পন্ন করা।
            </p>

            <div className="mt-10">
              <h2 className="text-3xl font-bold text-gray-800 text-center mb-6">আমাদের লক্ষ্য ও উদ্দেশ্য</h2>
              <div className="grid md:grid-cols-2 gap-8">
                <div className="bg-green-50 p-6 rounded-lg border-l-4 border-green-500">
                  <h3 className="text-xl font-semibold text-gray-800 mb-2">সেবা সহজীকরণ</h3>
                  <p>জটিল অনলাইন প্রক্রিয়াগুলোকে সাধারণ মানুষের জন্য সহজবোধ্য করে উপস্থাপন করা।</p>
                </div>
                <div className="bg-green-50 p-6 rounded-lg border-l-4 border-green-500">
                  <h3 className="text-xl font-semibold text-gray-800 mb-2">নির্ভরযোগ্যতা ও বিশ্বস্ততা</h3>
                  <p>প্রতিটি গ্রাহককে সঠিক ও নির্ভুল সেবা প্রদানের মাধ্যমে সর্বোচ্চ আস্থা অর্জন করা।</p>
                </div>
                 <div className="bg-green-50 p-6 rounded-lg border-l-4 border-green-500">
                  <h3 className="text-xl font-semibold text-gray-800 mb-2">সময় সাশ্রয়</h3>
                  <p>ঘরে বসেই যেন সকলে প্রয়োজনীয় সেবা গ্রহণ করতে পারে, তা নিশ্চিত করার মাধ্যমে মূল্যবান সময় সাশ্রয় করা।</p>
                </div>
                 <div className="bg-green-50 p-6 rounded-lg border-l-4 border-green-500">
                  <h3 className="text-xl font-semibold text-gray-800 mb-2">ডিজিটাল সচেতনতা বৃদ্ধি</h3>
                  <p>সাধারণ মানুষকে ডিজিটাল সেবা ব্যবহারে উৎসাহিত করা এবং এ বিষয়ে তাদের সক্ষমতা বৃদ্ধিতে সহায়তা করা।</p>
                </div>
              </div>
            </div>

            <p className="pt-6">
              আপনার যেকোনো প্রয়োজনে আমরা সর্বদা আপনার পাশে আছি। আমাদের উপর আস্থা রাখার জন্য আপনাকে আন্তরিক ধন্যবাদ।
            </p>
          </div>
        </div>
      </div>
    </div>
  );
};

export default AboutPage;