Improve project structure.

New Project Structure:
  - Created reusable UI components (ServiceCard, AnimatedSection, SectionTitle)
  - Split large components into smaller, focused ones
  - Extracted shared hooks for common functionality
  - Organized constants into separate files

Key Improvements:
  - Hooks: useScrollNavigation, useScrollToSection, useCookieSettings
  - UI Components: Modular components for consistent styling and behavior
  - Constants: Centralized data management (ServicesData, NavigationData)
  - Component Split: Navbar, Hero, and Footer broken into logical sub-components

frontend/app/(root)/Home.tsx

@@ -1,28 +1,18 @@
 'use client';
 
-import React, {useEffect} from "react";
-import HomeServices from "@/app/(root)/sections/HomeServices";
-import {motion} from "framer-motion";
+import React from "react";
+import { motion } from "framer-motion";
+import { useScrollToSection } from "@/hooks/useScrollToSection";
 import Hero from "@/app/(root)/sections/Hero";
+import HomeServices from "@/app/(root)/sections/HomeServices";
 import About from "@/app/(root)/sections/About";
 import ProcessSection from "@/app/(root)/sections/ProcessSection";
 import WhyUs from "@/app/(root)/sections/WhyUs";
-import Faq from "@/app/(root)/sections/Faq";
 import ReferralSection from "@/app/(root)/sections/ReferralSection";
+import Faq from "@/app/(root)/sections/Faq";
 
 const Home = () => {
-    useEffect(() => {
-        const scrollToId = localStorage.getItem('scrollToId')
-        if (scrollToId) {
-            localStorage.removeItem('scrollToId')
-            const el = document.getElementById(scrollToId)
-            if (el) {
-                setTimeout(() => {
-                    el.scrollIntoView({behavior: 'smooth', block: 'start'})
-                }, 200)
-            }
-        }
-    }, [])
+    useScrollToSection();
 
     return (
         <motion.div