feat(design): integrate OuiHeberg/OVHcloud comparison matrix and trust banner into live site

Idées/MASTER_ROADMAP_500_ETAPES.md

@@ -216,9 +216,9 @@
 - [x] **Étape 189** : Première connexion réussie sur l'interface d'administration Pterodactyl
 - [ ] **Étape 190** : Activation obligatoire de l'authentification à deux facteurs (2FA TOTP) sur le compte admin
 - [x] **Étape 191** : Personnalisation du titre de la plateforme dans les paramètres : Forgium Cloud (validé en prod)
-- [ ] **Étape 192** : Création de la première zone géographique d'hébergement : 'Garage-Node1 (France)'
+- [x] **Étape 192** : Création de la première zone géographique d'hébergement : 'Garage-Node1 (France)'
-- [ ] **Étape 193** : Création de la clé d'API d'administration Pterodactyl avec tous les droits de gestion
+- [x] **Étape 193** : Création de la clé d'API d'administration Pterodactyl avec tous les droits de gestion
-- [ ] **Étape 194** : Stockage chiffré de la clé d'API pour la future passerelle de commande automatique
+- [x] **Étape 194** : Stockage chiffré de la clé d'API pour la passerelle de commande automatique Paymenter (CT 103)
 - [ ] **Étape 195** : Contrôle de la charge système du CT Panel (CPU < 2%, RAM < 400 Mo au repos)
 - [ ] **Étape 196** : Mise en place d'un script de sauvegarde quotidien de la base MariaDB (mysqldump gzip)
 - [ ] **Étape 197** : Test de restauration de la base de données sur une instance de test pour valider le backup

site-web/index.html

@@ -85,30 +85,40 @@
 
     <!-- APERÇU RAPIDE DES OFFRES -->
     <section class="container section">
+        <div class="free-banner">
+            <div class="free-banner-content">
+                <span class="free-badge">OFFRE DE LANCEMENT</span>
+                <div class="free-banner-text">
+                    Accès libre à nos infrastructures : <strong>0.00 € / mois</strong> sur l'ensemble de notre catalogue. Déploiement automatique en 15 secondes.
+                </div>
+            </div>
+            <a href="https://client.forgium.fr" class="btn btn-sm btn-primary">Créer mon compte &rarr;</a>
+        </div>
+
         <div class="section-head">
-            <div class="section-tag">CATALOGUE OFFICIEL</div>
+            <div class="section-tag">CATALOGUE OFFICIEL • ACCÈS LIBRE 0.00 €</div>
             <h2>Des Solutions Pensées Pour Vous</h2>
-            <p>Découvrez notre gamme complète d'hébergement sans engagement.</p>
+            <p>Hébergez vos serveurs de jeux et vos applications sur du matériel dédié non partagé.</p>
         </div>
 
         <div class="quick-cards">
             <div class="quick-card">
                 <div class="quick-icon">🎮</div>
-                <h3>Serveurs Minecraft</h3>
+                <h3>Serveurs Minecraft (0.00 €)</h3>
                 <p>Paper, Fabric, Forge installables en 1 clic avec des performances sans lag pour vos joueurs.</p>
-                <a href="offres.html#minecraft" class="quick-link">Voir les formules Minecraft &rarr;</a>
+                <a href="https://client.forgium.fr" class="quick-link">Déployer sur Pterodactyl &rarr;</a>
             </div>
             <div class="quick-card">
                 <div class="quick-icon">🤖</div>
-                <h3>Bots Discord & Apps</h3>
+                <h3>Bots Discord & Apps (0.00 €)</h3>
                 <p>Hébergez vos bots en Python, Node.js ou Java avec redémarrage automatique 24/7.</p>
-                <a href="offres.html#bots" class="quick-link">Voir les formules Bots &rarr;</a>
+                <a href="https://client.forgium.fr" class="quick-link">Déployer mon bot &rarr;</a>
             </div>
             <div class="quick-card">
                 <div class="quick-icon">🛡️</div>
                 <h3>Forge Shield Protection</h3>
                 <p>Bouclier réseau multicouche et sauvegardes automatiques quotidiennes pour chaque serveur.</p>
-                <a href="infrastructure.html" class="quick-link">En savoir plus &rarr;</a>
+                <a href="infrastructure.html" class="quick-link">Notre architecture &rarr;</a>
             </div>
         </div>
     </section>

site-web/offres.html

@@ -37,9 +37,40 @@
 
     <main class="container section">
         <div class="section-head">
-            <div class="section-tag">CATALOGUE OFFICIEL</div>
+            <div class="section-tag">CATALOGUE OFFICIEL • LIVRAISON IMMÉDIATE</div>
-            <h2>Nos Formules d'Hébergement</h2>
+            <h2>Des Formules Haute Performance à 0.00 €</h2>
-            <p>Des ressources réelles réservées pour chaque client. Déploiement automatisé instantané.</p>
+            <p>Infrastructure matérielle souveraine sur AMD Ryzen 7 & SSD NVMe. Provisionnement automatisé 24/7 en quelques secondes.</p>
+        </div>
+
+        <!-- BANNIÈRE ACCÈS LIBRE 0.00 € -->
+        <div class="free-banner">
+            <div class="free-banner-content">
+                <span class="free-badge">OFFRE DE LANCEMENT</span>
+                <div class="free-banner-text">
+                    Toutes nos formules sont actuellement à <strong>0.00 € / mois</strong> sans engagement. Créez votre compte, commandez et votre serveur est instantanément déployé sur notre cluster !
+                </div>
+            </div>
+            <a href="https://client.forgium.fr" class="btn btn-sm btn-primary">Créer mon compte &rarr;</a>
+        </div>
+
+        <!-- TRUST STRIP (Style OuiHeberg / OVHcloud) -->
+        <div class="trust-strip">
+            <div class="trust-item">
+                <span class="trust-icon">⚡</span>
+                <span>Déploiement en &lt; 15s</span>
+            </div>
+            <div class="trust-item">
+                <span class="trust-icon">🛡️</span>
+                <span>Anti-DDoS Game Inclus</span>
+            </div>
+            <div class="trust-item">
+                <span class="trust-icon">🇫🇷</span>
+                <span>Hébergé 100% en France</span>
+            </div>
+            <div class="trust-item">
+                <span class="trust-icon">⚙️</span>
+                <span>Panel Pterodactyl & Monaco Editor</span>
+            </div>
         </div>
 
         <div class="pricing-grid">
@@ -152,6 +183,90 @@
                 <a href="#cloud" class="btn btn-block btn-outline">Bientôt Disponible</a>
             </div>
         </div>
+
+        <!-- TABLEAU COMPARATIF DÉTAILLÉ (Style PlanetHoster / OVHcloud) -->
+        <section class="comparison-section">
+            <div class="section-head">
+                <div class="section-tag">MATRICE TECHNIQUE</div>
+                <h2>Comparatif Exhaustif des Formules</h2>
+                <p>Chaque serveur dispose de son propre conteneur isolé avec ressources dédiées non partagées.</p>
+            </div>
+
+            <div class="table-responsive">
+                <table class="compare-table">
+                    <thead>
+                        <tr>
+                            <th>Fonctionnalité / Spécification</th>
+                            <th>Bot Discord (Node/Python)</th>
+                            <th>Minecraft Starter</th>
+                            <th>Minecraft Community</th>
+                        </tr>
+                    </thead>
+                    <tbody>
+                        <tr>
+                            <td><strong>Tarif Mensuel</strong></td>
+                            <td class="val-highlight">0.00 € (Offert)</td>
+                            <td class="val-highlight">0.00 € (Offert)</td>
+                            <td class="val-highlight">0.00 € (Offert)</td>
+                        </tr>
+                        <tr>
+                            <td><strong>Moteur Processeur</strong></td>
+                            <td>1 vCPU AMD Ryzen 7 3700X</td>
+                            <td>1.5 vCPU Dédié</td>
+                            <td>2 vCPU Multi-thread</td>
+                        </tr>
+                        <tr>
+                            <td><strong>Mémoire RAM Garantie</strong></td>
+                            <td>512 Mo DDR4</td>
+                            <td>1536 Mo (1.5 Go)</td>
+                            <td>RAM Adaptative</td>
+                        </tr>
+                        <tr>
+                            <td><strong>Stockage SSD NVMe</strong></td>
+                            <td>2 Go Ultra-Rapide</td>
+                            <td>5 Go PCIe 4.0</td>
+                            <td>SSD NVMe Dédié</td>
+                        </tr>
+                        <tr>
+                            <td><strong>Protection DDoS Forgium Shield</strong></td>
+                            <td class="check-green">✓ Couche 3/4/7</td>
+                            <td class="check-green">✓ Couche 3/4/7</td>
+                            <td class="check-green">✓ Couche 3/4/7 Spécial Jeux</td>
+                        </tr>
+                        <tr>
+                            <td><strong>Accès SFTP & Gestionnaire de Fichiers</strong></td>
+                            <td class="check-green">✓ Inclus</td>
+                            <td class="check-green">✓ Monaco Editor (VS Code)</td>
+                            <td class="check-green">✓ Monaco Editor (VS Code)</td>
+                        </tr>
+                        <tr>
+                            <td><strong>Sauvegardes Automatiques</strong></td>
+                            <td class="check-green">✓ 1 Snapshot</td>
+                            <td class="check-green">✓ 1 Sauvegarde Quotidienne</td>
+                            <td class="check-green">✓ Multiples Sauvegardes</td>
+                        </tr>
+                        <tr>
+                            <td><strong>Console Interactive en Direct</strong></td>
+                            <td class="check-green">✓ Websocket SSL</td>
+                            <td class="check-green">✓ Websocket SSL</td>
+                            <td class="check-green">✓ Websocket SSL</td>
+                        </tr>
+                        <tr>
+                            <td><strong>Engagement</strong></td>
+                            <td>Sans engagement (Résiliez en 1 clic)</td>
+                            <td>Sans engagement</td>
+                            <td>Sans engagement</td>
+                        </tr>
+                        <tr>
+                            <td><strong>Action</strong></td>
+                            <td><a href="https://client.forgium.fr" class="btn btn-sm btn-outline">Commander</a></td>
+                            <td><a href="https://client.forgium.fr" class="btn btn-sm btn-primary">Déployer (0.00 €)</a></td>
+                            <td><a href="https://client.forgium.fr" class="btn btn-sm btn-outline">Commander</a></td>
+                        </tr>
+                    </tbody>
+                </table>
+            </div>
+        </section>
     </main>
 
     <footer class="footer-wrapper">

site-web/style.css

@@ -735,13 +735,131 @@ h1 {
     padding: 2rem;
 }
 
-.contact-box h3 {
+/* TRUST BADGES & METRICS (Inspiré OuiHeberg / OVHcloud) */
-    font-size: 1.4rem;
+.trust-strip {
-    margin-bottom: 0.5rem;
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: center;
+    align-items: center;
+    gap: 2.5rem;
+    padding: 1.5rem 2rem;
+    margin: 2rem auto 3.5rem;
+    background: rgba(15, 23, 42, 0.45);
+    border: 1px solid rgba(255, 255, 255, 0.08);
+    border-radius: 16px;
+    backdrop-filter: blur(12px);
 }
 
-.contact-box p {
+.trust-item {
-    color: var(--text-muted);
+    display: flex;
-    margin-bottom: 1.8rem;
+    align-items: center;
+    gap: 0.75rem;
+    font-size: 0.92rem;
+    font-weight: 600;
+    color: var(--text-main);
 }
 
+.trust-item .trust-icon {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 32px;
+    height: 32px;
+    border-radius: 8px;
+    background: rgba(56, 189, 248, 0.12);
+    border: 1px solid rgba(56, 189, 248, 0.25);
+    color: var(--accent-cyan);
+}
+
+/* FREE BANNER NOTIFICATION */
+.free-banner {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    flex-wrap: wrap;
+    gap: 1rem;
+    background: linear-gradient(90deg, rgba(37, 99, 235, 0.2) 0%, rgba(56, 189, 248, 0.15) 100%);
+    border: 1px solid rgba(56, 189, 248, 0.35);
+    border-radius: 16px;
+    padding: 1.2rem 1.8rem;
+    margin-bottom: 2.5rem;
+}
+
+.free-banner-content {
+    display: flex;
+    align-items: center;
+    gap: 1rem;
+}
+
+.free-badge {
+    background: #10b981;
+    color: #fff;
+    font-size: 0.75rem;
+    font-weight: 800;
+    padding: 0.3rem 0.7rem;
+    border-radius: 9999px;
+    letter-spacing: 0.5px;
+    text-transform: uppercase;
+}
+
+.free-banner-text {
+    font-size: 0.95rem;
+    font-weight: 500;
+}
+
+.free-banner-text strong {
+    color: var(--accent-cyan);
+}
+
+/* COMPARISON TABLE (Inspiré PlanetHoster & OVHcloud) */
+.comparison-section {
+    margin: 4.5rem 0;
+}
+
+.table-responsive {
+    overflow-x: auto;
+    border-radius: 18px;
+    border: 1px solid var(--border);
+    background: var(--bg-card);
+    backdrop-filter: blur(16px);
+}
+
+.compare-table {
+    width: 100%;
+    border-collapse: collapse;
+    text-align: left;
+    font-size: 0.92rem;
+}
+
+.compare-table th, .compare-table td {
+    padding: 1.1rem 1.5rem;
+    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
+}
+
+.compare-table th {
+    background: rgba(11, 17, 32, 0.85);
+    font-weight: 700;
+    color: var(--text-main);
+    font-size: 0.95rem;
+}
+
+.compare-table tr:last-child td {
+    border-bottom: none;
+}
+
+.compare-table tr:hover td {
+    background: rgba(255, 255, 255, 0.02);
+}
+
+.check-green {
+    color: #34d399;
+    font-weight: 800;
+}
+
+.val-highlight {
+    font-family: 'JetBrains Mono', monospace;
+    font-weight: 700;
+    color: var(--accent-cyan);
+}
+
+