@extends('_layouts.master')

@section('content')
    <div class="isolate px-6 py-24 sm:py-32 lg:px-8">
        <div class="mx-auto max-w-2xl sm:text-center">
            <h2 class="text-4xl font-semibold tracking-tight text-balance text-gray-900 sm:text-5xl">Destek Alın</h2>
            <p class="mt-2 text-lg/8 text-gray-600">Hangi konuda destek almak istersiniz?</p>
        </div>
        <div class="mx-auto mt-20 max-w-lg space-y-16">
            <div class="flex gap-x-6">
                <div class="flex size-10 shrink-0 items-center justify-center rounded-lg bg-orange-600">
                    <span class="material-symbols-rounded text-white">
                        flare
                    </span>
                </div>
                <div>
                    <h3 class="text-base/7 font-semibold text-gray-900">Satış desteği</h3>
                    <p class="mt-2 text-base/7 text-gray-600">Bulut Adisyon kullanıcısı olmak istiyorsanız satış birimimiz ile iletişime geçin.</p>
                    <p class="mt-4 text-sm/6 font-semibold">
                        <a href="https://wa.me/908502551090" class="text-orange-600">Canlı satış desteği <span aria-hidden="true">&rarr;</span></a>
                    </p>
                </div>
            </div>
            <div class="flex gap-x-6">
                <div class="flex size-10 shrink-0 items-center justify-center rounded-lg bg-orange-600">
                    <span class="material-symbols-rounded text-white">
                        history_edu
                    </span>
                </div>
                <div>
                    <h3 class="text-base/7 font-semibold text-gray-900">Eğitim desteği</h3>
                    <p class="mt-2 text-base/7 text-gray-600">Bulut Adisyon ile ilgili eğitim desteği almak için eğitim videolarımıza göz atabilirsiniz. Eğer online ya da yerinde destek almak isterseniz lütfen bize yazın.</p>
                    <p class="mt-4 text-sm/6 font-semibold">
                        <a href="https://disk.yandex.com.tr/d/YJbb_KI5whet5A" class="text-orange-600">Eğitim videoları <span aria-hidden="true">&rarr;</span></a>
                    </p>
                    <p class="mt-2 text-sm/6 font-semibold">
                        <a href="https://wa.me/908502551090" class="text-orange-600">Bize yazın <span aria-hidden="true">&rarr;</span></a>
                    </p>
                </div>
            </div>
            <div class="flex gap-x-6">
                <div class="flex size-10 shrink-0 items-center justify-center rounded-lg bg-orange-600">
                    <span class="material-symbols-rounded text-white">
                        code
                    </span>
                </div>
                <div>
                    <h3 class="text-base/7 font-semibold text-gray-900">Teknik destek</h3>
                    <p class="mt-2 text-base/7 text-gray-600">Kullanım esnasında herhangi bir problem ile karşlılaşırsanız uzmanlarımızdan canlı yazışma desteği alabilir ya da destek dökümanlarından faydalanabilirsiniz.</p>
                    <p class="mt-4 text-sm/6 font-semibold">
                        <a href="https://wa.me/908502551090" class="text-orange-600">Canlı destek (WhatsApp) <span aria-hidden="true">&rarr;</span></a>
                    </p>
                    <p class="mt-4 text-sm/6 font-semibold">
                        <a href="https://tawk.to/chat/5d83c9a49f6b7a4457e29640/1g1uqgv2k" class="text-orange-600">Canlı destek (Tawk.to) <span aria-hidden="true">&rarr;</span></a>
                    </p>
                    <p class="mt-4 text-sm/6 font-semibold">
                        <a href="https://poscloud.tawk.help" class="text-orange-600">Destek dökümanları <span aria-hidden="true">&rarr;</span></a>
                    </p>
                </div>
            </div>
        </div>
    </div>
@endsection