feat: Add animated bento grid features to landing page

Co-authored-by: iza <[email protected]>

Author: tembo[bot]

apps/docs/app/(home)/page.tsx

@@ -1,6 +1,7 @@
 import { Footer } from '@/components/footer';
 import { Description } from '@/components/landing/description';
 import FAQ from '@/components/landing/faq';
+import { FeaturesBento } from '@/components/landing/features-bento';
 import { GridCards } from '@/components/landing/grid-cards';
 import Hero from '@/components/landing/hero';
 import Section from '@/components/landing/section';
@@ -75,6 +76,16 @@ export default function HomePage() {
 					</div>
 				</Section>
 
+				{/* Features Bento Grid Section */}
+				<Section
+					className="border-border border-b bg-background/30 py-16 lg:py-24"
+					id="features"
+				>
+					<div className="mx-auto w-full max-w-7xl px-4 sm:px-6 lg:px-8">
+						<FeaturesBento />
+					</div>
+				</Section>
+
 				{/* Grid Cards Section */}
 				<Section className="border-border border-b py-16 lg:py-24" id="cards">
 					<div className="mx-auto w-full max-w-7xl px-4 sm:px-6 lg:px-8">