/* eslint-disable */
// V3.2 — Animated CSS swirls (no SVG filter — pure motion via @keyframes)
const V3Swirl = ({ className, color = "#C8E150", rotate = 0, opacity = 0.55, variant = "swoop", scale = 1, duration = 24 }) => {
  const id = React.useId();
  const paths = {
    swoop:  "M 60,200 C 100,80 240,40 360,80 C 480,120 540,240 460,310 C 380,380 240,360 160,300 C 80,240 100,160 220,140 C 340,120 460,200 410,290",
    arc:    "M 40,260 Q 200,40 380,140 T 540,300",
    streak: "M 40,180 C 160,100 280,140 420,90 C 520,55 580,100 580,170",
    loop:   "M 80,200 C 80,80 240,40 360,100 C 480,160 500,280 380,320 C 260,360 140,300 200,220 C 260,140 420,160 480,240",
    blob:   "M 100,200 C 100,100 240,60 360,100 C 480,140 540,240 460,300 C 380,360 220,340 160,280 C 100,220 100,200 100,200 Z",
  };
  const d = paths[variant] || paths.swoop;
  return (
    <svg viewBox="0 0 600 400" className={"v3-swirl-anim " + (className || "")}
         style={{ transform: `rotate(${rotate}deg) scale(${scale})`, opacity, "--swirl-dur": duration + "s" }}
         aria-hidden="true" preserveAspectRatio="none">
      <defs>
        <linearGradient id={`l-${id}`} x1="0" y1="0" x2="1" y2="1">
          <stop offset="0%" stopColor={color} stopOpacity="0.95"/>
          <stop offset="100%" stopColor={color} stopOpacity="0.55"/>
        </linearGradient>
      </defs>
      <path className="v3-swirl-path" d={d} fill="none" stroke={`url(#l-${id})`}
            strokeWidth="42" strokeLinecap="round" strokeLinejoin="round" pathLength="1"/>
    </svg>
  );
};
window.V3Swirl = V3Swirl;
window.V3Brush = V3Swirl;

// ---------- SCROLL REVEAL HOOK (declared early — used by all later modules) ----------
const useReveal = (delay = 0) => {
  const ref = React.useRef(null);
  React.useEffect(() => {
    if (!ref.current) return;
    const el = ref.current;
    const io = new IntersectionObserver(([e]) => {
      if (e.isIntersecting) {
        setTimeout(() => el.classList.add("is-in"), delay);
        io.disconnect();
      }
    }, { threshold: 0.12, rootMargin: "0px 0px -60px 0px" });
    io.observe(el);
    return () => io.disconnect();
  }, [delay]);
  return ref;
};
const Reveal = ({ children, delay = 0, as: As = "div", className = "", ...rest }) => {
  const ref = useReveal(delay);
  return <As ref={ref} className={"v3-reveal " + className} {...rest}>{children}</As>;
};
window.useReveal = useReveal;
window.Reveal = Reveal;
