HERO SECTION CREATION PROMPT Create a modern hero section with a looping video background and the following specifications: Video Background: URL: https://d8j0ntlcm91z4.cloudfront.net/user_38xzZboKViGWJOttwIXH07lWA1P/hf_20260329_050842_be71947f-f16e-4a14-810c-06e83d23ddb5.mp4 Size: 115% width and height Position: Centered horizontally, anchored to top with object-top focal point Custom JavaScript fade system (NO CSS transitions): 250ms requestAnimationFrame-based fade-in on load/loop start 250ms fade-out when 0.55 seconds remain before video end fadingOutRef boolean prevents re-triggering fade-out from repeated timeUpdate events On ended: opacity set to 0, 100ms delay, reset to currentTime = 0, play, fade back in Each new fade cancels running animation frames to prevent competing animations Fades resume from current opacity (no snapping) Fonts Required: Schibsted Grotesk (weights: 400, 500, 600, 700) Inter (weights: 400, 500, 600, 700) Noto Sans (weights: 400, 500, 600, 700) Fustat (weights: 400, 500, 600, 700) Navigation Bar: Logo: "Logoipsum" (Schibsted Grotesk SemiBold, 24px, -1.44px tracking) Menu items (Schibsted Grotesk Medium, 16px, -0.2px tracking): Platform Features (with dropdown chevron icon) Projects Community Contact Right side buttons: "Sign Up" (transparent background, 82px width) "Log In" (black background, white text, 101px width) Padding: 120px horizontal, 16px vertical Hero Content (moved up 50px with -mt-[50px]): Badge Component: Dark badge with star icon
……（完整源码请在站内查看）
