Improved texts and profile pic added

src/components/About.jsx

@@ -1,6 +1,6 @@
 import styles from '../styles/components/About.module.scss';
 
-const STACK = ['Technology 1', 'Technology 2', 'Technology 3', 'Technology 4', 'Technology 5', 'Technology 6'];
+const STACK = ['Azure', '.NET', 'C#', 'JavaScript', 'React', 'Node.js', 'SQL'];
 
 export default function About() {
   return (
@@ -15,13 +15,14 @@ export default function About() {
         <div className={styles.body}>
           <div className={styles.text}>
             <p>
-              A paragraph about yourself and your background. What kind of work
-              do you do and what drives you? Keep it personal and authentic.
+              I'm a curious software engineer with a passion for building scalable and efficient
+              applications. With deep knowledge in cloud, backend, and frontend development, I enjoy
+              working on projects that challenge me to learn new technologies and improve my skills.
             </p>
             <p>
-              A second paragraph with more details — hobbies, interests, or
-              anything else that gives visitors a sense of who you are beyond
-              your job title.
+              I tend to build always something that is useful to others, and I find joy in creating tools 
+              and applications that solve real-world problems. I believe that technology has the power to 
+              make a positive impact on people's lives, and I strive to contribute to that impact through my work.
             </p>
             <p>
               Here are some technologies I've been working with recently:
@@ -38,21 +39,25 @@ export default function About() {
 
           <div className={styles.card}>
             <div className={styles.avatar}>
-              <span className={styles.avatarInner}>YN</span>
+              <img src="/me.png" alt="Profile" className={styles.avatarImg} />
             </div>
             <div className={styles.meta}>
               <p className={styles.metaLine}>
                 <span className={styles.metaKey}>location</span>
-                <span>City, Country</span>
+                <span className={styles.metaValue}>Turku Archipelago, Finland</span>
               </p>
               <p className={styles.metaLine}>
-                <span className={styles.metaKey}>status</span>
-                <span className={styles.green}>Available</span>
-              </p>
-              <p className={styles.metaLine}>
-                <span className={styles.metaKey}>focus</span>
-                <span>Your focus area</span>
+                <span className={styles.metaKey}>favorite book</span>
+                <span className={styles.metaValue}>The Lord of the Rings</span>
               </p>
+              <div className={styles.metaLine}>
+                <span className={styles.metaKey}>favorite songs</span>
+                <div className={styles.metaLinks}>
+                  <a href="https://www.youtube.com/watch?v=EqDcigWxZuU" target="_blank" rel="noreferrer">Rücksturz – Agitation Free</a>
+                  <a href="https://www.youtube.com/watch?v=2i2oJJwgLTk" target="_blank" rel="noreferrer">Year of Love – Jenny Hval</a>
+                  <a href="https://www.youtube.com/watch?v=C5lVJkp5TT4" target="_blank" rel="noreferrer">Пачка сигарет – КИНО</a>
+                </div>
+              </div>
             </div>
           </div>
         </div>

src/components/Contact.jsx

@@ -12,12 +12,13 @@ export default function Contact() {
 
         <div className={styles.body}>
           <p className={styles.lede}>
-            A short message inviting visitors to reach out. Let them know
-            you're open to new opportunities, collaborations, or just a chat.
+            I'm currently employed, but my inbox is always open. Whether you have a question or 
+            just want to say hi, I'll try my best to get back to you!
           </p>
+          <p>I also have a small company if you are interested in collaboration or services.</p>
 
           <a
-            href="mailto:your@email.com"
+            href="mailto:veikko@lintujarvi.fi"
             className={styles.emailBtn}
           >
             Say hello ↗
@@ -25,9 +26,9 @@ export default function Contact() {
 
           <ul className={styles.socials}>
             {[
-              { label: 'GitHub', href: '#' },
-              { label: 'LinkedIn', href: '#' },
-              { label: 'Platform', href: '#' },
+              { label: 'Gitea', href: 'https://gitea.tietokonepaja.fi/' },
+              { label: 'LinkedIn', href: 'https://www.linkedin.com/in/veikko-lintuj%C3%A4rvi-5888a6175/' },
+              { label: 'Company', href: 'https://www.tietokonepaja.fi/' },
             ].map(({ label, href }) => (
               <li key={label}>
                 <a href={href} target="_blank" rel="noreferrer">

src/components/Footer.jsx

@@ -5,7 +5,7 @@ export default function Footer() {
     <footer className={styles.footer}>
       <p>
         Designed &amp; built by{' '}
-        <a href="#home">Your Name</a>{' '}
+        <a href="#home">Veikko Lintujärvi</a>{' '}
         <span className={styles.separator}>·</span>{' '}
         <span className={styles.stack}>React + Vite</span>
       </p>

src/components/Hero.jsx

@@ -8,15 +8,15 @@ export default function Hero() {
       <div className={styles.content}>
         <p className={styles.greeting}>Hey, I'm</p>
         <h1 className={styles.name}>
-          Your Name<span className={styles.dot}>.</span>
+          Veikko Lintujärvi<span className={styles.dot}>.</span>
         </h1>
         <p className={styles.tagline}>
-          Your tagline goes here —{' '}
-          <span className={styles.highlight}>make it memorable.</span>
+          Making world a better place —{' '}
+          <span className={styles.highlight}>one line at a time.</span>
         </p>
         <p className={styles.sub}>
-          A short bio or description about yourself. What do you do, what do
-          you care about, and what makes you interesting?
+          I'm a curious software engineer from Turku Archipelago, Finland. Right now
+          I'm excited about cloud, Linux and AI.
         </p>
 
         <div className={styles.cta}>

src/styles/components/About.module.scss

@@ -87,18 +87,15 @@
   width: 100px;
   height: 100px;
   border-radius: 50%;
-  background: linear-gradient(135deg, $color-primary 0%, $color-primary-mid 100%);
-  display: flex;
-  align-items: center;
-  justify-content: center;
+  overflow: hidden;
   box-shadow: 0 0 30px rgb(var(--color-primary-mid) / 0.3);
 }
 
-.avatarInner {
-  font-size: $text-xl;
-  font-weight: 700;
-  color: #fff;
-  letter-spacing: 0.05em;
+.avatarImg {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+  display: block;
 }
 
 .meta {
@@ -110,7 +107,7 @@
 
 .metaLine {
   display: flex;
-  justify-content: space-between;
+  align-items: flex-start;
   font-size: $text-sm;
   color: $color-text-muted;
   border-bottom: 1px solid $color-border;
@@ -125,8 +122,27 @@
   font-family: $font-mono;
   color: $color-text-dim;
   font-size: $text-xs;
+  flex-shrink: 0;
+  width: 7.5rem;
 }
 
-.green {
-  color: #4ade80;
+.metaValue {
+  text-align: left;
+}
+
+.metaLinks {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  gap: $space-2;
+
+  a {
+    color: $color-accent;
+    text-decoration: none;
+    font-size: $text-xs;
+
+    &:hover {
+      text-decoration: underline;
+    }
+  }
 }