Square Image Card with Icon & Badge Overlay

<article class="relative overflow-hidden w-[200px] h-[200px] bg-gradient-to-br from-zinc-800 to-zinc-900 border-zinc-800 border rounded-2xl">
        <div class="absolute inset-0 bg-[url(https://hoirqrkdgbmvpwutwuwj-all.supabase.co/storage/v1/object/public/assets/assets/6d09277c-88d3-4681-8a06-18307469ce9f_800w.jpg)] bg-cover"></div>
        <div class="absolute top-3 left-3">
            <span class="inline-flex h-7 w-7 items-center justify-center rounded-full bg-zinc-100/90 text-zinc-900 border border-zinc-700">
                <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="brain" class="lucide lucide-brain h-3.5 w-3.5"><path d="M12 18V5"></path><path d="M15 13a4.17 4.17 0 0 1-3-4 4.17 4.17 0 0 1-3 4"></path><path d="M17.598 6.5A3 3 0 1 0 12 5a3 3 0 1 0-5.598 1.5"></path><path d="M17.997 5.125a4 4 0 0 1 2.526 5.77"></path><path d="M18 18a4 4 0 0 0 2-7.464"></path><path d="M19.967 17.483A4 4 0 1 1 12 18a4 4 0 1 1-7.967-.517"></path><path d="M6 18a4 4 0 0 1-2-7.464"></path><path d="M6.003 5.125a4 4 0 0 0-2.526 5.77"></path></svg>
            </span>
        </div>
        <div class="absolute top-3 right-3">
            <span class="px-2 py-1 rounded-md bg-zinc-900/60 backdrop-blur text-[11px] text-zinc-300 font-normal border border-zinc-800 font-geist" style="">ML Engine</span>
        </div>
        <div class="absolute bottom-3 left-3 right-3">
            <p class="text-white text-lg font-medium tracking-tight leading-tight font-geist" style="">Neural.Core</p>
        </div>
    </article>