fix: add SSR safety and fix memory leak (qa-requested)

- Add 'use client' directive to GlobalBackground component
- Fix SSR-unsafe document access in usePageVisibility hook
- Fix memory leak in useIntersectionObserver cleanup function

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

src/components/layout/GlobalBackground.tsx

@@ -1,3 +1,5 @@
+'use client';
+
 import { usePageVisibility } from '@/hooks/usePageVisibility';
 import { useIntersectionObserver } from '@/hooks/useIntersectionObserver';
 

src/hooks/useIntersectionObserver.ts

@@ -30,14 +30,16 @@ export const useIntersectionObserver = <T extends HTMLElement = HTMLDivElement>(
       }
     );
 
-    if (ref.current) {
+    const element = ref.current;
-      observer.observe(ref.current);
+    if (element) {
+      observer.observe(element);
     }
 
     return () => {
-      if (ref.current) {
+      if (element) {
-        observer.unobserve(ref.current);
+        observer.unobserve(element);
       }
+      observer.disconnect();
     };
   }, [threshold, root, rootMargin]);
 

src/hooks/usePageVisibility.ts

@@ -5,7 +5,9 @@ import { useState, useEffect } from 'react';
  * @returns boolean - true when page is visible, false when hidden
  */
 export const usePageVisibility = (): boolean => {
-  const [isVisible, setIsVisible] = useState<boolean>(!document.hidden);
+  const [isVisible, setIsVisible] = useState<boolean>(() =>
+    typeof document !== 'undefined' ? !document.hidden : true
+  );
 
   useEffect(() => {
     const handleVisibilityChange = () => {