Rune

# Rune

Create a responsive React + TypeScript + Vite + Tailwind CSS website. Use small components for navigation, hero, interactive stage, content sections and footer. Put media URLs in src/lib/assets.ts and animations in cleaned-up hooks. Do not output a giant HTML file, an iframe, or a screenshot pretending to be the website.

## Design direction
A dark portfolio for a 3D creator. The hero is one screen: a top nav, a huge gradient-filled "HEY, I'M RUNE" spanning the full width, a portrait of the character standing in front of it that drifts toward the cursor (magnetic), a short uppercase tagline and a glossy gradient "Contact Me" pill. Next comes a band of two rows of animated hero-preview GIFs sliding in opposite directions with scroll; then an "About me" section whose paragraph lights up character by character as it scrolls through, framed by four floating 3D icons; a white "Services" sheet with big numbered rows; and a "Project" section where three bordered cards stick and stack on top of each other, each shrinking slightly as the next arrives. Lenis smooths the scroll.

Palette and type: #18011F, #B600A8, #7621B0, #BE4C00, #7721B1, #D7E2EA, #0C0C0C, #FFFFFF, #e5e7eb, #9ca3af, #0c0c0c, #d7e2ea.
Font families: ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji / ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace / inherit / Kanit,sans-serif.
Font stylesheet: https://fonts.googleapis.com/css2?family=Kanit:wght@300;400;500;600;700;800;900&display=swap

## Layout and copy