Hero Banner with AI Tagline & Demo Button

<section class="relative overflow-hidden h-[600px] bg-zinc-900 bg-[url(https://hoirqrkdgbmvpwutwuwj-all.supabase.co/storage/v1/object/public/assets/assets/17b34540-9b9c-44ba-9ed6-3ed1bed31bf3_1600w.jpg)] bg-cover border-zinc-800 border rounded-3xl w-full max-w-7xl" style="">
            
            <div class="relative z-10 h-full flex items-center justify-center">
                <div class="absolute left-12 top-12 max-w-md flex flex-col gap-4">
                    <h3 class="leading-tight md:text-8xl text-7xl text-white mb-1 font-geist font-medium tracking-tighter" style="">FlowAI</h3>
                    <p class="md:text-5xl text-3xl font-normal text-zinc-300 tracking-tighter font-geist" style="">Intelligent workflows that adapt, learn, and optimize your business processes automatically.</p>
                </div>
                
                <button id="playDemo" class="group inline-flex gap-4 hover:bg-zinc-800 transition text-zinc-100 bg-zinc-800/80 border-zinc-700 border rounded-full pt-3 pr-5 pb-3 pl-5 backdrop-blur items-center">
                    <span class="flex h-10 w-10 items-center justify-center rounded-full bg-zinc-100 text-zinc-900">
                        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-lucide="play" class="lucide lucide-play h-5 w-5 translate-x-[1px]"><path d="M5 5a2 2 0 0 1 3.008-1.728l11.997 6.998a2 2 0 0 1 .003 3.458l-12 7A2 2 0 0 1 5 19z"></path></svg>
                    </span>
                    <div class="text-left">
                        <p class="sm:text-xl leading-tight text-lg font-medium tracking-tight font-geist" style="">Watch Demo</p>
                        <p class="text-xs text-zinc-400 font-geist" style="">AI in action</p>
                    </div>
                </button>
            </div>

            <div class="absolute right-5 top-5 flex items-center gap-2 text-xs text-zinc-400">
                <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-lucide="zap" class="lucide lucide-zap h-4 w-4"><path d="M4 14a1 1 0 0 1-.78-1.63l9.9-10.2a.5.5 0 0 1 .86.46l-1.92 6.02A1 1 0 0 0 13 10h7a1 1 0 0 1 .78 1.63l-9.9 10.2a.5.5 0 0 1-.86-.46l1.92-6.02A1 1 0 0 0 11 14z"></path></svg>
                <span class="font-normal font-geist" style="">Powered by advanced AI</span>
            </div>
        </section>