A reusable React SVG component for the official Elestio logo that prevents ID collisions when rendered multiple times on the same page.
## Key Components
- **ElestioLogo**: React functional component that renders the Elestio logo SVG
- **Unique ID generation**: Uses `React.useId()` to create collision-free gradient and mask IDs
- **Flexible styling**: Accepts `className` and all standard SVG props for customization
## Usage Example
```typescript
import { ElestioLogo } from './elestio-logo';
// Basic usage
// With custom styling
// Multiple instances (IDs won't conflict)
```
The component features a complex multi-colored gradient design with five distinct linear gradients (orange, red, purple, yellow, and blue) applied to different sections of the logo. The unique ID system ensures that multiple logo instances can coexist without SVG definition conflicts.