"use client";

import * as React from "react";
import { motion, useReducedMotion } from "framer-motion";
import { cn } from "@/lib/utils";

function useReducedMotionSafe() {
  const prefersReduced = useReducedMotion();
  const [mounted, setMounted] = React.useState(false);
  React.useEffect(() => setMounted(true), []);
  return mounted ? !!prefersReduced : false;
}

/**
 * Split hero: copy on the left, a three.js point-cloud globe with a wireframe
 * shell and a few orbiting data arcs on the right. three.js is imported lazily
 * so it never blocks first paint, and the WebGL context is fully released on
 * unmount.
 */

export interface HeroParticleGlobeProps {
  eyebrow?: string;