Simple Newsletter Form

<div
        class="max-w-3xl w-full mx-auto bg-indigo-950 p-16 rounded-[4rem] text-center relative overflow-hidden shadow-2xl">
        <div class="absolute -top-10 -right-10 w-48 h-48 bg-white/5 rounded-full blur-3xl"></div>
        <div class="absolute -bottom-10 -left-10 w-64 h-64 bg-indigo-500/10 rounded-full blur-3xl"></div>
        <div class="relative z-10">
            <h3 class="text-4xl md:text-5xl font-black text-white mb-6 italic uppercase tracking-tighter leading-none">
                Stay <br> <span class="underline decoration-white/20 decoration-8 underline-offset-8">dangerous.</span>
            </h3>
            <p class="text-indigo-200/70 mb-12 text-lg font-medium max-w-md mx-auto">Weekly engineering insights
                directly to your inbox.</p>
            <div class="flex flex-col sm:flex-row gap-4 max-w-xl mx-auto">
                <input type="email" placeholder="you@example.com"
                    class="flex-1 px-8 py-5 rounded-[2rem] bg-indigo-900/50 text-white placeholder-indigo-400/50 outline-none border border-white/10 focus:ring-4 focus:ring-white/10 transition-all font-bold">
                <button
                    class="bg-white text-indigo-950 font-black px-10 py-5 rounded-[2rem] hover:bg-indigo-50 transition-all active:scale-95 shadow-xl shadow-indigo-950/20 uppercase tracking-widest text-xs">Join
                    Elite</button>
            </div>
        </div>
    </div>