Build me a stunning, production-grade website for Sarvam AI — an Indian AI company whose mission is to build AI for a billion people, with deep roots in India's linguistic and cultural diversity. The name "Sarvam" (सर्वम्) means "everything" in Sanskrit.
Aesthetic Direction: Go for a refined Indian modernism — inspired by Mughal jali lattice geometry, the warmth of saffron and marigold, and the precision of frontier AI engineering. Think: ancient India meets GPU clusters. Confident, warm, architecturally elegant, and technically serious. Not kitsch — think the Taj Mahal meets a data center.
Color Palette:
Background: #0A0A0F (near-black with blue undertone)
Primary accent: #FF6B35 (warm saffron-orange)
Secondary accent: #00C9A7 (teal-green for tech credibility)
Body text: #C8B8A2 (warm aged parchment — not sterile white)
Highlight white: #FAFAF7 (slightly warm)
Typography:
Display/Hero: Playfair Display (classical, Indic-adjacent serif)
Subheadings: Syne (geometric, modern)
Body: Literata (refined long-form reading)
Code: Fira Code
Visual Effects & Textures:
Subtle grain overlay across the entire page
Soft saffron radial glow behind hero elements
SVG-based jali lattice patterns as decorative dividers and background watermarks
Scroll-triggered text reveals using IntersectionObserver with vertical clip-mask wipes
Sticky nav that starts transparent and gains a backdrop-filter: blur(20px) dark blur on scroll
Magnetic hover effect on CTA buttons with a pulsing saffron ring animation
Page Sections to Build:
Navbar — Logo shows both Devanagari "सर्वम्" and Roman "Sarvam AI" side by side as SVG. Links: Products, Research, API, About, Blog. Right-side CTA: "Get API Access" with glowing saffron pulse.
Hero — Full viewport height. Massive Playfair Display headline: "AI for a Billion People." Subline in Syne: "Built for India's languages, cultures, and contexts — from the ground up." Below it, two CTAs: "Explore the API" (filled saffron) and "Read our Research" (ghost/outlined). Background: animated particle field subtly shaped like the Indian subcontinent, with glowing nodes at major Indian cities. Faint jali pattern overlaid at 5% opacity.
Language Strip — A horizontally scrolling ticker (auto-animated, no pause) showing Sarvam's supported Indian languages in their native scripts: हिन्दी · தமிழ் · తెలుగు · ಕನ್ನಡ · മലയാളം · বাংলা · ગુજરાતી · ਪੰਜਾਬੀ · ଓଡ଼ିଆ · মৈতৈলোন্ · and more. Each script in its own warm-toned color. This strip signals scope instantly.
Products Section — Three cards in an asymmetric grid (one wide, two stacked). Products: Sarvam-1 (flagship LLM), Shuka (voice AI), Translate API (real-time Indian language translation). Each card has a glowing accent border, a subtle animated background, a one-line description, and a "Learn more →" link. Cards lift and glow on hover.
Research Section — Dark editorial layout. Left side: a large pull quote in Playfair Display italic — "We don't adapt Western models to India. We build from Bharat." Right side: three recent research paper cards with title, abstract snippet, and a tag (e.g., "NLP", "Speech", "Indic LLMs"). A "View all research →" link at the bottom.
API / Developer Section — Deep dark panel with a live code snippet shown in Fira Code with syntax highlighting. The snippet shows a simple API call to Sarvam's translation endpoint with a JSON response in Hindi. Below the code: three stat cards — "11+ Languages", "< 200ms latency", "99.9% uptime". A CTA: "Start building free →"
About / Mission Section — Full-width cinematic panel. Background: a slow parallax image of India from above (satellite-style, muted and dark). Overlaid large text: "Sarvam was founded with one belief — that the next billion internet users deserve AI that truly understands them." Founder names beneath in small Syne caps.
Footer — Three columns: Links (Products, Research, Careers, Blog), Socials (GitHub, Twitter/X, LinkedIn), and a newsletter signup. Bottom bar: copyright, privacy policy, terms. The Devanagari logo watermarked faintly in the background at 3% opacity.
Technical Requirements:
[SPOILER="Prompt"]
Single HTML file with embedded CSS and JS
Google Fonts for typography
Smooth scroll behavior throughout
All animations CSS-first, JS only where necessary
Fully responsive down to 375px mobile
Accessible — proper semantic HTML, ARIA labels, sufficient color contrast on interactive elements
Make it feel like it was designed by a world-class studio hired specifically to capture the soul of Indian AI. Every detail should feel intentional and unmistakably Sarvam.