"use client"; import React, { useRef, useState } from "react"; import { motion, useScroll, useTransform, useSpring, useMotionValue, useVelocity, useAnimationFrame } from "framer-motion"; import { ArrowDownLeft, ArrowUpRight } from "lucide-react"; // ============================================================================ // 1. THE "EVENT HORIZON" (Black Hole Distortion) // Audacity: As you reach the bottom, the entire page bends into a singularity. // Tech: 3D Transform + Scale + Scroll trigger. // ============================================================================ export const EventHorizonFooter = () => { const containerRef = useRef(null); const { scrollYProgress } = useScroll({ target: containerRef, offset: ["start end", "end end"] }); // The scale effect for the "Black Hole" feel const scale = useTransform(scrollYProgress, [0, 1], [0.5, 1]); const rotate = useTransform(scrollYProgress, [0, 1], [15, 0]); const y = useTransform(scrollYProgress, [0, 1], [500, 0]); const opacity = useTransform(scrollYProgress, [0, 0.5, 1], [0, 1, 1]); return (

{/* The "Singularity" Glow */}

BEYOND
LIMITS

{["Manifesto", "Careers", "Legal", "Sitemap"].map((item, i) => (

0{i + 1} {item}

))}

); };

BEYONDLIMITS

BEYOND
LIMITS

Property	Type	Default	Description
links	string[]	["Mission", "Tech", "Crew", "Contact"]	Array of footer link labels.
backgroundColor	string	#000000	Background color of the footer (hex, rgb, or hsl).
textColor	string	#ffffff	Text color for links (hex, rgb, or hsl).

Event Horizon Footer

Props