Create a fullscreen hero landing page for a creative studio called "Foldcraft" using React, Tailwind CSS, and Lucide React icons. The page is a single viewport-height section with a looping background video, a responsive navbar, a mobile menu, and staggered-animated hero text. **Video Background:** - URL: `https://d8j0ntlcm91z4.cloudfront.net/user_38xzZboKViGWJOttwIXH07lWA1P/hf_20260622_204221_5339e40b-e73d-4ab0-9c65-79c18c66fd50.mp4` - Attributes: autoPlay, muted, loop, playsInline - Styling: absolute positioned, full width/height, object-cover, object-position at 70% horizontal center - The video sits behind all content (no z-index or z-0) **Font:** - Google Fonts: Geist (weights 300-700), loaded via `` in index.html - Tailwind config extends fontFamily with `geist: ['Geist', 'sans-serif']` - Applied as `font-geist` on the root container - Body CSS: `-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale` **Root Container:** - `relative h-screen w-full overflow-hidden bg-black font-geist` **Navbar (z-30):** - Flex, space-between, padding: `px-6 py-5 md:px-12 lg:px-16` - Left side: Logo text "Foldcraft" (`text-lg font-semibold tracking-tight text-white sm:text-xl`) followed by desktop nav links (hidden on mobile, flex on md+) - Nav links: Home, Projects, Studio, Reach Us (`text-sm text-white/80 hover:text-white transition-colors`) - Right side (desktop): "Let's Talk" button (`rounded-lg bg-white px-5 py-2 text-sm font-medium text-black hover:scale-105 transi
……（完整源码请在站内查看）
.webp)