
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Tuxiom | Expert Linux Support</title>
    <script src="https://cdn.tailwindcss.com"></script>
</head>
<body class="bg-[#0f1115] text-gray-300 font-sans antialiased">

    <nav class="p-6 flex justify-between items-center max-w-6xl mx-auto">
        <div class="text-2xl font-bold text-white tracking-tighter">TUXIOM</div>
        <div class="space-x-8 hidden md:flex">
            <a href="/support/contact.html" 
               class="inline-block bg-indigo-600 text-white font-bold px-5 py-2 rounded-xl 
                      text-sm shadow-[0_0_15px_rgba(129,138,248,0.2)] 
                      hover:bg-indigo-500 hover:shadow-[0_0_25px_rgba(129,138,248,0.4)] 
                      active:scale-[0.95] active:shadow-inner 
                      transition-all duration-75 ease-out cursor-pointer">
                Contact
            </a>
        </div>
    </nav>

    <header class="py-20 px-6 text-center border-b border-gray-800">
        <h1 class="text-5xl md:text-7xl font-extrabold text-white mb-6">
            Speed Comes <span class="text-blue-500 underline decoration-blue-500/30">First.</span>
        </h1>
        <p class="text-xl text-gray-400 max-w-2xl mx-auto mb-10 leading-relaxed">
            Unbeatable performance and features through open-source mastery. 
            From home users to IT Professionals, we make Linux work for you.
        </p>
        
        <div class="inline-block bg-slate-900/50 border border-white/10 p-6 rounded-3xl font-mono text-blue-400 hover:border-blue-500 hover:shadow-[0_0_20px_rgba(59,130,246,0.5)] hover:-translate-y-1 transition-all duration-150 ease-in-out cursor-pointer">
            $ sudo tuxiom --optimize-it
        </div>
    </header>

    <section class="py-20 px-6 max-w-6xl mx-auto grid grid-cols-1 md:grid-cols-3 gap-12 items-start"> 
        <div class="flex flex-col h-full"> <div class="text-blue-500 text-3xl mb-4">🛡️</div>

            <h3 class="text-xl font-bold text-white mb-4">What is my IP?</h3> 
            <div class="bg-black/40 border border-gray-800 rounded-lg p-4 font-mono text-sm shadow-inner flex-grow"> 
            <div class="flex gap-2"> 
                <span class="text-green-500">tuxiom@local:~$</span> 
                <button onclick="getIP()" class="text-white hover:text-blue-400 underline decoration-dotted transition-colors"> show IP </button> 
            </div>
            <div id="ip-result" class="mt-2 text-blue-400 font-bold tracking-wider"></div> 
            <div class="w-2 h-4 bg-white/50 animate-pulse mt-1"></div> </div> 
            <p class="text-gray-500 text-xs mt-3 italic">Click the command to query interface.</p> 
        </div> 

        
        <a href="/support/lin-sup.html" class="block group"> 
        <div class="text-blue-500 text-3xl mb-4 transition-transform duration-150 group-hover:scale-110">⚡</div> 
        <h3 class="text-xl font-bold text-white mb-4 group-hover:text-blue-400 transition-colors duration-150"> Linux Support </h3> 
            <p class="text-gray-500">Certified staff providing systems management.</p> 
            </a> 
            <div class="block"> <div class="text-blue-500 text-3xl mb-4">📦</div>
            <h3 class="text-xl font-bold text-white mb-4">Cool Apps</h3> 
                <p class="text-gray-500">From CentOS to modern Debian deployments, we support many distros.</p> 
        </div> 
    </section>
    <footer class="py-10 text-center text-gray-600 text-sm border-t border-gray-900">
        &copy; 2026 Tuxiom, LLC. | Built with Node.js & Passion for Linux.
    </footer>
    <script>
                function getIP() {
                    const display = document.getElementById('ip-result');
                    display.innerText = "running curl...";
                    
                    fetch('/api/ip')
                        .then(response => {
                            if (!response.ok) throw new Error('Network response was not ok');
                            return response.text();
                        })
                        .then(ip => { 
                            display.innerText = ip; 
                        })
                        .catch(error => { 
                            console.error('Fetch Error:', error);
                            display.innerText = "Error: Check browser console (F12)"; 
                        });
                }
    </script>
</body>
</html>
    