diff --git a/components/SpeakerCard.tsx b/components/SpeakerCard.tsx
index 571d0d7..fd96a5f 100644
--- a/components/SpeakerCard.tsx
+++ b/components/SpeakerCard.tsx
@@ -10,31 +10,28 @@ type SpeakerType = {
 
 const SpeakerCard = ({ speaker }: { speaker: SpeakerType }) => {
   return (
-    <div
-      key={speaker.id}
-      className="hover:border-gradient-to-r relative flex w-72 flex-col space-y-3 rounded-3xl border-2 border-transparent bg-white p-4 shadow-lg transition-all duration-300 hover:-translate-y-3 hover:shadow-2xl"
-    >
+    <div className="bg-white border border-gray-200 rounded-lg shadow-md hover:shadow-lg transition-shadow duration-300 overflow-hidden">
       {/* Image Section */}
-      <div className="relative h-64 w-full overflow-hidden rounded-xl shadow-lg">
+      <div className="relative h-64 w-full overflow-hidden">
         <img
           src={speaker.imageLink}
-          className="h-full w-full object-cover transition-transform duration-300 hover:scale-110"
+          className="h-full w-full object-cover"
           alt={speaker.name}
         />
       </div>
 
       {/* Text Section */}
-      <div className="text-center">
-        <h1 className="text-xl font-semibold text-gray-800">{speaker.name}</h1>
-        <h2 className="mt-1 text-sm text-gray-500">{speaker.designation}</h2>
+      <div className="p-6">
+        <h3 className="text-xl font-semibold text-gray-900 mb-2">{speaker.name}</h3>
+        <p className="text-sm text-gray-600 leading-relaxed mb-3">{speaker.designation}</p>
         {speaker.topic && (
-          <p className="mt-2 text-sm font-medium italic text-gray-600">
-            Topic: {speaker.topic}
-          </p>
+          <div className="mt-4 pt-3 border-t border-gray-100">
+            <p className="text-sm font-medium text-blue-600">
+              <span className="text-gray-500">Topic:</span> {speaker.topic}
+            </p>
+          </div>
         )}
       </div>
-
-      {/* Hover Overlay Effect */}
     </div>
   )
 }
diff --git a/pages/speakers.tsx b/pages/speakers.tsx
index d107937..7c881ab 100644
--- a/pages/speakers.tsx
+++ b/pages/speakers.tsx
@@ -20,22 +20,36 @@ const keynoteSpeakers: SpeakerType[] = [
   {
     id: 2,
     name: "Prof. Dr. Stephan Weyers",
-    designation: "Vice-Rector for Teaching, Studies and International Affairs, FH Dortmund.",
+    designation: "Vice-Rector for Teaching, Studies and International Affairs, FH Dortmund",
+    topic: "Navigating the Future: Engineering Education for Sustainability and Employability",
     imageLink: "/speakers/stephanWeyers.png",
+  },
+  {
+    id: 3,
+    name: "Prof. Dr. Jean Meyer",
+    designation: "President of THWS",
+    topic: "Humanoid Robots – More than just another Industrial Revolution",
+    imageLink: "/speakers/jean.png",
   }
+]
+
+const plenarySpeakers: SpeakerType[] = [
+  // Add your plenary speaker data here
+  // Example:
   // {
-  //   id: 2,
-  //   name: 'Chaitra Vedullapalli',
-  //   designation: 'Cofounder & CMO, Meylah',
-  //   imageLink: './speakers/chaitra_v.jpeg',
-  // },
-  // {
-  //   id: 3,
-  //   name: 'Prof. Dr.-Ing. Vinod Rajamani',
-  //   designation: 'Professor, University of Applied Sciences and Arts Dortmund',
-  //   imageLink:
-  //     'https://www.fh-dortmund.de/kontakt-daten/Rajamani-Vinod.php.media/82194/Vinod-Rajamani_Portrait.jpg.scaled/3312b7eed140ac54332cfc22f82c192c.jpg',
-  // },
+  //   id: 10,
+  //   name: 'Plenary Speaker Name',
+  //   designation: 'Title and Organization',
+  //   topic: 'Talk Topic',
+  //   imageLink: '/speakers/plenary-speaker.jpg',
+  // }
+  {
+    id: 1,
+    name: "Prof. Dr. Achim Förster",
+    designation: "Vice President for International & Academic Affairs at THWS",
+    topic: "AI Regulation under the EU AI Act",
+    imageLink: "/speakers/achim.png",
+  }
 ]
 
 const aiForAllSpeakers: SpeakerType[] = [
@@ -81,64 +95,71 @@ const digitalTransformationSpeakers: SpeakerType[] = [
 ]
 
 const Speakers = () => {
+  const SectionHeader = ({ title, subtitle }: { title: string; subtitle?: string }) => (
+    <div className="text-center mb-12">
+      <h2 className="text-3xl font-bold text-gray-900 mb-2">{title}</h2>
+      {subtitle && <p className="text-lg text-gray-600">{subtitle}</p>}
+      <div className="w-24 h-1 bg-blue-600 mx-auto mt-4 rounded"></div>
+    </div>
+  )
+
+  const SpeakerGrid = ({ speakers }: { speakers: SpeakerType[] }) => (
+    <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-6 max-w-7xl mx-auto px-4">
+      {speakers.map((speaker) => (
+        <SpeakerCard key={speaker.id} speaker={speaker} />
+      ))}
+    </div>
+  )
+
   return (
-    <div className="min-h-screen bg-white py-10">
-      {/* Keynote Speakers Section */}
-      <div className="flex justify-center">
-        <h1 className="w-fit rounded-full bg-gradient-to-r from-purple-600 via-indigo-600 to-blue-600 bg-clip-text px-6 py-3 text-4xl font-extrabold text-transparent shadow-lg">
-          Keynote Speakers
-        </h1>
-      </div>
-      <div className="mt-12 flex flex-wrap justify-center gap-8 py-6 px-4 lg:px-16">
-        {keynoteSpeakers.map((speaker) => (
-          <div
-            key={speaker.id}
-            className="hover:border-gradient-to-r w-full max-w-xs rounded-2xl border-2 border-transparent bg-white bg-clip-border p-6 shadow-lg transition-all hover:scale-105 hover:from-purple-500 hover:via-indigo-500 hover:to-blue-500 hover:shadow-2xl"
-          >
-            <SpeakerCard speaker={speaker} />
-          </div>
-        ))}
-      </div>
+    <div className="min-h-screen bg-gray-50 py-12">
+      <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        
+        {/* Page Header */}
+        <div className="text-center mb-16">
+          <h1 className="text-4xl font-bold text-gray-900 mb-4">Conference Speakers</h1>
+          <p className="text-xl text-gray-600 max-w-3xl mx-auto">
+            Meet our distinguished speakers who will share their expertise and insights at CSITSS 2025
+          </p>
+        </div>
 
-      {/* Pre Conference Speakers Section */}
-      <div className="mt-16 flex justify-center">
-        <h1 className="w-fit rounded-full bg-gradient-to-r from-teal-600 via-green-600 to-yellow-600 bg-clip-text px-6 py-3 text-4xl font-extrabold text-transparent shadow-lg">
-          Invited Speakers
-        </h1>
-      </div>
+        {/* Keynote Speakers Section */}
+        <section className="mb-20">
+          <SectionHeader title="Keynote Speakers" />
+          <SpeakerGrid speakers={keynoteSpeakers} />
+        </section>
 
-      {/* AI for All Track */}
-      <div className="mt-12 flex justify-center">
-        <h2 className="w-fit rounded-full bg-gradient-to-r from-purple-600 via-indigo-600 to-blue-600 bg-clip-text px-6 py-3 text-3xl font-extrabold text-transparent shadow-lg">
-          Track 1: AI for All
-        </h2>
-      </div>
-      <div className="mt-8 flex flex-wrap justify-center gap-8 py-6 px-4 lg:px-16">
-        {aiForAllSpeakers.map((speaker) => (
-          <div
-            key={speaker.id}
-            className="hover:border-gradient-to-r w-full max-w-xs rounded-2xl border-2 border-transparent bg-white bg-clip-border p-6 shadow-lg transition-all hover:scale-105 hover:from-purple-500 hover:via-indigo-500 hover:to-blue-500 hover:shadow-2xl"
-          >
-            <SpeakerCard speaker={speaker} />
+        {/* Plenary Speakers Section */}
+        {plenarySpeakers.length > 0 && (
+          <section className="mb-20">
+            <SectionHeader title="Plenary Speakers" />
+            <SpeakerGrid speakers={plenarySpeakers} />
+          </section>
+        )}
+
+        {/* Invited Speakers Section */}
+        <section className="mb-20">
+          <SectionHeader title="Invited Speakers" subtitle="Special presentations across different tracks" />
+          
+          {/* AI for All Track */}
+          <div className="mb-16">
+            <div className="text-center mb-8">
+              <h3 className="text-2xl font-semibold text-gray-800 mb-2">Track 1: AI for All</h3>
+              <div className="w-16 h-0.5 bg-purple-500 mx-auto rounded"></div>
+            </div>
+            <SpeakerGrid speakers={aiForAllSpeakers} />
           </div>
-        ))}
-      </div>
 
-      {/* Digital Transformation Track */}
-      <div className="mt-16 flex justify-center">
-        <h2 className="w-fit rounded-full bg-gradient-to-r from-pink-600 via-red-600 to-yellow-600 bg-clip-text px-6 py-3 text-3xl font-extrabold text-transparent shadow-lg">
-          Track 2: Digital Transformation
-        </h2>
-      </div>
-      <div className="mt-8 flex flex-wrap justify-center gap-8 py-6 px-4 lg:px-16">
-        {digitalTransformationSpeakers.map((speaker) => (
-          <div
-            key={speaker.id}
-            className="hover:border-gradient-to-r w-full max-w-xs rounded-2xl border-2 border-transparent bg-white bg-clip-border p-6 shadow-lg transition-all hover:scale-105 hover:from-pink-500 hover:via-red-500 hover:to-yellow-500 hover:shadow-2xl"
-          >
-            <SpeakerCard speaker={speaker} />
+          {/* Digital Transformation Track */}
+          <div className="mb-16">
+            <div className="text-center mb-8">
+              <h3 className="text-2xl font-semibold text-gray-800 mb-2">Track 2: Digital Transformation</h3>
+              <div className="w-16 h-0.5 bg-green-500 mx-auto rounded"></div>
+            </div>
+            <SpeakerGrid speakers={digitalTransformationSpeakers} />
           </div>
-        ))}
+        </section>
+
       </div>
     </div>
   )
diff --git a/public/speakers/achim.png b/public/speakers/achim.png
new file mode 100644
index 0000000..f412fca
Binary files /dev/null and b/public/speakers/achim.png differ
diff --git a/public/speakers/jean.png b/public/speakers/jean.png
new file mode 100644
index 0000000..9badc9a
Binary files /dev/null and b/public/speakers/jean.png differ