# Bento Grid Section

A modern bento-style grid layout for showcasing features or content. Supports custom headers, icons, and descriptions with hover animations. Responsive design with 3-column layout on desktop.

## Files

| Target | Type |
|--------|------|
| `$modules$/bento-grid-section/index.ts` | index |
| `$modules$/bento-grid-section/bento-grid-section.tsx` | component |
| `$modules$/bento-grid-section/lang/en.json` | lang |
| `$modules$/bento-grid-section/lang/tr.json` | lang |
| `$modules$/bento-grid-section/lang/pt.json` | lang |

## Exports

**Components/Functions:** `BentoGrid`, `BentoGridItem`, `BentoGridSection`

```typescript
import { BentoGrid, BentoGridItem, BentoGridSection } from '@/modules/bento-grid-section';
```

## Usage

```
import { BentoGridSection } from '@/modules/bento-grid-section';

<BentoGridSection
  title="Features"
  items={[
    {
      title: "Fast Performance",
      description: "Lightning fast load times",
      header: <div className="h-full w-full bg-gradient-to-br from-violet-500 to-purple-500" />,
      icon: <IconBolt className="h-4 w-4" />,
      className: "md:col-span-2"
    },
    // more items...
  ]}
/>
```
