<!DOCTYPE html>
<html lang="tr">

<head>
    <?php include "inc/head.php"; ?>
</head>

<body class="bg-verinay-dark">
    <!-- ========= NAV ========= -->
    <?php include "inc/navbar.php"; ?>

    <!-- ========= HERO SECTION ========= -->
    <section class="hero-section relative w-full h-screen overflow-hidden bg-verinay-dark">
        <!-- Background Image -->
        <div class="absolute inset-0 bg-cover bg-center bg-no-repeat opacity-30"
            style="background-image: url('images/domain/domain-background.jpg');">
        </div>

        <!-- Gradient Overlay -->
        <div class="absolute inset-0 bg-gradient-to-r from-black/90 via-black/70 to-transparent"></div>

        <!-- Content -->
        <div class="relative z-10 h-full flex items-center">
            <div class="container mx-auto px-4 sm:px-6 lg:px-8">
                <div class="grid grid-cols-1 lg:grid-cols-2 gap-8 lg:gap-12 items-center h-full">
                    <!-- Sol taraf - Logo ve İçerik -->
                    <div class="hero-content">
                        <!-- Discount Badge -->
                        <div
                            class="inline-flex flex-wrap items-center px-3 py-2 sm:px-4 bg-verinay-dark-3 rounded-full mb-4 sm:mb-6 border border-verinay-gray-2">
                            <i class="fas fa-globe verinay-yellow-1 mr-2 text-xs sm:text-sm"></i>
                            <span class="verinay-white text-xs sm:text-sm font-medium">Özel alan adları ile</span>
                            <span class="verinay-yellow-1 text-xs sm:text-sm ml-1 sm:ml-2 font-bold">fark yarat</span>
                            <span class="verinay-white text-xs sm:text-sm font-medium pl-1 sm:pl-2">ve öne çık!</span>
                        </div>

                        <!-- Main Title -->
                        <h1
                            class="text-2xl sm:text-3xl md:text-4xl lg:text-5xl xl:text-6xl font-bold verinay-white mb-4 sm:mb-6 leading-tight">
                            Alan Adı
                        </h1>

                        <!-- Subtitle -->
                        <p
                            class="text-base sm:text-lg md:text-xl verinay-gray-1 mb-6 sm:mb-8 max-w-2xl leading-relaxed">
                            Doğru alan adıyla fark yarat. Profesyonel web varlığınızı güçlendirin ve markanızı dijital
                            dünyada öne çıkarın.
                        </p>

                        <!-- Features List -->
                        <div class="grid grid-cols-1 sm:grid-cols-2 gap-3 mb-6 sm:mb-8">
                            <div class="flex items-center verinay-gray-1">
                                <i class="fas fa-shield-alt verinay-yellow-1 mr-3 text-sm"></i>
                                <span class="text-sm sm:text-base">Güvenli Alan Adı</span>
                            </div>
                            <div class="flex items-center verinay-gray-1">
                                <i class="fas fa-rocket verinay-yellow-1 mr-3 text-sm"></i>
                                <span class="text-sm sm:text-base">Hızlı Aktivasyon</span>
                            </div>
                            <div class="flex items-center verinay-gray-1">
                                <i class="fas fa-lock verinay-yellow-1 mr-3 text-sm"></i>
                                <span class="text-sm sm:text-base">SSL Sertifikası</span>
                            </div>
                            <div class="flex items-center verinay-gray-1">
                                <i class="fas fa-headset verinay-yellow-1 mr-3 text-sm"></i>
                                <span class="text-sm sm:text-base">7/24 Destek</span>
                            </div>
                            <div class="flex items-center verinay-gray-1">
                                <i class="fas fa-sync-alt verinay-yellow-1 mr-3 text-sm"></i>
                                <span class="text-sm sm:text-base">Kolay Yönetim</span>
                            </div>
                            <div class="flex items-center verinay-gray-1">
                                <i class="fas fa-star verinay-yellow-1 mr-3 text-sm"></i>
                                <span class="text-sm sm:text-base">Premium Özellikler</span>
                            </div>
                        </div>

                        <!-- Buttons -->
                        <div class="flex flex-col sm:flex-row gap-3 sm:gap-4 mb-8">
                            <button type="button" id="btn-search-domain"
                                class="bg-verinay-yellow-1 hover:bg-verinay-yellow-2 verinay-dark font-semibold px-6 py-3 sm:px-8 sm:py-4 rounded-lg transition-all duration-300 transform hover:scale-105 text-sm sm:text-base flex items-center justify-center">
                                <i class="fa-solid fa-globe mr-2"></i>
                                Alan Adı Ara
                            </button>
                            <button type="button" id="btn-view-prices"
                                class="border border-verinay-gray-2 verinay-white hover:bg-verinay-gray-3 font-semibold px-6 py-3 sm:px-8 sm:py-4 rounded-lg transition-all duration-300 text-sm sm:text-base flex items-center justify-center">
                                <i class="fa-solid fa-list mr-2"></i>
                                Fiyatları İncele
                            </button>
                        </div>

                        <!-- Stats -->
                        <div class="grid grid-cols-3 gap-4 sm:gap-6">
                            <div class="text-center">
                                <div
                                    class="text-xl sm:text-2xl font-bold verinay-yellow-1 flex items-center justify-center mb-1">
                                    <i class="fas fa-globe mr-2"></i>
                                    100+
                                </div>
                                <div class="text-xs sm:text-sm verinay-gray-1">Uzantı</div>
                            </div>
                            <div class="text-center">
                                <div
                                    class="text-xl sm:text-2xl font-bold verinay-yellow-1 flex items-center justify-center mb-1">
                                    <i class="fas fa-clock mr-2"></i>
                                    24/7
                                </div>
                                <div class="text-xs sm:text-sm verinay-gray-1">Destek</div>
                            </div>
                            <div class="text-center">
                                <div
                                    class="text-xl sm:text-2xl font-bold verinay-yellow-1 flex items-center justify-center mb-1">
                                    <i class="fas fa-users mr-2"></i>
                                    5000+
                                </div>
                                <div class="text-xs sm:text-sm verinay-gray-1">Müşteri</div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- ========= DOMAIN SEARCH SECTION ========= -->
    <section class="domain-search-section py-16 bg-verinay-dark-2" id="domain-search-section">
        <div class="container mx-auto px-4 sm:px-6 lg:px-8 text-center">
            <h2 class="text-2xl sm:text-3xl md:text-4xl font-bold verinay-yellow-1 mb-4">Yeni alan adınızı keşfedin</h2>
            <p class="text-base sm:text-lg verinay-gray-1 mb-8 max-w-2xl mx-auto">
                Hızlı ve kolay şekilde dilediğiniz alan adını arayın ve müsaitliğini kontrol edin.
            </p>
            <div class="domain-search-wrapper max-w-2xl mx-auto">
                <div
                    class="flex flex-col sm:flex-row gap-3 sm:gap-0 bg-verinay-dark-3 rounded-lg p-2 border border-verinay-gray-2">
                    <input type="text"
                        class="flex-1 bg-transparent verinay-white placeholder-verinay-gray-1 px-4 py-3 focus:outline-none text-base"
                        placeholder="Alan adınızı yazın..." id="inputDomain">
                    <button
                        class="bg-verinay-yellow-1 hover:bg-verinay-yellow-2 verinay-dark font-semibold px-6 py-3 rounded-md transition-all duration-300 transform hover:scale-105 flex items-center justify-center whitespace-nowrap"
                        type="submit" id="btnCheckAvailability">
                        <i class="fas fa-search mr-2"></i>
                        Ara
                    </button>
                </div>
            </div>
        </div>
    </section>

    <!-- ========= DOMAIN SECTION ========= -->
    <section class="domain-price-section py-16 bg-verinay-dark relative overflow-hidden" id="domain-price-section">
        <!-- Floating Shapes -->
        <div class="floating-shapes absolute inset-0 pointer-events-none">
            <div class="shape absolute w-32 h-32 bg-verinay-yellow-1 opacity-5 rounded-full animate-pulse"
                style="top: 10%; left: 10%;"></div>
            <div class="shape absolute w-24 h-24 bg-verinay-yellow-2 opacity-10 rounded-full animate-pulse"
                style="top: 60%; right: 15%; animation-delay: 2s;"></div>
            <div class="shape absolute w-40 h-40 bg-verinay-yellow-1 opacity-3 rounded-full animate-pulse"
                style="bottom: 20%; left: 20%; animation-delay: 4s;"></div>
        </div>

        <div class="container mx-auto px-4 sm:px-6 lg:px-8 relative z-10">
            <div class="text-center mb-12">
                <h2 class="text-2xl sm:text-3xl md:text-4xl font-bold verinay-yellow-1 mb-4">
                    Popüler Üst Seviye Alan Adları (TLD)
                </h2>
                <p class="text-base sm:text-lg verinay-gray-1 max-w-2xl mx-auto">
                    En çok tercih edilen alan adları burada!
                </p>
            </div>

            <div class="grid grid-cols-1 md:grid-cols-3 gap-6 lg:gap-8">
                <!-- .com Domain Card -->
                <div
                    class="domain-card bg-verinay-dark-4 rounded-xl p-6 border border-verinay-gray-2 hover:border-verinay-yellow-1 transition-all duration-300 transform hover:scale-105 hover:shadow-lg group">
                    <div class="text-center mb-6">
                        <div class="text-4xl font-bold verinay-white mb-4">.com</div>
                    </div>
                    <div class="domain-info text-center mb-6">
                        <div class="flex items-center justify-center mb-3">
                            <span
                                class="bg-verinay-yellow-1 verinay-dark px-4 py-2 rounded-full text-sm font-bold flex items-center">
                                <i class="fas fa-star mr-2"></i>
                                En Popüler
                            </span>
                        </div>
                        <p class="verinay-gray-1 text-sm mb-4 leading-relaxed">
                            .com alan adı, web siteleri için en çok tercih edilen ve güvenilir üst seviye alan adıdır.
                        </p>
                        <div class="flex items-center justify-center mb-2">
                            <span class="text-3xl font-bold verinay-yellow-1">450₺</span>
                            <span class="verinay-gray-1 text-sm ml-2">/yıl</span>
                        </div>
                    </div>
                    <div class="domain-actions flex flex-col gap-3">
                        <a href="#"
                            class="bg-verinay-yellow-1 hover:bg-verinay-yellow-2 verinay-dark font-bold py-3 px-6 rounded-lg transition-all duration-300 text-center flex items-center justify-center">
                            <i class="fas fa-plus mr-2"></i>
                            Hemen Kaydet
                        </a>
                        <a href="#"
                            class="border-2 border-verinay-gray-2 verinay-white hover:bg-verinay-gray-3 hover:border-verinay-yellow-1 font-semibold py-3 px-6 rounded-lg transition-all duration-300 text-center flex items-center justify-center">
                            <i class="fas fa-exchange-alt mr-2"></i>
                            Transfer Et
                        </a>
                    </div>
                </div>

                <!-- .net Domain Card -->
                <div
                    class="domain-card bg-verinay-dark-4 rounded-xl p-6 border border-verinay-gray-2 hover:border-verinay-yellow-1 transition-all duration-300 transform hover:scale-105 hover:shadow-lg group">
                    <div class="text-center mb-6">
                        <div class="text-4xl font-bold verinay-white mb-4">.net</div>
                    </div>
                    <div class="domain-info text-center mb-6">
                        <div class="flex items-center justify-center mb-3">
                            <span
                                class="bg-verinay-gray-2 verinay-white px-4 py-2 rounded-full text-sm font-bold flex items-center">
                                <i class="fas fa-network-wired mr-2"></i>
                                Teknoloji
                            </span>
                        </div>
                        <p class="verinay-gray-1 text-sm mb-4 leading-relaxed">
                            .net alan adı, teknoloji şirketleri ve iletişim projeleri için idealdir.
                        </p>
                        <div class="flex items-center justify-center mb-2">
                            <span class="text-3xl font-bold verinay-yellow-1">400₺</span>
                            <span class="verinay-gray-1 text-sm ml-2">/yıl</span>
                        </div>
                    </div>
                    <div class="domain-actions flex flex-col gap-3">
                        <a href="#"
                            class="bg-verinay-yellow-1 hover:bg-verinay-yellow-2 verinay-dark font-bold py-3 px-6 rounded-lg transition-all duration-300 text-center flex items-center justify-center">
                            <i class="fas fa-plus mr-2"></i>
                            Hemen Kaydet
                        </a>
                        <a href="#"
                            class="border-2 border-verinay-gray-2 verinay-white hover:bg-verinay-gray-3 hover:border-verinay-yellow-1 font-semibold py-3 px-6 rounded-lg transition-all duration-300 text-center flex items-center justify-center">
                            <i class="fas fa-exchange-alt mr-2"></i>
                            Transfer Et
                        </a>
                    </div>
                </div>

                <!-- .org Domain Card -->
                <div
                    class="domain-card bg-verinay-dark-4 rounded-xl p-6 border border-verinay-gray-2 hover:border-verinay-yellow-1 transition-all duration-300 transform hover:scale-105 hover:shadow-lg group">
                    <div class="text-center mb-6">
                        <div class="text-4xl font-bold verinay-white mb-4">.org</div>
                    </div>
                    <div class="domain-info text-center mb-6">
                        <div class="flex items-center justify-center mb-3">
                            <span
                                class="bg-verinay-dark-2 border border-verinay-gray-2 verinay-white px-4 py-2 rounded-full text-sm font-bold flex items-center">
                                <i class="fas fa-heart mr-2"></i>
                                Organizasyon
                            </span>
                        </div>
                        <p class="verinay-gray-1 text-sm mb-4 leading-relaxed">
                            .org alan adı, kar amacı gütmeyen kuruluşlar ve organizasyonlar için mükemmeldir.
                        </p>
                        <div class="flex items-center justify-center mb-2">
                            <span class="text-3xl font-bold verinay-yellow-1">400₺</span>
                            <span class="verinay-gray-1 text-sm ml-2">/yıl</span>
                        </div>
                    </div>
                    <div class="domain-actions flex flex-col gap-3">
                        <a href="#"
                            class="bg-verinay-yellow-1 hover:bg-verinay-yellow-2 verinay-dark font-bold py-3 px-6 rounded-lg transition-all duration-300 text-center flex items-center justify-center">
                            <i class="fas fa-plus mr-2"></i>
                            Hemen Kaydet
                        </a>
                        <a href="#"
                            class="border-2 border-verinay-gray-2 verinay-white hover:bg-verinay-gray-3 hover:border-verinay-yellow-1 font-semibold py-3 px-6 rounded-lg transition-all duration-300 text-center flex items-center justify-center">
                            <i class="fas fa-exchange-alt mr-2"></i>
                            Transfer Et
                        </a>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- ========= FEATURES SECTION ========= -->
    <section class="section py-16 bg-verinay-dark-2">
        <div class="container mx-auto px-4 sm:px-6 lg:px-8">
            <div class="text-center mb-12">
                <h3 class="text-2xl sm:text-3xl md:text-4xl font-bold verinay-yellow-1 mb-4">
                    En İyi Hosting Özellikleri
                </h3>
                <p class="text-base sm:text-lg verinay-gray-1 max-w-2xl mx-auto">
                    Alan adıyla birlikte Hosting paketlerimizde sunulan avantajları keşfedin.
                </p>
            </div>

            <div class="grid grid-cols-1 md:grid-cols-3 gap-6 lg:gap-8">
                <!-- Plesk & cPanel Feature -->
                <div
                    class="feature-card bg-verinay-dark-4 rounded-xl p-8 border border-verinay-gray-2 hover:border-verinay-yellow-1 transition-all duration-300 transform hover:scale-105 text-center group">
                    <div class="mb-6">
                        <div
                            class="inline-flex items-center justify-center w-20 h-20 bg-verinay-yellow-1 rounded-xl mb-4 group-hover:scale-110 transition-transform duration-300">
                            <i class="fas fa-tachometer-alt text-2xl verinay-dark"></i>
                        </div>
                    </div>
                    <h5 class="text-xl font-bold verinay-white mb-4">
                        Plesk & cPanel Kontrol Paneli
                    </h5>
                    <p class="verinay-gray-1 leading-relaxed">
                        Kolay kullanım ve yönetim için gelişmiş kontrol panelleri ile web sitenizi kolayca yönetin.
                    </p>
                </div>

                <!-- 7/24 Support Feature -->
                <div
                    class="feature-card bg-verinay-dark-4 rounded-xl p-8 border border-verinay-gray-2 hover:border-verinay-yellow-1 transition-all duration-300 transform hover:scale-105 text-center group">
                    <div class="mb-6">
                        <div
                            class="inline-flex items-center justify-center w-20 h-20 bg-verinay-yellow-1 rounded-xl mb-4 group-hover:scale-110 transition-transform duration-300">
                            <i class="fas fa-headset text-2xl verinay-dark"></i>
                        </div>
                    </div>
                    <h5 class="text-xl font-bold verinay-white mb-4">
                        7/24 Destek
                    </h5>
                    <p class="verinay-gray-1 leading-relaxed">
                        Kesintisiz hizmet ve profesyonel destek ekibi her zaman yanınızda. Her sorunuzda yanıtlıyız.
                    </p>
                </div>

                <!-- One Click Install Feature -->
                <div
                    class="feature-card bg-verinay-dark-4 rounded-xl p-8 border border-verinay-gray-2 hover:border-verinay-yellow-1 transition-all duration-300 transform hover:scale-105 text-center group">
                    <div class="mb-6">
                        <div
                            class="inline-flex items-center justify-center w-20 h-20 bg-verinay-yellow-1 rounded-xl mb-4 group-hover:scale-110 transition-transform duration-300">
                            <i class="fas fa-mouse-pointer text-2xl verinay-dark"></i>
                        </div>
                    </div>
                    <h5 class="text-xl font-bold verinay-white mb-4">
                        Tek Tıkla Kurulum
                    </h5>
                    <p class="verinay-gray-1 leading-relaxed">
                        WordPress, Joomla gibi uygulamaları hızlıca kurun. Tek tıkla profesyonel web sitesi.
                    </p>
                </div>
            </div>
        </div>
    </section>

    <!-- ========= CONTACT SECTION ========= -->
    <?php include 'inc/contact.php'; ?>

    <!-- ========= FAQ SECTION ========= -->
    <section class="faq-section relative py-20">
        <div class="container mx-auto px-4 sm:px-6 lg:px-8 max-w-5xl">
            <!-- Header -->
            <div class="text-center mb-12">
                <h2 class="text-3xl sm:text-4xl font-semibold verinay-yellow-1 mb-3 tracking-tight">
                    Sıkça Sorulan Sorular
                </h2>
                <p class="text-neutral-400 text-lg">
                    Alan adı hizmetlerimiz hakkında merak ettikleriniz
                </p>
            </div>

            <!-- FAQ Items -->
            <div class="space-y-5">
                <!-- FAQ Item 1 -->
                <div
                    class="faq-item bg-verinay-dark-2 rounded-xl border border-neutral-700/50 hover:border-neutral-600/50 transition-all duration-300 hover:bg-neutral-800/70">
                    <button
                        class="faq-question w-full px-6 py-5 text-left flex items-center justify-between hover:bg-neutral-700/20 transition-all duration-200 rounded-xl group"
                        data-faq="1">
                        <span class="text-white font-medium text-lg group-hover:text-neutral-100 transition-colors">
                            Alan Adı Satın Almanın Avantajları Nelerdir?
                        </span>
                        <div class="flex-shrink-0">
                            <div
                                class="w-6 h-6 rounded-md bg-neutral-700 group-hover:bg-neutral-600 transition-colors duration-200 flex items-center justify-center">
                                <svg class="faq-icon w-4 h-4 text-neutral-300 group-hover:text-white transform transition-transform duration-200"
                                    fill="currentColor" viewBox="0 0 20 20">
                                    <path fill-rule="evenodd"
                                        d="M10 3a1 1 0 011 1v5h5a1 1 0 110 2h-5v5a1 1 0 11-2 0v-5H4a1 1 0 110-2h5V4a1 1 0 011-1z"
                                        clip-rule="evenodd"></path>
                                </svg>
                            </div>
                        </div>
                    </button>
                    <div class="faq-answer max-h-0 overflow-hidden transition-all duration-300 ease-out"
                        data-faq-content="1">
                        <div class="px-6 pb-6 pt-1">
                            <div class="border-t border-neutral-700/30 pt-5">
                                <div class="space-y-4 text-neutral-300 text-base leading-relaxed">
                                    <p>
                                        Alan adı satın alma hizmetimiz, markanıza birçok avantaj sunar. En önemli
                                        avantajlarımızdan biri, <strong class="text-white">güvenli DNS yönetimi ve hızlı
                                            propagasyon</strong>
                                        ile profesyonel web varlığınızı hızla oluşturmanızdır.
                                    </p>
                                    <p>
                                        Güvenlik konusunda oldukça titiziz. <strong class="text-white">Domain koruması,
                                            WHOIS gizlilik koruması ve otomatik yenileme</strong> sistemi ile alan
                                        adınızın güvenliğini en üst seviyede sağlarız. Bu sayede markanız her zaman
                                        korunmuş olur.
                                    </p>
                                    <p>
                                        Ayrıca deneyimli ve bilgili destek ekibimizle <strong class="text-white">7/24
                                            Türkçe teknik destek</strong> sunuyoruz. Ücretsiz DNS yönetimi ve e-posta
                                        yönlendirme hizmetleri ile alan adınızı istediğiniz gibi özelleştirebilirsiniz.
                                    </p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- FAQ Item 2 -->
                <div
                    class="faq-item bg-verinay-dark-2 rounded-xl border border-neutral-700/50 hover:border-neutral-600/50 transition-all duration-300 hover:bg-neutral-800/70">
                    <button
                        class="faq-question w-full px-6 py-5 text-left flex items-center justify-between hover:bg-neutral-700/20 transition-all duration-200 rounded-xl group"
                        data-faq="2">
                        <span class="text-white font-medium text-lg group-hover:text-neutral-100 transition-colors">
                            Alan Adım Kaç Dakikada Aktif Olur?
                        </span>
                        <div class="flex-shrink-0">
                            <div
                                class="w-6 h-6 rounded-md bg-neutral-700 group-hover:bg-neutral-600 transition-colors duration-200 flex items-center justify-center">
                                <svg class="faq-icon w-4 h-4 text-neutral-300 group-hover:text-white transform transition-transform duration-200"
                                    fill="currentColor" viewBox="0 0 20 20">
                                    <path fill-rule="evenodd"
                                        d="M10 3a1 1 0 011 1v5h5a1 1 0 110 2h-5v5a1 1 0 11-2 0v-5H4a1 1 0 110-2h5V4a1 1 0 011-1z"
                                        clip-rule="evenodd"></path>
                                </svg>
                            </div>
                        </div>
                    </button>
                    <div class="faq-answer max-h-0 overflow-hidden transition-all duration-300 ease-out"
                        data-faq-content="2">
                        <div class="px-6 pb-6 pt-1">
                            <div class="border-t border-neutral-700/30 pt-5">
                                <div class="space-y-4 text-neutral-300 text-base leading-relaxed">
                                    <p>
                                        Alan adınız sipariş vermenizden itibaren <strong
                                            class="text-white">anında</strong>
                                        otomatik olarak kaydedilir ve kullanıma hazır hale gelir. DNS propagasyonu ise
                                        genellikle <strong class="text-white">24 saat içinde</strong> tamamlanır.
                                    </p>
                                    <p>
                                        Alan adı kaydından sonra, <strong class="text-white">DNS yönetim paneli</strong>
                                        üzerinden alan adınızı anında yönetmeye başlayabilirsiniz. Temel DNS kayıtları
                                        önceden ayarlanmış olarak gelir ve istediğiniz hosting'e yönlendirebilirsiniz.
                                    </p>
                                    <p>
                                        Eğer özel DNS ayarlarına ihtiyacınız varsa (MX kayıtları, CNAME, A kayıtları
                                        vb.)
                                        <strong class="text-white">teknik destek ekibimiz</strong> size yardımcı
                                        olabilir. Genellikle tüm ayarlar 1 saat içinde aktif hale gelir.
                                    </p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- FAQ Item 3 -->
                <div
                    class="faq-item bg-verinay-dark-2 rounded-xl border border-neutral-700/50 hover:border-neutral-600/50 transition-all duration-300 hover:bg-neutral-800/70">
                    <button
                        class="faq-question w-full px-6 py-5 text-left flex items-center justify-between hover:bg-neutral-700/20 transition-all duration-200 rounded-xl group"
                        data-faq="3">
                        <span class="text-white font-medium text-lg group-hover:text-neutral-100 transition-colors">
                            Alan Adımı Transfer Edebilir miyim?
                        </span>
                        <div class="flex-shrink-0">
                            <div
                                class="w-6 h-6 rounded-md bg-neutral-700 group-hover:bg-neutral-600 transition-colors duration-200 flex items-center justify-center">
                                <svg class="faq-icon w-4 h-4 text-neutral-300 group-hover:text-white transform transition-transform duration-200"
                                    fill="currentColor" viewBox="0 0 20 20">
                                    <path fill-rule="evenodd"
                                        d="M10 3a1 1 0 011 1v5h5a1 1 0 110 2h-5v5a1 1 0 11-2 0v-5H4a1 1 0 110-2h5V4a1 1 0 011-1z"
                                        clip-rule="evenodd"></path>
                                </svg>
                            </div>
                        </div>
                    </button>
                    <div class="faq-answer max-h-0 overflow-hidden transition-all duration-300 ease-out"
                        data-faq-content="3">
                        <div class="px-6 pb-6 pt-1">
                            <div class="border-t border-neutral-700/30 pt-5">
                                <div class="space-y-4 text-neutral-300 text-base leading-relaxed">
                                    <p>
                                        Evet! Mevcut alan adınızı bizim firmamıza <strong class="text-white">kolayca
                                            transfer edebilirsiniz</strong>. Transfer işlemi tamamen ücretsizdir ve alan
                                        adınızın süresine 1 yıl eklenir. Bu sayede hem para tasarrufu yapar hem de daha
                                        iyi hizmet alırsınız.
                                    </p>
                                    <p>
                                        Transfer işlemi için sadece <strong class="text-white">EPP kodu (Auth
                                            Code)</strong>
                                        gereklidir. Bu kodu mevcut registrar'ınızdan alarak transfer işlemini
                                        başlatabilirsiniz. Transfer süreci genellikle <strong class="text-white">5-7 gün
                                            içinde</strong> tamamlanır.
                                    </p>
                                    <p>
                                        Transfer sırasında alan adınızda <strong class="text-white">hiçbir kesinti
                                            yaşanmaz</strong>. Web siteniz ve e-postalarınız normal şekilde çalışmaya
                                        devam eder. Transfer tamamlandıktan sonra daha gelişmiş DNS yönetimi ve güvenlik
                                        özelliklerinden faydalanabilirsiniz.
                                    </p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- FAQ Item 4 -->
                <div
                    class="faq-item bg-verinay-dark-2 rounded-xl border border-neutral-700/50 hover:border-neutral-600/50 transition-all duration-300 hover:bg-neutral-800/70">
                    <button
                        class="faq-question w-full px-6 py-5 text-left flex items-center justify-between hover:bg-neutral-700/20 transition-all duration-200 rounded-xl group"
                        data-faq="4">
                        <span class="text-white font-medium text-lg group-hover:text-neutral-100 transition-colors">
                            WHOIS Gizlilik Koruması Nedir?
                        </span>
                        <div class="flex-shrink-0">
                            <div
                                class="w-6 h-6 rounded-md bg-neutral-700 group-hover:bg-neutral-600 transition-colors duration-200 flex items-center justify-center">
                                <svg class="faq-icon w-4 h-4 text-neutral-300 group-hover:text-white transform transition-transform duration-200"
                                    fill="currentColor" viewBox="0 0 20 20">
                                    <path fill-rule="evenodd"
                                        d="M10 3a1 1 0 011 1v5h5a1 1 0 110 2h-5v5a1 1 0 11-2 0v-5H4a1 1 0 110-2h5V4a1 1 0 011-1z"
                                        clip-rule="evenodd"></path>
                                </svg>
                            </div>
                        </div>
                    </button>
                    <div class="faq-answer max-h-0 overflow-hidden transition-all duration-300 ease-out"
                        data-faq-content="4">
                        <div class="px-6 pb-6 pt-1">
                            <div class="border-t border-neutral-700/30 pt-5">
                                <div class="space-y-4 text-neutral-300 text-base leading-relaxed">
                                    <p>
                                        WHOIS gizlilik koruması, <strong class="text-white">kişisel bilgilerinizi
                                            koruyarak</strong> alan adı sahiplik bilgilerinizin herkese açık WHOIS
                                        veritabanında gizlenmesini sağlar. Bu sayede isminiz, adresiniz, telefon
                                        numaranız
                                        ve e-posta adresiniz gizli kalır.
                                    </p>
                                    <p>
                                        <strong class="text-white">Ücretsiz WHOIS koruması</strong> ile spam e-postalar,
                                        istenmeyen telefon aramaları ve kimlik hırsızlığı girişimlerinden korunursunuz.
                                        Kişisel ve kurumsal güvenliğiniz için bu hizmet son derece önemlidir.
                                    </p>
                                    <p>
                                        WHOIS koruması aktif olduğunda, <strong class="text-white">proxy
                                            bilgileri</strong>
                                        gösterilir ancak yasal süreçlerde gerekli olması durumunda gerçek bilgileriniz
                                        yetkili makamlara verilebilir. Bu hizmet tüm uygun alan adı uzantıları için
                                        ücretsiz olarak sunulmaktadır.
                                    </p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- ========= FOOTER ========= -->
    <?php include 'inc/footer.php'; ?>

    <!-- ========= SCRIPT ========= -->
    <script src="js/main.js"></script>
</body>

</html>