// useBreakpoint.jsx — shared responsive hook
function useBreakpoint() {
  const [width, setWidth] = React.useState(window.innerWidth);
  React.useEffect(() => {
    const handle = () => setWidth(window.innerWidth);
    window.addEventListener("resize", handle);
    return () => window.removeEventListener("resize", handle);
  }, []);
  return {
    isMobile:  width < 640,
    isTablet:  width >= 640 && width < 1024,
    isDesktop: width >= 1024,
    width,
  };
}
Object.assign(window, { useBreakpoint });