@extends('frontend::layouts.master')

@section('content')
<section class="pt-24 md:pt-32 pb-10 lg:pb-16  relative overflow-hidden">
    <div class="container mx-auto px-4">
        <div class="text-center mb-12">
            <h2 class="text-4xl md:text-5xl font-bold bg-gradient-to-r from-purple-400 to-pink-600 bg-clip-text text-transparent mb-4">
                About Us
            </h2>
            <p class="text-gray-400 max-w-2xl mx-auto">
                Your trusted gaming partner since 2020. We're dedicated to providing the best gaming experience for our community.
            </p>
        </div>

        <div class="grid md:grid-cols-2 gap-12 items-center mb-16">
            <div class="relative">
                <div class="absolute -top-4 -left-4 w-72 h-72 bg-purple-500/30 rounded-full filter blur-3xl"></div>
                <div class="absolute -bottom-4 -right-4 w-72 h-72 bg-pink-500/30 rounded-full filter blur-3xl"></div>
                <img src="https://www.buff.game/wp-content/uploads/2021/08/Skye_artwork.png" alt="Gaming Setup" 
                     class="relative h-[600px] object-cover object-center">
            </div>
            <div class="space-y-6">
                <h3 class="text-3xl font-bold text-white">Our Mission</h3>
                <p class="text-gray-400 leading-relaxed">
                    We strive to create a seamless gaming experience by providing reliable top-up services, competitive e-sports platforms, and a vibrant gaming community where players can connect, compete, and grow together.
                Lorem ipsum dolor sit amet consectetur adipisicing elit. Omnis eaque rem nulla aliquam eveniet, maiores assumenda excepturi accusamus eius libero repellat hic dolore cum animi nihil laboriosam quidem, itaque beatae id possimus nam est officia molestiae! Placeat ea assumenda eum cumque. Aperiam consequuntur facilis quis autem delectus reprehenderit! Nam fuga vitae magnam nihil quaerat placeat incidunt! Exercitationem voluptate suscipit saepe quisquam, repellendus nobis nisi rem sequi ipsa dignissimos tenetur illum cum, modi rerum minima. Assumenda ullam distinctio aliquid? Facere, rerum.
                </p>
                <p class="text-gray-400 leading-relaxed">
                    We strive to create a seamless gaming experience by providing reliable top-up services, competitive e-sports platforms, and a vibrant gaming community where players can connect, compete, and grow together.
                Lorem ipsum dolor sit amet consectetur adipisicing elit. Omnis eaque rem nulla aliquam eveniet, maiores assumenda excepturi accusamus eius libero repellat hic dolore cum animi nihil laboriosam quidem, itaque beatae id possimus nam est officia molestiae! Placeat ea assumenda eum cumque. Aperiam consequuntur facilis quis autem delectus reprehenderit! Nam fuga vitae magnam nihil quaerat placeat incidunt! Exercitationem voluptate suscipit saepe quisquam, repellendus nobis nisi rem sequi ipsa dignissimos tenetur illum cum, modi rerum minima. Assumenda ullam distinctio aliquid? Facere, rerum.
                </p>
            </div>
        </div>

        <p class="text-gray-400 leading-relaxed mb-10">
            We strive to create a seamless gaming experience by providing reliable top-up services, competitive e-sports platforms, and a vibrant gaming community where players can connect, compete, and grow together.
        Lorem ipsum dolor sit amet consectetur adipisicing elit. Omnis eaque rem nulla aliquam eveniet, maiores assumenda excepturi accusamus eius libero repellat hic dolore cum animi nihil laboriosam quidem, itaque beatae id possimus nam est officia molestiae! Placeat ea assumenda eum cumque. Aperiam consequuntur facilis quis autem delectus reprehenderit! Nam fuga vitae magnam nihil quaerat placeat incidunt! Exercitationem voluptate suscipit saepe quisquam, repellendus nobis nisi rem sequi ipsa dignissimos tenetur illum cum, modi rerum minima. Assumenda ullam distinctio aliquid? Facere, rerum.
        </p>

        <div class="grid md:grid-cols-3 gap-8">
            <div class="p-6 bg-white/5 rounded-xl backdrop-blur-sm border border-white/10 transition duration-300">
                <div class="w-12 h-12 bg-purple-500/20 rounded-lg flex items-center justify-center mb-4">
                    <svg class="w-6 h-6 text-purple-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"></path>
                    </svg>
                </div>
                <h4 class="text-xl font-semibold text-white mb-2">Secure Transactions</h4>
                <p class="text-gray-400">Your security is our priority. All transactions are protected with state-of-the-art encryption.</p>
            </div>

            <div class="p-6 bg-white/5 rounded-xl backdrop-blur-sm border border-white/10 transition duration-300">
                <div class="w-12 h-12 bg-pink-500/20 rounded-lg flex items-center justify-center mb-4">
                    <svg class="w-6 h-6 text-pink-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z"></path>
                    </svg>
                </div>
                <h4 class="text-xl font-semibold text-white mb-2">Instant Delivery</h4>
                <p class="text-gray-400">Get your game credits and items delivered instantly after payment confirmation.</p>
            </div>

            <div class="p-6 bg-white/5 rounded-xl backdrop-blur-sm border border-white/10 transition duration-300">
                <div class="w-12 h-12 bg-blue-500/20 rounded-lg flex items-center justify-center mb-4">
                    <svg class="w-6 h-6 text-blue-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M18.364 5.636l-3.536 3.536m0 5.656l3.536 3.536M9.172 9.172L5.636 5.636m3.536 9.192l-3.536 3.536M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path>
                    </svg>
                </div>
                <h4 class="text-xl font-semibold text-white mb-2">24/7 Support</h4>
                <p class="text-gray-400">Our dedicated support team is always ready to assist you with any questions or concerns.</p>
            </div>
        </div>
    </div>
</section>

@endsection