Split Color Text

Create a React + TypeScript component `SplitText` that renders a huge word cut horizontally in half: the top half stays white, the bottom half is a violet gradient — with the two halves sliding apart then snapping together on entrance.

Implementation:
- Wrapper `relative inline-block select-none`, font `font-black uppercase text-7xl md:text-9xl tracking-tighter leading-none`.
- Render the SAME text twice, stacked absolutely:
  - Top layer: `text-white`, clipped with `clipPath: 'inset(0 0 50% 0)'`.
  - Bottom layer: `bg-clip-text text-transparent bg-gradient-to-r from-violet-500 to-fuchsia-500`, clipped with `clipPath: 'inset(50% 0 0 0)'`.
- A third invisible copy (`opacity-0`) provides natural layout size so the absolute layers align pixel-perfect.