diff --git a/assets/style.css b/assets/style.css
index a64a23f..15bc720 100644
--- a/assets/style.css
+++ b/assets/style.css
@@ -155,3 +155,43 @@
 @media (max-width: 640px) {
   .services-grid { grid-template-columns: 1fr; }
 }
+
+/* ── App cards (section Mes Apps) ─────────────────────────────────────────── */
+.app-card {
+  background: #161b22;
+  border: 1px solid #30363d;
+  border-radius: 0.75rem;
+  padding: 1.25rem;
+  transition: all 0.2s ease;
+  position: relative;
+}
+
+.app-card:hover {
+  border-color: #8b5cf6;
+  box-shadow: 0 0 12px rgba(139, 92, 246, 0.25);
+  transform: translateY(-2px);
+}
+
+.app-btn {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: 0.5rem;
+  width: 100%;
+  padding: 0.5rem 1rem;
+  font-size: 0.875rem;
+  font-weight: 600;
+  color: #c4b5fd;
+  background: #8b5cf610;
+  border: 1px solid #8b5cf630;
+  border-radius: 0.5rem;
+  transition: all 0.15s;
+  text-decoration: none;
+}
+
+.app-btn:hover {
+  background: #8b5cf620;
+  border-color: #8b5cf6;
+  color: #e9d5ff;
+  box-shadow: 0 0 8px rgba(139, 92, 246, 0.3);
+}
diff --git a/index.php b/index.php
index efe3e60..f957099 100644
--- a/index.php
+++ b/index.php
@@ -54,6 +54,112 @@
   <!-- ── Main ───────────────────────────────────────────────────────────────── -->
   <main class="max-w-[1600px] mx-auto px-4 py-6">
 
+    <!-- ── Mes Applications ────────────────────────────────────────────────────── -->
+    <section class="mb-10">
+      <!-- En-tête de section -->
+      <div class="section-header">
+        <h2 class="section-title">🚀 Mes Applications</h2>
+        <span class="section-count">4</span>
+      </div>
+
+      <!-- Grille des applications -->
+      <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4">
+        
+        <!-- App 1: CronHub -->
+        <div class="app-card group">
+          <div class="flex flex-col h-full">
+            <!-- Icône & Titre -->
+            <div class="flex items-center gap-3 mb-3">
+              <span class="text-3xl">⏰</span>
+              <h3 class="text-base font-bold text-white">CronHub</h3>
+            </div>
+            
+            <!-- Description -->
+            <p class="text-sm text-gray-400 mb-4 flex-grow">
+              Gestionnaire de cron jobs
+            </p>
+            
+            <!-- Bouton -->
+            <a href="https://cronhub.nas.percolouco.com" target="_blank" rel="noopener noreferrer"
+               class="app-btn">
+              Ouvrir
+              <span class="text-xs">→</span>
+            </a>
+          </div>
+        </div>
+
+        <!-- App 2: GarageManager -->
+        <div class="app-card group">
+          <div class="flex flex-col h-full">
+            <!-- Icône & Titre -->
+            <div class="flex items-center gap-3 mb-3">
+              <span class="text-3xl">🚗</span>
+              <h3 class="text-base font-bold text-white">GarageManager</h3>
+            </div>
+            
+            <!-- Description -->
+            <p class="text-sm text-gray-400 mb-4 flex-grow">
+              Gestion véhicules & entretiens
+            </p>
+            
+            <!-- Bouton -->
+            <a href="https://garage.nas.percolouco.com" target="_blank" rel="noopener noreferrer"
+               class="app-btn">
+              Ouvrir
+              <span class="text-xs">→</span>
+            </a>
+          </div>
+        </div>
+
+        <!-- App 3: PercoMemo -->
+        <div class="app-card group">
+          <div class="flex flex-col h-full">
+            <!-- Icône & Titre -->
+            <div class="flex items-center gap-3 mb-3">
+              <span class="text-3xl">📝</span>
+              <h3 class="text-base font-bold text-white">PercoMemo</h3>
+            </div>
+            
+            <!-- Description -->
+            <p class="text-sm text-gray-400 mb-4 flex-grow">
+              Mémos & notes
+            </p>
+            
+            <!-- Bouton -->
+            <a href="http://192.168.1.29:9400" target="_blank" rel="noopener noreferrer"
+               class="app-btn">
+              Ouvrir
+              <span class="text-xs">→</span>
+            </a>
+          </div>
+        </div>
+
+        <!-- App 4: Planka -->
+        <div class="app-card group">
+          <div class="flex flex-col h-full">
+            <!-- Icône & Titre -->
+            <div class="flex items-center gap-3 mb-3">
+              <span class="text-3xl">📋</span>
+              <h3 class="text-base font-bold text-white">Planka</h3>
+            </div>
+            
+            <!-- Description -->
+            <p class="text-sm text-gray-400 mb-4 flex-grow">
+              Kanban & projets
+            </p>
+            
+            <!-- Bouton -->
+            <a href="https://planka.nas.percolouco.com" target="_blank" rel="noopener noreferrer"
+               class="app-btn">
+              Ouvrir
+              <span class="text-xs">→</span>
+            </a>
+          </div>
+        </div>
+
+      </div>
+    </section>
+
     <!-- Loader -->
     <div id="loader" class="flex flex-col items-center justify-center py-24 gap-4">
       <div class="w-8 h-8 border-4 border-violet-500 border-t-transparent rounded-full animate-spin"></div>