Glassmorphic Feature Card with Image & CTA

<article class="group relative overflow-hidden hover:from-white/12 hover:to-white/6 transition-all duration-500 bg-gradient-to-b from-white/8 to-white/4 border-white/10 border rounded-2xl pt-6 pr-6 pb-6 pl-6 backdrop-blur-xl">
                <div class="relative h-48 lg:h-52 overflow-hidden rounded-xl ring-1 ring-white/10 mb-6">
                  <img src="https://hoirqrkdgbmvpwutwuwj.supabase.co/storage/v1/object/public/assets/assets/91128fd1-ca2a-44e1-b4e8-678711b5c5f4_800w.jpg" alt="Real-time Collaboration" class="h-full w-full object-cover transition-transform duration-700 group-hover:scale-105">
                  <div class="absolute inset-0 bg-gradient-to-t from-black/60 via-black/20 to-transparent"></div>
                  <div class="absolute top-3 right-3">
                    <button class="inline-flex h-9 w-9 items-center justify-center rounded-lg bg-white/15 ring-1 ring-white/20 backdrop-blur-xl hover:bg-white/25 transition-colors">
                      <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="h-4 w-4 stroke-[1.5]"><path d="M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2" class=""></path><path d="M16 3.128a4 4 0 0 1 0 7.744" class=""></path><path d="M22 21v-2a4 4 0 0 0-3-3.87" class=""></path><circle cx="9" cy="7" r="4" class=""></circle></svg>
                    </button>
                  </div>
                </div>
                <div class="">
                  <h3 class="text-xl font-display font-semibold tracking-tight mb-3" style="">Team Collaboration</h3>
                  <p class="text-white/70 leading-relaxed mb-6" style="">Work together seamlessly with real-time collaboration tools, version control, and instant feedback loops for creative teams.</p>
                  <button class="inline-flex items-center gap-2 rounded-xl border border-white/15 bg-white/5 px-5 py-3 text-sm font-medium text-white/90 hover:bg-white/10 hover:border-white/20 transition-all duration-200" style="">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="h-4 w-4 stroke-[1.5]"><path d="M18 21a8 8 0 0 0-16 0" class=""></path><circle cx="10" cy="8" r="5" class=""></circle><path d="M22 20c0-3.37-2-6.5-4-8a5 5 0 0 0-.45-8.3" class=""></path></svg>
                    Join Workspace
                  </button>
                </div>
              </article>