From 9a208ef1bf575bf6d187aecd283b1d6bcd67922a Mon Sep 17 00:00:00 2001
From: Amp <amp@ampcode.com>
Date: Mon, 14 Sep 2026 20:58:59 +0000
Subject: [PATCH] Add subtle gradients to product cards

Co-authored-by: Nicholas Kissel <nicholas@rivet.gg>
---
 src/components/marketing/sections/StackSection.tsx | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/src/components/marketing/sections/StackSection.tsx b/src/components/marketing/sections/StackSection.tsx
index f576314..6647321 100644
--- a/src/components/marketing/sections/StackSection.tsx
+++ b/src/components/marketing/sections/StackSection.tsx
@@ -80,6 +80,10 @@ export const StackSection = () => (
               {hasProductMotif(product.id) ? (
                 <ProductMotif productId={product.id} surface="card" />
               ) : null}
+              <span
+                aria-hidden="true"
+                className="pointer-events-none absolute inset-0 bg-gradient-to-br from-white/[0.09] via-transparent to-black/[0.12]"
+              />
               <span className="relative self-start rounded-full border border-cream/20 bg-cream/10 px-3 py-1 text-sm font-medium text-cream/90 backdrop-blur-md backdrop-saturate-[1.3] transition-colors duration-300 [transition-timing-function:cubic-bezier(0.65,0,0.35,1)] motion-reduce:transition-none group-hover:border-cream/35 group-hover:bg-cream/25 group-hover:text-cream">
                 {product.verb}
               </span>