Digital Reality

Build a high-performance, agency-grade Social Media section called "Digital Reality" in React 19, TypeScript, and Tailwind CSS with Framer Motion.

## 1. Overview & Visual Objective
Build a React functional component using Tailwind CSS that replicates a cinematic, glassmorphic social media post or digital portfolio hero section.
Structure & Layout:
The main wrapper should take up the full screen (min-h-screen) with a solid black background (bg-[#000000]), centering its contents using flexbox.
Inside, create a fixed aspect ratio card that is exactly 600px wide and 800px high using inline styles. It should have a black background, shadow-2xl, be relative, and have overflow-hidden.
Background Media:
Place a full-cover background <video> element filling the card (absolute inset-0 z-0 h-full w-full object-cover opacity-100).
The video source must strictly use this exact URL: https://d8j0ntlcm91z4.cloudfront.net/user_38xzZboKViGWJOttwIXH07lWA1P/hf_20260429_212252_7d25a6d2-cf7f-465c-9bd1-a1496112806e.mp4
Make sure the video is configured exactly with autoPlay, loop, muted, and playsInline. Do not put any dark opacity gradient overlays on top of the video directly.
SVG Film Noise Overlay: