<!-- source-hash: 42afed7b963d9c8db89ec0c7a70f20ee -->
Loading skeleton component that replicates the exact layout and dimensions of an `OrganizationCard`, preventing layout shifts during data fetching.

## Key Components

### `OrganizationCardSkeleton`
Single card skeleton with three configurable sections:
- **Header** — 60×60px org logo placeholder + title + subtitle text skeletons
- **Description** — Fixed 48px height, two-line body text skeletons (toggled via `showDescription`)
- **Footer** — Two icon+stat pairs and a tag/badge placeholder (toggled via `showFooter`)

### `OrganizationCardSkeletonGrid`
Renders a responsive grid of `OrganizationCardSkeleton` instances. Defaults to 12 cards across a 1→2→3 column responsive layout.

### `OrganizationCardSkeletonProps`

| Prop | Type | Default | Description |
|---|---|---|---|
| `className` | `string` | — | Additional CSS classes on the card |
| `containerClassName` | `string` | — | Overrides background/border of the card container |
| `showFooter` | `boolean` | `true` | Renders the stats/badge footer row |
| `showDescription` | `boolean` | `true` | Renders the description area |

## Usage Example

```typescript
// Single skeleton card
import { OrganizationCardSkeleton } from "./organization-card-skeleton"

<OrganizationCardSkeleton showFooter={true} showDescription={true} />

// Grid skeleton while fetching a list
import { OrganizationCardSkeletonGrid } from "./organization-card-skeleton"

<OrganizationCardSkeletonGrid
  count={9}
  showFooter={true}
  showDescription={false}
  className="my-6"
/>
```

> Both components set `role="status"` and `aria-label` for screen reader accessibility during loading states.