import { ArrowUpRight, Blocks, Gauge, Layers, Palette, Terminal, Zap, } from "lucide-react" /** * Edit CONTENT / FEATURES for your product. Bento grid — one wide card, * one tall card, and supporting cells. Soft-rect panels only. * After install this file lives in your repo. */ const CONTENT = { stamp: "Product", headlineBefore: "One kit,", headlineAccent: "every section", headlineAfter: ".", lede: "Replace these with your real product pillars. Keep one job per card.", } const FEATURES = [ { icon: Layers, title: "Sections that compose", detail: "Heroes, pricing, FAQs, and forms share tokens — so any page looks designed, not assembled.", span: "@min-[64rem]:col-span-2", }, { icon: Zap, title: "Fast by default", detail: "Server-first blocks with motion that respects reduced motion.", span: "", }, { icon: Palette, title: "Themed in minutes", detail: "Accent, surface, and radius axes — no theme soup.", span: "", }, { icon: Terminal, title: "Owned source", detail: "The CLI installs files into your repo. Edit copy, fork layout, keep git history.", span: "", }, { icon: Gauge, title: "Production hardening", detail: "Focus states, safe-area insets, and contrast checked before you ship.", span: "", }, { icon: Blocks, title: "Grows with you", detail: "Start with a hero and a form. Add dashboards, tools, and docs without rewriting.", span: "@min-[64rem]:col-span-2", }, ] export function FeatureBento() { return (

{CONTENT.stamp}

{CONTENT.headlineBefore}{" "} {CONTENT.headlineAccent} {CONTENT.headlineAfter}

{CONTENT.lede}

{feature.title}

{feature.detail}

) }

{CONTENT.headlineBefore}{" "} {CONTENT.headlineAccent} {CONTENT.headlineAfter}

{feature.title}