From 21a302a2ec46655ef8a4dc6b504b6353c5bbf173 Mon Sep 17 00:00:00 2001
From: Jalil Arfaoui <jalil@arfaoui.net>
Date: Tue, 17 Mar 2026 19:36:44 +0100
Subject: [PATCH] =?UTF-8?q?Accueil=20:=20clarifier=20les=203=20activit?=
 =?UTF-8?q?=C3=A9s=20dans=20le=20hero=20avec=20phrase=20d'accroche=20et=20?=
 =?UTF-8?q?3=20boutons=20color=C3=A9s=20(FR/EN/AR)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/pages/ar/index.astro | 18 ++++++++++++------
 src/pages/en/index.astro | 18 ++++++++++++------
 src/pages/index.astro    | 20 +++++++++++++-------
 3 files changed, 37 insertions(+), 19 deletions(-)

diff --git a/src/pages/ar/index.astro b/src/pages/ar/index.astro
index c379868..857fb51 100644
--- a/src/pages/ar/index.astro
+++ b/src/pages/ar/index.astro
@@ -32,15 +32,21 @@ const recommendationCount = (await getCollection("recommendations")).length;
           مطوّر • مصوّر • ممثل
         </h2>
         <p class="mb-8 text-lg text-neutral-600 dark:text-neutral-400 leading-relaxed">
-          أكتب الكود من أجل عالم أكثر عدلًا، وأصعد على الخشبة لأجل الباقي. أو العكس.
+          ثلاثة أنشطة، محرّك واحد: الفضول. أصمّم البرمجيات، أصوّر ما حولي، وأصعد على الخشبة.
         </p>
 
-        <div class="flex flex-wrap gap-4">
-          <a href="/ar/برمجة" class="inline-flex items-center px-6 py-3 text-sm font-semibold text-white bg-tiqa-600 rounded-full hover:bg-tiqa-700 transition-colors duration-200">
-            اكتشف أعمالي
+        <div class="flex flex-wrap gap-3">
+          <a href="/ar/برمجة" class="inline-flex items-center px-5 py-2.5 text-sm font-semibold text-white bg-tiqa-600 rounded-full hover:bg-tiqa-700 transition-colors duration-200">
+            برمجة
           </a>
-          <a href="/ar/نبذة-عني" class="inline-flex items-center px-6 py-3 text-sm font-semibold text-neutral-700 bg-neutral-100 dark:bg-neutral-800 dark:text-neutral-200 rounded-full hover:bg-neutral-200 dark:hover:bg-neutral-700 transition-colors duration-200">
-            تعرّف عليّ أكثر
+          <a href="/ar/تصوير" class="inline-flex items-center px-5 py-2.5 text-sm font-semibold text-white bg-slate-600 rounded-full hover:bg-slate-700 transition-colors duration-200">
+            تصوير
+          </a>
+          <a href="/ar/مسرح" class="inline-flex items-center px-5 py-2.5 text-sm font-semibold text-white bg-amber-600 rounded-full hover:bg-amber-700 transition-colors duration-200">
+            مسرح
+          </a>
+          <a href="/ar/نبذة-عني" class="inline-flex items-center px-5 py-2.5 text-sm font-semibold text-neutral-700 bg-neutral-100 dark:bg-neutral-800 dark:text-neutral-200 rounded-full hover:bg-neutral-200 dark:hover:bg-neutral-700 transition-colors duration-200">
+            نبذة عنّي
           </a>
         </div>
       </div>
diff --git a/src/pages/en/index.astro b/src/pages/en/index.astro
index 0fca9f8..60e3440 100644
--- a/src/pages/en/index.astro
+++ b/src/pages/en/index.astro
@@ -32,15 +32,21 @@ const recommendationCount = (await getCollection("recommendations")).length;
           Software Craftsman • Photographer • Actor
         </h2>
         <p class="mb-8 text-lg text-neutral-600 dark:text-neutral-400 leading-relaxed">
-          I write code for a fairer world and get on stage for the rest. Or the other way around.
+          Three pursuits, one driving force: curiosity. I build software, photograph what surrounds me, and perform on stage.
         </p>
 
-        <div class="flex flex-wrap gap-4">
-          <a href="/en/code" class="inline-flex items-center px-6 py-3 text-sm font-semibold text-white bg-tiqa-600 rounded-full hover:bg-tiqa-700 transition-colors duration-200">
-            View my work
+        <div class="flex flex-wrap gap-3">
+          <a href="/en/code" class="inline-flex items-center px-5 py-2.5 text-sm font-semibold text-white bg-tiqa-600 rounded-full hover:bg-tiqa-700 transition-colors duration-200">
+            Code
           </a>
-          <a href="/en/about" class="inline-flex items-center px-6 py-3 text-sm font-semibold text-neutral-700 bg-neutral-100 dark:bg-neutral-800 dark:text-neutral-200 rounded-full hover:bg-neutral-200 dark:hover:bg-neutral-700 transition-colors duration-200">
-            Learn more
+          <a href="/en/photo" class="inline-flex items-center px-5 py-2.5 text-sm font-semibold text-white bg-slate-600 rounded-full hover:bg-slate-700 transition-colors duration-200">
+            Photo
+          </a>
+          <a href="/en/theater" class="inline-flex items-center px-5 py-2.5 text-sm font-semibold text-white bg-amber-600 rounded-full hover:bg-amber-700 transition-colors duration-200">
+            Theater
+          </a>
+          <a href="/en/about" class="inline-flex items-center px-5 py-2.5 text-sm font-semibold text-neutral-700 bg-neutral-100 dark:bg-neutral-800 dark:text-neutral-200 rounded-full hover:bg-neutral-200 dark:hover:bg-neutral-700 transition-colors duration-200">
+            About
           </a>
         </div>
       </div>
diff --git a/src/pages/index.astro b/src/pages/index.astro
index d222d5f..5863dc2 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -32,15 +32,21 @@ const recommendationCount = (await getCollection("recommendations")).length;
           Développeur • Photographe • Comédien
         </h2>
         <p class="mb-8 text-lg text-neutral-600 dark:text-neutral-400 leading-relaxed">
-          Je code pour un monde plus juste et je monte sur scène pour le reste. Ou l'inverse.
+          Trois activités, un même moteur : la curiosité. Je conçois du logiciel, je photographie ce qui m'entoure et je monte sur scène.
         </p>
-        
-        <div class="flex flex-wrap gap-4">
-          <a href="/code" class="inline-flex items-center px-6 py-3 text-sm font-semibold text-white bg-tiqa-600 rounded-full hover:bg-tiqa-700 transition-colors duration-200">
-            Voir mon travail
+
+        <div class="flex flex-wrap gap-3">
+          <a href="/code" class="inline-flex items-center px-5 py-2.5 text-sm font-semibold text-white bg-tiqa-600 rounded-full hover:bg-tiqa-700 transition-colors duration-200">
+            Code
           </a>
-          <a href="/a-propos" class="inline-flex items-center px-6 py-3 text-sm font-semibold text-neutral-700 bg-neutral-100 dark:bg-neutral-800 dark:text-neutral-200 rounded-full hover:bg-neutral-200 dark:hover:bg-neutral-700 transition-colors duration-200">
-            En savoir plus
+          <a href="/photo" class="inline-flex items-center px-5 py-2.5 text-sm font-semibold text-white bg-slate-600 rounded-full hover:bg-slate-700 transition-colors duration-200">
+            Photo
+          </a>
+          <a href="/theatre" class="inline-flex items-center px-5 py-2.5 text-sm font-semibold text-white bg-amber-600 rounded-full hover:bg-amber-700 transition-colors duration-200">
+            Théâtre
+          </a>
+          <a href="/a-propos" class="inline-flex items-center px-5 py-2.5 text-sm font-semibold text-neutral-700 bg-neutral-100 dark:bg-neutral-800 dark:text-neutral-200 rounded-full hover:bg-neutral-200 dark:hover:bg-neutral-700 transition-colors duration-200">
+            À propos
           </a>
         </div>
       </div>