CategoryStrip

// In apps/web/app/page.tsx
<section className="flex flex-col sm:flex-row gap-3 sm:gap-8 px-3 sm:px-8 pt-3 pb-3 sm:pb-8">
  {categories.map((cat) => (
    <a
      key={cat.label}
      href={cat.href}
      className="flex-1 relative h-[160px] sm:h-[240px] overflow-hidden group"
      style={{ borderRadius: 'var(--radius-2xl)' }}
    >
      <Image src={cat.img} fill priority sizes="(max-width: 640px) 100vw, 33vw" className="object-cover" />
      <div className="absolute inset-0 bg-black/40 group-hover:bg-black/50 transition-colors" />
      <div className="absolute inset-0 flex items-end p-6">
        <span className="font-display text-[16px] sm:text-[20px] font-[600] text-white">{cat.label}</span>
      </div>
    </a>
  ))}
</section>