added promo banner for Lumical

www/src/components/PromoBanner.tsx

@@ -0,0 +1,51 @@
+import React, { useEffect, useRef } from 'react';
+import { Calendar, Sparkles } from 'lucide-react';
+
+export function PromoBanner() {
+  const bannerRef = useRef<HTMLDivElement>(null);
+
+  useEffect(() => {
+    // Update CSS custom property for header offset
+    const updateOffset = () => {
+      if (bannerRef.current) {
+        const height = bannerRef.current.offsetHeight;
+        document.documentElement.style.setProperty('--promo-banner-height', `${height}px`);
+      }
+    };
+
+    updateOffset();
+    window.addEventListener('resize', updateOffset);
+    return () => window.removeEventListener('resize', updateOffset);
+  }, []);
+
+  return (
+    <div
+      ref={bannerRef}
+      className="fixed top-0 left-0 right-0 z-[60] bg-gradient-to-r from-violet-600 via-purple-600 to-indigo-600 text-white"
+    >
+      <a
+        href="https://lumical.app"
+        target="_blank"
+        rel="noopener noreferrer"
+        className="block max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-2.5 hover:bg-white/5 transition-colors"
+      >
+        <div className="flex items-center justify-center gap-x-3 text-sm">
+          <span className="flex items-center gap-1.5">
+            <Sparkles className="w-4 h-4" />
+            <span className="font-medium">New from RayLabs:</span>
+          </span>
+          <span className="inline-flex items-center gap-1.5 font-semibold">
+            <Calendar className="w-4 h-4" />
+            Lumical
+          </span>
+          <span className="hidden sm:inline text-white/90">
+            — Scan meeting invites to your calendar with AI
+          </span>
+          <span className="ml-1 inline-flex items-center gap-1 rounded-full bg-white/20 px-3 py-0.5 text-xs font-medium">
+            Try it free
+          </span>
+        </div>
+      </a>
+    </div>
+  );
+}