VALORANT Mobile

A production-quality single-page marketing site simulating Riot Games' tactical shooter brand: magnetic cursor, agent portrait switcher, YouTube soundtrack player with visualizer, animated phone mockup, pre-registration form with ticket generation, and specs/FAQ accordions.

Gaming marketing sites need immersive, brand-consistent experiences that feel like the game itself — not generic landing pages.

The repository evidence points to these observable boundaries and technologies:

• Vanilla HTML/CSS/JS (single file)
• CSS custom properties for theming
• IntersectionObserver for scroll animations
• YouTube IFrame API for audio
• Custom audio visualizer (CSS bars)
• Magnetic cursor with trailing dot

• Magnetic cursor with inertia
• Agent tab switcher with portrait swap
• Ability detail panel on hover/click
• Soundtrack terminal with waveform viz
• Pre-registration form with dynamic ticket
• System specs tabs (iOS/Android)
• FAQ accordion with smooth expand
• Trailer modal with simulated player

• Coordinating many interactive modules without framework
• YouTube API reliability in preview
• Magnetic cursor performance on scroll
• CSS-only visualizer synchronization

• All interactive modules functional
• Responsive down to 375px
• No framework dependencies
• Brand-accurate visual language

Marketing sites for games succeed when every interaction reinforces the game's visual language — the site should feel like a menu screen.