diff --git a/client/src/Icons/ContactIcon.jsx b/client/src/Icons/ContactIcon.jsx
new file mode 100644
index 000000000..91925391b
--- /dev/null
+++ b/client/src/Icons/ContactIcon.jsx
@@ -0,0 +1,32 @@
+import React from 'react';
+
+const styles = {
+  Icon: {
+    fill: '#8a1c1c',
+    top: '464px',
+    left: '407px',
+    width: '114px',
+    height: '133px',
+  },
+};
+
+export const IconComponent = ({ className = '' }) => (
+  <svg className={className} viewBox="0 0 24 24">
+    <path d="M0 0h24v24H0z" fill="none" />
+    <path d="M12 2a9 9 0 0 0-9 9c0 4.17 2.84 7.67 6.69 8.69L12 22l2.31-2.31C18.16 18.67 21 15.17 21 11a9 9 0 0 0-9-9zm0 2c1.66 0 3 1.34 3 3s-1.34 3-3 3-3-1.34-3-3 1.34-3 3-3zm0 14.3a7.2 7.2 0 0 1-6-3.22c.03-1.99 4-3.08 6-3.08 1.99 0 5.97 1.09 6 3.08a7.2 7.2 0 0 1-6 3.22z" />
+  </svg>
+);
+
+const defaultProps = {
+  IconComponent,
+};
+
+const ContactIcon = (props) => {
+  return (
+    props.IconComponent 
+      ? <props.IconComponent style={styles.Icon} /> 
+      : <defaultProps.IconComponent />
+  );
+};
+
+export default ContactIcon;
\ No newline at end of file
diff --git a/client/src/img/coordinator.jpg b/client/src/img/coordinator.jpg
new file mode 100644
index 000000000..590722dfd
Binary files /dev/null and b/client/src/img/coordinator.jpg differ
diff --git a/client/src/img/ipms-banner.jpg b/client/src/img/ipms-banner.jpg
new file mode 100644
index 000000000..8737e6f2f
Binary files /dev/null and b/client/src/img/ipms-banner.jpg differ
diff --git a/client/src/img/mansoor.jpg b/client/src/img/mansoor.jpg
new file mode 100644
index 000000000..c48f1c2a7
Binary files /dev/null and b/client/src/img/mansoor.jpg differ
diff --git a/client/src/img/student.jpg b/client/src/img/student.jpg
new file mode 100644
index 000000000..af635da68
Binary files /dev/null and b/client/src/img/student.jpg differ
diff --git a/client/src/img/supervisor.jpg b/client/src/img/supervisor.jpg
new file mode 100644
index 000000000..0b7065ed6
Binary files /dev/null and b/client/src/img/supervisor.jpg differ
diff --git a/client/src/pages/A1InternshipRequestForm.js b/client/src/pages/A1InternshipRequestForm.js
index ee307f08e..d3d855fd1 100644
--- a/client/src/pages/A1InternshipRequestForm.js
+++ b/client/src/pages/A1InternshipRequestForm.js
@@ -1,6 +1,6 @@
 import React, { useState, useEffect } from "react";
 import "../styles/A1InternshipRequestForm.css";
-
+import { useNavigate } from "react-router-dom";
 
 const outcomeLabels = [
   "Problem Solving",
@@ -11,6 +11,7 @@ const outcomeLabels = [
   "Application",
 ];
 
+
 const outcomeDescriptions = [
   "Understand and solve complex computing problems",
   "Create, build, and assess computing solutions",
@@ -25,7 +26,7 @@ const signatureFonts = [
   { name: "Great Vibes", class: "font-great-vibes" },
   { name: "Pacifico", class: "font-pacifico" },
   { name: "Satisfy", class: "font-satisfy" },
-  { name: "Caveat", class: "font-caveat" }
+  { name: "Caveat", class: "font-caveat" },
 ];
 
 
@@ -61,9 +62,11 @@ const SignatureInput = ({ id, value, onChange, disabled, placeholder }) => {
       />
       {showFonts && nameInput && (
         <div className="signature-font-options">
-          <div className="signature-font-preview-header">Select a signature style:</div>
+          <div className="signature-font-preview-header">
+            Select a signature style:
+          </div>
           {signatureFonts.map((font) => (
-            <div 
+            <div
               key={font.class}
               className={`signature-font-preview ${font.class}`}
               onClick={() => selectFont(font.class)}
@@ -76,11 +79,7 @@ const SignatureInput = ({ id, value, onChange, disabled, placeholder }) => {
       {nameInput && (
         <div className={`signature-preview ${selectedFont}`}>
           {nameInput}
-          <input 
-            type="hidden" 
-            id={id} 
-            value={nameInput} 
-          />
+          <input type="hidden" id={id} value={nameInput} />
         </div>
       )}
     </div>
@@ -88,6 +87,7 @@ const SignatureInput = ({ id, value, onChange, disabled, placeholder }) => {
 };
 
 const A1InternshipRequestForm = ({ userRole = "student" }) => {
+   const navigate = useNavigate();
   const initialState = {
     interneeName: "",
     // soonerId: "",
@@ -108,6 +108,31 @@ const A1InternshipRequestForm = ({ userRole = "student" }) => {
   };
 
   const [formData, setFormData] = useState(initialState);
+
+  useEffect(() => {
+    const ouEmail = localStorage.getItem("ouEmail");
+
+    fetch(
+      `${
+        process.env.REACT_APP_API_URL
+      }/api/student/me?ouEmail=${encodeURIComponent(ouEmail)}`
+    )
+      .then((res) => {
+        console.log("Fetch status:", res.status);
+        return res.json();
+      })
+      .then((data) => {
+        console.log("Fetch returned:", data);
+        setFormData((f) => ({
+          ...f,
+          interneeName: data.interneeName,
+          soonerId: data.soonerId,
+          interneeEmail: data.interneeEmail,
+        }));
+      })
+      .catch((err) => console.error("Prefill error:", err));
+  }, []);
+
   const [successMsg, setSuccessMsg] = useState("");
   const [errors, setErrors] = useState({});
   const [dateError, setDateError] = useState("");
@@ -115,11 +140,18 @@ const A1InternshipRequestForm = ({ userRole = "student" }) => {
   const isFieldEditable = (fieldType) => {
     switch (userRole) {
       case "student":
-        return !["advisorSignature", "coordinatorApproval", "supervisorComments", "coordinatorComments"].includes(fieldType);
+        return ![
+          "advisorSignature",
+          "coordinatorApproval",
+          "supervisorComments",
+          "coordinatorComments",
+        ].includes(fieldType);
       case "supervisor":
         return ["advisor", "supervisorComments"].includes(fieldType);
       case "coordinator":
-        return ["coordinator", "coordinatorComments", "advisor"].includes(fieldType);
+        return ["coordinator", "coordinatorComments", "advisor"].includes(
+          fieldType
+        );
       default:
         return true;
     }
@@ -149,7 +181,7 @@ const A1InternshipRequestForm = ({ userRole = "student" }) => {
       }
     }
     if (errors[id]) {
-      setErrors(prev => {
+      setErrors((prev) => {
         const newErrors = { ...prev };
         delete newErrors[id];
         return newErrors;
@@ -176,7 +208,9 @@ const A1InternshipRequestForm = ({ userRole = "student" }) => {
 
   useEffect(() => {
     const timeout = setTimeout(() => {
-      const descriptions = formData.tasks.map((task) => task.description.trim()).filter(Boolean);
+      const descriptions = formData.tasks
+        .map((task) => task.description.trim())
+        .filter(Boolean);
       if (descriptions.length > 0) {
         fetch(`${process.env.REACT_APP_API_URL}/api/align-outcomes`, {
           method: "POST",
@@ -186,8 +220,12 @@ const A1InternshipRequestForm = ({ userRole = "student" }) => {
           .then((res) => res.json())
           .then((data) => {
             const updatedTasks = formData.tasks.map((task) => {
-              const match = data.results.find((r) => r.task === task.description);
-              return match ? { ...task, outcomes: match.matched_outcomes } : { ...task, outcomes: [] };
+              const match = data.results.find(
+                (r) => r.task === task.description
+              );
+              return match
+                ? { ...task, outcomes: match.matched_outcomes }
+                : { ...task, outcomes: [] };
             });
             setFormData((prev) => ({ ...prev, tasks: updatedTasks }));
           })
@@ -198,10 +236,14 @@ const A1InternshipRequestForm = ({ userRole = "student" }) => {
   }, [formData.tasks]);
 
   const renderOutcomeCell = (task, outcome, key) => {
-    const normalizedOutcome = outcome.charAt(0).toLowerCase() + outcome.replace(/\s+/g, "").slice(1);
+    const normalizedOutcome =
+      outcome.charAt(0).toLowerCase() + outcome.replace(/\s+/g, "").slice(1);
     const isMatched = task.outcomes.includes(normalizedOutcome);
     return (
-      <td key={key} style={{ backgroundColor: isMatched ? "#c6f6d5" : "", padding: "4px" }}>
+      <td
+        key={key}
+        style={{ backgroundColor: isMatched ? "#c6f6d5" : "", padding: "4px" }}
+      >
         <input
           type="text"
           value={isMatched ? "✔" : ""}
@@ -230,12 +272,18 @@ const A1InternshipRequestForm = ({ userRole = "student" }) => {
     //if (!formData.soonerId) newErrors.soonerId = "Sooner ID is required";
     //else if (!numberPattern.test(formData.soonerId)) newErrors.soonerId = "Sooner ID should be numeric";
     if (!formData.interneeEmail) newErrors.interneeEmail = "Email is required";
-    else if (!emailPattern.test(formData.interneeEmail)) newErrors.interneeEmail = "Invalid email format";
-    if (!formData.workplaceName) newErrors.workplaceName = "Workplace name is required";
-    else if (!namePattern.test(formData.workplaceName)) newErrors.workplaceName = "Workplace name should contain only letters and spaces";
-    if (formData.website && !formData.website.includes('.')) newErrors.website = "Please enter a valid website address";
+    else if (!emailPattern.test(formData.interneeEmail))
+      newErrors.interneeEmail = "Invalid email format";
+    if (!formData.workplaceName)
+      newErrors.workplaceName = "Workplace name is required";
+    else if (!namePattern.test(formData.workplaceName))
+      newErrors.workplaceName =
+        "Workplace name should contain only letters and spaces";
+    if (formData.website && !formData.website.includes("."))
+      newErrors.website = "Please enter a valid website address";
     if (!formData.phone) newErrors.phone = "Phone is required";
-    else if (!phonePattern.test(formData.phone)) newErrors.phone = "Phone must be 10 digits";
+    else if (!phonePattern.test(formData.phone))
+      newErrors.phone = "Phone must be 10 digits";
     if (!formData.startDate) newErrors.startDate = "Start date is required";
     if (!formData.endDate) newErrors.endDate = "End date is required";
     if (!formData.advisorName) newErrors.advisorName = "Supervisor name is required";
@@ -254,11 +302,14 @@ const A1InternshipRequestForm = ({ userRole = "student" }) => {
 
   const submitFormData = async () => {
     try {
-      const response = await fetch(`${process.env.REACT_APP_API_URL}/api/form/submit`, {
-        method: "POST",
-        headers: { "Content-Type": "application/json" },
-        body: JSON.stringify(formData),
-      });
+      const response = await fetch(
+        `${process.env.REACT_APP_API_URL}/api/form/submit`,
+        {
+          method: "POST",
+          headers: { "Content-Type": "application/json" },
+          body: JSON.stringify(formData),
+        }
+      );
       if (!response.ok) throw new Error("Failed to submit form");
       const data = await response.json();
       return data;
@@ -270,11 +321,14 @@ const A1InternshipRequestForm = ({ userRole = "student" }) => {
 
   const sendTaskDescriptions = async (descriptions) => {
     try {
-      const response = await fetch(`${process.env.REACT_APP_API_URL}/api/align-outcomes`, {
-        method: "POST",
-        headers: { "Content-Type": "application/json" },
-        body: JSON.stringify({ tasks: descriptions }),
-      });
+      const response = await fetch(
+        `${process.env.REACT_APP_API_URL}/api/align-outcomes`,
+        {
+          method: "POST",
+          headers: { "Content-Type": "application/json" },
+          body: JSON.stringify({ tasks: descriptions }),
+        }
+      );
       if (!response.ok) throw new Error("Failed to send task descriptions");
       const data = await response.json();
       return data.results.map(({ task, matched_outcomes }) => ({
@@ -290,16 +344,27 @@ const A1InternshipRequestForm = ({ userRole = "student" }) => {
   const handleSubmit = async (e) => {
     e.preventDefault();
     if (!validateForm()) return;
-    const taskDescriptions = formData.tasks.map((task) => task.description.trim()).filter(Boolean);
+    const taskDescriptions = formData.tasks
+      .map((task) => task.description.trim())
+      .filter(Boolean);
     try {
       const aligned = await sendTaskDescriptions(taskDescriptions);
       if (aligned && aligned.length > 0) {
         setFormData((prev) => ({ ...prev, tasks: aligned }));
         const submissionResponse = await submitFormData();
-        const recipient = submissionResponse.manual ? "coordinator for manual review!" : "supervisor!";
+        const recipient = submissionResponse.manual
+          ? "coordinator for manual review!"
+          : "supervisor!";
         setSuccessMsg(`Form submitted successfully and sent to ${recipient}`);
         setTimeout(() => setSuccessMsg(""), 15000);
         setFormData(initialState);
+          
+      const timeoutId = setTimeout(() => {
+        navigate('/student-dashboard');
+      }, 1000);
+
+     
+      return () => clearTimeout(timeoutId);
       } else {
         setErrors({ tasks: "Outcome alignment failed or returned no tasks." });
       }
@@ -310,22 +375,22 @@ const A1InternshipRequestForm = ({ userRole = "student" }) => {
 
   useEffect(() => {
     const fonts = [
-      'https://fonts.googleapis.com/css2?family=Dancing+Script:wght@500&display=swap',
-      'https://fonts.googleapis.com/css2?family=Great+Vibes&display=swap',
-      'https://fonts.googleapis.com/css2?family=Pacifico&display=swap',
-      'https://fonts.googleapis.com/css2?family=Satisfy&display=swap',
-      'https://fonts.googleapis.com/css2?family=Caveat:wght@500&display=swap'
+      "https://fonts.googleapis.com/css2?family=Dancing+Script:wght@500&display=swap",
+      "https://fonts.googleapis.com/css2?family=Great+Vibes&display=swap",
+      "https://fonts.googleapis.com/css2?family=Pacifico&display=swap",
+      "https://fonts.googleapis.com/css2?family=Satisfy&display=swap",
+      "https://fonts.googleapis.com/css2?family=Caveat:wght@500&display=swap",
     ];
     const links = [];
-    fonts.forEach(font => {
-      const link = document.createElement('link');
+    fonts.forEach((font) => {
+      const link = document.createElement("link");
       link.href = font;
-      link.rel = 'stylesheet';
+      link.rel = "stylesheet";
       document.head.appendChild(link);
       links.push(link);
     });
     return () => {
-      links.forEach(link => document.head.removeChild(link));
+      links.forEach((link) => document.head.removeChild(link));
     };
   }, []);
 
@@ -354,29 +419,41 @@ const A1InternshipRequestForm = ({ userRole = "student" }) => {
                   // disabled={!isFieldEditable("interneeName")} 
                   disabled
                 />
-                {errors.interneeName && <div style={{ color: "red", fontSize: "0.8rem" }}>{errors.interneeName}</div>}
+                {errors.interneeName && (
+                  <div style={{ color: "red", fontSize: "0.8rem" }}>
+                    {errors.interneeName}
+                  </div>
+                )}
               </td>
               <td colSpan="3">
                 Name<span className="required-asterisk">*</span>:<br />
-                <input 
-                  type="text" 
-                  id="workplaceName" 
-                  value={formData.workplaceName} 
-                  onChange={handleInputChange} 
-                  disabled={!isFieldEditable("workplaceName")} 
+                <input
+                  type="text"
+                  id="workplaceName"
+                  value={formData.workplaceName}
+                  onChange={handleInputChange}
+                  disabled={!isFieldEditable("workplaceName")}
                 />
-                {errors.workplaceName && <div style={{ color: "red", fontSize: "0.8rem" }}>{errors.workplaceName}</div>}
+                {errors.workplaceName && (
+                  <div style={{ color: "red", fontSize: "0.8rem" }}>
+                    {errors.workplaceName}
+                  </div>
+                )}
               </td>
               <td colSpan="2">
                 Name<span className="required-asterisk">*</span>:<br />
-                <input 
-                  type="text" 
-                  id="advisorName" 
-                  value={formData.advisorName} 
-                  onChange={handleInputChange} 
-                  disabled={!isFieldEditable("advisorName")} 
+                <input
+                  type="text"
+                  id="advisorName"
+                  value={formData.advisorName}
+                  onChange={handleInputChange}
+                  disabled={!isFieldEditable("advisorName")}
                 />
-                {errors.advisorName && <div style={{ color: "red", fontSize: "0.8rem" }}>{errors.advisorName}</div>}
+                {errors.advisorName && (
+                  <div style={{ color: "red", fontSize: "0.8rem" }}>
+                    {errors.advisorName}
+                  </div>
+                )}
               </td>
             </tr>
             <tr>
@@ -427,37 +504,49 @@ const A1InternshipRequestForm = ({ userRole = "student" }) => {
                   disabled
                  
                 />
-                {errors.interneeEmail && <div style={{ color: "red", fontSize: "0.8rem" }}>{errors.interneeEmail}</div>}
+                {errors.interneeEmail && (
+                  <div style={{ color: "red", fontSize: "0.8rem" }}>
+                    {errors.interneeEmail}
+                  </div>
+                )}
               </td>
               <td colSpan="3">
                 Phone<span className="required-asterisk">*</span>:<br />
-                <input 
-                  type="text" 
-                  id="phone" 
-                  value={formData.phone} 
-                  onChange={handleInputChange} 
-                  disabled={!isFieldEditable("phone")} 
+                <input
+                  type="text"
+                  id="phone"
+                  value={formData.phone}
+                  onChange={handleInputChange}
+                  disabled={!isFieldEditable("phone")}
                 />
-                {errors.phone && <div style={{ color: "red", fontSize: "0.8rem" }}>{errors.phone}</div>}
+                {errors.phone && (
+                  <div style={{ color: "red", fontSize: "0.8rem" }}>
+                    {errors.phone}
+                  </div>
+                )}
               </td>
               <td colSpan="2">
                 Email<span className="required-asterisk">*</span>:<br />
-                <input 
-                  type="email" 
-                  id="advisorEmail" 
-                  value={formData.advisorEmail} 
-                  onChange={handleInputChange} 
-                  disabled={!isFieldEditable("advisorEmail")} 
+                <input
+                  type="email"
+                  id="advisorEmail"
+                  value={formData.advisorEmail}
+                  onChange={handleInputChange}
+                  disabled={!isFieldEditable("advisorEmail")}
                 />
-                {errors.advisorEmail && <div style={{ color: "red", fontSize: "0.8rem" }}>{errors.advisorEmail}</div>}
+                {errors.advisorEmail && (
+                  <div style={{ color: "red", fontSize: "0.8rem" }}>
+                    {errors.advisorEmail}
+                  </div>
+                )}
               </td>
             </tr>
             <tr>
               <td colSpan="3">
                 Credit Hours<span className="required-asterisk">*</span>:<br />
-                <select 
-                  id="creditHours" 
-                  value={formData.creditHours} 
+                <select
+                  id="creditHours"
+                  value={formData.creditHours}
                   onChange={handleCreditHourChange}
                   disabled={!isFieldEditable("creditHours")}
                 >
@@ -466,47 +555,59 @@ const A1InternshipRequestForm = ({ userRole = "student" }) => {
                   <option value="2">2 Credits</option>
                   <option value="3">3 Credits</option>
                 </select>
-                {errors.creditHours && <div style={{ color: "red", fontSize: "0.8rem" }}>{errors.creditHours}</div>}
+                {errors.creditHours && (
+                  <div style={{ color: "red", fontSize: "0.8rem" }}>
+                    {errors.creditHours}
+                  </div>
+                )}
               </td>
               <td colSpan="3">
-  <label htmlFor="startDate">
-    Start Date<span className="required-asterisk">*</span>:
-  </label><br />
-  <div className="date-input-wrapper">
-    <input 
-      type="date"
-      id="startDate"
-      value={formData.startDate}
-      onChange={handleInputChange}
-      disabled={!isFieldEditable("startDate")}
-    />
-  </div>
-  {errors.startDate && <div className="error-text">{errors.startDate}</div>}
-</td>
-
-<td colSpan="2">
-  <label htmlFor="endDate">
-    End Date<span className="required-asterisk">*</span>:
-  </label><br />
-  <div className="date-input-wrapper">
-    <input
-      type="date"
-      id="endDate"
-      value={formData.endDate}
-      min={formData.startDate}
-      onChange={handleInputChange}
-      disabled={!isFieldEditable("endDate")}
-    />
-  </div>
-  {dateError && <div className="error-text">{dateError}</div>}
-  {errors.endDate && <div className="error-text">{errors.endDate}</div>}
-</td>
+                <label htmlFor="startDate">
+                  Start Date<span className="required-asterisk">*</span>:
+                </label>
+                <br />
+                <div className="date-input-wrapper">
+                  <input
+                    type="date"
+                    id="startDate"
+                    value={formData.startDate}
+                    onChange={handleInputChange}
+                    disabled={!isFieldEditable("startDate")}
+                  />
+                </div>
+                {errors.startDate && (
+                  <div className="error-text">{errors.startDate}</div>
+                )}
+              </td>
 
+              <td colSpan="2">
+                <label htmlFor="endDate">
+                  End Date<span className="required-asterisk">*</span>:
+                </label>
+                <br />
+                <div className="date-input-wrapper">
+                  <input
+                    type="date"
+                    id="endDate"
+                    value={formData.endDate}
+                    min={formData.startDate}
+                    onChange={handleInputChange}
+                    disabled={!isFieldEditable("endDate")}
+                  />
+                </div>
+                {dateError && <div className="error-text">{dateError}</div>}
+                {errors.endDate && (
+                  <div className="error-text">{errors.endDate}</div>
+                )}
+              </td>
             </tr>
           </tbody>
         </table>
 
-        <h3 className="section-title">Task Details & Program Outcomes<span className="required-asterisk">*</span></h3>
+        <h3 className="section-title">
+          Task Details & Program Outcomes
+          <span className="required-asterisk">*</span>
+        </h3>
         <div className="table-box">
           <div className="job-description-box">
             <strong>Job Description Details:</strong>
@@ -522,7 +623,8 @@ const A1InternshipRequestForm = ({ userRole = "student" }) => {
                 <th style={{ width: "20%" }}>Task</th>
                 {outcomeLabels.map((label, j) => (
                   <th key={`label-${j}`} style={{ width: "13.33%" }}>
-                    {label}<br />
+                    {label}
+                    <br />
                     <small>({outcomeDescriptions[j]})</small>
                   </th>
                 ))}
@@ -537,16 +639,26 @@ const A1InternshipRequestForm = ({ userRole = "student" }) => {
                       placeholder={`Task ${i + 1}`}
                       value={task.description}
                       onChange={(e) => handleTaskChange(i, e.target.value)}
-                      style={{ width: "100%", padding: "4px", boxSizing: "border-box" }}
+                      style={{
+                        width: "100%",
+                        padding: "4px",
+                        boxSizing: "border-box",
+                      }}
                       disabled={!isFieldEditable("task")}
                     />
                   </td>
-                  {outcomeLabels.map((label, j) => renderOutcomeCell(task, label, `${i}-${j}`))}
+                  {outcomeLabels.map((label, j) =>
+                    renderOutcomeCell(task, label, `${i}-${j}`)
+                  )}
                 </tr>
               ))}
             </tbody>
           </table>
-          {errors.tasks && <div style={{ color: "red", fontSize: "0.8rem", marginTop: "5px" }}>{errors.tasks}</div>}
+          {errors.tasks && (
+            <div style={{ color: "red", fontSize: "0.8rem", marginTop: "5px" }}>
+              {errors.tasks}
+            </div>
+          )}
         </div>
 
         <h3 className="section-title">Signatures:</h3>
@@ -556,7 +668,7 @@ const A1InternshipRequestForm = ({ userRole = "student" }) => {
               <td className="signature-cell" colSpan="1">
                 Internee Signature<span className="required-asterisk">*</span>:<br />
                 <div className="signature-field">
-                  <SignatureInput 
+                  <SignatureInput
                     id="interneeSignature"
                     value={formData.interneeSignature}
                     onChange={handleInputChange}
@@ -564,7 +676,11 @@ const A1InternshipRequestForm = ({ userRole = "student" }) => {
                     placeholder="Enter your full name"
                   />
                 </div>
-                {errors.interneeSignature && <div style={{ color: "red", fontSize: "0.8rem" }}>{errors.interneeSignature}</div>}
+                {errors.interneeSignature && (
+                  <div style={{ color: "red", fontSize: "0.8rem" }}>
+                    {errors.interneeSignature}
+                  </div>
+                )}
               </td>
               </tr>
           </tbody>
@@ -581,4 +697,4 @@ const A1InternshipRequestForm = ({ userRole = "student" }) => {
   );
 };
 
-export default A1InternshipRequestForm;
\ No newline at end of file
+export default A1InternshipRequestForm;
diff --git a/client/src/pages/About.js b/client/src/pages/About.js
new file mode 100644
index 000000000..346545515
--- /dev/null
+++ b/client/src/pages/About.js
@@ -0,0 +1,69 @@
+import React from "react";
+import "../styles/About.css";
+import bannerImg from "../img/ipms-banner.jpg";
+import studentImg from '../img/student.jpg';
+import supervisorImg from '../img/supervisor.jpg';
+import coordinatorImg from '../img/coordinator.jpg';
+
+const About = () => {
+  return (
+    <div className="about-wrapper">
+      <h1 className="about-heading">About IPMS</h1>
+
+      <img src={bannerImg} alt="IPMS banner" className="about-banner" />
+
+      <p className="about-summary">
+        The <strong>Internship Program Management System (IPMS)</strong> is an all-in-one solution designed to streamline and support every stage of the Computer Science internship experience at the University of Oklahoma.
+      </p>
+
+      <div className="section">
+        <div className="feature-cards">
+          <div className="feature-card">
+            <span className="icon">🔐</span>
+            <h3>Role-based Login</h3>
+            <p>Students, supervisors, and coordinators get access to tools tailored to their role.</p>
+          </div>
+          <div className="feature-card">
+            <span className="icon">🧾</span>
+            <h3>Token-based Authentication</h3>
+            <p>Secure token login system — no passwords. Tokens last the full semester.</p>
+          </div>
+          <div className="feature-card">
+            <span className="icon">🔄</span>
+            <h3>Streamlined Communication</h3>
+            <p>Automatic reminders and workflows connect all users seamlessly.</p>
+          </div>
+        </div>
+      </div>
+
+      <div className="section">
+        <h2 className="section-heading">Who Uses IPMS?</h2>
+        <div className="user-role-cards">
+          <div className="user-card">
+          <img src={studentImg} alt="student" className="user-card" />
+            <h4>Students</h4>
+            <p>Submit requests, track weekly progress, and complete your internship journey.</p>
+          </div>
+          <div className="user-card">
+          <img src={supervisorImg} alt="supervisor" className="user-card" />
+            <h4>Supervisors</h4>
+            <p>Review forms, approve progress, and evaluate student performance.</p>
+          </div>
+          <div className="user-card">          
+            <img src={coordinatorImg} alt="Coordinator" className="user-card" />
+            <h4>Coordinators</h4>
+            <p>Oversee submissions, grade final reports, and manage workflows.</p>
+          </div>
+        </div>
+      </div>
+
+      <div className="cta-footer">
+        <h3>Get in Touch</h3>
+        <p>Interested in learning more or need assistance? Contact us!</p>
+        <a href="/contact" className="cta-button">Contact Page</a>
+      </div>
+    </div>
+  );
+};
+
+export default About;
\ No newline at end of file
diff --git a/client/src/pages/Contact.js b/client/src/pages/Contact.js
new file mode 100644
index 000000000..9de515013
--- /dev/null
+++ b/client/src/pages/Contact.js
@@ -0,0 +1,91 @@
+import React from "react";
+import "../styles/Contact.css";
+import MansoorImage from "../img/mansoor.jpg";
+import ContactIcon, { IconComponent } from "../Icons/ContactIcon";
+
+const teamMembers = [
+  {
+    name: "Gladis Menachery Sunny",
+    email: "Gladis.Menachery.Sunny-1@ou.edu",
+    role: "Token Generation and Login"
+  },
+  {
+    name: "Ravichandra Reddy",
+    email: "Ravichandra.Reddy.Mulagondla-1@ou.edu",
+    role: "A.1 Form"
+  },
+  {
+    name: "Naveena Suddapalli",
+    email: "Naveena.Suddapalli-1@ou.edu",
+    role: "A.2 Weekly Report"
+  },
+  {
+    name: "Saketh Reddy Aredla",
+    email: "Saketh.Reddy.Aredla-1@ou.edu",
+    role: "A.3 Form"
+  },
+  {
+    name: "Rahul Juluru",
+    email: "Rahul.Juluru-1@ou.edu",
+    role: "Supervisor approval workflow"
+  },
+  {
+    name: "Narayana Phani Charan Nimmagadda",
+    email: "Narayana.Phani.Charan.Nimmagadda-1@ou.edu",
+    role: "Coordinator Approval workflow"
+  },
+];
+
+const MansoorEmail = "Mansoor.A.Abdulhak-1@ou.edu";
+const AssistantEmail = "Oluwasijibomi.Ajisegiri@ou.edu";
+
+const Contact = () => {
+  return (
+    <div className="contact-container">
+      <h1 className="contact-heading">Contact Us</h1>
+
+      {/* Academic Contact */}
+      <div className="contact-card">
+        <img src={MansoorImage} alt="Dr. Mansoor Abdulhak" className="contact-image" />
+        <div className="contact-info">
+          <h2>Dr. Mansoor Abdulhak</h2>
+          <p>Assistant Professor, University of Oklahoma</p>
+          <p>📧 <a href={`mailto=${MansoorEmail}`}>{MansoorEmail}</a></p>
+          <p>📞 (405) 325-5408</p>
+          <p>🏢 Devon Energy Hall, 234</p>
+        </div>
+      </div>
+
+      {/* Teaching Assistant */}
+      <div className="contact-card">
+        <ContactIcon IconComponent={() => <IconComponent className="team-icon" />} />
+        <div className="contact-info">
+          <h4>SJ Ajisegiri</h4>
+          <p>Teaching Assistant</p>
+          <p>📧 <a href={`mailto:${AssistantEmail}`}>{AssistantEmail}</a></p>
+        </div>
+      </div>
+
+      {/* Technical Support */}
+      <div className="tech-support-card">
+        <h2>Technical Support – Team G</h2>
+        <div className="team-grid">
+          {teamMembers.map(({ name, email, role }) => (
+            <div key={email} className="team-member">
+              <ContactIcon IconComponent={() => <IconComponent className="team-icon" />} />
+              <div>
+                <h6>{name}</h6>
+                <p>{role}</p>
+                <p>
+                  📧 <a href={`mailto:${email}`}>{email}</a>
+                </p>
+              </div>
+            </div>
+          ))}
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export default Contact;
\ No newline at end of file
diff --git a/client/src/pages/Home.js b/client/src/pages/Home.js
index ffe18418f..5f27617b0 100644
--- a/client/src/pages/Home.js
+++ b/client/src/pages/Home.js
@@ -37,7 +37,6 @@ function Home() {
 
     const { email: ouEmail, password, role } = formData;
 
-
     if (!ouEmail || !password || !role) {
       return Swal.fire({
         icon: "warning",
@@ -55,31 +54,34 @@ function Home() {
             "Content-Type": "application/json",
           },
           body: JSON.stringify({ ouEmail, password, role }),
-        },
+        }
       );
 
       const data = await response.json();
 
       if (response.ok) {
         const user = data.user;
-        if(role === "student"){
-           // Store only required fields
-        const limitedUserInfo = {
-          fullName: user.fullName,
-          id: user._id,
-          email:user.ouEmail
-        };
-        
-        localStorage.setItem("ipmsUser", JSON.stringify(limitedUserInfo));
-        navigate("/student-dashboard");
-        }else if(role === "supervisor"){
+        if (role === "student") {
+          // Store only required fields
+          const limitedUserInfo = {
+            fullName: user.fullName,
+            id: user._id,
+            email: user.ouEmail,
+            academicAdvisor: user.academicAdvisor,
+            semester: user.semester,
+          };
+
+          localStorage.setItem("ipmsUser", JSON.stringify(limitedUserInfo));
+          localStorage.setItem("ouEmail", user.ouEmail);
+          navigate("/student-dashboard");
+        } else if (role === "supervisor") {
           Swal.fire({
             icon: "success",
             title: "Login Successful 🌟",
             text: `Welcome back, ${role}!`,
           });
           navigate("/supervisor-dashboard");
-        }else{
+        } else {
           Swal.fire({
             icon: "success",
             title: "Login Successful 🌟",
@@ -88,23 +90,21 @@ function Home() {
           navigate("/coordinator-dashboard");
         }
 
-       
-
         // Swal.fire({
         //   icon: "success",
         //   title: "Login Successful",
         //   text: `Welcome back, `,
         // });
-
-       
       } else {
         Swal.fire({
           icon: "error",
           title: "Login Failed",
-          html: data.message + " " + 
-        (data.renewalLink 
-         ? `Please click <a href="${data.renewalLink}" target="_blank" rel="noopener noreferrer">here</a> to request a new token.` 
-         : "Something went wrong."),
+          html:
+            data.message +
+            " " +
+            (data.renewalLink
+              ? `Please click <a href="${data.renewalLink}" target="_blank" rel="noopener noreferrer">here</a> to request a new token.`
+              : "Something went wrong."),
         });
       }
     } catch (error) {
@@ -151,7 +151,6 @@ function Home() {
                         role: r,
                       })
                     }
-                
                   >
                     <Icon />
                     <p className="role-label">
@@ -219,16 +218,7 @@ function Home() {
                 <input type="checkbox" style={{ marginRight: "6px" }} />
                 Remember me
               </label>
-              <Link
-                to="/"
-                style={{
-                  color: "#7f1d1d",
-                  fontWeight: "500",
-                  textDecoration: "underline",
-                }}
-              >
-                Forgot password?
-              </Link>
+              
             </div>
 
             <button type="submit" className="login-button">
diff --git a/client/src/pages/StudentDashboard.jsx b/client/src/pages/StudentDashboard.jsx
index 276bbb651..68968e16f 100644
--- a/client/src/pages/StudentDashboard.jsx
+++ b/client/src/pages/StudentDashboard.jsx
@@ -1,136 +1,308 @@
 import React, { useEffect, useState } from "react";
 import { useNavigate } from "react-router-dom";
-import "../styles/StudentDashboard.css"; // Make sure you create this CSS
+import "../styles/StudentDashboard.css";
+import Swal from "sweetalert2";
 
 const StudentDashboard = () => {
   const navigate = useNavigate();
-
   const user = JSON.parse(localStorage.getItem("ipmsUser"));
   const ouEmail = user?.email;
+  const backendUrl = process.env.REACT_APP_API_URL;
+  const studentId = localStorage.getItem("studentId");
+
   const [approvalStatus, setApprovalStatus] = useState("not_submitted");
+  const [submissions, setSubmissions] = useState([]);
 
   useEffect(() => {
-    const fetchData = async () => {
+    
+    const fetchA1Status = async () => {
       try {
-        const res = await fetch(`${process.env.REACT_APP_API_URL}/api/student`, {
+        const res = await fetch(`${backendUrl}/api/student`, {
           method: "POST",
+          headers: { "Content-Type": "application/json" },
+          body: JSON.stringify({ ouEmail: user?.email }),
+        });
+        const data = await res.json();
+        setApprovalStatus(data.approvalStatus);
+      } catch (err) {
+        console.error("Error fetching A1 status:", err);
+      }
+    };
+
+    const fetchSubmissions = async () => {
+      try {
+        const res = await fetch(`${backendUrl}/api/student/submissions`, {
+          method: "GET",
           headers: {
             "Content-Type": "application/json",
+            "ipms-user": JSON.stringify({
+              _id: studentId,
+              role: "student",
+            }),
           },
-          body: JSON.stringify({ ouEmail }),
         });
-
         const data = await res.json();
-        setApprovalStatus(data.approvalStatus);
+        setSubmissions(data);
       } catch (err) {
-        console.error("Error fetching internship data", err);
+        console.error("Error fetching submissions:", err);
       }
     };
 
-    if (ouEmail) {
-      fetchData();
+    if (user?.email) {
+      fetchA1Status();
+      fetchSubmissions();
+    }
+  }, [user?.email, studentId, backendUrl]);
+
+  const handleResend = async (id) => {
+    try {
+      const res = await fetch(`${backendUrl}/api/coordinator/request/${id}/resend`, {
+        method: "POST",
+      });
+      if (res.ok) alert("Resent to coordinator!");
+    } catch (err) {
+      alert("Error resending.");
+    }
+  };
+
+  const handleDelete = async (id) => {
+    if (!window.confirm("Are you sure you want to delete this request?")) return;
+    try {
+      const res = await fetch(`${backendUrl}/api/student/request/${id}/delete`, {
+        method: "DELETE",
+        headers: {
+          "Content-Type": "application/json",
+          "ipms-user": JSON.stringify({ _id: studentId, role: "student" }),
+        },
+      });
+      if (res.ok) {
+        alert("Deleted successfully.");
+        setSubmissions((prev) => prev.filter((s) => s._id !== id));
+      }
+    } catch (err) {
+      alert("Error deleting.");
     }
-  }, [ouEmail]);
-  console.log(approvalStatus);
+  };
+
+
+  const handleAccountDelete = async () => {
+    Swal.fire({
+      title: "Are you sure?",
+      text: "Your account will be permanently deleted. This cannot be undone!",
+      icon: "warning",
+      showCancelButton: true,
+      confirmButtonColor: "#e45858",
+      cancelButtonColor: "#3085d6",
+      confirmButtonText: "Yes, delete my account"
+    }).then(async (result) => {
+      if (result.isConfirmed) {
+        try {
+          // Make API call to delete account
+          const res = await fetch(`${backendUrl}/api/token/delete`, {
+            method: "DELETE",
+            headers: {
+              "Content-Type": "application/json",
+            },
+            body: JSON.stringify({ ouEmail }),
+          });
+          const data = await res.json();
+          if (res.ok) {
+           
+            Swal.fire("Deleted!", data.message || "Your account has been deleted.", "success")
+              .then(() => {
+                // Redirect to login page
+                navigate("/", { replace: true });
+                // Optionally, force reload to clear history stack
+                window.location.reload();
+              });
+          } else {
+            Swal.fire("Error", data.error || "Account deletion failed.", "error");
+          }
+        } catch (err) {
+          Swal.fire("Error", "Account deletion failed.", "error");
+        }
+      }
+    });
+  };
+
+console.log(approvalStatus)
 
   return (
     <div className="student-dashboard">
-      <div className="dashboard-header">
-        <h2>Welcome, {user.fullName}</h2>
-      </div>
+      
 
       <div className="dashboard-card">
-        {/* ------ FORM A1 Card ------ */}
+      <div
+          className="container-fluid p-4 mb-4"
+          style={{
+            background: "#842020",
+            borderRadius: "15px",
+            marginTop: "20px",
+          }}
+        >
+          <div className="d-flex align-items-center">
+            {/* Avatar Icon */}
+            <div
+              className="rounded-circle bg-light d-flex align-items-center justify-content-center"
+              style={{ width: 250, height: 250, marginRight: 50 }}
+            >
+              {/* Bootstrap "person" icon, can use font-awesome as well */}
+              <svg
+                xmlns="http://www.w3.org/2000/svg"
+                width="140"
+                height="140"
+                fill="#90313A"
+                className="bi bi-person"
+                viewBox="0 0 16 16"
+              >
+                <path d="M8 8a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm4-3a4 4 0 1 1-8 0 4 4 0 0 1 8 0zm2 8c0 1-1 2-6 2s-6-1-6-2 1-2 6-2 6 1 6 2zm-1.995-.15c-.977-.211-2.488-.35-4.005-.35-1.517 0-3.028.139-4.005.35C2.523 12.368 4.033 13 8 13s5.477-.632 5.995-1.15z" />
+              </svg>
+            </div>
+            {/* Student Info */}
+            <div>
+              <h1 className="text-white fw-bold" style={{ fontSize: "3rem" }}>
+                {user.fullName}
+              </h1>
+              <div className="mt-3">
+                <span
+                  className="badge rounded-pill px-4 py-2"
+                  style={{ background: "#712622", fontSize: "1.7rem" }}
+                >
+                  Advisor: [{user.academicAdvisor}]
+                </span>
+              </div>
+              <div className="mt-3">
+                <span
+                  className="badge rounded-pill px-4 py-2"
+                  style={{ background: "#712622", fontSize: "1.7rem" }}
+                >
+                  Semester: [{user.semester}]
+                </span>
+              </div>
+            </div>
+          </div>
+        </div>
+        {/* FORM A1 Card */}
         <div className="card-section">
           <div className="card-content">
             <h3>Request Internship (FORM A1)</h3>
-            <p>Track your internship journey</p>
-
-            {approvalStatus === "not_submitted" && (
-              <p style={{ fontSize: "0.85rem", color: "#888" }}>
-                You have not submitted the form yet
-              </p>
-            )}
-
-            {(approvalStatus === "submitted" ||
-              approvalStatus === "pending manual review") && (
-              <p style={{ fontSize: "0.85rem", color: "#888" }}>
-                Your form is submitted and under review
-              </p>
-            )}
-
-            {approvalStatus === "approved" && (
-              <p style={{ fontSize: "0.85rem", color: "green" }}>Approved</p>
-            )}
+            <p>Status: {approvalStatus.replace("_", " ")}</p>
           </div>
-
           <button
             className="card-button"
             onClick={() => {
-              if (
-                approvalStatus === "draft" ||
-                approvalStatus === "not_submitted"
-              ) {
+              
                 navigate("/a1-form");
-              }
+              
             }}
             disabled={
-              approvalStatus !== "draft" && approvalStatus !== "not_submitted"
+              approvalStatus === "pending" ||
+              approvalStatus === "approved"
             }
-            style={{
-              backgroundColor:
-                approvalStatus !== "draft" && approvalStatus !== "not_submitted"
-                  ? "#ccc"
-                  : "",
-              cursor:
-                approvalStatus !== "draft" && approvalStatus !== "not_submitted"
-                  ? "not-allowed"
-                  : "pointer",
-            }}
           >
-            {approvalStatus === "approved" ? "Track" : "Request Internship"}
+            {approvalStatus === "approved" ? "Approved"  : approvalStatus === "pending" ? "Under Review" : "Request Internship"}
           </button>
         </div>
 
-        {/* ------ FORM A2 Card ------ */}
+        {/* FORM A2 Card */}
         <div className="card-section">
           <div className="card-content">
-            <h3>Weekly Report (Form A2)</h3>
-
-            {approvalStatus === "not_submitted" && (
-              <p style={{ fontSize: "0.85rem", color: "#888" }}>
-                Please fill your Form A1 first
-              </p>
-            )}
-
-            {approvalStatus === "draft" && (
-              <p style={{ fontSize: "0.85rem", color: "#888" }}>
-                Finish your Form A1 first
-              </p>
-            )}
-
-            {(approvalStatus === "submitted" ||
-              approvalStatus === "pending manual review") && (
-              <p style={{ fontSize: "0.85rem", color: "#888" }}>
-                Wait for your Form A1 to be approved
-              </p>
-            )}
+            <h3>Weekly Report (FORM A2)</h3>
+            <p>
+              {approvalStatus === "approved"
+                ? "You may now submit weekly reports"
+                : "Finish Form A1 approval first"}
+            </p>
           </div>
-
           <button
             className="card-button"
             disabled={approvalStatus !== "approved"}
-            onClick={() => {
-              if (approvalStatus === "approved") {
-                navigate("/weekly-report");
-              }
-            }}
+            onClick={() => navigate("/weekly-report")}
+          >
+            Request
+          </button>
+        </div>
+      </div>
+
+      {/* Submissions Section */}
+      <div className="submission-section">
+        <h3>My Submissions</h3>
+        {submissions.length === 0 ? (
+          <p>No submissions yet.</p>
+        ) : (
+          <table className="submission-table">
+            <thead>
+              <tr>
+                <th>Form</th>
+                <th>Supervisor Status</th>
+                <th>Coordinator Status</th>
+                <th>Actions</th>
+              </tr>
+            </thead>
+            <tbody>
+              {submissions.map((s) => (
+                <tr key={s._id}>
+                  <td>{s.form_type}</td>
+                  <td>{s.supervisor_status}</td>
+                  <td>{s.coordinator_status}</td>
+                  <td>
+                    {s.supervisor_status === "approved" &&
+                    s.coordinator_status === "pending" ? (
+                      <>
+                        <button onClick={() => handleResend(s._id)}>
+                          Resend
+                        </button>
+                        <button onClick={() => handleDelete(s._id)}>
+                          Delete
+                        </button>
+                      </>
+                    ) : (
+                      "—"
+                    )}
+                  </td>
+                </tr>
+              ))}
+            </tbody>
+          </table>
+        )}
+             <div className="d-flex justify-content-center mt-4">
+          <button
+            type="button"
+            className="btn btn-outline-danger w-100"
             style={{
-              backgroundColor: approvalStatus !== "approved" ? "#ccc" : "",
-              cursor: approvalStatus !== "approved" ? "not-allowed" : "pointer",
+              borderWidth: "3px",
+              borderRadius: "8px",
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center",
+              gap: "12px",
+              padding: "0.5rem 0",
+              maxWidth: "100%",
+              cursor:"pointer"
             }}
+            onClick={handleAccountDelete}
           >
-            Request
+            {/* Trash SVG icon */}
+            <svg
+              width="20"
+              height="20"
+              viewBox="0 0 24 24"
+              fill="#e45858"
+              xmlns="http://www.w3.org/2000/svg"
+              style={{ marginRight: "10px" }}
+            >
+              <path
+                d="M3 6h18M9 6V4a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v2m2 0v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6h14z"
+                stroke="#e45858"
+                strokeWidth="2"
+                strokeLinecap="round"
+                strokeLinejoin="round"
+                fill="none"
+              />
+            </svg>
+            <span style={{ color: "#e45858", fontWeight: 500 }}>
+              Delete My Account
+            </span>
           </button>
         </div>
       </div>
@@ -138,4 +310,4 @@ const StudentDashboard = () => {
   );
 };
 
-export default StudentDashboard;
+export default StudentDashboard;
\ No newline at end of file
diff --git a/client/src/router.js b/client/src/router.js
index 2dba3de27..a41675cf9 100644
--- a/client/src/router.js
+++ b/client/src/router.js
@@ -19,6 +19,8 @@ import CoordinatorRequestDetailView from "./pages/CoordinatorRequestDetailView";
 import TokenRenewal from "./pages/TokenRenewal";
 import StudentDashboard from "./pages/StudentDashboard";
 import ProtectedRouteStudent from "./pages/ProtectedRouteStudent";
+import About from "./pages/About";
+import Contact from "./pages/Contact";
 import WeeklyFourWeekReportForm from "./pages/WeeklyFourWeekReportForm";
 import SubmittedReports from "./pages/SubmittedReports";
 import CumulativeReviewForm from "./pages/CumulativeReviewForm";
@@ -84,6 +86,14 @@ const router = createBrowserRouter([
         path: "renew-token/:token",
         element: <TokenRenewal />,
       },
+      {
+        path: "about",
+        element: <About />,
+      },
+      {
+        path: "contact",
+        element: <Contact />,
+      },
       {
         path: "four-week-report",
         element: <WeeklyFourWeekReportForm />,
diff --git a/client/src/styles/About.css b/client/src/styles/About.css
new file mode 100644
index 000000000..4a6ba6b8c
--- /dev/null
+++ b/client/src/styles/About.css
@@ -0,0 +1,112 @@
+  .about-wrapper {
+    max-width: 1100px;
+    margin: auto;
+    padding: 2rem;
+    font-family: 'Segoe UI', sans-serif;
+    color: #333;
+  }
+  
+  .about-heading {
+    text-align: center;
+    font-size: 2.8rem;
+    margin-bottom: 1rem;
+    color: #2a4d69;
+  }
+  
+  .about-banner {
+    width: 100%;
+    height: auto;
+    border-radius: 8px;
+    margin-bottom: 1.5rem;
+  }
+  
+  .about-summary {
+    font-size: 1.1rem;
+    text-align: center;
+    margin-bottom: 2rem;
+    line-height: 1.6;
+  }
+  
+  .section {
+    margin-bottom: 3rem;
+  }
+  
+  .feature-cards {
+    display: flex;
+    gap: 1.5rem;
+    justify-content: space-around;
+    flex-wrap: wrap;
+  }
+  
+  .feature-card {
+    background: #fff;
+    border: 1px solid #ddd;
+    border-radius: 12px;
+    padding: 1.5rem;
+    width: 300px;
+    text-align: center;
+    box-shadow: 0 4px 8px rgba(0,0,0,0.05);
+    transition: 0.3s ease;
+  }
+  
+  .feature-card:hover {
+    box-shadow: 0 6px 15px rgba(0,0,0,0.1);
+  }
+  
+  .feature-card .icon {
+    font-size: 3rem;
+    margin-bottom: 0.5rem;
+  }
+  
+  .section-heading {
+    text-align: center;
+    font-size: 1.8rem;
+    margin-bottom: 1rem;
+  }
+  
+  .user-role-cards {
+    display: flex;
+    justify-content: space-around;
+    gap: 1.5rem;
+    flex-wrap: wrap;
+  }
+  
+  .user-card {
+    background: #fff;
+    padding: 1.2rem;
+    text-align: center;
+    border-radius: 12px;
+    border: 1px solid #ddd;
+    width: 250px;
+    box-shadow: 0 4px 8px rgba(0,0,0,0.05);
+  }
+  
+  .user-card img {
+    width: 200px;
+    margin-bottom: 0.8rem;
+  }
+  
+  .cta-footer {
+    background-color: #8b0000;
+    color: white;
+    text-align: center;
+    padding: 2rem;
+    border-radius: 8px;
+  }
+  
+  .cta-button {
+    display: inline-block;
+    margin-top: 1rem;
+    padding: 0.8rem 1.6rem;
+    background: white;
+    color: #8b0000;
+    text-decoration: none;
+    font-weight: bold;
+    border-radius: 6px;
+    transition: background 0.3s ease;
+  }
+  
+  .cta-button:hover {
+    background: #f0f0f0;
+  }
+  
\ No newline at end of file
diff --git a/client/src/styles/Contact.css b/client/src/styles/Contact.css
new file mode 100644
index 000000000..e1f1dc745
--- /dev/null
+++ b/client/src/styles/Contact.css
@@ -0,0 +1,80 @@
+.contact-container {
+  max-width: 900px;
+  margin: 0 auto;
+  padding: 2rem;
+  font-family: 'Segoe UI', sans-serif;
+  background-color: #f9f9fb;
+}
+
+.contact-heading {
+  text-align: center;
+  font-size: 2.5rem;
+  margin-bottom: 2rem;
+  color: #222;
+}
+
+.contact-card,
+.tech-support-card {
+  background: #fff;
+  border-radius: 12px;
+  padding: 1.5rem;
+  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
+  margin-bottom: 1.5rem;
+}
+
+.contact-card {
+  display: flex;
+  align-items: center;
+  gap: 1.5rem;
+}
+
+.contact-image {
+  width: 160px;
+  height: 160px;
+  border-radius: 50%;
+  object-fit: cover;
+}
+
+.contact-info {
+  flex: 1;
+}
+
+.contact-info h2 {
+  margin-bottom: 0.25rem;
+  color: #222;
+}
+
+.contact-info a {
+  color: #9d2235;
+  text-decoration: none;
+}
+
+.contact-info a:hover {
+  text-decoration: underline;
+}
+
+.team-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(375px, 1fr));
+  gap: 1.2rem;
+  margin-top: 1rem;
+}
+
+.team-member {
+  display: flex;
+  align-items: center;
+  gap: 0.8rem;
+}
+
+.team-name {
+  font-weight: 600;
+  color: #333;
+}
+
+.team-icon {
+  width: 114px;
+  height: 133px;
+  fill: #8a1c1c;
+  flex-shrink: 0;
+  display: block;
+}
\ No newline at end of file
diff --git a/server/models/TokenRequest.js b/server/models/TokenRequest.js
index d7b52670e..2b76e0a77 100644
--- a/server/models/TokenRequest.js
+++ b/server/models/TokenRequest.js
@@ -21,8 +21,7 @@ const mongoose = require('mongoose');
  * - deletedAt: Marks soft deletion if the student cancels.
  * - status: Optional string enum for tracking token state.
  * - activationLinkSentAt: Timestamp when the activation email was sent.
- * - password: Encrypted password for login authentication.
-
+ *
  * Additional Features:
  * - Automatically sets `expiresAt` to 6 months from `requestedAt`.
  * - Uses `timestamps` to auto-generate `createdAt` and `updatedAt`.
@@ -79,10 +78,11 @@ const userTokenRequestSchema = new mongoose.Schema(
     },
     token: {
       type: String,
-      required: [true, 'Token is required'],
-      unique: true,
+      required: function () {
+        return this.role === "student";
+      },
+      // Note: unique index will be handled separately below
     },
-  
     isActivated: {
       type: Boolean,
       default: false,
@@ -105,7 +105,7 @@ const userTokenRequestSchema = new mongoose.Schema(
     },
     status: {
       type: String,
-      enum: ['pending', 'activated', 'expired', 'deleted','deactivated'],
+      enum: ['pending', 'activated', 'expired', 'deleted', 'deactivated'],
       default: 'pending',
     },
   },
@@ -114,6 +114,20 @@ const userTokenRequestSchema = new mongoose.Schema(
   }
 );
 
+userTokenRequestSchema.index(
+  { token: 1 },
+  {
+    unique: true,
+    partialFilterExpression: { isStudent: true, token: { $exists: true, $ne: null } }
+  }
+);
+userTokenRequestSchema.index(
+  { soonerId: 1 },
+  {
+    unique: true,
+    partialFilterExpression: { isStudent: true, soonerId: { $exists: true, $ne: null } }
+  }
+);
 // Automatically set expiresAt to 5 days after requestedAt
 userTokenRequestSchema.pre('save', function (next) {
   if (!this.expiresAt) {
@@ -124,12 +138,16 @@ userTokenRequestSchema.pre('save', function (next) {
   next();
 });
 
+// Auto-expire unactivated requests after 5 days
 userTokenRequestSchema.index(
   { requestedAt: 1 },
   {
-    expireAfterSeconds: 432000,
+    expireAfterSeconds: 432000, // 5 days
     partialFilterExpression: { isActivated: false },
   }
 );
 
-module.exports = mongoose.model('UserTokenRequest', userTokenRequestSchema);
\ No newline at end of file
+// ✅ NEW: Make token unique only if token exists (Partial Unique Index)
+
+
+module.exports = mongoose.model('UserTokenRequest', userTokenRequestSchema);
diff --git a/server/models/User.js b/server/models/User.js
index 59aecfdd8..ee8181c4c 100644
--- a/server/models/User.js
+++ b/server/models/User.js
@@ -18,6 +18,9 @@ const userSchema = new mongoose.Schema({
     type: String,
     required: true,
   },
+  soonerId: {
+    type: String,
+  },
   createdAt: {
     type: Date,
     default: Date.now,
@@ -25,4 +28,3 @@ const userSchema = new mongoose.Schema({
 });
 
 module.exports = mongoose.model("User", userSchema);
-
diff --git a/server/routes/studentRoutes.js b/server/routes/studentRoutes.js
index 26716b7c2..70311336e 100644
--- a/server/routes/studentRoutes.js
+++ b/server/routes/studentRoutes.js
@@ -4,27 +4,31 @@ const InternshipRequest = require("../models/InternshipRequest");
 const User = require("../models/User");
 const TokenRequest = require("../models/TokenRequest");
 
-
 // GET internship request by student's ouEmail
 router.post("/", async (req, res) => {
   const { ouEmail } = req.body;
   console.log("Received email:", ouEmail);
 
   try {
-    const studentUser = await TokenRequest.findOne({ ouEmail });
-
-    if (!studentUser) {
-      return res.status(404).json({ message: "Student not found in TokenRequest" });
-    }
-
-    const internshipData = await InternshipRequest.findOne({ student: studentUser._id });
+    const internshipData = await InternshipRequest.findOne({
+      "student.email": ouEmail,
+    });
+    
 
     if (!internshipData) {
       // No record found, return a specific flag
-      return res.status(200).json({ message: "No internship request found", approvalStatus: "not_submitted" });
+      return res.status(200).json({
+        message: "No internship request found",
+        approvalStatus: "not_submitted",
+      });
     }
+    const { supervisor_status, coordinator_status } = internshipData;
+
 
-    const approvalStatus = internshipData.status;
+    const approvalStatus =
+      (supervisor_status == "pending" || supervisor_status == "approved" ) ? supervisor_status : coordinator_status
+    
+    console.log(supervisor_status, coordinator_status)
 
     return res.status(200).json({ message: "Success", approvalStatus });
   } catch (error) {
@@ -33,6 +37,54 @@ router.post("/", async (req, res) => {
   }
 });
 
-  
+// Fetch interneeName, soonerId, interneeEmail by OU email passed as query string
+router.get("/me", async (req, res) => {
+  const { ouEmail } = req.query;
+  if (!ouEmail) {
+    return res
+      .status(400)
+      .json({ message: "Missing query parameter: ouEmail" });
+  }
+
+  try {
+    // look in the TokenRequest collection where your student doc lives
+    const student = await TokenRequest.findOne({ ouEmail }).select(
+      "fullName soonerId ouEmail"
+    );
+
+    if (!student) {
+      return res.status(404).json({ message: "Student not found" });
+    }
+
+    return res.json({
+      interneeName: student.fullName,
+      soonerId: student.soonerId,
+      interneeEmail: student.ouEmail,
+    });
+  } catch (err) {
+    console.error("Error in GET /api/student/me:", err);
+    return res.status(500).json({ message: "Server error" });
+  }
+});
+
+// DELETE /api/student/account/:id
+router.delete("/account/:id", async (req, res) => {
+  try {
+    const studentId = req.params.id;
+
+    await TokenRequest.findByIdAndDelete(studentId);
+
+    await InternshipRequest.deleteMany({ student: studentId });
+
+    return res
+      .status(200)
+      .json({ message: "Account and related data deleted" });
+  } catch (err) {
+    console.error("Error deleting account:", err);
+    return res
+      .status(500)
+      .json({ message: "Server error while deleting account" });
+  }
+});
 
-module.exports = router;
\ No newline at end of file
+module.exports = router;
diff --git a/server/routes/token.js b/server/routes/token.js
index 5b663911b..6c8387995 100644
--- a/server/routes/token.js
+++ b/server/routes/token.js
@@ -5,7 +5,7 @@ const crypto = require("crypto");
 const bcrypt = require("bcrypt");
 const TokenRequest = require("../models/TokenRequest");
 const emailService = require("../services/emailService");
-const User = require("../models/User")
+const User = require("../models/User");
 
 const JWT_SECRET = process.env.JWT_SECRET;
 const FRONTEND_URL = process.env.FRONTEND_URL;
@@ -15,10 +15,13 @@ const hashToken = (token) => {
   return crypto.createHash("sha256").update(token).digest("hex");
 };
 
+// ---------------------------------- TOKEN REQUEST ----------------------------------
+// ---------------------------------- TOKEN REQUEST ----------------------------------
 router.post("/request", async (req, res) => {
   try {
     const { fullName, ouEmail, soonerId, password, semester, academicAdvisor, role } = req.body;
-    if (!fullName || !ouEmail || !password || !semester) {
+
+    if (!fullName || !ouEmail || !password || !semester || !role) {
       return res.status(400).json({ error: "All fields are required." });
     }
 
@@ -27,71 +30,84 @@ router.post("/request", async (req, res) => {
       return res.status(401).json({ error: "Token request already exists for this email." });
     }
 
-    if(role==="student"){
+    if (role.toLowerCase() === "student") {
+      if (!soonerId) {
+        return res.status(400).json({ error: "Sooner ID is required for students." });
+      }
+
       const existingSoonerId = await TokenRequest.findOne({ soonerId });
-      if(existingSoonerId){
+      if (existingSoonerId) {
         return res.status(402).json({ error: "Token request already exists for this Sooner ID." });
       }
     }
 
-    const plainToken = jwt.sign({ ouEmail }, JWT_SECRET, { expiresIn: "180d" });
-    const hashedToken = hashToken(plainToken);
-    const hashedPassword = await bcrypt.hash(password, SALT_ROUNDS);
+    let plainToken = null;
+    let hashedToken = null;
+    const isStudent = role.toLowerCase() === "student";
 
-    const requestedAt = new Date();
-    const expiresAt = new Date(requestedAt.getTime() + 5 * 24 * 60 * 60 * 1000);
+    if (role.toLowerCase() === "student") {
+      plainToken = jwt.sign({ ouEmail }, JWT_SECRET, { expiresIn: "180d" });
+      hashedToken = hashToken(plainToken);
+    }
+
+    const hashedPassword = await bcrypt.hash(password, SALT_ROUNDS);
 
     const request = new TokenRequest({
       fullName,
       ouEmail,
-      soonerId: role === "student" ? soonerId : "",
+      soonerId: isStudent ? soonerId : undefined,
       password: hashedPassword,
       semester,
       role,
-      academicAdvisor: role === "student" ? academicAdvisor : "",
-      isStudent: role === "student",
-      token: hashedToken,
-      requestedAt,
-      expiresAt,
-      activationLinkSentAt: new Date(),
+      academicAdvisor: isStudent ? academicAdvisor : undefined,
+      isStudent,
+      ...(isStudent && {
+        token: hashedToken,
+        activationLinkSentAt: new Date(),
+      })
     });
 
-    
-
     await request.save();
-   
-
-    const activationLink = `${FRONTEND_URL}/activate/${plainToken}`;
-    const emailBody = `
-      <p>Hi ${fullName},</p>
-      <p>Thank you for requesting access to the Internship Program Management System (IPMS).</p>
-      <p><strong>Your activation link:</strong></p>
-      <p><a href="${activationLink}">${activationLink}</a></p>
-      <p><strong>Note:</strong> This token will expire in <strong>5 days</strong> if not activated.</p>
-      <p>Regards,<br/>IPMS Team</p>
-    `;
-
-    await emailService.sendEmail({
-      to: ouEmail,
-      subject: "Your IPMS Token Activation Link",
-      html: emailBody,
-    });
 
-    res.status(201).json({
-      message: "Token requested and email sent.",
-      token: plainToken,
-      expiresAt,
-    });
+    if (role.toLowerCase() === "student") {
+      const activationLink = `${FRONTEND_URL}/activate/${plainToken}`;
+      const emailBody = `
+        <p>Hi ${fullName},</p>
+        <p>Thank you for requesting access to the Internship Program Management System (IPMS).</p>
+        <p><strong>Your activation link:</strong></p>
+        <p><a href="${activationLink}">${activationLink}</a></p>
+        <p><strong>Note:</strong> This token will expire in <strong>5 days</strong> if not activated.</p>
+        <p>Regards,<br/>IPMS Team</p>
+      `;
+
+      await emailService.sendEmail({
+        to: ouEmail,
+        subject: "Your IPMS Token Activation Link",
+        html: emailBody,
+      });
+
+      res.status(201).json({
+        message: "Token requested and email sent.",
+        token: plainToken,
+      });
+    } else {
+      console.log(`Email not sent - user is not a student: ${ouEmail}`);
+      res.status(201).json({ message: "Token is not required for supervisors or coordinators." });
+    }
   } catch (err) {
     console.error("Token Request Error:", err);
     res.status(500).json({ error: err.message });
   }
 });
 
+// ---------------------------------- ACTIVATE TOKEN ----------------------------------
 router.post("/activate", async (req, res) => {
   try {
+    console.log(" Activation request received at backend");
+
     const { token } = req.body;
     if (!token) return res.status(400).json({ error: "Token is missing." });
+
     const hashedToken = hashToken(token);
     const user = await TokenRequest.findOne({ token: hashedToken });
 
@@ -109,13 +125,16 @@ router.post("/activate", async (req, res) => {
     user.expiresAt = sixMonthsLater;
 
     await user.save();
+    console.log("Token activated successfully");
 
     res.json({ message: "Token activated successfully." });
   } catch (err) {
+    console.error("Activation error:", err);
     res.status(500).json({ error: err.message });
   }
 });
 
+// ---------------------------------- LOGIN BY TOKEN (Optional) ----------------------------------
 router.post("/login", async (req, res) => {
   try {
     const { token } = req.body;
@@ -133,6 +152,7 @@ router.post("/login", async (req, res) => {
   }
 });
 
+// ---------------------------------- USER LOGIN (Email/Password) ----------------------------------
 router.post("/user-login", async (req, res) => {
   const { ouEmail, password, role } = req.body;
 
@@ -144,7 +164,7 @@ router.post("/user-login", async (req, res) => {
     const user = await TokenRequest.findOne({ ouEmail });
 
     if (!user) {
-      return res.status(401).json({ message: "Email or password is incorrect" });
+      return res.status(401).json({ message: "Email does not Exist. Try Signing up." });
     }
 
     const isMatch = await bcrypt.compare(password, user.password);
@@ -173,13 +193,13 @@ router.post("/user-login", async (req, res) => {
       const tokenExpiry = new Date(user.expiresAt);
 
       if (tokenExpiry < now || user.status === "deactivated") {
-        if(!user.status === "deactivated"){
+        if (user.status !== "deactivated") {
           user.status = "deactivated";
           await user.save();
         }
         return res.status(403).json({
-          message : "Your account is deactivated due to token expiry.",
-          renewalLink: `${FRONTEND_URL}/renew-token/${user.token}`
+          message: "Your account is deactivated due to token expiry.",
+          renewalLink: `${FRONTEND_URL}/renew-token/${user.token}`,
         });
       }
     }
@@ -191,6 +211,28 @@ router.post("/user-login", async (req, res) => {
   }
 });
 
+router.delete("/delete", async (req, res) => {
+  try {
+    const { ouEmail } = req.body;
+
+    if (!ouEmail) {
+      return res.status(400).json({ error: "Email is not found for deletion." });
+    }
+    
+    const user = await TokenRequest.findOneAndDelete({ouEmail});
+    
+    if (!user) {
+      return res.status(404).json({ error: "User not found." });
+    }
+
+    res.status(200).json({ message: "User deleted successfully." });
+
+  } catch (err) {
+    res.status(500).json({ error: err.message });
+  }
+});
+
+// ---------------------------------- DEACTIVATE TOKEN (SOFT DELETE) ----------------------------------
 router.delete("/deactivate", async (req, res) => {
   try {
     const { token, ouEmail } = req.body;
@@ -201,9 +243,6 @@ router.delete("/deactivate", async (req, res) => {
     let filter = {};
 
     if (token) {
-      if (typeof token !== "string") {
-        return res.status(400).json({ error: "Token must be a string." });
-      }
       const hashedToken = hashToken(token);
       filter = { token: hashedToken };
     } else {
@@ -230,6 +269,8 @@ router.delete("/deactivate", async (req, res) => {
   }
 });
 
+// ---------------------------------- TOKEN RENEWAL ----------------------------------
+// ---------------------------------- TOKEN RENEWAL ----------------------------------
 router.post("/renew", async (req, res) => {
   try {
     const { token } = req.body;
@@ -238,6 +279,7 @@ router.post("/renew", async (req, res) => {
       return res.status(400).json({ message: "Token is required." });
     }
 
+    // const hashedToken = hashToken(token);
     const user = await TokenRequest.findOne({ token: token });
 
     if (!user) {
@@ -272,4 +314,4 @@ router.post("/renew", async (req, res) => {
   }
 });
 
-module.exports = router;
+module.exports = router;
\ No newline at end of file
diff --git a/server/services/emailService.js b/server/services/emailService.js
index e2b1118e8..b784325e0 100644
--- a/server/services/emailService.js
+++ b/server/services/emailService.js
@@ -18,8 +18,8 @@ class EmailService {
     });
 
     this.defaultSender =
-    process.env.EMAIL_DEFAULT_SENDER ||
-    "Internship Program Management System <noreply@ipms.edu>";
+      process.env.EMAIL_DEFAULT_SENDER ||
+      "Internship Program Management System <noreply@ipms.edu>";
   }
 
   /**
@@ -33,6 +33,7 @@ class EmailService {
    * @param {Array} [options.attachments] - Array of attachment objects
    * @param {Array} [options.cc] - Carbon copy recipients
    * @param {Array} [options.bcc] - Blind carbon copy recipients
+   * @param {string} [options.role] - User role (optional, to conditionally skip email)
    * @returns {Promise<Object>} - Result of the email sending operation
    */
   async sendEmail(options) {
@@ -44,6 +45,7 @@ class EmailService {
         };
       }
 
+
       const mailOptions = {
         from: options.from || this.defaultSender,
         to: options.to,
@@ -52,7 +54,7 @@ class EmailService {
         text: options.text || options.html.replace(/<[^>]*>/g, ""),
         attachments: options.attachments || [],
       };
-      
+
       // Add optional fields if provided
       if (options.cc) mailOptions.cc = options.cc;
       if (options.bcc) mailOptions.bcc = options.bcc;
@@ -66,6 +68,7 @@ class EmailService {
     }
   }
 }
+
 // Create and export a singleton instance
 const emailService = new EmailService();
 module.exports = emailService;