"use client";

import dynamic from "next/dynamic";

/**
 * Client-only loader for the 3D How It Works experience.
 *
 * `ssr: false` is required: the experience uses React Three Fiber, a Zustand
 * store, Lenis, and `window`/`AudioContext` — all client-only. The 100vh
 * placeholder reserves space so the page doesn't jump while the (large) GLB
 * scene and WebGL bundle load.
 */
const Experience3D = dynamic(() => import("./Experience3D"), {
  ssr: false,
  loading: () => <div style={{ minHeight: "100vh" }} aria-hidden />,
});

export default function Experience3DLoader() {
  return <Experience3D />;
}
