Hero Heading with Domain Input Call-to-Action

<div class="z-10 text-center max-w-4xl mr-auto ml-auto pr-6 pl-6 relative">
            
            <!-- Badge -->
            <div class="reveal delay-100 inline-flex items-center gap-2 px-3 py-1 rounded-full border border-red-500/20 bg-red-500/5 text-xs font-medium text-red-200 mb-8 cursor-default active">
                <span class="relative flex h-1.5 w-1.5">
                  <span class="animate-ping absolute inline-flex h-full w-full rounded-full bg-red-400 opacity-75"></span>
                  <span class="relative inline-flex rounded-full h-1.5 w-1.5 bg-red-500"></span>
                </span>
                Go Direct
            </div>
            
            <!-- Title -->
            <h1 class="reveal delay-200 text-5xl md:text-7xl font-semibold tracking-tighter text-transparent bg-clip-text bg-gradient-to-b from-white via-white to-white/50 mb-8 leading-[1] active">
                Managable Engineering for Founders Who Refuse to Be Silenced
            </h1>
            
            <!-- Subtitle -->
            <p class="reveal delay-300 text-lg md:text-xl text-slate-400 max-w-2xl mx-auto mb-12 font-light leading-relaxed tracking-wide active">
                Traditional PR is dead. Your narrative is your product. We engineer the frameworks that make your story inevitable.
            </p>
            
            <!-- Interactive Domain Input -->
            <div class="reveal delay-300 max-w-md mx-auto relative group active">
                <div class="flex items-center p-1 bg-white/[0.03] border border-white/10 rounded-lg focus-within:border-red-500/50 focus-within:ring-1 focus-within:ring-red-500/20 transition-all shadow-inner">
                    <div class="pl-4 pr-2 text-slate-500">
                        <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" width="16" height="16" viewBox="0 0 24 24" data-icon="lucide:globe" data-width="16" data-height="16" class="iconify iconify--lucide"><g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class=""><circle cx="12" cy="12" r="10" class=""></circle><path d="M12 2a14.5 14.5 0 0 0 0 20a14.5 14.5 0 0 0 0-20M2 12h20" class=""></path></g></svg>
                    </div>
                    <input type="text" id="domainInput" placeholder="yourstartup.com" class="flex-1 bg-transparent border-none text-white placeholder-slate-600 text-sm focus:outline-none h-10 w-full min-w-0">
                    <button onclick="openModal()" class="whitespace-nowrap px-4 py-2 bg-white text-black text-xs font-semibold rounded hover:bg-slate-200 transition-all shadow-[0_0_20px_rgba(255,255,255,0.1)] flex items-center gap-2">
                        Forge Your Signal
                        <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" width="12" height="12" viewBox="0 0 24 24" data-icon="lucide:arrow-right" data-width="12" data-height="12" class="iconify group-hover:translate-x-0.5 transition-transform iconify--lucide"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 12h14m-7-7l7 7l-7 7" class=""></path></svg>
                    </button>
                </div>
                <p id="errorMsg" class="absolute -bottom-6 left-0 w-full text-center text-[10px] text-red-400 opacity-0 transition-opacity">Please enter a valid domain to proceed.</p>
            </div>
        </div>