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

<head>
    <?php include "inc/head.php"; ?>
    <style>
        .package-card {
            transition: all 0.3s ease;
        }

        .package-card:hover {
            transform: translateY(-5px);
        }
    </style>
</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/game-server/minecraft-background.webp');">
        </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-gift verinay-yellow-1 mr-2 text-xs sm:text-sm"></i>
                            <span class="verinay-white text-xs sm:text-sm font-medium">Yıllık satın alımlarda</span>
                            <span class="verinay-yellow-1 text-xs sm:text-sm ml-1 sm:ml-2 font-bold">10 ay öde 2
                                ay</span>
                            <span class="verinay-white text-xs sm:text-sm font-medium pl-1 sm:pl-2">ücretsiz
                                kullan!</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">
                            Minecraft Server Kiralama
                        </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">
                            Türkiye lokasyon sunucularımız ile düşük gecikme değerleri alabileceğiniz özel Minecraft
                            VDS'ler. Yüksek performans, SSD disk ve 7/24 teknik destek.
                        </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-server verinay-yellow-1 mr-3 text-sm"></i>
                                <span class="text-sm sm:text-base">Yüksek Performans VDS</span>
                            </div>
                            <div class="flex items-center verinay-gray-1">
                                <i class="fas fa-bolt verinay-yellow-1 mr-3 text-sm"></i>
                                <span class="text-sm sm:text-base">Düşük Ping Değerleri</span>
                            </div>
                            <div class="flex items-center verinay-gray-1">
                                <i class="fas fa-hdd verinay-yellow-1 mr-3 text-sm"></i>
                                <span class="text-sm sm:text-base">SSD Disk Depolama</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 Teknik Destek</span>
                            </div>
                            <div class="flex items-center verinay-gray-1">
                                <i class="fas fa-plug verinay-yellow-1 mr-3 text-sm"></i>
                                <span class="text-sm sm:text-base">Plugin Desteği</span>
                            </div>
                            <div class="flex items-center verinay-gray-1">
                                <i class="fas fa-cloud-upload-alt verinay-yellow-1 mr-3 text-sm"></i>
                                <span class="text-sm sm:text-base">Otomatik Yedekleme</span>
                            </div>
                        </div>

                        <!-- Buttons -->
                        <div class="flex flex-col sm:flex-row gap-3 sm:gap-4 mb-8">
                            <button type="button"
                                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-cube mr-2"></i>
                                Minecraft Paketleri
                            </button>
                            <button type="button"
                                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="fas fa-list mr-2"></i>
                                Özellikler
                            </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-tachometer-alt mr-2"></i>
                                    &lt;10ms
                                </div>
                                <div class="text-xs sm:text-sm verinay-gray-1">Ping</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>
                                    7/24
                                </div>
                                <div class="text-xs sm:text-sm verinay-gray-1">Online</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>
                                    500+
                                </div>
                                <div class="text-xs sm:text-sm verinay-gray-1">Aktif Server</div>
                            </div>
                        </div>
                    </div>

                    <!-- Sağ taraf - Minecraft Server Console Mockup -->
                    <div class="hidden lg:block">
                        <div class="relative">
                            <!-- Minecraft Server Console Mockup -->
                            <div class="bg-verinay-dark-3 rounded-lg p-6 border border-verinay-gray-2 backdrop-blur-sm">
                                <div class="flex items-center justify-between mb-4">
                                    <div class="verinay-white font-semibold flex items-center">
                                        <i class="fas fa-terminal verinay-yellow-1 mr-2"></i>
                                        Server Konsolu
                                    </div>
                                    <div class="flex items-center space-x-2">
                                        <div class="w-3 h-3 bg-green-400 rounded-full animate-pulse"></div>
                                        <span class="text-xs verinay-gray-1">Online</span>
                                    </div>
                                </div>

                                <!-- Console Output -->
                                <div class="bg-verinay-dark-4 p-4 rounded font-mono text-sm h-64 overflow-hidden">
                                    <div class="space-y-1">
                                        <div class="verinay-gray-1">[14:32:15] [Server thread/INFO]: Starting
                                            minecraft server version 1.20.1</div>
                                        <div class="verinay-gray-1">[14:32:16] [Server thread/INFO]: Loading
                                            properties</div>
                                        <div class="verinay-gray-1">[14:32:17] [Server thread/INFO]: Default game
                                            type: SURVIVAL</div>
                                        <div class="verinay-gray-1">[14:32:18] [Server thread/INFO]: Generating
                                            keypair</div>
                                        <div class="verinay-gray-1">[14:32:19] [Server thread/INFO]: Starting
                                            Minecraft server on *:25565</div>
                                        <div class="text-green-400">[14:32:20] [Server thread/INFO]: Done (5.2s)!
                                            For help, type "help"</div>
                                        <div class="text-blue-400">[14:32:25] [Server thread/INFO]: Player123 joined
                                            the game</div>
                                        <div class="text-blue-400">[14:32:30] [Server thread/INFO]: GamerTR joined
                                            the game</div>
                                        <div class="verinay-yellow-1">[14:32:35] [Server thread/INFO]: &lt;Player123&gt;
                                            Merhaba!</div>
                                        <div class="verinay-yellow-1">[14:32:40] [Server thread/INFO]: &lt;GamerTR&gt;
                                            Selam!</div>
                                        <div class="animate-pulse verinay-white">█</div>
                                    </div>
                                </div>

                                <!-- Server Stats -->
                                <div class="mt-4 grid grid-cols-2 gap-3">
                                    <div class="p-3 bg-verinay-dark-4 rounded border border-verinay-gray-2">
                                        <div class="text-xs verinay-gray-1 mb-1 flex items-center">
                                            <i class="fas fa-users verinay-yellow-1 mr-2"></i>
                                            Oyuncular
                                        </div>
                                        <div class="verinay-white font-semibold">2/20</div>
                                    </div>
                                    <div class="p-3 bg-verinay-dark-4 rounded border border-verinay-gray-2">
                                        <div class="text-xs verinay-gray-1 mb-1 flex items-center">
                                            <i class="fas fa-microchip verinay-yellow-1 mr-2"></i>
                                            CPU Kullanımı
                                        </div>
                                        <div class="verinay-white font-semibold">15%</div>
                                    </div>
                                </div>

                                <!-- RAM Usage -->
                                <div class="mt-3 p-3 bg-verinay-dark-4 rounded border border-verinay-gray-2">
                                    <div class="text-xs verinay-gray-1 mb-2 flex items-center">
                                        <i class="fas fa-memory verinay-yellow-1 mr-2"></i>
                                        RAM Kullanımı
                                    </div>
                                    <div class="w-full bg-verinay-gray-2 rounded-full h-2">
                                        <div class="bg-verinay-yellow-1 h-2 rounded-full transition-all duration-300"
                                            style="width: 60%"></div>
                                    </div>
                                    <div class="text-xs verinay-gray-1 mt-1 flex items-center justify-between">
                                        <span>3.6 GB / 6 GB</span>
                                        <span class="verinay-yellow-1">60%</span>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- ========= CONTENT SECTION ========= -->
    <section class="py-12 sm:py-16 lg:py-20">
        <div class="container mx-auto px-4 sm:px-6 lg:px-8">
            <div class="max-w-6xl mx-auto">
                <div
                    class="bg-verinay-dark-4 border border-verinay-gray-2 rounded-xl p-6 sm:p-8 lg:p-12 relative overflow-hidden">

                    <!-- Background Pattern -->
                    <div class="absolute inset-0 opacity-5">
                        <div class="absolute top-4 left-4 w-4 h-4 bg-verinay-yellow-1 rounded-full"></div>
                        <div class="absolute top-8 right-8 w-2 h-2 bg-verinay-yellow-1 rounded-full"></div>
                        <div class="absolute bottom-6 left-12 w-3 h-3 bg-verinay-yellow-1 rounded-full"></div>
                        <div class="absolute bottom-12 right-6 w-5 h-5 bg-verinay-yellow-1 rounded-full"></div>
                    </div>

                    <!-- Content -->
                    <div class="relative z-10">
                        <!-- Header Section -->
                        <div class="text-center mb-8">
                            <!-- Icon Badge -->
                            <div
                                class="inline-flex items-center justify-center w-16 h-16 bg-verinay-dark-3 rounded-full mb-4 border border-verinay-gray-2">
                                <i class="fas fa-cubes text-2xl verinay-yellow-1"></i>
                            </div>

                            <h3 class="text-xl sm:text-2xl lg:text-3xl font-bold verinay-yellow-1 mb-4">
                                Güvenilir Minecraft Sunucu Kiralama
                            </h3>

                            <!-- Subtitle -->
                            <div class="max-w-2xl mx-auto">
                                <p class="verinay-gray-1 text-sm sm:text-base font-medium mb-6">
                                    Profesyonel Minecraft sunucuları ile kesintisiz oyun deneyimi
                                </p>
                            </div>
                        </div>

                        <!-- Features Grid -->
                        <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4 mb-8">
                            <div
                                class="flex items-center p-3 bg-verinay-dark-3 rounded-lg border border-verinay-gray-2">
                                <i class="fas fa-headset verinay-yellow-1 mr-3 text-lg"></i>
                                <span class="verinay-white text-sm font-medium">7/24 Teknik Destek</span>
                            </div>
                            <div
                                class="flex items-center p-3 bg-verinay-dark-3 rounded-lg border border-verinay-gray-2">
                                <i class="fas fa-cloud-upload-alt verinay-yellow-1 mr-3 text-lg"></i>
                                <span class="verinay-white text-sm font-medium">Otomatik Yedekleme</span>
                            </div>
                            <div
                                class="flex items-center p-3 bg-verinay-dark-3 rounded-lg border border-verinay-gray-2">
                                <i class="fas fa-chart-line verinay-yellow-1 mr-3 text-lg"></i>
                                <span class="verinay-white text-sm font-medium">%99.9 Uptime</span>
                            </div>
                            <div
                                class="flex items-center p-3 bg-verinay-dark-3 rounded-lg border border-verinay-gray-2">
                                <i class="fas fa-shield-alt verinay-yellow-1 mr-3 text-lg"></i>
                                <span class="verinay-white text-sm font-medium">DDoS Koruması</span>
                            </div>
                            <div
                                class="flex items-center p-3 bg-verinay-dark-3 rounded-lg border border-verinay-gray-2">
                                <i class="fas fa-server verinay-yellow-1 mr-3 text-lg"></i>
                                <span class="verinay-white text-sm font-medium">Yüksek Performans</span>
                            </div>
                            <div
                                class="flex items-center p-3 bg-verinay-dark-3 rounded-lg border border-verinay-gray-2">
                                <i class="fas fa-map-marker-alt verinay-yellow-1 mr-3 text-lg"></i>
                                <span class="verinay-white text-sm font-medium">Türkiye Lokasyon</span>
                            </div>
                        </div>

                        <!-- Main Content -->
                        <div class="text-center">
                            <p
                                class="verinay-white text-sm sm:text-base lg:text-lg leading-relaxed max-w-4xl mx-auto mb-8">
                                Profesyonel sunucularımız en son teknoloji ile donatılmış ve Türkiye'nin en hızlı veri
                                merkezlerinde barındırılmaktadır. Yüksek performans donanımları ile arkadaşlarınızla
                                mükemmel bir oyun deneyimi yaşarken, sunucunuzun her zaman aktif kalmasını garanti
                                ediyoruz.
                            </p>

                            <!-- CTA Button -->
                            <button
                                class="bg-verinay-yellow-1 hover:bg-verinay-yellow-2 verinay-dark font-semibold px-8 py-3 rounded-lg transition-all duration-300 transform hover:scale-105 text-sm sm:text-base inline-flex items-center">
                                <i class="fas fa-rocket mr-2"></i>
                                Minecraft Sunucu Kirala
                            </button>
                        </div>

                        <!-- Stats Bar -->
                        <div class="mt-8 pt-6 border-t border-verinay-gray-2">
                            <div class="grid grid-cols-1 sm:grid-cols-3 gap-4 text-center">
                                <div>
                                    <div class="text-2xl font-bold verinay-yellow-1 mb-1">500+</div>
                                    <div class="text-xs verinay-gray-1">Aktif Sunucu</div>
                                </div>
                                <div>
                                    <div class="text-2xl font-bold verinay-yellow-1 mb-1">15ms</div>
                                    <div class="text-xs verinay-gray-1">Ortalama Ping</div>
                                </div>
                                <div>
                                    <div class="text-2xl font-bold verinay-yellow-1 mb-1">7/24</div>
                                    <div class="text-xs verinay-gray-1">Kesintisiz Hizmet</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- ========= FEATURE SECTION ========= -->
    <section class="py-12 sm:py-16 lg:py-20">
        <div class="container mx-auto px-4 sm:px-6 lg:px-8">
            <div class="max-w-6xl mx-auto">
                <!-- Başlık -->
                <div class="text-center mb-8 sm:mb-12 lg:mb-16">
                    <h2 class="text-2xl sm:text-3xl lg:text-4xl xl:text-5xl font-bold verinay-yellow-1 mb-4">
                        Tüm Paketlerimizin Ortak Özellikleri
                    </h2>
                </div>

                <div class="grid grid-cols-1 lg:grid-cols-12 gap-8 lg:gap-12 items-center">
                    <!-- Sol taraf - Minecraft karakterler görseli için küçük alan -->
                    <div class="order-2 lg:order-1 lg:col-span-4">
                        <div class="max-w-sm mx-auto">
                            <img src="images/game-server/mc-feature.png" alt="MINECRAFT FEATURE">
                        </div>
                    </div>

                    <!-- Sağ taraf - Özellikler (daha geniş) -->
                    <div class="order-1 lg:order-2 lg:col-span-8">
                        <div class="grid grid-cols-1 sm:grid-cols-2 gap-4 sm:gap-6">

                            <!-- Bot Koruması -->
                            <div
                                class="bg-verinay-dark-4 border border-verinay-gray-2 rounded-xl p-6 hover:border-verinay-yellow-2 transition-colors duration-300">
                                <div class="w-14 h-14 bg-green-500/20 rounded-xl flex items-center justify-center mb-5">
                                    <i class="fas fa-robot text-2xl text-green-400"></i>
                                </div>
                                <h3 class="text-xl font-bold verinay-yellow-1 mb-3">
                                    Güçlü Bot Koruması
                                </h3>
                                <p class="verinay-white text-sm leading-relaxed">
                                    Sunucunuza gelen botların %99'unu kesiyoruz.
                                </p>
                            </div>

                            <!-- DDoS Koruması -->
                            <div
                                class="bg-verinay-dark-4 border border-verinay-gray-2 rounded-xl p-6 hover:border-verinay-yellow-2 transition-colors duration-300">
                                <div class="w-14 h-14 bg-blue-500/20 rounded-xl flex items-center justify-center mb-5">
                                    <i class="fas fa-shield-alt text-2xl text-blue-400"></i>
                                </div>
                                <h3 class="text-xl font-bold verinay-yellow-1 mb-3">
                                    DDoS Koruması
                                </h3>
                                <p class="verinay-white text-sm leading-relaxed">
                                    Sunucunuza gelen DDoS saldırıların güçlü DDoS korumamız ile kesiyoruz.
                                </p>
                            </div>

                            <!-- 7/24 Teknik Destek -->
                            <div
                                class="bg-verinay-dark-4 border border-verinay-gray-2 rounded-xl p-6 hover:border-verinay-yellow-2 transition-colors duration-300">
                                <div
                                    class="w-14 h-14 bg-purple-500/20 rounded-xl flex items-center justify-center mb-5">
                                    <i class="fas fa-headset text-2xl text-purple-400"></i>
                                </div>
                                <h3 class="text-xl font-bold verinay-yellow-1 mb-3">
                                    7/24 Teknik Destek
                                </h3>
                                <p class="verinay-white text-sm leading-relaxed">
                                    7/24 teknik destek hizmetimiz ile sunucunuzda rahat edebilirsiniz.
                                </p>
                            </div>

                            <!-- Web Script -->
                            <div
                                class="bg-verinay-dark-4 border border-verinay-gray-2 rounded-xl p-6 hover:border-verinay-yellow-2 transition-colors duration-300">
                                <div class="w-14 h-14 bg-red-500/20 rounded-xl flex items-center justify-center mb-5">
                                    <i class="fas fa-code text-2xl text-red-400"></i>
                                </div>
                                <h3 class="text-xl font-bold verinay-yellow-1 mb-3">
                                    Web Script
                                </h3>
                                <p class="verinay-white text-sm leading-relaxed">
                                    Minecraft WebScript'imiz ile oyuncularınıza ürün satabilirsiniz.
                                </p>
                            </div>

                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- ========= GAME PACKET SECTION ========= -->
    <section id="packages-section" class="py-12 sm:py-16 lg:py-20">
        <div class="container mx-auto px-4 sm:px-6 lg:px-8">
            <div class="max-w-6xl mx-auto">

                <!-- Başlık -->
                <div class="text-center mb-8 sm:mb-12">
                    <h2 class="text-2xl sm:text-3xl lg:text-4xl xl:text-5xl font-bold verinay-yellow-1 mb-4">
                        İhtiyacınıza Uygun olan İşlemcinizi belirleyin
                    </h2>
                    <p class="verinay-gray-1 text-base sm:text-lg mb-8">
                        Tüm paketlerde ister Web Panel, isterseniz Uzak Masaüstü seçebilirsiniz!
                    </p>
                </div>

                <!-- İşlemci Seçim Butonları -->
                <div class="flex flex-wrap justify-center gap-4 mb-12">
                    <!-- Intel -->
                    <button onclick="showPackages('intel')" id="intel-btn"
                        class="processor-btn active bg-blue-600 hover:bg-blue-700 text-white px-6 py-3 rounded-lg font-semibold transition-all duration-300 flex items-center gap-3">
                        <img src="images/game-server/intel-for-mc.png" alt="Intel Logo"
                            class="h-6 w-auto" />
                        INTEL E5-2699 V4
                    </button>

                    <!-- AMD -->
                    <button onclick="showPackages('amd')" id="amd-btn"
                        class="processor-btn bg-verinay-gray-2 hover:bg-orange-600 text-white px-6 py-3 rounded-lg font-semibold transition-all duration-300 flex items-center gap-3">
                        <img src="images/game-server/ryzen-for-mc.png" alt="AMD Logo" class="h-6 w-auto" />
                        AMD RYZEN 9 5950X
                    </button>
                </div>

                <!-- Paketler -->
                <div id="packages-container">

                    <!-- Intel Paketleri -->
                    <div id="intel-packages" class="packages-grid grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6">

                        <!-- Paket 1 -->
                        <div
                            class="package-card bg-verinay-dark-4 border-2 border-verinay-gray-2 rounded-2xl p-6 text-center">
                            <div class="mb-6">
                                <div class="w-26 h-26 mx-auto mb-4 rounded-lg flex items-center justify-center">
                                    <img src="images/game-server/mc-logo.png" alt="MINECRAFT LOGO">
                                </div>
                                <h3 class="text-xl font-bold verinay-white mb-2">Paket 1</h3>
                                <div class="bg-blue-100 text-blue-800 text-3xl font-bold py-2 rounded-lg">
                                    139.99 ₺
                                </div>
                            </div>

                            <div class="space-y-4 mb-8 text-left">
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-memory text-green-500"></i>
                                    <span class="verinay-gray-1">8 GB DDR4 ECC Ram</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-microchip text-green-500"></i>
                                    <span class="verinay-gray-1">4 Core E5-2699 V4</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-hdd text-green-500"></i>
                                    <span class="verinay-gray-1">40 GB NVMe SSD</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-shield-alt text-green-500"></i>
                                    <span class="verinay-gray-1">%99 DDoS Koruması</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-chart-line text-green-500"></i>
                                    <span class="verinay-gray-1">Ücretsiz Kurulum</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-puzzle-piece text-green-500"></i>
                                    <span class="verinay-gray-1">Ücretsiz Plugin Paketi</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fab fa-discord text-green-500"></i>
                                    <span class="verinay-gray-1">Ücretsiz Discord Destek</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-desktop text-green-500"></i>
                                    <span class="verinay-gray-1">Slot Sınırı Yoktur</span>
                                </div>
                            </div>

                            <button
                                class="w-full bg-green-600 hover:bg-green-700 text-white font-bold py-4 rounded-lg transition-colors duration-300">
                                Hemen Kirala
                            </button>
                        </div>

                        <!-- Paket 2 -->
                        <div
                            class="package-card bg-verinay-dark-4 border-2 border-verinay-gray-2 rounded-2xl p-6 text-center">
                            <div class="mb-6">
                                <div class="w-26 h-26 mx-auto mb-4 rounded-lg flex items-center justify-center">
                                    <img src="images/game-server/mc-logo.png" alt="MINECRAFT LOGO">
                                </div>
                                <h3 class="text-xl font-bold verinay-white mb-2">Paket 1</h3>
                                <div class="bg-blue-100 text-blue-800 text-3xl font-bold py-2 rounded-lg">
                                    159.99 ₺
                                </div>
                            </div>

                            <div class="space-y-4 mb-8 text-left">
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-memory text-green-500"></i>
                                    <span class="verinay-gray-1">16 GB DDR4 ECC Ram</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-microchip text-green-500"></i>
                                    <span class="verinay-gray-1">6 Core E5-2699 V4</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-hdd text-green-500"></i>
                                    <span class="verinay-gray-1">80 GB NVMe SSD</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-shield-alt text-green-500"></i>
                                    <span class="verinay-gray-1">%99 DDoS Koruması</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-chart-line text-green-500"></i>
                                    <span class="verinay-gray-1">Ücretsiz Kurulum</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-puzzle-piece text-green-500"></i>
                                    <span class="verinay-gray-1">Ücretsiz Plugin Paketi</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fab fa-discord text-green-500"></i>
                                    <span class="verinay-gray-1">Ücretsiz Discord Destek</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-desktop text-green-500"></i>
                                    <span class="verinay-gray-1">Slot Sınırı Yoktur</span>
                                </div>
                            </div>

                            <button
                                class="w-full bg-green-600 hover:bg-green-700 text-white font-bold py-4 rounded-lg transition-colors duration-300">
                                Hemen Kirala
                            </button>
                        </div>

                        <!-- Paket 3 -->
                        <div
                            class="package-card bg-verinay-dark-4 border-2 border-verinay-gray-2 rounded-2xl p-6 text-center">
                            <div class="mb-6">
                                <div class="w-26 h-26 mx-auto mb-4 rounded-lg flex items-center justify-center">
                                    <img src="images/game-server/mc-logo.png" alt="MINECRAFT LOGO">
                                </div>
                                <h3 class="text-xl font-bold verinay-white mb-2">Paket 1</h3>
                                <div class="bg-blue-100 text-blue-800 text-3xl font-bold py-2 rounded-lg">
                                    179.99 ₺
                                </div>
                            </div>

                            <div class="space-y-4 mb-8 text-left">
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-memory text-green-500"></i>
                                    <span class="verinay-gray-1">32 GB DDR4 ECC Ram</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-microchip text-green-500"></i>
                                    <span class="verinay-gray-1">8 Core E5-2699 V4</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-hdd text-green-500"></i>
                                    <span class="verinay-gray-1">120 GB NVMe SSD</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-shield-alt text-green-500"></i>
                                    <span class="verinay-gray-1">%99 DDoS Koruması</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-chart-line text-green-500"></i>
                                    <span class="verinay-gray-1">Ücretsiz Kurulum</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-puzzle-piece text-green-500"></i>
                                    <span class="verinay-gray-1">Ücretsiz Plugin Paketi</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fab fa-discord text-green-500"></i>
                                    <span class="verinay-gray-1">Ücretsiz Discord Destek</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-desktop text-green-500"></i>
                                    <span class="verinay-gray-1">Slot Sınırı Yoktur</span>
                                </div>
                            </div>

                            <button
                                class="w-full bg-green-600 hover:bg-green-700 text-white font-bold py-4 rounded-lg transition-colors duration-300">
                                Hemen Kirala
                            </button>
                        </div>
                    </div>

                    <!-- AMD Paketleri -->
                    <div id="amd-packages"
                        class="packages-grid grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6 hidden">

                        <!-- AMD Paket 1 -->
                        <div
                            class="package-card bg-verinay-dark-4 border-2 border-verinay-gray-2 rounded-2xl p-6 text-center">
                            <div class="mb-6">
                                <div class="w-26 h-26 mx-auto mb-4 rounded-lg flex items-center justify-center">
                                    <img src="images/game-server/mc-logo.png" alt="MINECRAFT LOGO">
                                </div>
                                <h3 class="text-xl font-bold verinay-white mb-2">AMD Paket 1</h3>
                                <div class="bg-orange-100 text-orange-800 text-3xl font-bold py-2 rounded-lg">
                                    189.99 ₺
                                </div>
                            </div>

                            <div class="space-y-4 mb-8 text-left">
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-memory text-red-500"></i>
                                    <span class="verinay-gray-1">16 GB DDR4 ECC Ram</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-microchip text-red-500"></i>
                                    <span class="verinay-gray-1">4 Core Ryzen 9 5950X</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-hdd text-red-500"></i>
                                    <span class="verinay-gray-1">60 GB NVMe SSD</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-shield-alt text-red-500"></i>
                                    <span class="verinay-gray-1">%99 DDoS Koruması</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-chart-line text-red-500"></i>
                                    <span class="verinay-gray-1">Ücretsiz Kurulum</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-puzzle-piece text-red-500"></i>
                                    <span class="verinay-gray-1">Ücretsiz Plugin Paketi</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fab fa-discord text-red-500"></i>
                                    <span class="verinay-gray-1">Ücretsiz Discord Destek</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-desktop text-red-500"></i>
                                    <span class="verinay-gray-1">Slot Sınırı Yoktur</span>
                                </div>
                            </div>

                            <button
                                class="w-full bg-red-600 hover:bg-red-700 text-white font-bold py-4 rounded-lg transition-colors duration-300">
                                Hemen Kirala
                            </button>
                        </div>

                        <!-- AMD Paket 2 -->
                        <div
                            class="package-card bg-verinay-dark-4 border-2 border-verinay-gray-2 rounded-2xl p-6 text-center">
                            <div class="mb-6">
                                <div class="w-26 h-26 mx-auto mb-4 rounded-lg flex items-center justify-center">
                                    <img src="images/game-server/mc-logo.png" alt="MINECRAFT LOGO">
                                </div>
                                <h3 class="text-xl font-bold verinay-white mb-2">AMD Paket 2</h3>
                                <div class="bg-orange-100 text-orange-800 text-3xl font-bold py-2 rounded-lg">
                                    349.99 ₺
                                </div>
                            </div>

                            <div class="space-y-4 mb-8 text-left">
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-memory text-red-500"></i>
                                    <span class="verinay-gray-1">32 GB DDR4 ECC Ram</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-microchip text-red-500"></i>
                                    <span class="verinay-gray-1">8 Core Ryzen 9 5950X</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-hdd text-red-500"></i>
                                    <span class="verinay-gray-1">120 GB NVMe SSD</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-shield-alt text-red-500"></i>
                                    <span class="verinay-gray-1">%99 DDoS Koruması</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-chart-line text-red-500"></i>
                                    <span class="verinay-gray-1">Ücretsiz Kurulum</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-puzzle-piece text-red-500"></i>
                                    <span class="verinay-gray-1">Ücretsiz Plugin Paketi</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fab fa-discord text-red-500"></i>
                                    <span class="verinay-gray-1">Ücretsiz Discord Destek</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-desktop text-red-500"></i>
                                    <span class="verinay-gray-1">Slot Sınırı Yoktur</span>
                                </div>
                            </div>

                            <button
                                class="w-full bg-red-600 hover:bg-red-700 text-white font-bold py-4 rounded-lg transition-colors duration-300">
                                Hemen Kirala
                            </button>
                        </div>

                        <!-- AMD Paket 3 -->
                        <div
                            class="package-card bg-verinay-dark-4 border-2 border-verinay-gray-2 rounded-2xl p-6 text-center">
                            <div class="mb-6">
                                <div class="w-26 h-26 mx-auto mb-4 rounded-lg flex items-center justify-center">
                                    <img src="images/game-server/mc-logo.png" alt="MINECRAFT LOGO">
                                </div>
                                <h3 class="text-xl font-bold verinay-white mb-2">AMD Paket 3</h3>
                                <div class="bg-orange-100 text-orange-800 text-3xl font-bold py-2 rounded-lg">
                                    549.99 ₺
                                </div>
                            </div>

                            <div class="space-y-4 mb-8 text-left">
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-memory text-red-500"></i>
                                    <span class="verinay-gray-1">64 GB DDR4 ECC Ram</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-microchip text-red-500"></i>
                                    <span class="verinay-gray-1">12 Core Ryzen 9 5950X</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-hdd text-red-500"></i>
                                    <span class="verinay-gray-1">200 GB NVMe SSD</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-shield-alt text-red-500"></i>
                                    <span class="verinay-gray-1">%99 DDoS Koruması</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-chart-line text-red-500"></i>
                                    <span class="verinay-gray-1">Ücretsiz Kurulum</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-puzzle-piece text-red-500"></i>
                                    <span class="verinay-gray-1">Ücretsiz Plugin Paketi</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fab fa-discord text-red-500"></i>
                                    <span class="verinay-gray-1">Ücretsiz Discord Destek</span>
                                </div>
                                <div class="flex items-center gap-3">
                                    <i class="fas fa-desktop text-red-500"></i>
                                    <span class="verinay-gray-1">Slot Sınırı Yoktur</span>
                                </div>
                            </div>

                            <button
                                class="w-full bg-red-600 hover:bg-red-700 text-white font-bold py-4 rounded-lg transition-colors duration-300">
                                Hemen Kirala
                            </button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- ========= PACKET FEATURE ========= -->
    <section id="features-section" class="py-12 sm:py-16 lg:py-20">
        <div class="container mx-auto px-4 sm:px-6 lg:px-8">
            <div class="max-w-6xl mx-auto">
                <!-- Başlık -->
                <div class="text-center mb-8 sm:mb-12 lg:mb-16">
                    <h1 class="text-xl sm:text-2xl lg:text-3xl xl:text-5xl font-bold verinay-yellow-1">
                        Tüm Oyun Sunucularımızın Ortak Özellikleri
                    </h1>
                </div>

                <!-- Özellik Kutuları -->
                <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6 sm:gap-8">
                    <!-- Kutu 1 -->
                    <div
                        class="bg-verinay-dark-4 border border-verinay-gray-2 rounded-xl p-6 sm:p-8 text-center hover:border-verinay-yellow-2 transition-colors duration-300">
                        <div class="w-16 h-16 bg-green-500/20 rounded-xl flex items-center justify-center mx-auto mb-6">
                            <i class="fa-solid fa-server text-3xl text-green-400"></i>
                        </div>
                        <h3 class="text-xl font-bold verinay-yellow-1 mb-4">Yüksek Performans</h3>
                        <p class="verinay-gray-1 text-sm leading-relaxed">
                            Son teknoloji sunucularımız ile kesintisiz Minecraft deneyimi yaşayın.
                        </p>
                    </div>

                    <!-- Kutu 2 -->
                    <div
                        class="bg-verinay-dark-4 border border-verinay-gray-2 rounded-xl p-6 sm:p-8 text-center hover:border-verinay-yellow-2 transition-colors duration-300">
                        <div class="w-16 h-16 bg-blue-500/20 rounded-xl flex items-center justify-center mx-auto mb-6">
                            <i class="fa-solid fa-clock text-3xl text-blue-400"></i>
                        </div>
                        <h3 class="text-xl font-bold verinay-yellow-1 mb-4">Hızlı Kurulum</h3>
                        <p class="verinay-gray-1 text-sm leading-relaxed">
                            Sunucunuz sadece 5 dakika içinde hazır ve kullanıma ready durumda.
                        </p>
                    </div>

                    <!-- Kutu 3 -->
                    <div
                        class="bg-verinay-dark-4 border border-verinay-gray-2 rounded-xl p-6 sm:p-8 text-center hover:border-verinay-yellow-2 transition-colors duration-300">
                        <div
                            class="w-16 h-16 bg-purple-500/20 rounded-xl flex items-center justify-center mx-auto mb-6">
                            <i class="fa-solid fa-users text-3xl text-purple-400"></i>
                        </div>
                        <h3 class="text-xl font-bold verinay-yellow-1 mb-4">Sınırsız Slot</h3>
                        <p class="verinay-gray-1 text-sm leading-relaxed">
                            Tüm paketlerimizde oyuncu sayısı limiti bulunmamaktadır.
                        </p>
                    </div>

                    <!-- Kutu 4 -->
                    <div
                        class="bg-verinay-dark-4 border border-verinay-gray-2 rounded-xl p-6 sm:p-8 text-center hover:border-verinay-yellow-2 transition-colors duration-300">
                        <div
                            class="w-16 h-16 bg-yellow-500/20 rounded-xl flex items-center justify-center mx-auto mb-6">
                            <i class="fa-solid fa-folder text-3xl text-yellow-400"></i>
                        </div>
                        <h3 class="text-xl font-bold verinay-yellow-1 mb-4">Otomatik Yedekleme</h3>
                        <p class="verinay-gray-1 text-sm leading-relaxed">
                            Verileriniz günlük otomatik yedekleme sistemi ile güvende.
                        </p>
                    </div>

                    <!-- Kutu 5 -->
                    <div
                        class="bg-verinay-dark-4 border border-verinay-gray-2 rounded-xl p-6 sm:p-8 text-center hover:border-verinay-yellow-2 transition-colors duration-300">
                        <div class="w-16 h-16 bg-red-500/20 rounded-xl flex items-center justify-center mx-auto mb-6">
                            <i class="fa-solid fa-tachometer-alt text-3xl text-red-400"></i>
                        </div>
                        <h3 class="text-xl font-bold verinay-yellow-1 mb-4">Düşük Ping</h3>
                        <p class="verinay-gray-1 text-sm leading-relaxed">
                            Türkiye lokasyon sunucularımız ile minimum gecikme süresi.
                        </p>
                    </div>

                    <!-- Kutu 6 -->
                    <div
                        class="bg-verinay-dark-4 border border-verinay-gray-2 rounded-xl p-6 sm:p-8 text-center hover:border-verinay-yellow-2 transition-colors duration-300">
                        <div class="w-16 h-16 bg-cyan-500/20 rounded-xl flex items-center justify-center mx-auto mb-6">
                            <i class="fa-solid fa-tools text-3xl text-cyan-400"></i>
                        </div>
                        <h3 class="text-xl font-bold verinay-yellow-1 mb-4">Kolay Yönetim</h3>
                        <p class="verinay-gray-1 text-sm leading-relaxed">
                            Kullanıcı dostu web panel ile sunucunuzu kolayca yönetin.
                        </p>
                    </div>
                </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">
                    Minecraft sunucu kiralama 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">
                            Minecraft Sunucu Kiralama 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>
                                        Minecraft sunucu kiralama hizmetimiz, oyunculara birçok avantaj sunar. En önemli
                                        avantajlarımızdan biri, <strong class="text-white">NVMe SSD diskler ve Intel
                                            Xeon/AMD Ryzen işlemciler</strong>
                                        ile yüksek performans ve hızlı oyun deneyimi sunmamızdır.
                                    </p>
                                    <p>
                                        Güvenlik konusunda oldukça titiziz. <strong class="text-white">DDoS koruması,
                                            bot koruması ve günlük otomatik yedekleme</strong> sistemi ile sunucunuzun
                                        güvenliğini en üst seviyede sağlarız. Bu sayede oyununuz kesintisiz devam eder.
                                    </p>
                                    <p>
                                        Ayrıca deneyimli ve bilgili destek ekibimizle <strong class="text-white">7/24
                                            Türkçe teknik destek</strong> sunuyoruz. Türkiye lokasyonundaki
                                        sunucularımız sayesinde minimum ping değerleri ile oyun keyfinizi maksimuma
                                        çıkarabilirsiniz. Ücretsiz plugin paketi ve web script desteği ile sunucunuzu
                                        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">
                            Minecraft Sunucum Kaç Dakikada Hazır 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>
                                        Minecraft sunucunuz sipariş vermenizden itibaren <strong class="text-white">5
                                            dakika içinde</strong> otomatik olarak kurulur ve oynanmaya hazır hale
                                        gelir. Hızlı kurulum sistemimiz sayesinde bekleme süreniz minimum seviyededir.
                                    </p>
                                    <p>
                                        Sunucu kurulumundan sonra, <strong class="text-white">web panel veya uzak
                                            masaüstü</strong> üzerinden sunucunuzu anında yönetmeye başlayabilirsiniz.
                                        Temel Minecraft sunucu dosyaları önceden yüklenmiş olarak gelir ve istediğiniz
                                        modları, pluginleri kolayca yükleyebilirsiniz.
                                    </p>
                                    <p>
                                        Eğer özel bir sunucu kurulumu istiyorsanız (modlu sunucular, özel haritalar vb.)
                                        <strong class="text-white">teknik destek ekibimiz</strong> size yardımcı
                                        olabilir. Bu durumda kurulum süresi pakete göre değişiklik gösterebilir, ancak
                                        genellikle 1 saat içinde tamamlanır.
                                    </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">
                            Sunucumda Kaç Oyuncu Oynayabilir?
                        </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>
                                        Tüm Minecraft sunucu paketlerimizde <strong class="text-white">slot sınırı
                                            bulunmamaktadır</strong>. Sunucunuzun donanım kapasitesi ve RAM miktarına
                                        göre istediğiniz sayıda oyuncu alabilirsiniz. Bu sayede büyük topluluklar
                                        kurabilir veya arkadaş grubunuzla rahatça oynayabilirsiniz.
                                    </p>
                                    <p>
                                        Performans açısından, <strong class="text-white">8GB RAM'li paketimizde yaklaşık
                                            50-80 oyuncu, 16GB'da 100-150 oyuncu, 32GB'da ise 200+ oyuncu</strong>
                                        rahatça oynayabilir. Bu sayılar sunucu türüne, kullanılan pluginlere ve oyun
                                        tarzına göre değişiklik gösterebilir.
                                    </p>
                                    <p>
                                        Eğer çok yüksek oyuncu sayıları planlıyorsanız, <strong class="text-white">AMD
                                            Ryzen paketlerimizi</strong> tercih etmenizi öneririz. Daha yüksek CPU
                                        performansı sayesinde modlu sunucularda ve yoğun plugin kullanımında daha iyi
                                        sonuçlar alabilirsiniz.
                                    </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">
                            Sunucuma Mod ve Plugin Yükleyebilir 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="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>
                                        Elbette! Tüm paketlerimizde <strong class="text-white">tam yönetici
                                            erişimi</strong> bulunur. İstediğiniz modları, pluginleri, texture pack'leri
                                        ve özel haritaları kolayca yükleyebilirsiniz. Hem web panel hem de uzak masaüstü
                                        seçenekleri ile sunucunuzu tamamen kontrol edebilirsiniz.
                                    </p>
                                    <p>
                                        <strong class="text-white">Ücretsiz plugin paketi</strong> ile birlikte gelen
                                        sunucunuzda popüler pluginler önceden kurulu olarak gelir. Bunlar arasında
                                        Essentials, WorldEdit, Permissions ve daha birçok yararlı plugin bulunur. Ayrıca
                                        Bukkit, Spigot, Paper ve Forge sunucularını destekliyoruz.
                                    </p>
                                    <p>
                                        Eğer mod veya plugin yükleme konusunda yardıma ihtiyacınız varsa, <strong
                                            class="text-white">7/24 teknik destek ekibimiz</strong> size ücretsiz olarak
                                        yardımcı olabilir. FTP erişimi de dahil olmak üzere tüm dosya yönetim
                                        işlemlerini kolayca yapabilirsiniz.
                                    </p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

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

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

</html>