<section class="contact-section relative py-12 bg-verinay-dark-5">
    <div class="container mx-auto px-4 sm:px-6 lg:px-8 max-w-6xl">
        <div
            class="flex flex-col lg:flex-row items-center lg:items-center justify-between gap-8 pt-6 sm:pt-12 pb-6 sm:pb-12">
            <!-- Sol taraf - Başlık ve Açıklama -->
            <div class="flex-1 text-center lg:text-right">
                <h2 class="text-2xl sm:text-3xl lg:text-4xl font-bold verinay-yellow-1 mb-4 sm:mb-6">
                    Aklınızı Bir şey mi kurcalıyor?
                </h2>
                <p
                    class="verinay-white text-base sm:text-lg lg:text-xl leading-relaxed max-w-xl mx-auto lg:mx-0 lg:ml-auto">
                    Seni canlı sohbette veya destek talebinde bekliyor olacağız.
                    Ayrıca ulaşabileceğiniz bazı destek kanallarımız
                </p>
            </div>

            <!-- Sağ taraf - İletişim Butonları -->
            <div class="flex flex-col gap-3 sm:gap-4 w-full sm:w-80 lg:w-80">
                <!-- Mail Butonu -->
                <div
                    class="bg-verinay-gray-3 bg-opacity-10 rounded-xl px-4 sm:px-6 py-3 sm:py-4 text-center border border-transparent hover:border-verinay-yellow-1 hover:bg-verinay-yellow-1 hover:bg-opacity-10 transition-all duration-300 hover:scale-105 hover:shadow-lg hover:shadow-verinay-yellow-1/20">
                    <div
                        class="verinay-white font-semibold text-base sm:text-lg hover:text-verinay-yellow-1 transition-colors duration-300">
                        <a href="mailto:info@verinay.com" class="block w-full h-full">info@verinay.com</a>
                    </div>
                </div>

                <!-- Telefon Butonu -->
                <div
                    class="bg-verinay-gray-3 bg-opacity-10 rounded-xl px-4 sm:px-6 py-3 sm:py-4 text-center border border-transparent hover:border-verinay-yellow-1 hover:bg-verinay-yellow-1 hover:bg-opacity-10 transition-all duration-300 hover:scale-105 hover:shadow-lg hover:shadow-verinay-yellow-1/20">
                    <div
                        class="verinay-white font-bold text-lg sm:text-xl hover:text-verinay-yellow-1 transition-colors duration-300">
                        <a href="tel:06121235151" class="block w-full h-full">+90 612 123 51 51</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>