ui changes

src/App.tsx

@@ -8,7 +8,8 @@ import AIAssistant from '@/pages/AIAssistant/AIAssistant';
 import Campus from '@/pages/Campus/Campus';
 import Events from '@/pages/Events/Events';
 import Community from '@/pages/Community/Community';
-import Profile from '@/pages/Profile/Profile';
+import BusRoutes from '@/pages/BusRoutes/BusRoutes';
+import Faculty from '@/pages/Faculty/Faculty';
 
 const queryClient = new QueryClient({
   defaultOptions: {
@@ -40,9 +41,10 @@ function App() {
             <Route path="/notes" element={<Notes />} />
             <Route path="/ai-assistant" element={<AIAssistant />} />
             <Route path="/campus" element={<Campus />} />
+            <Route path="/bus-routes" element={<BusRoutes />} />
+            <Route path="/faculty" element={<Faculty />} />
             <Route path="/events" element={<Events />} />
             <Route path="/community" element={<Community />} />
-            <Route path="/profile" element={<Profile />} />
           </Route>
         </Routes>
       </BrowserRouter>

src/components/ChatPreview/ChatPreview.tsx

@@ -1,127 +0,0 @@
-import { motion } from 'framer-motion';
-import { Bot, Sparkles, ArrowRight } from 'lucide-react';
-import { Link } from 'react-router-dom';
-import { AI_SUGGESTED_PROMPTS } from '@/constants';
-
-const PREVIEW_MESSAGES = [
-  { role: 'user', text: 'What documents do I need for the first day?' },
-  { role: 'ai', text: 'For your first day at RIT, you\'ll need: Allotment order, 10th & 12th mark sheets, Transfer Certificate, Conduct Certificate, and 10 passport-size photos. Originals and 2 sets of photocopies are required. Would you like a complete checklist?' },
-  { role: 'user', text: 'Yes, and what about hostel admission?' },
-  { role: 'ai', text: 'For hostel admission, additionally bring your Aadhaar card, medical fitness certificate, and filled hostel application form. The hostel fee can be paid at the accounts office.' },
-];
-
-export default function ChatPreview() {
-  return (
-    <div className="bg-white rounded-3xl border border-[#E5E7EB] overflow-hidden" style={{ boxShadow: '0 8px 40px -8px rgba(0,0,0,0.12)' }}>
-      {/* Header */}
-      <div className="px-5 py-4 border-b border-[#E5E7EB] flex items-center gap-3">
-        <div
-          className="w-9 h-9 rounded-xl flex items-center justify-center"
-          style={{ background: 'linear-gradient(135deg, #F97316, #FB923C)' }}
-        >
-          <Bot className="w-5 h-5 text-white" />
-        </div>
-        <div>
-          <div className="text-sm font-semibold text-[#1E293B]" style={{ fontFamily: 'Poppins, sans-serif' }}>
-            RIT AI Assistant
-          </div>
-          <div className="flex items-center gap-1.5 text-xs text-[#94A3B8]">
-            <span className="w-1.5 h-1.5 rounded-full bg-emerald-400 inline-block" />
-            Powered by Gemini AI
-          </div>
-        </div>
-        <div className="ml-auto">
-          <span className="px-2.5 py-1 rounded-full text-xs font-medium bg-[#FFF7ED] text-[#F97316]" style={{ fontFamily: 'Poppins, sans-serif' }}>
-            Live
-          </span>
-        </div>
-      </div>
-
-      {/* Messages */}
-      <div className="p-5 flex flex-col gap-3 min-h-[260px]">
-        {PREVIEW_MESSAGES.map((msg, i) => (
-          <motion.div
-            key={i}
-            initial={{ opacity: 0, y: 10 }}
-            whileInView={{ opacity: 1, y: 0 }}
-            viewport={{ once: true }}
-            transition={{ duration: 0.4, delay: i * 0.15 }}
-            className={`flex ${msg.role === 'user' ? 'justify-end' : 'justify-start'}`}
-          >
-            {msg.role === 'ai' && (
-              <div className="w-7 h-7 rounded-full flex items-center justify-center mr-2 shrink-0 mt-0.5"
-                style={{ background: 'linear-gradient(135deg, #F97316, #FB923C)' }}>
-                <Bot className="w-3.5 h-3.5 text-white" />
-              </div>
-            )}
-            <div
-              className="text-xs leading-relaxed max-w-[78%] px-3.5 py-2.5"
-              style={{
-                background: msg.role === 'user' ? 'linear-gradient(135deg, #F97316, #FB923C)' : '#F8FAFC',
-                color: msg.role === 'user' ? 'white' : '#1E293B',
-                borderRadius: msg.role === 'user' ? '16px 16px 4px 16px' : '16px 16px 16px 4px',
-                border: msg.role === 'ai' ? '1px solid #E5E7EB' : 'none',
-                fontFamily: 'Inter, sans-serif',
-              }}
-            >
-              {msg.text}
-            </div>
-          </motion.div>
-        ))}
-
-        {/* Typing indicator */}
-        <motion.div
-          initial={{ opacity: 0 }}
-          animate={{ opacity: 1 }}
-          transition={{ delay: 0.8 }}
-          className="flex justify-start"
-        >
-          <div className="flex items-center gap-1 px-4 py-2.5 bg-[#F8FAFC] rounded-2xl border border-[#E5E7EB]">
-            {[0, 1, 2].map((i) => (
-              <motion.span
-                key={i}
-                className="w-1.5 h-1.5 bg-[#94A3B8] rounded-full"
-                animate={{ y: [0, -4, 0] }}
-                transition={{ duration: 0.8, repeat: Infinity, delay: i * 0.15 }}
-              />
-            ))}
-          </div>
-        </motion.div>
-      </div>
-
-      {/* Suggested Prompts */}
-      <div className="px-5 pb-2 flex flex-wrap gap-2">
-        {AI_SUGGESTED_PROMPTS.slice(0, 3).map((prompt, i) => (
-          <motion.span
-            key={i}
-            whileHover={{ scale: 1.03 }}
-            className="text-xs px-3 py-1.5 rounded-full border border-[#E5E7EB] text-[#475569] cursor-pointer hover:border-[#F97316] hover:text-[#F97316] transition-all"
-            style={{ fontFamily: 'Inter, sans-serif' }}
-          >
-            {prompt}
-          </motion.span>
-        ))}
-      </div>
-
-      {/* CTA */}
-      <div className="p-5 pt-3">
-        <Link to="/ai-assistant">
-          <motion.button
-            whileHover={{ scale: 1.02 }}
-            whileTap={{ scale: 0.98 }}
-            className="w-full flex items-center justify-center gap-2 py-3 rounded-xl text-sm font-semibold text-white transition-all"
-            style={{
-              fontFamily: 'Poppins, sans-serif',
-              background: 'linear-gradient(135deg, #F97316, #FB923C)',
-              boxShadow: '0 4px 15px rgba(249,115,22,0.35)',
-            }}
-          >
-            <Sparkles className="w-4 h-4" />
-            Ask Anything
-            <ArrowRight className="w-4 h-4" />
-          </motion.button>
-        </Link>
-      </div>
-    </div>
-  );
-}

src/components/Footer/Footer.tsx

@@ -4,8 +4,10 @@ import { GraduationCap, MapPin, Phone, Mail, Camera, Send, Globe, Play, ArrowRig
 const quickLinks = [
   { label: 'Home', path: '/' },
   { label: 'Notes & PYQs', path: '/notes' },
-  { label: 'AI Assistant', path: '/ai-assistant' },
+  { label: 'Chatbot', path: '/ai-assistant' },
   { label: 'Campus Map', path: '/campus' },
+  { label: 'Bus Routes', path: '/bus-routes' },
+  { label: 'Faculty Directory', path: '/faculty' },
   { label: 'Events', path: '/events' },
   { label: 'Community', path: '/community' },
 ];
@@ -38,7 +40,7 @@ export default function Footer() {
             className="flex items-center gap-2 bg-white text-[#F97316] px-6 py-3 rounded-xl font-semibold transition-all hover:shadow-lg hover:-translate-y-0.5"
             style={{ fontFamily: 'Poppins, sans-serif' }}
           >
-            Ask AI Assistant
+            Ask Chatbot
             <ArrowRight className="w-4 h-4" />
           </Link>
         </div>
@@ -62,7 +64,7 @@ export default function Footer() {
               </div>
             </div>
             <p className="text-slate-400 text-sm leading-relaxed mb-5" style={{ fontFamily: 'Inter, sans-serif' }}>
-              Your all-in-one guide to campus life at RIT. Notes, AI assistant, events, faculty, and more — made for freshers.
+              Your all-in-one guide to campus life at RIT. Notes, chatbot, events, faculty, and more — made for freshers.
             </p>
             <div className="flex items-center gap-3">
               {[Camera, Send, Globe, Play].map((Icon, i) => (

src/constants/index.ts

@@ -1,11 +1,13 @@
-import type { Feature, Stat, BusRoute, Faculty, Event, Club, Question, Confession, ToolkitItem, CampusLocation } from '@/types';
+import type { Feature, Stat, BusRoute, Faculty, Event, Club, Question, ToolkitItem, CampusLocation } from '@/types';
 
 // ─── Navigation ──────────────────────────────────────────────────────────────
 export const NAV_LINKS = [
   { label: 'Home', path: '/' },
   { label: 'Notes', path: '/notes' },
-  { label: 'AI Assistant', path: '/ai-assistant' },
-  { label: 'Campus', path: '/campus' },
+  { label: 'Chatbot', path: '/ai-assistant' },
+  { label: 'Campus Map', path: '/campus' },
+  { label: 'Bus Routes', path: '/bus-routes' },
+  { label: 'Faculty Directory', path: '/faculty' },
   { label: 'Clubs', path: '/events' },
   { label: 'Community', path: '/community' },
 ];
@@ -15,7 +17,7 @@ export const STATS: Stat[] = [
   { value: 20, suffix: '+', label: 'Sports', icon: 'Trophy' },
   { value: 100, suffix: '+', label: 'Faculty', icon: 'Users' },
   { value: 18, suffix: '', label: 'Clubs', icon: 'Star' },
-  { value: 24, suffix: '/7', label: 'AI Assistant', icon: 'Bot' },
+  { value: 24, suffix: '/7', label: 'Chatbot', icon: 'Bot' },
   { value: 5000, suffix: '+', label: 'Students', icon: 'GraduationCap' },
 ];
 
@@ -33,8 +35,8 @@ export const FEATURES: Feature[] = [
   {
     id: 'ai',
     icon: 'Bot',
-    title: 'AI Fresher Assistant',
-    description: 'Get instant answers about campus life, academics, rules, and everything RIT – powered by Gemini AI.',
+    title: 'RIT Chatbot',
+    description: 'Get instant answers about campus life, academics, rules, and everything RIT.',
     path: '/ai-assistant',
     color: '#8B5CF6',
     bgColor: '#F5F3FF',
@@ -44,7 +46,7 @@ export const FEATURES: Feature[] = [
     icon: 'Map',
     title: 'Campus Map',
     description: 'Explore RIT campus interactively – find departments, labs, library, canteen, and facilities.',
-    path: '/campus?tab=map',
+    path: '/campus',
     color: '#10B981',
     bgColor: '#ECFDF5',
   },
@@ -53,7 +55,7 @@ export const FEATURES: Feature[] = [
     icon: 'Bus',
     title: 'Bus Routes',
     description: 'View all campus bus routes, timings, and pickup locations at a glance.',
-    path: '/campus?tab=bus',
+    path: '/bus-routes',
     color: '#3B82F6',
     bgColor: '#EFF6FF',
   },
@@ -62,7 +64,7 @@ export const FEATURES: Feature[] = [
     icon: 'UserCheck',
     title: 'Faculty Directory',
     description: 'Find faculty contact details, department, designation, and office hours.',
-    path: '/campus?tab=faculty',
+    path: '/faculty',
     color: '#EC4899',
     bgColor: '#FDF2F8',
   },
@@ -93,15 +95,6 @@ export const FEATURES: Feature[] = [
     color: '#06B6D4',
     bgColor: '#ECFEFF',
   },
-  {
-    id: 'confession',
-    icon: 'Heart',
-    title: 'Anonymous Confession',
-    description: 'Share your thoughts, feelings, and confessions anonymously with the RIT community.',
-    path: '/community',
-    color: '#F97316',
-    bgColor: '#FFF7ED',
-  },
 ];
 
 // ─── Bus Routes ──────────────────────────────────────────────────────────────
@@ -860,9 +853,6 @@ export const QUESTIONS_DATA: Question[] = [
   },
 ];
 
-// ─── Confessions ─────────────────────────────────────────────────────────────
-export const CONFESSIONS_DATA: Confession[] = [];
-
 // ─── Toolkit Items ───────────────────────────────────────────────────────────
 export const TOOLKIT_ITEMS: ToolkitItem[] = [
   { id: '1', title: 'CS tools', description: 'Computer Science tools and resources', type: 'link', url: '#', icon: 'Code', category: 'Engineering' },

src/pages/AIAssistant/AIAssistant.tsx

@@ -9,7 +9,7 @@ const INITIAL_MESSAGES: ChatMessage[] = [
   {
     id: '1',
     role: 'assistant',
-    content: "👋 Hi there! I'm your **RIT AI Assistant**, powered by Google Gemini. I have comprehensive knowledge about Rajalakshmi Institute of Technology — from admission procedures to campus facilities.\n\nHow can I help you today?",
+    content: "👋 Hi there! I'm your **RIT Chatbot**. I have comprehensive knowledge about Rajalakshmi Institute of Technology — from admission procedures to campus facilities.\n\nHow can I help you today?",
     timestamp: new Date().toISOString(),
   },
 ];
@@ -109,10 +109,10 @@ export default function AIAssistant() {
               <Bot className="w-5 h-5 text-white" />
             </div>
             <div>
-              <h1 className="font-semibold text-[#1E293B] text-sm" style={{ fontFamily: 'Poppins, sans-serif' }}>RIT AI Assistant</h1>
+              <h1 className="font-semibold text-[#1E293B] text-sm" style={{ fontFamily: 'Poppins, sans-serif' }}>RIT Chatbot</h1>
               <div className="flex items-center gap-1.5 text-xs text-[#94A3B8]">
                 <span className="w-1.5 h-1.5 rounded-full bg-emerald-400" />
-                Powered by Gemini AI · Campus Knowledge Enabled
+                Campus Knowledge Enabled
               </div>
             </div>
           </div>
@@ -288,6 +288,9 @@ export default function AIAssistant() {
             <Send className="w-4 h-4" />
           </motion.button>
         </div>
+        <p className="text-[11px] text-center text-[#94A3B8] mt-3" style={{ fontFamily: 'Inter, sans-serif' }}>
+          ⚠️ Chatbot responses may not always be accurate. Please cross-reference critical academic or administrative details with official sources.
+        </p>
       </div>
     </div>
   );

src/pages/BusRoutes/BusRoutes.tsx

@@ -0,0 +1,132 @@
+import { useState, useEffect } from 'react';
+import { motion } from 'framer-motion';
+import { Search, Loader2, ChevronRight } from 'lucide-react';
+import BusCard from '@/components/BusCard/BusCard';
+import BusRouteMap from '@/components/BusRouteMap/BusRouteMap';
+import { StaggerContainer, StaggerItem } from '@/components/AnimatedContainer/AnimatedContainer';
+import type { BusRoute } from '@/types';
+import { getBackendUrl } from '@/lib/utils';
+import { Link } from 'react-router-dom';
+
+export default function BusRoutes() {
+  const [busSearch, setBusSearch] = useState('');
+  const [busRoutes, setBusRoutes] = useState<BusRoute[]>([]);
+  const [loadingBus, setLoadingBus] = useState(true);
+  const [selectedBusRoute, setSelectedBusRoute] = useState<BusRoute | null>(null);
+
+  useEffect(() => {
+    setLoadingBus(true);
+    fetch(getBackendUrl('/api/bus-routes'))
+      .then((res) => {
+        if (!res.ok) throw new Error('Backend offline');
+        return res.json();
+      })
+      .then((data) => {
+        if (data && data.length > 0) {
+          setBusRoutes(data);
+          setSelectedBusRoute(data[0]);
+        } else {
+          throw new Error('Empty data');
+        }
+        setLoadingBus(false);
+      })
+      .catch(() => {
+        fetch('/bus_routes.json')
+          .then((res) => res.json())
+          .then((data) => {
+            setBusRoutes(data);
+            setSelectedBusRoute(data[0]);
+          })
+          .catch((err) => console.error('Fallback fetch error:', err))
+          .finally(() => {
+            setLoadingBus(false);
+          });
+      });
+  }, []);
+
+  const filteredRoutes = busRoutes.filter((r) =>
+    r.name.toLowerCase().includes(busSearch.toLowerCase()) ||
+    r.from.toLowerCase().includes(busSearch.toLowerCase()) ||
+    r.number.toLowerCase().includes(busSearch.toLowerCase())
+  );
+
+  return (
+    <div className="min-h-screen relative overflow-hidden bg-[#FAFAFA]">
+      <div className="relative z-10">
+        {/* Header */}
+        <div className="bg-white border-b border-[#E5E7EB] py-10">
+          <div className="container-custom">
+            <div className="flex items-center gap-2 text-xs text-[#94A3B8] mb-3">
+              <Link to="/" className="hover:text-[#F97316]">Home</Link>
+              <ChevronRight className="w-3 h-3" />
+              <span className="text-[#F97316]">Bus Routes</span>
+            </div>
+            <h1 className="text-3xl md:text-4xl font-bold text-[#1E293B] mb-2" style={{ fontFamily: 'Playfair Display, serif' }}>
+              RIT{' '}
+              <span style={{ background: 'linear-gradient(135deg, #F97316, #FB923C)', WebkitBackgroundClip: 'text', WebkitTextFillColor: 'transparent', backgroundClip: 'text' }}>
+                Bus Routes
+              </span>
+            </h1>
+            <p className="text-[#475569] text-sm" style={{ fontFamily: 'Inter, sans-serif' }}>
+              View all campus bus routes, timings, and pickup locations at a glance.
+            </p>
+          </div>
+        </div>
+
+        <div className="container-custom py-8">
+          <div className="relative mb-6">
+            <Search className="absolute left-4 top-1/2 -translate-y-1/2 w-4.5 h-4.5 text-[#94A3B8]" />
+            <input
+              type="text"
+              placeholder="Search bus routes..."
+              value={busSearch}
+              onChange={(e) => setBusSearch(e.target.value)}
+              className="w-full pl-11 pr-4 py-3 rounded-xl border border-[#E5E7EB] bg-white text-sm text-[#1E293B] placeholder-[#94A3B8] focus:outline-none focus:border-[#F97316] transition-colors"
+              style={{ fontFamily: 'Inter, sans-serif' }}
+            />
+          </div>
+
+          {loadingBus ? (
+            <div className="flex flex-col items-center justify-center py-16 gap-3">
+              <Loader2 className="w-8 h-8 text-[#F97316] animate-spin" />
+              <p className="text-sm text-[#94A3B8]" style={{ fontFamily: 'Poppins, sans-serif' }}>
+                Loading live bus routes from RIT Transport...
+              </p>
+            </div>
+          ) : filteredRoutes.length === 0 ? (
+            <div className="text-center py-16 text-[#94A3B8]">
+              <p className="text-sm font-medium" style={{ fontFamily: 'Poppins, sans-serif' }}>
+                No bus routes found matching "{busSearch}"
+              </p>
+            </div>
+          ) : (
+            <div className="grid grid-cols-1 lg:grid-cols-12 gap-6 items-start">
+              {/* Routes List */}
+              <div className="lg:col-span-5 max-h-[650px] overflow-y-auto pr-2 space-y-4 scrollbar-thin">
+                <StaggerContainer>
+                  {filteredRoutes.map((route) => (
+                    <StaggerItem key={route.id} className="mb-4">
+                      <BusCard 
+                        route={route} 
+                        isSelected={selectedBusRoute?.number === route.number}
+                        onSelect={() => setSelectedBusRoute(route)}
+                      />
+                    </StaggerItem>
+                  ))}
+                </StaggerContainer>
+              </div>
+
+              {/* Interactive Map */}
+              <div className="lg:col-span-7 h-[450px] lg:h-[650px] sticky top-24">
+                <BusRouteMap 
+                  selectedRoute={selectedBusRoute} 
+                  allRoutes={filteredRoutes} 
+                />
+              </div>
+            </div>
+          )}
+        </div>
+      </div>
+    </div>
+  );
+}

src/pages/Community/Community.tsx

@@ -8,7 +8,6 @@ import SectionTitle from '@/components/SectionTitle/SectionTitle';
 import { getBackendUrl } from '@/lib/utils';
 import { StaggerContainer, StaggerItem } from '@/components/AnimatedContainer/AnimatedContainer';
 import AnimatedContainer from '@/components/AnimatedContainer/AnimatedContainer';
-import { CONFESSIONS_DATA } from '@/constants';
 
 const TRENDING_TAGS = ['hostel', 'academics', 'clubs', 'campus', 'canteen', 'sports', 'placement', 'library', 'cat exam', 'semester', 'labs', 'exams'];
 
@@ -270,7 +269,7 @@ export default function Community() {
             RIT Community
           </h1>
           <p className="text-slate-500 text-sm" style={{ fontFamily: 'Inter, sans-serif' }}>
-            Ask questions, share confessions, and connect with fellow RIT students.
+            Ask questions and connect with fellow RIT students.
           </p>
         </div>
       </div>

src/pages/Faculty/Faculty.tsx

@@ -0,0 +1,188 @@
+import { useState, useMemo } from 'react';
+import { motion } from 'framer-motion';
+import { Search, Users, Filter, ArrowUpDown, BookOpen, ChevronRight } from 'lucide-react';
+import FacultyCard from '@/components/FacultyCard/FacultyCard';
+import { StaggerContainer, StaggerItem } from '@/components/AnimatedContainer/AnimatedContainer';
+import { FACULTY_DATA, DEPARTMENTS } from '@/constants';
+import { Link } from 'react-router-dom';
+
+export default function Faculty() {
+  const [searchFaculty, setSearchFaculty] = useState('');
+  const [selectedDept, setSelectedDept] = useState('All Departments');
+  const [sortBy, setSortBy] = useState('Name A-Z');
+
+  const filteredAndSortedFaculty = useMemo(() => {
+    const filtered = FACULTY_DATA.filter((f) => {
+      const searchLower = searchFaculty.trim().toLowerCase();
+      const matchSearch = 
+        f.name.toLowerCase().includes(searchLower) ||
+        f.department.toLowerCase().includes(searchLower) ||
+        f.designation.toLowerCase().includes(searchLower) ||
+        (f.specialization && f.specialization.toLowerCase().includes(searchLower));
+      
+      const matchDept = selectedDept === 'All Departments' || f.department === selectedDept;
+      return matchSearch && matchDept;
+    });
+
+    return filtered.sort((a, b) => {
+      if (sortBy === 'Name A-Z') return a.name.localeCompare(b.name);
+      if (sortBy === 'Department') return a.department.localeCompare(b.department);
+      if (sortBy === 'Designation') return a.designation.localeCompare(b.designation);
+      return 0;
+    });
+  }, [searchFaculty, selectedDept, sortBy]);
+
+  return (
+    <div className="min-h-screen relative overflow-hidden bg-[#F8FAFC]">
+      {/* Background decorations */}
+      <div className="absolute inset-0 pointer-events-none overflow-hidden">
+        <div className="absolute top-0 left-0 w-full h-96 bg-gradient-to-b from-white/80 to-transparent" />
+        <div className="absolute top-20 -left-64 w-[500px] h-[500px] bg-purple-200/40 rounded-full blur-3xl opacity-50" />
+        <div className="absolute top-40 -right-64 w-[600px] h-[600px] bg-orange-200/40 rounded-full blur-3xl opacity-40" />
+        <div className="absolute inset-0" style={{ backgroundImage: 'radial-gradient(rgba(148, 163, 184, 0.1) 2px, transparent 2px)', backgroundSize: '32px 32px' }} />
+      </div>
+
+      <div className="relative z-10">
+        {/* Header */}
+        <div className="bg-white border-b border-[#E5E7EB] py-10">
+          <div className="container-custom">
+            <div className="flex items-center gap-2 text-xs text-[#94A3B8] mb-3">
+              <Link to="/" className="hover:text-[#F97316]">Home</Link>
+              <ChevronRight className="w-3 h-3" />
+              <span className="text-[#F97316]">Faculty Directory</span>
+            </div>
+            <h1 className="text-3xl md:text-4xl font-bold text-[#1E293B] mb-2" style={{ fontFamily: 'Playfair Display, serif' }}>
+              Faculty{' '}
+              <span style={{ background: 'linear-gradient(135deg, #F97316, #FB923C)', WebkitBackgroundClip: 'text', WebkitTextFillColor: 'transparent', backgroundClip: 'text' }}>
+                Directory
+              </span>
+            </h1>
+            <p className="text-[#475569] text-sm" style={{ fontFamily: 'Inter, sans-serif' }}>
+              Browse and connect with experienced faculty members across all departments.
+            </p>
+          </div>
+        </div>
+
+        <div className="container-custom py-8 space-y-8">
+          {/* Faculty Hero Section */}
+          <div className="grid grid-cols-1 lg:grid-cols-12 gap-6 items-stretch">
+            <div className="lg:col-span-5 bg-white rounded-3xl p-8 border border-[#E8ECF4] shadow-sm flex flex-col justify-center relative overflow-hidden">
+              <div className="absolute top-0 right-0 w-32 h-32 bg-orange-50 rounded-bl-full -z-10" />
+              <div className="w-14 h-14 rounded-2xl bg-gradient-to-br from-[#FF7A00] to-[#FB923C] flex items-center justify-center text-white mb-6 shadow-md">
+                <Users className="w-7 h-7" />
+              </div>
+              <h2 className="text-3xl font-bold text-[#1E293B] mb-3" style={{ fontFamily: 'Poppins, sans-serif' }}>
+                Faculty Directory
+              </h2>
+              <p className="text-[#64748B] text-xs leading-relaxed" style={{ fontFamily: 'Inter, sans-serif' }}>
+                Browse and connect with experienced faculty members. Search by name, department, or specialization.
+              </p>
+            </div>
+
+            <div className="lg:col-span-7 bg-white rounded-3xl p-6 border border-[#E8ECF4] shadow-sm">
+              <h3 className="text-sm font-semibold text-[#1E293B] mb-4 uppercase tracking-wider" style={{ fontFamily: 'Inter, sans-serif' }}>Department Overview</h3>
+              <div className="grid grid-cols-2 sm:grid-cols-4 gap-3">
+                {[
+                  { abrv: 'CSE', full: 'Computer Science & Engineering', color: 'blue' },
+                  { abrv: 'CSBS', full: 'Computer Science & Business Systems', color: 'indigo' },
+                  { abrv: 'AIML', full: 'Artificial Intelligence & Machine Learning', color: 'sky' },
+                  { abrv: 'ECE', full: 'Electronics & Communication Engineering', color: 'purple' },
+                  { abrv: 'MECH', full: 'Mechanical Engineering', color: 'orange' },
+                  { abrv: 'CIVIL', full: 'Civil Engineering', color: 'emerald' },
+                  { abrv: 'AI & DS', full: 'Artificial Intelligence & Data Science', color: 'pink' },
+                  { abrv: 'EEE', full: 'Electrical & Electronics Engineering', color: 'yellow' },
+                ].map(d => {
+                  const count = FACULTY_DATA.filter(f => f.department === d.full).length;
+                  return (
+                    <div key={d.abrv} className={`p-4 rounded-2xl bg-${d.color}-50 border border-${d.color}-100 flex flex-col gap-1 transition-transform hover:scale-105 cursor-default`}>
+                      <div className="flex justify-between items-center">
+                        <span className={`text-xs font-bold text-${d.color}-700`} style={{ fontFamily: 'Poppins, sans-serif' }}>{d.abrv}</span>
+                        <BookOpen className={`w-3.5 h-3.5 text-${d.color}-400`} />
+                      </div>
+                      <span className="text-2xl font-bold text-[#1E293B]" style={{ fontFamily: 'Poppins, sans-serif' }}>{count}</span>
+                    </div>
+                  );
+                })}
+              </div>
+            </div>
+          </div>
+
+          {/* Search Section */}
+          <div className="bg-white rounded-3xl p-4 border border-[#E8ECF4] shadow-sm flex flex-col md:flex-row gap-4">
+            <div className="relative flex-1">
+              <Search className="absolute left-4 top-1/2 -translate-y-1/2 w-5 h-5 text-[#94A3B8]" />
+              <input
+                type="text"
+                placeholder="Search by faculty name, department, designation or specialization..."
+                value={searchFaculty}
+                onChange={(e) => setSearchFaculty(e.target.value)}
+                className="w-full pl-12 pr-4 py-3.5 rounded-2xl bg-[#F8FAFC] border-none text-sm text-[#1E293B] placeholder-[#94A3B8] focus:ring-2 focus:ring-[#FF7A00]/20 focus:outline-none transition-all"
+                style={{ fontFamily: 'Inter, sans-serif' }}
+              />
+            </div>
+            <div className="flex flex-col sm:flex-row gap-3">
+              <div className="relative">
+                <Filter className="absolute left-4 top-1/2 -translate-y-1/2 w-4 h-4 text-[#94A3B8] pointer-events-none" />
+                <select
+                  value={selectedDept}
+                  onChange={(e) => setSelectedDept(e.target.value)}
+                  className="h-full pl-10 pr-10 py-3.5 rounded-2xl bg-[#F8FAFC] border-none text-sm font-medium text-[#475569] focus:ring-2 focus:ring-[#FF7A00]/20 focus:outline-none transition-all appearance-none cursor-pointer min-w-[200px]"
+                  style={{ fontFamily: 'Inter, sans-serif', backgroundImage: 'url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%2394A3B8%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E")', backgroundRepeat: 'no-repeat', backgroundPosition: 'right 1rem top 50%', backgroundSize: '0.65rem auto' }}
+                >
+                  {DEPARTMENTS.map((dept) => {
+                    const count = dept === 'All Departments' ? FACULTY_DATA.length : FACULTY_DATA.filter((f) => f.department === dept).length;
+                    return <option key={dept} value={dept}>{dept} ({count})</option>;
+                  })}
+                </select>
+              </div>
+              <div className="relative">
+                <ArrowUpDown className="absolute left-4 top-1/2 -translate-y-1/2 w-4 h-4 text-[#94A3B8] pointer-events-none" />
+                <select
+                  value={sortBy}
+                  onChange={(e) => setSortBy(e.target.value)}
+                  className="h-full pl-10 pr-10 py-3.5 rounded-2xl bg-[#F8FAFC] border-none text-sm font-medium text-[#475569] focus:ring-2 focus:ring-[#FF7A00]/20 focus:outline-none transition-all appearance-none cursor-pointer"
+                  style={{ fontFamily: 'Inter, sans-serif', backgroundImage: 'url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%2394A3B8%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E")', backgroundRepeat: 'no-repeat', backgroundPosition: 'right 1rem top 50%', backgroundSize: '0.65rem auto' }}
+                >
+                  <option value="Name A-Z">Sort: Name A-Z</option>
+                  <option value="Department">Sort: Department</option>
+                  <option value="Designation">Sort: Designation</option>
+                </select>
+              </div>
+            </div>
+          </div>
+
+          {/* Grid */}
+          {filteredAndSortedFaculty.length > 0 ? (
+            <StaggerContainer key={`${searchFaculty}-${selectedDept}-${sortBy}`} className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6 pb-20">
+              {filteredAndSortedFaculty.map((faculty) => (
+                <StaggerItem key={faculty.id}>
+                  <FacultyCard faculty={faculty} />
+                </StaggerItem>
+              ))}
+            </StaggerContainer>
+          ) : (
+            <div className="py-20 text-center flex flex-col items-center justify-center bg-white rounded-3xl border border-[#E8ECF4] shadow-sm">
+              <Users className="w-12 h-12 text-[#CBD5E1] mb-4" />
+              <h3 className="text-lg font-bold text-[#1E293B]" style={{ fontFamily: 'Poppins, sans-serif' }}>No faculty found</h3>
+              <p className="text-[#64748B] text-sm mt-1" style={{ fontFamily: 'Inter, sans-serif' }}>Try adjusting your search or filters.</p>
+            </div>
+          )}
+
+          {/* Bottom Status */}
+          <div className="fixed bottom-8 left-1/2 -translate-x-1/2 z-50 pointer-events-none">
+            <motion.div 
+              initial={{ opacity: 0, y: 20 }} 
+              animate={{ opacity: 1, y: 0 }} 
+              className="px-6 py-3 bg-white/80 backdrop-blur-md border border-[#E8ECF4] shadow-[0_8px_30px_rgb(0,0,0,0.08)] rounded-full flex items-center gap-2"
+            >
+              <span className="text-lg">👥</span>
+              <span className="text-sm font-semibold text-[#1E293B]" style={{ fontFamily: 'Inter, sans-serif' }}>
+                Showing {filteredAndSortedFaculty.length} Faculty Members
+              </span>
+            </motion.div>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}

src/pages/Home/Home.tsx

@@ -7,7 +7,6 @@ import {
 import SectionTitle from '@/components/SectionTitle/SectionTitle';
 import FeatureCard from '@/components/FeatureCard/FeatureCard';
 import FloatingCard from '@/components/FloatingCard/FloatingCard';
-import ChatPreview from '@/components/ChatPreview/ChatPreview';
 import { StaggerContainer, StaggerItem } from '@/components/AnimatedContainer/AnimatedContainer';
 import AnimatedContainer from '@/components/AnimatedContainer/AnimatedContainer';
 import { FEATURES, CAMPUS_LOCATIONS } from '@/constants';
@@ -123,7 +122,7 @@ export default function Home() {
                 style={{ fontFamily: 'Poppins, sans-serif' }}
               >
                 <Bot className="w-4 h-4" />
-                Ask AI Assistant
+                Ask Chatbot
               </motion.button>
             </Link>
           </motion.div>
@@ -178,7 +177,7 @@ export default function Home() {
                 { value: '20+', label: 'SPORTS', icon: Trophy },
                 { value: '100+', label: 'FACULTY', icon: GraduationCap },
                 { value: '18', label: 'CLUBS', icon: Award },
-                { value: '24/7', label: 'AI ASSISTANT', icon: Cpu },
+                { value: '24/7', label: 'CHATBOT', icon: Cpu },
                 { value: '5000+', label: 'STUDENTS', icon: Users },
               ].map((stat, i) => (
                 <div key={i} className="flex flex-col items-center justify-center p-4">
@@ -227,76 +226,7 @@ export default function Home() {
         </div>
       </section>
 
-      {/* ─── AI Section ───────────────────────────────────────────────────────── */}
-      <section className="section-padding bg-white relative z-20">
-        <div className="container-custom">
-          <div className="grid grid-cols-1 lg:grid-cols-2 gap-12 items-center">
-            {/* Left – Text */}
-            <AnimatedContainer direction="left">
-              <div className="inline-flex items-center gap-2 px-4 py-2 rounded-full mb-5"
-                style={{ backgroundColor: '#F5F3FF', border: '1px solid #DDD6FE' }}>
-                <Sparkles className="w-4 h-4 text-[#8B5CF6]" />
-                <span className="text-xs font-semibold text-[#8B5CF6] uppercase tracking-wider" style={{ fontFamily: 'Poppins, sans-serif' }}>
-                  AI-Powered
-                </span>
-              </div>
-              <h2 className="text-3xl md:text-4xl font-bold mb-4" style={{ fontFamily: 'Playfair Display, serif', color: '#1E293B' }}>
-                Your 24/7{' '}
-                <span style={{ background: 'linear-gradient(135deg, #F97316, #FB923C)', WebkitBackgroundClip: 'text', WebkitTextFillColor: 'transparent', backgroundClip: 'text' }}>
-                  Campus Guide
-                </span>
-              </h2>
-              <p className="text-[#475569] leading-relaxed mb-8" style={{ fontFamily: 'Inter, sans-serif' }}>
-                Ask anything about RIT — from admission documents to canteen timings. Our AI assistant, powered by Google Gemini with campus-specific knowledge, gives you instant, accurate answers.
-              </p>
 
-              <div className="grid grid-cols-2 gap-4 mb-8">
-                {[
-                  { icon: 'Brain', label: 'Gemini AI', desc: 'State-of-the-art AI' },
-                  { icon: 'Database', label: 'RAG System', desc: 'Campus knowledge base' },
-                  { icon: 'Map', label: 'Campus Context', desc: 'RIT-specific answers' },
-                  { icon: 'Zap', label: 'Instant Answers', desc: 'No wait time' },
-                ].map((item, i) => {
-                  const Icon = (LucideIcons as unknown as Record<string, React.ComponentType<{ className?: string; style?: React.CSSProperties }>>)[item.icon];
-                  return (
-                    <div key={i} className="flex items-start gap-3 p-4 rounded-xl border border-[#E5E7EB] bg-[#FAFAFA]">
-                      <div className="w-9 h-9 rounded-lg flex items-center justify-center bg-[#FFF7ED] shrink-0">
-                        {Icon && <Icon className="w-4.5 h-4.5" style={{ color: '#F97316' }} />}
-                      </div>
-                      <div>
-                        <div className="text-sm font-semibold text-[#1E293B]" style={{ fontFamily: 'Poppins, sans-serif' }}>{item.label}</div>
-                        <div className="text-xs text-[#94A3B8]" style={{ fontFamily: 'Inter, sans-serif' }}>{item.desc}</div>
-                      </div>
-                    </div>
-                  );
-                })}
-              </div>
-
-              <Link to="/ai-assistant">
-                <motion.button
-                  whileHover={{ scale: 1.03 }}
-                  whileTap={{ scale: 0.97 }}
-                  className="flex items-center gap-2 px-7 py-3.5 rounded-xl text-white font-semibold"
-                  style={{
-                    fontFamily: 'Poppins, sans-serif',
-                    background: 'linear-gradient(135deg, #F97316, #FB923C)',
-                    boxShadow: '0 6px 20px rgba(249,115,22,0.35)',
-                  }}
-                >
-                  <Bot className="w-4.5 h-4.5" />
-                  Try AI Assistant
-                  <ArrowRight className="w-4 h-4" />
-                </motion.button>
-              </Link>
-            </AnimatedContainer>
-
-            {/* Right – Chat Preview */}
-            <AnimatedContainer direction="right" delay={0.2}>
-              <ChatPreview />
-            </AnimatedContainer>
-          </div>
-        </div>
-      </section>
 
       {/* ─── Campus Quick Nav ─────────────────────────────────────────────────── */}
       <section className="section-padding relative z-20" style={{ backgroundColor: '#FAFAFA' }}>
@@ -386,86 +316,39 @@ export default function Home() {
 
       {/* ─── Community Teaser ─────────────────────────────────────────────────── */}
       <section className="section-padding bg-white relative z-20">
-        <div className="container-custom">
-          <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
-            {/* Q&A teaser */}
-            <AnimatedContainer direction="left">
-              <div className="rounded-3xl p-7 h-full border border-[#E5E7EB]"
-                style={{ background: 'linear-gradient(135deg, #FAFAFA, #FFF7ED)', boxShadow: '0 4px 20px -4px rgba(0,0,0,0.07)' }}>
-                <div className="flex items-center gap-3 mb-4">
-                  <div className="w-11 h-11 rounded-xl flex items-center justify-center bg-[#FFF7ED]">
-                    <LucideIcons.MessageCircle className="w-5 h-5 text-[#F97316]" />
-                  </div>
-                  <div>
-                    <h3 className="font-semibold text-[#1E293B]" style={{ fontFamily: 'Poppins, sans-serif' }}>Freshers Q&A</h3>
-                    <p className="text-xs text-[#94A3B8]">Get answers from seniors</p>
-                  </div>
+        <div className="container-custom max-w-2xl">
+          {/* Q&A teaser */}
+          <AnimatedContainer>
+            <div className="rounded-3xl p-7 border border-[#E5E7EB]"
+              style={{ background: 'linear-gradient(135deg, #FAFAFA, #FFF7ED)', boxShadow: '0 4px 20px -4px rgba(0,0,0,0.07)' }}>
+              <div className="flex items-center gap-3 mb-4">
+                <div className="w-11 h-11 rounded-xl flex items-center justify-center bg-[#FFF7ED]">
+                  <LucideIcons.MessageCircle className="w-5 h-5 text-[#F97316]" />
                 </div>
-                <div className="space-y-3 mb-5">
-                  {['How is hostel life at RIT?', 'Best clubs to join as a fresher?', 'Tips for first semester survival'].map((q, i) => (
-                    <div key={i} className="flex items-start gap-2.5 p-3 bg-white rounded-xl border border-[#E5E7EB]">
-                      <span className="text-[#F97316] text-xs font-bold mt-0.5">Q</span>
-                      <span className="text-xs text-[#475569]" style={{ fontFamily: 'Inter, sans-serif' }}>{q}</span>
-                    </div>
-                  ))}
+                <div>
+                  <h3 className="font-semibold text-[#1E293B]" style={{ fontFamily: 'Poppins, sans-serif' }}>Freshers Q&A</h3>
+                  <p className="text-xs text-[#94A3B8]">Get answers from seniors</p>
                 </div>
-                <Link to="/community">
-                  <motion.button
-                    whileHover={{ scale: 1.02 }}
-                    className="w-full py-2.5 rounded-xl text-sm font-semibold text-[#F97316] border-2 border-[#F97316] hover:bg-[#FFF7ED] transition-all"
-                    style={{ fontFamily: 'Poppins, sans-serif' }}
-                  >
-                    Join the Discussion
-                  </motion.button>
-                </Link>
               </div>
-            </AnimatedContainer>
-
-            {/* Anonymous Confession Teaser */}
-            <AnimatedContainer direction="right" delay={0.1}>
-              <div className="rounded-3xl p-7 h-full border border-[#E5E7EB]"
-                style={{ background: 'linear-gradient(135deg, #1E293B, #334155)', boxShadow: '0 4px 20px -4px rgba(0,0,0,0.15)' }}>
-                <div className="flex items-center gap-3 mb-4">
-                  <div className="w-11 h-11 rounded-xl flex items-center justify-center" style={{ backgroundColor: 'rgba(249,115,22,0.2)' }}>
-                    <LucideIcons.Heart className="w-5 h-5 text-[#F97316]" />
+              <div className="space-y-3 mb-5">
+                {['How is hostel life at RIT?', 'Best clubs to join as a fresher?', 'Tips for first semester survival'].map((q, i) => (
+                  <div key={i} className="flex items-start gap-2.5 p-3 bg-white rounded-xl border border-[#E5E7EB]">
+                    <span className="text-[#F97316] text-xs font-bold mt-0.5">Q</span>
+                    <span className="text-xs text-[#475569]" style={{ fontFamily: 'Inter, sans-serif' }}>{q}</span>
                   </div>
-                  <div>
-                    <h3 className="font-semibold text-white" style={{ fontFamily: 'Poppins, sans-serif' }}>Anonymous Confessions</h3>
-                    <p className="text-xs text-slate-400">Share without revealing identity</p>
-                  </div>
-                </div>
-                <div className="space-y-3 mb-5">
-                  {[
-                    { text: "I went to the wrong department on my first day 😅", reactions: 87 },
-                    { text: "The library WiFi is faster than my home connection 😂", reactions: 134 },
-                  ].map((c, i) => (
-                    <div key={i} className="p-3 rounded-xl" style={{ backgroundColor: 'rgba(255,255,255,0.07)', border: '1px solid rgba(255,255,255,0.1)' }}>
-                      <p className="text-xs text-slate-300 mb-2" style={{ fontFamily: 'Inter, sans-serif' }}>{c.text}</p>
-                      <div className="flex items-center gap-1 text-xs text-slate-500">
-                        <LucideIcons.Heart className="w-3 h-3 text-[#F97316]" />
-                        <span>{c.reactions}</span>
-                      </div>
-                    </div>
-                  ))}
-                </div>
-                <div className="flex items-center gap-2 p-3 rounded-xl mb-4" style={{ backgroundColor: 'rgba(249,115,22,0.1)', border: '1px solid rgba(249,115,22,0.2)' }}>
-                  <LucideIcons.Shield className="w-4 h-4 text-[#F97316] shrink-0" />
-                  <span className="text-xs text-slate-400" style={{ fontFamily: 'Inter, sans-serif' }}>
-                    100% Anonymous. No tracking. No identity revealed.
-                  </span>
-                </div>
-                <Link to="/community">
-                  <motion.button
-                    whileHover={{ scale: 1.02 }}
-                    className="w-full py-2.5 rounded-xl text-sm font-semibold text-white transition-all"
-                    style={{ fontFamily: 'Poppins, sans-serif', background: 'linear-gradient(135deg, #F97316, #FB923C)' }}
-                  >
-                    Confess Anonymously
-                  </motion.button>
-                </Link>
+                ))}
               </div>
-            </AnimatedContainer>
-          </div>
+              <Link to="/community">
+                <motion.button
+                  whileHover={{ scale: 1.02 }}
+                  className="w-full py-2.5 rounded-xl text-sm font-semibold text-[#F97316] border-2 border-[#F97316] hover:bg-[#FFF7ED] transition-all"
+                  style={{ fontFamily: 'Poppins, sans-serif' }}
+                >
+                  Join the Discussion
+                </motion.button>
+              </Link>
+            </div>
+          </AnimatedContainer>
         </div>
       </section>
     </div>

src/pages/Profile/Profile.tsx

@@ -1,219 +0,0 @@
-import { useState } from 'react';
-import { motion } from 'framer-motion';
-import {
-  User, Mail, Phone, GraduationCap, BookOpen,
-  Settings, LogOut, Edit3, Camera, Bell,
-  Shield, Star, Calendar, ChevronRight
-} from 'lucide-react';
-import AnimatedContainer from '@/components/AnimatedContainer/AnimatedContainer';
-import { StaggerContainer, StaggerItem } from '@/components/AnimatedContainer/AnimatedContainer';
-
-const MOCK_USER = {
-  name: 'Arjun Kumar',
-  rollNo: 'CB.EN.U4CSE25001',
-  department: 'Computer Science & Engineering',
-  semester: '1st Semester',
-  email: 'arjun.kumar@rit.ac.in',
-  phone: '+91 98765 43210',
-  joinedDate: 'August 2025',
-  batch: '2025-2029',
-};
-
-const ACTIVITY = [
-  { label: 'Notes Downloaded', value: '12', icon: BookOpen, color: '#F97316' },
-  { label: 'Questions Asked', value: '3', icon: Star, color: '#8B5CF6' },
-  { label: 'Events Registered', value: '2', icon: Calendar, color: '#10B981' },
-  { label: 'AI Queries', value: '48', icon: Shield, color: '#3B82F6' },
-];
-
-const MENU_ITEMS = [
-  { icon: Bell, label: 'Notifications', badge: '3' },
-  { icon: BookOpen, label: 'My Downloads', badge: null },
-  { icon: Star, label: 'Bookmarks', badge: null },
-  { icon: Settings, label: 'Settings', badge: null },
-  { icon: Shield, label: 'Privacy & Security', badge: null },
-];
-
-export default function Profile() {
-  const [isEditing, setIsEditing] = useState(false);
-
-  return (
-    <div className="min-h-screen" style={{ backgroundColor: '#FAFAFA' }}>
-      {/* Header */}
-      <div
-        className="py-16 relative overflow-hidden"
-        style={{ background: 'linear-gradient(135deg, #1E293B 0%, #334155 100%)' }}
-      >
-        <div
-          className="absolute inset-0 opacity-5"
-          style={{
-            backgroundImage: 'radial-gradient(circle, #F97316 1px, transparent 1px)',
-            backgroundSize: '32px 32px',
-          }}
-        />
-        <div className="container-custom relative z-10">
-          <div className="flex flex-col md:flex-row items-start md:items-center gap-6">
-            {/* Avatar */}
-            <div className="relative">
-              <motion.div
-                whileHover={{ scale: 1.05 }}
-                className="w-24 h-24 rounded-2xl flex items-center justify-center text-3xl font-bold text-white cursor-pointer"
-                style={{
-                  background: 'linear-gradient(135deg, #F97316, #FB923C)',
-                  fontFamily: 'Poppins, sans-serif',
-                  boxShadow: '0 8px 30px rgba(249,115,22,0.4)',
-                }}
-              >
-                AK
-              </motion.div>
-              <button
-                className="absolute -bottom-2 -right-2 w-8 h-8 rounded-xl flex items-center justify-center text-white"
-                style={{ background: 'linear-gradient(135deg, #F97316, #FB923C)' }}
-                aria-label="Change photo"
-              >
-                <Camera className="w-3.5 h-3.5" />
-              </button>
-            </div>
-
-            {/* Info */}
-            <div className="flex-1">
-              <h1 className="text-2xl font-bold text-white mb-1" style={{ fontFamily: 'Playfair Display, serif' }}>
-                {MOCK_USER.name}
-              </h1>
-              <p className="text-orange-300 text-sm mb-1" style={{ fontFamily: 'Inter, sans-serif' }}>
-                {MOCK_USER.rollNo}
-              </p>
-              <p className="text-slate-400 text-sm mb-3" style={{ fontFamily: 'Inter, sans-serif' }}>
-                {MOCK_USER.department} · {MOCK_USER.batch}
-              </p>
-              <div className="flex flex-wrap gap-2">
-                <span className="px-3 py-1 rounded-full text-xs font-semibold bg-orange-500/20 text-orange-300 border border-orange-500/30" style={{ fontFamily: 'Poppins, sans-serif' }}>
-                  {MOCK_USER.semester}
-                </span>
-                <span className="px-3 py-1 rounded-full text-xs font-semibold bg-emerald-500/20 text-emerald-400 border border-emerald-500/30" style={{ fontFamily: 'Poppins, sans-serif' }}>
-                  Active Student
-                </span>
-              </div>
-            </div>
-
-            {/* Edit button */}
-            <motion.button
-              whileHover={{ scale: 1.03 }}
-              whileTap={{ scale: 0.97 }}
-              onClick={() => setIsEditing(!isEditing)}
-              className="flex items-center gap-2 px-5 py-2.5 rounded-xl text-white text-sm font-semibold border border-white/20 hover:bg-white/10 transition-all"
-              style={{ fontFamily: 'Poppins, sans-serif' }}
-            >
-              <Edit3 className="w-4 h-4" />
-              Edit Profile
-            </motion.button>
-          </div>
-        </div>
-      </div>
-
-      <div className="container-custom py-8">
-        <div className="grid grid-cols-1 lg:grid-cols-3 gap-8">
-          {/* Left */}
-          <div className="lg:col-span-2 flex flex-col gap-6">
-            {/* Activity Stats */}
-            <AnimatedContainer>
-              <div className="grid grid-cols-2 sm:grid-cols-4 gap-4">
-                {ACTIVITY.map((item, i) => (
-                  <motion.div
-                    key={i}
-                    whileHover={{ y: -3 }}
-                    className="bg-white rounded-2xl border border-[#E5E7EB] p-4 text-center"
-                    style={{ boxShadow: '0 2px 15px -3px rgba(0,0,0,0.07)' }}
-                  >
-                    <div
-                      className="w-10 h-10 rounded-xl flex items-center justify-center mx-auto mb-2"
-                      style={{ backgroundColor: `${item.color}15` }}
-                    >
-                      <item.icon className="w-5 h-5" style={{ color: item.color } as React.CSSProperties} />
-                    </div>
-                    <div className="text-xl font-bold mb-0.5" style={{ color: item.color, fontFamily: 'Poppins, sans-serif' }}>
-                      {item.value}
-                    </div>
-                    <div className="text-[10px] text-[#94A3B8]" style={{ fontFamily: 'Inter, sans-serif' }}>{item.label}</div>
-                  </motion.div>
-                ))}
-              </div>
-            </AnimatedContainer>
-
-            {/* Personal Details */}
-            <AnimatedContainer delay={0.1}>
-              <div className="bg-white rounded-2xl border border-[#E5E7EB] p-6" style={{ boxShadow: '0 2px 15px -3px rgba(0,0,0,0.07)' }}>
-                <h3 className="text-sm font-semibold text-[#1E293B] mb-5" style={{ fontFamily: 'Poppins, sans-serif' }}>
-                  Personal Information
-                </h3>
-                <div className="grid grid-cols-1 sm:grid-cols-2 gap-5">
-                  {[
-                    { icon: User, label: 'Full Name', value: MOCK_USER.name },
-                    { icon: GraduationCap, label: 'Roll Number', value: MOCK_USER.rollNo },
-                    { icon: Mail, label: 'Email', value: MOCK_USER.email },
-                    { icon: Phone, label: 'Phone', value: MOCK_USER.phone },
-                    { icon: BookOpen, label: 'Department', value: MOCK_USER.department },
-                    { icon: Calendar, label: 'Joined', value: MOCK_USER.joinedDate },
-                  ].map((item, i) => (
-                    <div key={i} className="flex items-center gap-3 p-3 rounded-xl bg-[#F8FAFC] border border-[#E5E7EB]">
-                      <div className="w-9 h-9 rounded-lg flex items-center justify-center bg-[#FFF7ED] shrink-0">
-                        <item.icon className="w-4.5 h-4.5 text-[#F97316]" />
-                      </div>
-                      <div>
-                        <div className="text-[10px] text-[#94A3B8] uppercase tracking-wider" style={{ fontFamily: 'Inter, sans-serif' }}>{item.label}</div>
-                        <div className="text-sm font-medium text-[#1E293B]" style={{ fontFamily: 'Inter, sans-serif' }}>{item.value}</div>
-                      </div>
-                    </div>
-                  ))}
-                </div>
-              </div>
-            </AnimatedContainer>
-          </div>
-
-          {/* Right Sidebar */}
-          <div className="flex flex-col gap-5">
-            {/* Menu */}
-            <AnimatedContainer direction="right" delay={0.1}>
-              <div className="bg-white rounded-2xl border border-[#E5E7EB] overflow-hidden" style={{ boxShadow: '0 2px 15px -3px rgba(0,0,0,0.07)' }}>
-                {MENU_ITEMS.map((item, i) => (
-                  <motion.button
-                    key={i}
-                    whileHover={{ backgroundColor: '#FFF7ED', x: 2 }}
-                    className="w-full flex items-center justify-between px-5 py-3.5 border-b border-[#E5E7EB] last:border-0 transition-all text-left"
-                  >
-                    <div className="flex items-center gap-3">
-                      <item.icon className="w-4 h-4 text-[#94A3B8]" />
-                      <span className="text-sm text-[#475569]" style={{ fontFamily: 'Inter, sans-serif' }}>{item.label}</span>
-                    </div>
-                    <div className="flex items-center gap-2">
-                      {item.badge && (
-                        <span className="w-5 h-5 rounded-full flex items-center justify-center text-[10px] text-white font-bold"
-                          style={{ backgroundColor: '#F97316', fontFamily: 'Poppins, sans-serif' }}>
-                          {item.badge}
-                        </span>
-                      )}
-                      <ChevronRight className="w-3.5 h-3.5 text-[#94A3B8]" />
-                    </div>
-                  </motion.button>
-                ))}
-              </div>
-            </AnimatedContainer>
-
-            {/* Logout */}
-            <AnimatedContainer direction="right" delay={0.2}>
-              <motion.button
-                whileHover={{ scale: 1.02 }}
-                whileTap={{ scale: 0.98 }}
-                className="w-full flex items-center justify-center gap-2 py-3 rounded-xl border-2 border-red-100 text-red-400 hover:bg-red-50 text-sm font-semibold transition-all"
-                style={{ fontFamily: 'Poppins, sans-serif' }}
-              >
-                <LogOut className="w-4 h-4" />
-                Sign Out
-              </motion.button>
-            </AnimatedContainer>
-          </div>
-        </div>
-      </div>
-    </div>
-  );
-}

src/types/index.ts

@@ -142,14 +142,6 @@ export interface Question {
   isAnswered: boolean;
 }
 
-export interface Confession {
-  id: string;
-  content: string;
-  createdAt: string;
-  reactions: number;
-  category?: string;
-}
-
 // ─── AI Chat ─────────────────────────────────────────────────────────────────
 export interface ChatMessage {
   id: string;