refactor: homepage with personal brand focus (no empire talk) + profile photo

src/pages/index.astro

@@ -20,75 +20,50 @@ const blogPosts = (await getCollection('blog'))
 
 <BaseLayout 
   title="Inicio"
-  description="Portfolio personal de David Aragón - Indie builder construyendo €4M ARR en productos SaaS españoles"
+  description="Portfolio personal de David Aragón - Builder construyendo productos y compartiendo el viaje"
 >
   <Header />
   
   <main class="flex-1">
     <!-- Hero Section -->
-    <section class="max-w-6xl mx-auto px-4 sm:px-6 lg:px-8 py-20 text-center">
+    <section class="max-w-6xl mx-auto px-4 sm:px-6 lg:px-8 py-20">
-      <h1 class="text-5xl md:text-6xl font-bold mb-6">
+      <div class="flex flex-col md:flex-row items-center gap-12">
+        <div class="flex-shrink-0">
+          <img 
+            src="/david-aragon.jpg" 
+            alt="David Aragón"
+            class="w-48 h-48 md:w-64 md:h-64 rounded-full object-cover border-4 border-primary/20"
+          />
+        </div>
+        <div class="flex-1 text-center md:text-left">
+          <h1 class="text-4xl md:text-5xl font-bold mb-6">
             Hola, soy <span class="text-primary">David Aragón</span>
           </h1>
-      <p class="text-xl md:text-2xl text-text-secondary max-w-3xl mx-auto mb-8 leading-relaxed">
+          <p class="text-xl text-text-secondary mb-6 leading-relaxed">
-        Indie builder español construyendo en público. Trabajando hacia <strong class="text-primary">€4M ARR</strong> 
+            Builder construyendo productos que resuelven problemas reales. 
-        con un portfolio de productos SaaS enfocados en compliance y automatización.
+            De orfebre a fotógrafo a developer. Ahora construyendo en público.
           </p>
-      <div class="flex flex-wrap justify-center gap-4">
+          <p class="text-lg text-text-secondary mb-8">
+            Actualmente trabajando en <strong class="text-primary">WarrantyHub</strong> - 
+            gestión digital de garantías para hogares.
+          </p>
+          <div class="flex flex-wrap justify-center md:justify-start gap-4">
             <a 
-          href="/projects"
+              href="/blog"
               class="bg-primary hover:bg-primary/80 text-background px-8 py-3 rounded-lg 
                      font-semibold transition-colors"
             >
-          Ver Proyectos
+              Leer Blog
             </a>
             <a 
-          href="/blog"
+              href="/about"
               class="bg-surface hover:bg-surface/80 text-text-primary px-8 py-3 rounded-lg 
                      font-semibold border border-text-tertiary/20 transition-colors"
             >
-          Leer Blog
+              Sobre Mí
             </a>
           </div>
-    </section>
-
-    <!-- Featured Projects -->
-    <section class="max-w-6xl mx-auto px-4 sm:px-6 lg:px-8 py-16">
-      <div class="flex items-center justify-between mb-8">
-        <h2 class="text-3xl font-bold">Proyectos Destacados</h2>
-        <a 
-          href="/projects"
-          class="text-primary hover:text-secondary transition-colors font-medium"
-        >
-          Ver todos →
-        </a>
         </div>
-      
-      <div class="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
-        {projects.length > 0 ? (
-          projects.map(project => (
-            <Card href={`/projects/${project.slug}`}>
-              <h3 class="text-xl font-semibold mb-2 text-text-primary">{project.data.title}</h3>
-              <p class="text-text-secondary mb-4">{project.data.description}</p>
-              <div class="flex flex-wrap gap-2 mb-4">
-                {project.data.tags.slice(0, 3).map(tag => (
-                  <Tag label={tag} variant="primary" />
-                ))}
-              </div>
-              <div class="flex items-center justify-between">
-                <span class="text-sm text-text-tertiary capitalize">{project.data.status}</span>
-                <span class="text-primary text-sm font-medium">Ver proyecto →</span>
-              </div>
-            </Card>
-          ))
-        ) : (
-          <div class="col-span-full text-center py-12">
-            <p class="text-text-secondary">
-              Proyectos destacados próximamente. Mientras tanto, 
-              <a href="/blog" class="text-primary hover:underline">lee el blog</a>.
-            </p>
-          </div>
-        )}
       </div>
     </section>
 
@@ -131,13 +106,46 @@ const blogPosts = (await getCollection('blog'))
       </div>
     </section>
 
+    <!-- Featured Projects (if any) -->
+    {projects.length > 0 && (
+      <section class="max-w-6xl mx-auto px-4 sm:px-6 lg:px-8 py-16">
+        <div class="flex items-center justify-between mb-8">
+          <h2 class="text-3xl font-bold">Proyectos</h2>
+          <a 
+            href="/projects"
+            class="text-primary hover:text-secondary transition-colors font-medium"
+          >
+            Ver todos →
+          </a>
+        </div>
+        
+        <div class="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
+          {projects.map(project => (
+            <Card href={`/projects/${project.slug}`}>
+              <h3 class="text-xl font-semibold mb-2 text-text-primary">{project.data.title}</h3>
+              <p class="text-text-secondary mb-4">{project.data.description}</p>
+              <div class="flex flex-wrap gap-2 mb-4">
+                {project.data.tags.slice(0, 3).map(tag => (
+                  <Tag label={tag} variant="primary" />
+                ))}
+              </div>
+              <div class="flex items-center justify-between">
+                <span class="text-sm text-text-tertiary capitalize">{project.data.status}</span>
+                <span class="text-primary text-sm font-medium">Ver proyecto →</span>
+              </div>
+            </Card>
+          ))}
+        </div>
+      </section>
+    )}
+
     <!-- Newsletter CTA -->
     <section class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 py-16">
       <div class="bg-gradient-to-r from-primary/10 to-secondary/10 rounded-2xl p-8 md:p-12 text-center border border-primary/20">
         <h2 class="text-3xl font-bold mb-4">Construyendo en Público</h2>
         <p class="text-text-secondary mb-6 max-w-2xl mx-auto">
-          Suscríbete para recibir actualizaciones sobre nuevos proyectos, aprendizajes, 
+          Suscríbete para recibir actualizaciones sobre lanzamientos, aprendizajes técnicos, 
-          y transparencia total en el viaje hacia €4M ARR.
+          y el viaje de construcción de productos.
         </p>
         <form class="flex flex-col sm:flex-row gap-3 max-w-md mx-auto">
           <input