@extends('layouts.customer')
@section('page-title', 'درباره تیوان')

@section('content')
    <div class="min-h-screen bg-gray-50 py-12 px-4">
        <div class="max-w-4xl mx-auto">

            <div class="bg-white rounded-2xl shadow-xl border border-gray-200 overflow-hidden">

                <div class="bg-gradient-to-r from-blue-600 to-cyan-600 text-white px-10 py-12 text-center">
                    <h1 class="text-3xl font-bold">تیوان انرژی</h1>
                    <p class="text-lg opacity-90 mt-2">مدرن‌ترین پلتفرم خرید برق دوجانبه در ایران</p>
                </div>

                <div class="p-10 space-y-12">

                    <div class="text-center">
                        <h2 class="text-2xl font-bold text-gray-800 mb-6">ما کی هستیم؟</h2>
                        <p class="text-gray-600 leading-relaxed max-w-2xl mx-auto">
                            تیوان در سال ۱۴۰۴ با هدف ایجاد شفافیت و دسترسی آسان به بازار برق ایران تأسیس شد.
                            ما اولین شرکتی هستیم که امکان خرید برق دوجانبه را به صورت آنلاین، سریع و بدون واسطه برای مشترکین صنعتی و تجاری فراهم کردیم.
                        </p>
                        <p class="text-gray-600 mt-5">
                            باور ما این است که انرژی باید <strong>شفاف، هوشمند و با قیمت مناسب و در دسترس همه</strong> باشد.
                        </p>
                    </div>

                    <hr class="border-gray-200">

                    <div class="grid grid-cols-2 md:grid-cols-4 gap-6 text-center">
                        <div class="bg-blue-50 rounded-xl p-6">
                            <div class="text-2xl font-bold text-blue-700">+۲٬۸۰۰</div>
                            <p class="text-sm text-gray-600 mt-1">مشترک فعال</p>
                        </div>
                        <div class="bg-emerald-50 rounded-xl p-6">
                            <div class="text-2xl font-bold text-emerald-700">۹۸٫۷٪</div>
                            <p class="text-sm text-gray-600 mt-1">رضایت مشتری</p>
                        </div>
                        <div class="bg-purple-50 rounded-xl p-6">
                            <div class="text-2xl font-bold text-purple-700">۲۴/۷</div>
                            <p class="text-sm text-gray-600 mt-1">پشتیبانی فعال</p>
                        </div>
                        <div class="bg-cyan-50 rounded-xl p-6">
                            <div class="text-2xl font-bold text-cyan-700">۰٪</div>
                            <p class="text-sm text-gray-600 mt-1">کارمزد پنهان</p>
                        </div>
                    </div>

                    <hr class="border-gray-200">

                    <div class="grid md:grid-cols-2 gap-8">
                        <div class="bg-blue-50 rounded-xl p-7 border border-blue-200">
                            <h3 class="font-bold text-blue-900 mb-3">ماموریت ما</h3>
                            <p class="text-gray-700 text-sm leading-relaxed">
                                ایجاد شفافیت کامل در بازار برق و توانمندسازی مشترکین برای مدیریت هوشمند هزینه‌های انرژی.
                            </p>
                        </div>
                        <div class="bg-emerald-50 rounded-xl p-7 border border-emerald-200">
                            <h3 class="font-bold text-emerald-900 mb-3">چشم‌انداز ما</h3>
                            <p class="text-gray-700 text-sm leading-relaxed">
                                تا سال ۱۴۰۸، تیوان مرجع اصلی خرید برق دوجانبه برای بیش از ۱ میلیون مشترک در ایران باشد.
                            </p>
                        </div>
                    </div>

                    <hr class="border-gray-200">

                    <div class="text-center">
                        <h2 class="text-2xl font-bold text-gray-800 mb-10">تیم تیوان</h2>
                        <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
                            <div class="space-y-4">
                                <div class="w-24 h-24 bg-gradient-to-br from-blue-600 to-cyan-500 rounded-full mx-auto flex items-center justify-center text-white text-2xl font-bold shadow-lg">
                                    ا
                                </div>
                                <div>
                                    <p class="font-bold text-gray-900">اکبر قیصری</p>
                                    <p class="text-sm text-gray-600">مدیرعامل و بنیان‌گذار</p>
                                    <p class="text-xs text-gray-500">CEO</p>
                                </div>
                            </div>

                            <div class="space-y-4">
                                <div class="w-24 h-24 bg-gradient-to-br from-emerald-600 to-teal-500 rounded-full mx-auto flex items-center justify-center text-white text-2xl font-bold shadow-lg">
                                    م
                                </div>
                                <div>
                                    <p class="font-bold text-gray-900">محمد باقری</p>
                                    <p class="text-sm text-gray-600">مدیر اجرایی و هم‌بنیان‌گذار</p>
                                    <p class="text-xs text-gray-500">COO</p>
                                </div>
                            </div>

                            <div class="space-y-4">
                                <div class="w-24 h-24 bg-gradient-to-br from-purple-600 to-pink-500 rounded-full mx-auto flex items-center justify-center text-white text-2xl font-bold shadow-lg">
                                    م
                                </div>
                                <div>
                                    <p class="font-bold text-gray-900">محمود محسنی‌فر</p>
                                    <p class="text-sm text-gray-600">مدیر فنی و هم‌بنیان‌گذار</p>
                                    <p class="text-xs text-gray-500">CTO</p>
                                </div>
                            </div>
                        </div>
                    </div>

                    <hr class="border-gray-200">

                    <div class="text-center pt-6">
                        <p class="text-gray-600">تهران — دفتر مرکزی تیوان انرژی</p>
                        <p class="text-sm text-gray-500 mt-2">
                            تلفن: ۰۲۱-۲۸۴۲۵۰۰۰ | ایمیل: info@t1.energy
                        </p>
                        <div class="flex justify-center gap-6 mt-6 text-xl text-gray-500">
                            <a href="#" class="hover:text-blue-600 transition"><i class="fab fa-telegram"></i></a>
                            <a href="#" class="hover:text-pink-600 transition"><i class="fab fa-instagram"></i></a>
                            <a href="#" class="hover:text-blue-700 transition"><i class="fab fa-linkedin"></i></a>
                        </div>
                    </div>

                </div>
            </div>

        </div>
    </div>
@endsection