update

components/Educations.jsx

@@ -41,7 +41,6 @@ const Educations = () => {
         Educations
       </h3>
 
-      {/* Formations container */}
       <div className="w-full max-w-6xl">
         {formationsData.map((formation, index) => (
           <div
@@ -52,10 +51,8 @@ const Educations = () => {
               md:grid md:grid-cols-2 md:gap-8 p-6
             `}
           >
-            {/* Conditional rendering for alternating layout */}
             {index % 2 === 0 ? (
               <>
-                {/* Left/Image Column */}
                 <div className="flex justify-center items-center p-4">
                   <Image
                     src={formation.img}
@@ -65,17 +62,14 @@ const Educations = () => {
                     className="w-full h-auto rounded-lg transition-transform duration-300 hover:scale-95 shadow-md"
                   />
                 </div>
-                {/* Right/Content Column */}
                 <div className="flex flex-col items-center text-center p-4 md:items-start md:text-left">
                   <h3 className="text-2xl font-semibold text-gray-800 mb-3 font-poppins">
                     {formation.name}
                   </h3>
-                  {/* Use whitespace-pre-wrap to respect newline characters in description */}
                   <p className="text-gray-600 text-lg mb-5 font-poppins whitespace-pre-wrap">
                     {formation.desc}
                   </p>
 
-                  {/* Link to formation (if available) */}
                   {formation.link && (
                     <div className="flex flex-wrap justify-center md:justify-start gap-6 w-full mt-auto">
                       <a
@@ -93,7 +87,6 @@ const Educations = () => {
               </>
             ) : (
               <>
-                {/* Right/Content Column (now on left visually) */}
                 <div className="flex flex-col items-center text-center p-4 md:items-start md:text-left">
                   <h3 className="text-2xl font-semibold text-gray-800 mb-3 font-poppins">
                     {formation.name}
@@ -102,7 +95,6 @@ const Educations = () => {
                     {formation.desc}
                   </p>
 
-                  {/* Link to formation (if available) */}
                   {formation.link && (
                     <div className="flex flex-wrap justify-center md:justify-start gap-6 w-full mt-auto">
                       <a
@@ -117,7 +109,6 @@ const Educations = () => {
                     </div>
                   )}
                 </div>
-                {/* Left/Image Column (now on right visually) */}
                 <div className="flex justify-center items-center p-4">
                   <Image
                     src={formation.img}