Add founder photo to About page

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

src/pages/AboutPage.css

@@ -140,6 +140,9 @@
 
 /* Founder */
 .about-founder-card {
+  display: flex;
+  gap: 2.5rem;
+  align-items: center;
   max-width: 900px;
   margin: 0 auto;
   background: rgba(255, 255, 255, 0.05);
@@ -151,6 +154,26 @@
   transition: box-shadow 0.4s, border-color 0.4s;
 }
 
+.about-founder-photo {
+  flex-shrink: 0;
+}
+
+.about-founder-img {
+  width: 160px;
+  height: 160px;
+  border-radius: 50%;
+  object-fit: cover;
+  object-position: top;
+  border: 3px solid rgba(255, 91, 4, 0.3);
+  box-shadow: 0 0 30px rgba(255, 91, 4, 0.12);
+  transition: border-color 0.3s, box-shadow 0.3s;
+}
+
+.about-founder-img:hover {
+  border-color: var(--orange-100);
+  box-shadow: 0 0 40px rgba(255, 91, 4, 0.2);
+}
+
 .about-founder-info h3 {
   font-size: 1.5rem;
   font-weight: 800;
@@ -305,8 +328,14 @@
   }
 
   .about-founder-card {
+    flex-direction: column;
+    text-align: center;
     padding: 2rem;
   }
+
+  .about-founder-details li {
+    text-align: left;
+  }
 }
 
 @media (max-width: 600px) {

src/pages/AboutPage.tsx

@@ -249,6 +249,9 @@ const AboutPage = () => {
             {...fadeUp}
             whileHover={{ borderColor: 'rgba(255, 91, 4, 0.4)', boxShadow: '0 8px 40px rgba(255, 91, 4, 0.1)', transition: { duration: 0.3 } }}
           >
+            <motion.div className="about-founder-photo" whileHover={{ scale: 1.05 }} transition={{ duration: 0.3 }}>
+              <img src="/founder-vadym.png" alt="Vadym Samoilenko — CEO & Founder of AImpress" className="about-founder-img" />
+            </motion.div>
             <div className="about-founder-info">
               <h3>Vadym Samoilenko</h3>
               <span className="about-founder-role">CEO & Founder of AImpress Ltd</span>