Ajout de la présentation

presentation/index.html

@@ -13,6 +13,9 @@
     
     <!-- Load Google Fonts -->
     <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet">
+    <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
+    <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
+    <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
     
     <style>
         body {
@@ -151,7 +154,7 @@
             <div class="flex flex-col items-center justify-center h-full gap-2 w-full max-w-5xl mx-auto">
                 <!-- CEO Level -->
                 <div class="bg-slate-800 p-4 rounded-2xl border-t-4 border-sky-400 text-center w-64 shadow-xl z-10">
-                    <div class="w-12 h-12 bg-slate-900 rounded-full mx-auto mb-2 border border-slate-700 flex items-center justify-center text-xl text-sky-400"><img src="https://guillaume-sanchez.fr/images/cyberusgate/nicolas.jpeg" alt="Chess King Icon" class="rounded-full"></div>
+                    <div class="w-20 h-20 bg-slate-900 rounded-full mx-auto mb-2 border border-slate-700 flex items-center justify-center text-xl text-sky-400"><img src="https://guillaume-sanchez.fr/images/cyberusgate/nicolas.jpeg" alt="Chess King Icon" class="rounded-full"></div>
                     <h3 class="font-bold text-lg leading-tight">Nicolas</h3>
                     <p class="text-sky-400 text-xs font-medium mb-1">Dir. Général & Stratégie</p>
                     <p class="text-[10px] text-slate-400">Gouvernance, Vision, Scalabilité</p>
@@ -173,28 +176,28 @@
                 <div class="grid grid-cols-4 gap-4 w-full z-10">
                     <!-- Anthony -->
                     <div class="bg-slate-800/80 p-4 rounded-2xl border border-slate-700 text-center hover:bg-slate-800 transition-colors">
-                        <div class="w-10 h-10 bg-slate-900 rounded-full mx-auto mb-2 flex items-center justify-center text-sky-400"><img src="https://guillaume-sanchez.fr/images/cyberusgate/anthony.jpg" alt="Microchip Icon" class="rounded-full"></div>
+                        <div class="w-20 h-20 bg-slate-900 rounded-full mx-auto mb-2 flex items-center justify-center text-sky-400"><img src="https://guillaume-sanchez.fr/images/cyberusgate/anthony.jpg" alt="Microchip Icon" class="rounded-full"></div>
                         <h3 class="font-bold text-sm">Anthony</h3>
                         <p class="text-sky-400 text-[11px] mb-1">Dir. Technique</p>
                         <p class="text-[10px] text-slate-400 leading-tight">Innovation Tech & UX<br>Technologie invisible</p>
                     </div>
                     <!-- Guillaume -->
                     <div class="bg-slate-800/80 p-4 rounded-2xl border border-slate-700 text-center hover:bg-slate-800 transition-colors">
-                        <div class="w-10 h-10 bg-slate-900 rounded-full mx-auto mb-2 flex items-center justify-center text-sky-400"><img src="https://guillaume-sanchez.fr/images/cyberusgate/guillaume.jpg" alt="Scale Icon" class="rounded-full"></div>
+                        <div class="w-20 h-20 bg-slate-900 rounded-full mx-auto mb-2 flex items-center justify-center text-sky-400"><img src="https://guillaume-sanchez.fr/images/cyberusgate/guillaume.jpg" alt="Scale Icon" class="rounded-full"></div>
                         <h3 class="font-bold text-sm">Guillaume</h3>
                         <p class="text-sky-400 text-[11px] mb-1">Dir. Conformité</p>
                         <p class="text-[10px] text-slate-400 leading-tight">Éthique, RGPD<br>Protection des données</p>
                     </div>
                     <!-- Erkin -->
                     <div class="bg-slate-800/80 p-4 rounded-2xl border border-slate-700 text-center hover:bg-slate-800 transition-colors">
-                        <div class="w-10 h-10 bg-slate-900 rounded-full mx-auto mb-2 flex items-center justify-center text-sky-400"><img src="https://guillaume-sanchez.fr/images/cyberusgate/erkin.jpeg" alt="Chart Line Icon" class="rounded-full"></div>
+                        <div class="w-20 h-20 bg-slate-900 rounded-full mx-auto mb-2 flex items-center justify-center text-sky-400"><img src="https://guillaume-sanchez.fr/images/cyberusgate/erkin.jpeg" alt="Chart Line Icon" class="rounded-full"></div>
                         <h3 class="font-bold text-sm">Erkin</h3>
                         <p class="text-sky-400 text-[11px] mb-1">Dir. Commercial</p>
                         <p class="text-[10px] text-slate-400 leading-tight">Acquisition, Marketing<br>Modernisation B2B</p>
                     </div>
                     <!-- Antoine -->
                     <div class="bg-slate-800/80 p-4 rounded-2xl border border-slate-700 text-center hover:bg-slate-800 transition-colors">
-                        <div class="w-10 h-10 bg-slate-900 rounded-full mx-auto mb-2 flex items-center justify-center text-sky-400"><img src="https://guillaume-sanchez.fr/images/cyberusgate/antoine.jpeg" alt="Coins Icon" class="rounded-full"></div>
+                        <div class="w-20 h-20 bg-slate-900 rounded-full mx-auto mb-2 flex items-center justify-center text-sky-400"><img src="https://guillaume-sanchez.fr/images/cyberusgate/antoine.jpeg" alt="Coins Icon" class="rounded-full"></div>
                         <h3 class="font-bold text-sm">Antoine</h3>
                         <p class="text-sky-400 text-[11px] mb-1">Dir. Financier</p>
                         <p class="text-[10px] text-slate-400 leading-tight">Infrastructure & Finance<br>Pérennité du modèle</p>