feat(site): redesign with product pages, ecosystem sections and pixel reveal

Add cli/code/office/platform/pricing pages, new home sections
(Ecosystem, FeatureGrid, Faq, WorkflowSteps, BottomCta, ProductEcosystem),
ScrollReveal and PixelTextReveal animation components, brand assets,
and expanded site-content.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

components/home/HeroSection.tsx

@@ -1,6 +1,5 @@
-import Image from "next/image"
 import Link from "next/link"
-import LottiePlayer from "@/components/LottiePlayer"
+import PixelTextReveal from "@/components/PixelTextReveal"
 
 export default function HeroSection() {
   return (
@@ -67,7 +66,7 @@ export default function HeroSection() {
               <div className="hero-v1-bg-gradient" />
             </div>
           </div>
-          <LottiePlayer src="/assets/cdn-prod-website-files-com/68a342b7066c56fa60eb3af1/68d1a7d9c54a9b73191bb531_hero-v1-animation-quantum-webflow-template.json" className="hero-v1-lottie" loop autoplay />
+          <PixelTextReveal lines={["DAL", "Ecosystem"]} className="hero-v1-lottie" />
         </div>
         <div id="about-us" data-w-id="bce231a0-6e79-c8d3-8883-56d99499b3ad" style={{ opacity: "0", filter: "blur(8px)" }} className="about-section-wrapper">
           <div className="about-section-top-content">
@@ -82,13 +81,22 @@ export default function HeroSection() {
           </div>
           <div className="about-section-bottom-content">
             <Link href="/about" className="lightbox-link w-inline-block">
-              <Image
-                src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a612636043d8e5dcb04ad0_about-us-video-thumbnail-quantum-webflow-template.jpg"
-                width={660}
-                height={372}
-                alt="DAL Code product overview"
+              <div
                 className="lightbox-thumbnail"
-              />
+                style={{
+                  width: 660,
+                  height: 372,
+                  background: "linear-gradient(135deg, var(--core--colors--neutral--200) 0%, var(--core--colors--neutral--300) 100%)",
+                  display: "flex",
+                  alignItems: "center",
+                  justifyContent: "center",
+                  fontSize: "0.875rem",
+                  color: "var(--core--colors--neutral--500)",
+                  letterSpacing: "0.05em",
+                }}
+              >
+                PRODUCT DEMO
+              </div>
             </Link>
             <div className="position-relative---z-index-1">
               <div className="hidden-on-mobile-portrait">