From d2de92a19912e3aecdb29d4ab5d43964fcfea653 Mon Sep 17 00:00:00 2001
From: oimwiodev <fedora-heremes@me.com>
Date: Sat, 20 Jun 2026 18:23:43 +0100
Subject: [PATCH] feat: standalone check-order page, backup drives page, nav
 links, cookies, confirmed-order delete guard

---
 __pycache__/server.cpython-311.pyc |  Bin 0 -> 39315 bytes
 backup-drives.html                 |  238 +++++
 check-order.html                   |  228 +++++
 index.html                         | 1317 ++++++++++++++--------------
 server.py                          |    7 +
 5 files changed, 1131 insertions(+), 659 deletions(-)
 create mode 100644 __pycache__/server.cpython-311.pyc
 create mode 100644 backup-drives.html
 create mode 100644 check-order.html

diff --git a/__pycache__/server.cpython-311.pyc b/__pycache__/server.cpython-311.pyc
new file mode 100644
index 0000000000000000000000000000000000000000..27d2db03cb9f651a9313c7b3cde6d521803a7a0c
GIT binary patch
literal 39315
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

literal 0
HcmV?d00001

diff --git a/backup-drives.html b/backup-drives.html
new file mode 100644
index 0000000..881672a
--- /dev/null
+++ b/backup-drives.html
@@ -0,0 +1,238 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<title>Vela — Backup Drives</title>
+<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap" rel="stylesheet">
+<style>
+  *,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
+  :root{--bg:#0a0a0b;--bg-card:#121214;--bg-card-hover:#1a1a1e;--border:#1e1e22;--border-hover:#2a2a30;--text:#e8e8ed;--text-dim:#888891;--text-muted:#5c5c66;--accent:#6c5ce7;--accent-hover:#7f6ff0;--accent-glow:rgba(108,92,231,0.15);--green:#00c951;--orange:#ff922b;--red:#ff4757;--radius:12px;--radius-sm:8px;--nav-bg:rgba(10,10,11,0.8)}
+  .light{--bg:#f5f5f7;--bg-card:#ffffff;--bg-card-hover:#f0f0f2;--border:#d2d2d7;--border-hover:#c0c0c5;--text:#1d1d1f;--text-dim:#6e6e73;--text-muted:#aeaeb2;--accent:#5e5ce6;--accent-hover:#4a48d4;--accent-glow:rgba(94,92,230,0.12);--green:#34c759;--orange:#ff9500;--red:#ff3b30;--nav-bg:rgba(245,245,247,0.85)}
+  html{scroll-behavior:smooth}
+  body{font-family:'Inter',-apple-system,sans-serif;background:var(--bg);color:var(--text);line-height:1.6;-webkit-font-smoothing:antialiased}
+  .en .fr-only,.fr .en-only{display:none!important}
+  nav{position:fixed;top:0;left:0;right:0;z-index:100;padding:1rem 2rem;display:flex;align-items:center;justify-content:space-between;background:var(--nav-bg);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--border)}
+  .nav-logo{font-weight:800;font-size:1.3rem;letter-spacing:-0.03em;color:var(--text);text-decoration:none}
+  .nav-logo .dot{color:var(--accent)}
+  .nav-links{display:flex;gap:2rem;align-items:center}
+  .nav-links a{color:var(--text-dim);text-decoration:none;font-size:0.875rem;font-weight:500;transition:color .2s}
+  .nav-links a:hover{color:var(--text)}
+  .nav-links a.active{color:var(--accent)}
+  .theme-btn{font-size:1.15rem;background:transparent;border:none;cursor:pointer;padding:.2rem;color:var(--text-dim);transition:color .2s;line-height:1;touch-action:manipulation;display:inline-flex;align-items:center}
+  .theme-btn:hover{color:var(--text)}
+  .btn{display:inline-flex;align-items:center;gap:.5rem;padding:.7rem 1.5rem;border-radius:var(--radius-sm);font-weight:600;font-size:.9rem;text-decoration:none;cursor:pointer;transition:all .2s;border:none;font-family:inherit}
+  .btn-primary{background:var(--accent);color:#fff;box-shadow:0 0 24px var(--accent-glow)}
+  .btn-primary:hover{background:var(--accent-hover);transform:translateY(-1px)}
+  .btn-ghost{background:transparent;color:var(--text);border:1px solid var(--border)}
+  .btn-ghost:hover{border-color:var(--border-hover);background:var(--bg-card)}
+  .hero{min-height:100vh;display:flex;flex-direction:column;justify-content:center;padding:6rem 2rem 4rem;max-width:1200px;margin:0 auto}
+  .hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}
+  .hero-badge{display:inline-flex;align-items:center;gap:.5rem;padding:.35rem .85rem;border-radius:100px;background:rgba(108,92,231,.1);border:1px solid rgba(108,92,231,.2);font-size:.8rem;color:var(--accent);font-weight:500;margin-bottom:1.5rem;width:fit-content}
+  .hero h1{font-size:clamp(2rem,4vw,3.2rem);font-weight:900;letter-spacing:-.04em;line-height:1.1;margin-bottom:1.5rem}
+  .hero h1 .highlight{color:var(--accent)}
+  .hero p{font-size:1.05rem;color:var(--text-dim);max-width:520px;margin-bottom:2rem;line-height:1.7}
+  .hero-actions{display:flex;gap:1rem;flex-wrap:wrap}
+  section{padding:4rem 2rem}
+  .section-inner{max-width:1000px;margin:0 auto}
+  .section-label{font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;color:var(--accent);font-weight:600;margin-bottom:.75rem}
+  .section-title{font-size:clamp(1.5rem,3vw,2.2rem);font-weight:800;letter-spacing:-.03em;margin-bottom:1rem}
+  .section-sub{color:var(--text-dim);font-size:1rem;max-width:600px;margin-bottom:2.5rem}
+  .drive-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.5rem}
+  .drive-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:2rem;transition:all .2s}
+  .drive-card:hover{border-color:var(--border-hover);background:var(--bg-card-hover)}
+  .drive-icon{font-size:2.2rem;margin-bottom:1rem}
+  .drive-name{font-size:1.2rem;font-weight:700;margin-bottom:.25rem}
+  .drive-type{font-size:.78rem;color:var(--accent);font-family:'Inter',monospace;margin-bottom:1rem}
+  .drive-specs{list-style:none}
+  .drive-specs li{padding:.45rem 0;font-size:.88rem;color:var(--text-dim);border-bottom:1px solid var(--border);display:flex;align-items:center;gap:.5rem}
+  .drive-specs li:last-child{border-bottom:none}
+  .drive-specs .check{color:var(--green)}
+  .drive-specs .x{color:var(--red)}
+  .drive-price{font-size:.85rem;color:var(--text-dim);margin-top:1.25rem;display:flex;align-items:baseline;gap:.35rem}
+  .drive-price .amount{font-size:1.5rem;font-weight:800;color:var(--text)}
+  .comparison-section{background:var(--bg-card);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
+  .compare-table{width:100%;border-collapse:collapse;overflow:hidden;display:block;overflow-x:auto}
+  .compare-table th,.compare-table td{text-align:left;padding:.75rem 1rem;font-size:.85rem;border-bottom:1px solid var(--border)}
+  .compare-table th{background:rgba(108,92,231,.08);font-weight:600;font-size:.75rem;text-transform:uppercase;letter-spacing:.06em;color:var(--text-dim)}
+  .compare-table tr:last-child td{border-bottom:none}
+  .compare-table .yes{color:var(--green);font-weight:600}
+  .compare-table .no{color:var(--red)}
+  .faq-item{border-bottom:1px solid var(--border);padding:1.25rem 0}
+  .faq-q{font-weight:600;cursor:pointer;display:flex;justify-content:space-between;align-items:center;user-select:none}
+  .faq-q .arrow{transition:transform .2s;color:var(--text-dim)}
+  .faq-item.open .faq-q .arrow{transform:rotate(180deg)}
+  .faq-a{max-height:0;overflow:hidden;transition:max-height .3s,padding .3s;color:var(--text-dim);font-size:.9rem}
+  .faq-item.open .faq-a{max-height:300px}
+  .faq-a>div{padding-top:1rem}
+  .cta-section{text-align:center;padding:5rem 2rem}
+  .cta-section h2{font-size:clamp(1.5rem,3vw,2rem);font-weight:800;margin-bottom:1rem}
+  .cta-section p{color:var(--text-dim);margin-bottom:1.5rem}
+  footer{border-top:1px solid var(--border);padding:2rem;text-align:center;color:var(--text-muted);font-size:.8rem}
+  @media(max-width:768px){.hero-grid{grid-template-columns:1fr;gap:2rem}nav{padding:.75rem 1rem}.nav-links{gap:1rem}.nav-links a{font-size:.78rem}.drive-grid{grid-template-columns:1fr}}
+</style>
+<script>(function(){var t=localStorage.getItem('vela_theme');if(t==='light'||(!t&&window.matchMedia('(prefers-color-scheme:light)').matches))document.documentElement.classList.add('light');var l=(navigator.language||navigator.userLanguage||'en').slice(0,2);document.documentElement.classList.add(l==='fr'?'fr':'en')})();</script>
+</head>
+<body>
+
+<nav>
+  <a href="/" class="nav-logo">VELA<span class="dot">.</span></a>
+  <div class="nav-links">
+    <a href="/"><span class="en-only">Home</span><span class="fr-only">Accueil</span></a>
+    <a href="/check-order.html"><span class="en-only">Check Order</span><span class="fr-only">Suivi</span></a>
+    <a href="/backup-drives.html" class="active"><span class="en-only">Backup Drives</span><span class="fr-only">Disques Backup</span></a>
+    <button class="theme-btn" id="themeToggle" onclick="toggleTheme()" title="Toggle theme"></button>
+  </div>
+</nav>
+
+<!-- Hero -->
+<section class="hero" id="top">
+  <div class="hero-grid">
+    <div>
+      <div class="hero-badge">
+        <span class="en-only">🛡️ Data Protection</span><span class="fr-only">🛡️ Protection des Données</span>
+      </div>
+      <h1>
+        <span class="en-only">Backup drives.<br><span class="highlight">Because data happens.</span></span>
+        <span class="fr-only">Disques de sauvegarde.<br><span class="highlight">Parce que les données comptent.</span></span>
+      </h1>
+      <p class="en-only">Every server tier can be upgraded with an automated backup drive. We handle the setup — rsync, snapshots, or whatever makes sense for your use case.</p>
+      <p class="fr-only">Chaque offre serveur peut être améliorée avec un disque de sauvegarde automatisé. Nous gérons la configuration — rsync, snapshots, selon vos besoins.</p>
+      <div class="hero-actions">
+        <a href="#drives" class="btn btn-primary"><span class="en-only">See Options →</span><span class="fr-only">Voir les options →</span></a>
+        <a href="/#contact" class="btn btn-ghost"><span class="en-only">Get a Quote</span><span class="fr-only">Demander un devis</span></a>
+      </div>
+    </div>
+    <div style="display:grid;grid-template-columns:1fr;gap:1rem">
+      <div style="background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:1.5rem;text-align:center">
+        <div style="font-size:2.5rem;font-weight:800;letter-spacing:-.03em;color:var(--accent)">2x</div>
+        <div style="font-size:.85rem;color:var(--text-dim);margin-top:.25rem"><span class="en-only">Backup tiers available</span><span class="fr-only">Offres backup disponibles</span></div>
+      </div>
+      <div style="background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:1.5rem;text-align:center">
+        <div style="font-size:2.5rem;font-weight:800;letter-spacing:-.03em;color:var(--green)">24/7</div>
+        <div style="font-size:.85rem;color:var(--text-dim);margin-top:.25rem"><span class="en-only">Automated, silent backups</span><span class="fr-only">Sauvegardes automatisées et silencieuses</span></div>
+      </div>
+    </div>
+  </div>
+</section>
+
+<!-- Drive Options -->
+<section id="drives">
+  <div class="section-inner">
+    <div class="section-label"><span class="en-only">Add-ons</span><span class="fr-only">Options</span></div>
+    <h2 class="section-title"><span class="en-only">Protect your data without thinking about it.</span><span class="fr-only">Protégez vos données sans y penser.</span></h2>
+    <p class="section-sub en-only">Add a backup drive to any server tier. We configure it, test it, and leave it running silently. You get notified if something goes wrong.</p>
+    <p class="section-sub fr-only">Ajoutez un disque de sauvegarde à n'importe quelle offre. Nous le configurons, le testons, et il tourne en silence. Vous êtes notifié en cas de problème.</p>
+    <div class="drive-grid">
+      <div class="drive-card">
+        <div class="drive-icon">💾</div>
+        <div class="drive-name"><span class="en-only">Backup 512</span><span class="fr-only">Backup 512</span></div>
+        <div class="drive-type">512 GB SSD</div>
+        <ul class="drive-specs">
+          <li><span class="check">✓</span> <span class="en-only">512 GB SATA SSD</span><span class="fr-only">512 Go SSD SATA</span></li>
+          <li><span class="check">✓</span> <span class="en-only">Daily automated rsync</span><span class="fr-only">Rsync automatisé quotidien</span></li>
+          <li><span class="check">✓</span> <span class="en-only">Snapshot retention: 7 days</span><span class="fr-only">Rétention snapshots : 7 jours</span></li>
+          <li><span class="check">✓</span> <span class="en-only">Email alert on failure</span><span class="fr-only">Alerte email en cas d'échec</span></li>
+          <li><span class="x">✗</span> <span class="en-only">Off-site backup</span><span class="fr-only">Sauvegarde hors-site</span></li>
+        </ul>
+        <div class="drive-price"><span class="en-only">Add</span><span class="fr-only">Ajout</span> <span class="amount">—</span></div>
+      </div>
+      <div class="drive-card" style="border-color:var(--accent);background:linear-gradient(135deg,rgba(108,92,231,.06),transparent 60%)">
+        <div class="drive-icon">💿</div>
+        <div class="drive-name"><span class="en-only">Backup 1TB</span><span class="fr-only">Backup 1 To</span></div>
+        <div class="drive-type">1 TB SSD</div>
+        <ul class="drive-specs">
+          <li><span class="check">✓</span> <span class="en-only">1 TB SATA SSD</span><span class="fr-only">1 To SSD SATA</span></li>
+          <li><span class="check">✓</span> <span class="en-only">Daily automated rsync</span><span class="fr-only">Rsync automatisé quotidien</span></li>
+          <li><span class="check">✓</span> <span class="en-only">Snapshot retention: 14 days</span><span class="fr-only">Rétention snapshots : 14 jours</span></li>
+          <li><span class="check">✓</span> <span class="en-only">Email alert on failure</span><span class="fr-only">Alerte email en cas d'échec</span></li>
+          <li><span class="x">✗</span> <span class="en-only">Off-site backup</span><span class="fr-only">Sauvegarde hors-site</span></li>
+        </ul>
+        <div class="drive-price"><span class="en-only">Add</span><span class="fr-only">Ajout</span> <span class="amount">—</span></div>
+      </div>
+    </div>
+  </div>
+</section>
+
+<!-- Comparison -->
+<section class="comparison-section" id="compare">
+  <div class="section-inner">
+    <div class="section-label"><span class="en-only">At a glance</span><span class="fr-only">Comparatif</span></div>
+    <h2 class="section-title"><span class="en-only">Which backup fits?</span><span class="fr-only">Quel backup vous convient ?</span></h2>
+    <p class="section-sub en-only">Both drives are pre-configured and work out of the box. Choose based on how much data you need to protect.</p>
+    <p class="section-sub fr-only">Les deux disques sont pré-configurés et fonctionnent immédiatement. Choisissez selon la quantité de données à protéger.</p>
+    <div class="compare-table">
+      <table style="width:100%;border-collapse:collapse;min-width:500px">
+        <thead>
+          <tr>
+            <th><span class="en-only">Feature</span><span class="fr-only">Fonctionnalité</span></th>
+            <th>Backup 512</th>
+            <th>Backup 1TB</th>
+          </tr>
+        </thead>
+        <tbody>
+          <tr><td style="font-weight:600"><span class="en-only">Capacity</span><span class="fr-only">Capacité</span></td><td><span class="en-only">512 GB SSD</span><span class="fr-only">512 Go SSD</span></td><td><span class="en-only">1 TB SSD</span><span class="fr-only">1 To SSD</span></td></tr>
+          <tr><td style="font-weight:600"><span class="en-only">Backup Method</span><span class="fr-only">Méthode</span></td><td colspan="2">rsync + snapshots (btrfs / ZFS)</td></tr>
+          <tr><td style="font-weight:600"><span class="en-only">Frequency</span><span class="fr-only">Fréquence</span></td><td colspan="2"><span class="en-only">Daily (configurable)</span><span class="fr-only">Quotidienne (configurable)</span></td></tr>
+          <tr><td style="font-weight:600"><span class="en-only">Snapshot Retention</span><span class="fr-only">Rétention</span></td><td>7 days</td><td>14 days</td></tr>
+          <tr><td style="font-weight:600"><span class="en-only">Failure Alerts</span><span class="fr-only">Alertes</span></td><td class="yes">✓ Email</td><td class="yes">✓ Email</td></tr>
+          <tr><td style="font-weight:600"><span class="en-only">Hot-swap</span><span class="fr-only">Remplacement à chaud</span></td><td class="no">✗</td><td class="yes">✓ <span class="en-only">Supported</span><span class="fr-only">Supporté</span></td></tr>
+          <tr><td style="font-weight:600"><span class="en-only">On-site Install</span><span class="fr-only">Installation sur place</span></td><td class="yes">✓</td><td class="yes">✓</td></tr>
+        </tbody>
+      </table>
+    </div>
+  </div>
+</section>
+
+<!-- FAQ -->
+<section style="background:var(--bg)">
+  <div class="section-inner" style="max-width:720px">
+    <div class="section-label">FAQ</div>
+    <h2 class="section-title"><span class="en-only">Backup questions, answered.</span><span class="fr-only">Questions backup, réponses.</span></h2>
+    <div class="faq-list">
+      <div class="faq-item" onclick="this.classList.toggle('open')">
+        <div class="faq-q"><span class="en-only">Can I add a backup after the server is installed?</span><span class="fr-only">Puis-je ajouter un backup après installation ?</span><span class="arrow">▾</span></div>
+        <div class="faq-a"><div><span class="en-only">Yes. As long as your server has a free SATA port and physical space, we can add a drive and configure it on a return visit.</span><span class="fr-only">Oui. Tant que votre serveur a un port SATA libre, nous pouvons ajouter un disque et le configurer lors d'une visite.</span></div></div>
+      </div>
+      <div class="faq-item" onclick="this.classList.toggle('open')">
+        <div class="faq-q"><span class="en-only">What happens if the backup drive fails?</span><span class="fr-only">Que se passe-t-il si le disque backup tombe en panne ?</span><span class="arrow">▾</span></div>
+        <div class="faq-a"><div><span class="en-only">You get an email alert. The primary drive keeps running — your server stays up. We can replace the backup drive on-site.</span><span class="fr-only">Vous recevez une alerte email. Le disque principal continue de fonctionner. Nous remplaçons le disque backup sur place.</span></div></div>
+      </div>
+      <div class="faq-item" onclick="this.classList.toggle('open')">
+        <div class="faq-q"><span class="en-only">Can I use the backup drive for extra storage?</span><span class="fr-only">Puis-je utiliser le backup comme stockage supplémentaire ?</span><span class="arrow">▾</span></div>
+        <div class="faq-a"><div><span class="en-only">It's possible, but not recommended. The backup drive is sized and configured for its job. Using it for storage can affect backup reliability.</span><span class="fr-only">Possible mais déconseillé. Le disque est dimensionné pour la sauvegarde. L'utiliser pour du stockage peut affecter sa fiabilité.</span></div></div>
+      </div>
+      <div class="faq-item" onclick="this.classList.toggle('open')">
+        <div class="faq-q"><span class="en-only">Do I need a Plus tier to add backup?</span><span class="fr-only">Faut-il une offre Plus pour ajouter un backup ?</span><span class="arrow">▾</span></div>
+        <div class="faq-a"><div><span class="en-only">No. You can add a backup drive to any tier — Rif, Rif+, Atlas, or Atlas+. The Plus tiers include a backup by default.</span><span class="fr-only">Non. Vous pouvez ajouter un backup à n'importe quelle offre — Rif, Rif+, Atlas ou Atlas+. Les offres Plus incluent un backup par défaut.</span></div></div>
+      </div>
+    </div>
+  </div>
+</section>
+
+<!-- CTA -->
+<section class="cta-section" style="border-top:1px solid var(--border)">
+  <h2><span class="en-only">Ready to secure your data?</span><span class="fr-only">Prêt à sécuriser vos données ?</span></h2>
+  <p class="en-only" style="max-width:450px;margin:0 auto 1.5rem">Add a backup drive to any server tier. We'll include it in the quote.</p>
+  <p class="fr-only" style="max-width:450px;margin:0 auto 1.5rem">Ajoutez un disque de sauvegarde à n'importe quelle offre. Nous l'incluons dans le devis.</p>
+  <a href="/#contact" class="btn btn-primary"><span class="en-only">Get a Quote</span><span class="fr-only">Demander un devis</span></a>
+</section>
+
+<footer>
+  <span class="en-only">Vela — Server Installation. Simply.</span>
+  <span class="fr-only">Vela — Installation de serveurs. Simplement.</span>
+</footer>
+
+<script>
+window.toggleTheme = function() {
+  const html = document.documentElement;
+  html.classList.toggle('light');
+  localStorage.setItem('vela_theme', html.classList.contains('light') ? 'light' : 'dark');
+  document.getElementById('themeToggle').textContent = html.classList.contains('light') ? '🌙' : '☀️';
+};
+(function() {
+  document.getElementById('themeToggle').textContent = document.documentElement.classList.contains('light') ? '🌙' : '☀️';
+})();
+</script>
+</body>
+</html>
diff --git a/check-order.html b/check-order.html
new file mode 100644
index 0000000..463e764
--- /dev/null
+++ b/check-order.html
@@ -0,0 +1,228 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<title>Vela — Check Order Status</title>
+<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap" rel="stylesheet">
+<style>
+  *,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
+  :root{--bg:#0a0a0b;--bg-card:#121214;--bg-card-hover:#1a1a1e;--border:#1e1e22;--border-hover:#2a2a30;--text:#e8e8ed;--text-dim:#888891;--text-muted:#5c5c66;--accent:#6c5ce7;--accent-hover:#7f6ff0;--accent-glow:rgba(108,92,231,0.15);--green:#00c951;--red:#ff4757;--nav-bg:rgba(10,10,11,0.8);--radius:12px;--radius-sm:8px}
+  .light{--bg:#f5f5f7;--bg-card:#ffffff;--bg-card-hover:#f0f0f2;--border:#d2d2d7;--border-hover:#c0c0c5;--text:#1d1d1f;--text-dim:#6e6e73;--text-muted:#aeaeb2;--accent:#5e5ce6;--accent-hover:#4a48d4;--accent-glow:rgba(94,92,230,0.12);--green:#34c759;--red:#ff3b30;--nav-bg:rgba(245,245,247,0.85)}
+  html{scroll-behavior:smooth}
+  body{font-family:'Inter',-apple-system,sans-serif;background:var(--bg);color:var(--text);line-height:1.6;-webkit-font-smoothing:antialiased;min-height:100vh;display:flex;flex-direction:column}
+  .en .fr-only,.fr .en-only{display:none!important}
+  nav{position:fixed;top:0;left:0;right:0;z-index:100;padding:1rem 2rem;display:flex;align-items:center;justify-content:space-between;background:var(--nav-bg);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--border)}
+  .nav-logo{font-weight:800;font-size:1.3rem;letter-spacing:-0.03em;color:var(--text);text-decoration:none}
+  .nav-logo .dot{color:var(--accent)}
+  .nav-links{display:flex;gap:2rem;align-items:center}
+  .nav-links a{color:var(--text-dim);text-decoration:none;font-size:0.875rem;font-weight:500;transition:color .2s}
+  .nav-links a:hover{color:var(--text)}
+  .nav-links a.active{color:var(--accent)}
+  .theme-btn{font-size:1.15rem;background:transparent;border:none;cursor:pointer;padding:.2rem;color:var(--text-dim);transition:color .2s;line-height:1;touch-action:manipulation;display:inline-flex;align-items:center}
+  .theme-btn:hover{color:var(--text)}
+  .btn{display:inline-flex;align-items:center;gap:.5rem;padding:.7rem 1.5rem;border-radius:var(--radius-sm);font-weight:600;font-size:.9rem;text-decoration:none;cursor:pointer;transition:all .2s;border:none;font-family:inherit}
+  .btn-primary{background:var(--accent);color:#fff;box-shadow:0 0 24px var(--accent-glow)}
+  .btn-primary:hover{background:var(--accent-hover);transform:translateY(-1px)}
+  .btn-ghost{background:transparent;color:var(--text);border:1px solid var(--border)}
+  .btn-ghost:hover{border-color:var(--border-hover);background:var(--bg-card)}
+  .btn-sm{padding:.4rem 1rem;font-size:.8rem}
+  .main{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:6rem 1.5rem 4rem;max-width:640px;margin:0 auto;width:100%}
+  .page-icon{font-size:2.5rem;margin-bottom:1rem}
+  h1{font-size:clamp(1.6rem,3vw,2.2rem);font-weight:800;letter-spacing:-.03em;margin-bottom:.5rem;text-align:center}
+  .sub{color:var(--text-dim);text-align:center;margin-bottom:2rem;font-size:.95rem;max-width:460px}
+  .card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:2rem;width:100%}
+  .field-wrapper{position:relative;display:flex;align-items:center;background:var(--bg-card);border-radius:10px;border:1.5px solid var(--border);transition:border-color .2s,box-shadow .2s;margin-bottom:1rem}
+  .field-wrapper:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px rgba(108,92,231,.18)}
+  .field-wrapper.error{border-color:#e03131}
+  .field-icon{position:absolute;left:14px;top:50%;transform:translateY(-50%);font-size:18px;color:var(--text-muted);pointer-events:none;transition:color .2s}
+  .field-wrapper:focus-within .field-icon{color:var(--accent)}
+  .field-input{width:100%;padding:14px 14px 14px 42px;font-family:'Inter',-apple-system,sans-serif;font-size:16px;font-weight:400;color:var(--text);background:transparent;border:none;border-radius:10px;outline:none}
+  .field-input::placeholder{color:var(--text-muted)}
+  .status-result{padding:1.25rem;border-radius:var(--radius-sm);margin-top:1.25rem;display:none}
+  .status-result.found{display:block;background:rgba(0,201,81,.08);border:1px solid rgba(0,201,81,.2)}
+  .status-result.not-found{display:block;background:rgba(255,71,87,.08);border:1px solid rgba(255,71,87,.2)}
+  .status-result .btn{margin-top:1rem}
+  .back-link{display:inline-flex;align-items:center;gap:.35rem;color:var(--text-dim);text-decoration:none;font-size:.85rem;margin-bottom:2rem;transition:color .2s}
+  .back-link:hover{color:var(--text)}
+  .remember-row{display:flex;align-items:center;gap:.5rem;margin-bottom:1rem;font-size:.8rem;color:var(--text-dim);cursor:pointer;user-select:none}
+  .remember-row input[type=checkbox]{accent-color:var(--accent);width:16px;height:16px;cursor:pointer}
+  footer{border-top:1px solid var(--border);padding:2rem;text-align:center;color:var(--text-muted);font-size:.8rem}
+  @media(max-width:768px){nav{padding:.75rem 1rem}.nav-links{gap:1rem}.nav-links a{font-size:.78rem}.main{padding:5rem 1rem 3rem}.card{padding:1.25rem}}
+</style>
+<script>(function(){var t=localStorage.getItem('vela_theme');if(t==='light'||(!t&&window.matchMedia('(prefers-color-scheme:light)').matches))document.documentElement.classList.add('light');var l=(navigator.language||navigator.userLanguage||'en').slice(0,2);document.documentElement.classList.add(l==='fr'?'fr':'en')})();</script>
+</head>
+<body>
+
+<nav>
+  <a href="/" class="nav-logo">VELA<span class="dot">.</span></a>
+  <div class="nav-links">
+    <a href="/"><span class="en-only">Home</span><span class="fr-only">Accueil</span></a>
+    <a href="/check-order.html" class="active"><span class="en-only">Check Order</span><span class="fr-only">Suivi</span></a>
+    <a href="/backup-drives.html"><span class="en-only">Backup Drives</span><span class="fr-only">Disques Backup</span></a>
+    <button class="theme-btn" id="themeToggle" onclick="toggleTheme()" title="Toggle theme"></button>
+  </div>
+</nav>
+
+<div class="main">
+  <div class="page-icon">🔍</div>
+  <h1 class="en-only">Check Your Order Status</h1>
+  <h1 class="fr-only">Vérifier le Statut de Votre Commande</h1>
+  <p class="sub en-only">Enter your email and phone to see where your order is. No password needed.</p>
+  <p class="sub fr-only">Entrez votre email et téléphone pour suivre votre commande. Sans mot de passe.</p>
+
+  <div class="card">
+    <div class="field-wrapper" id="checkEmailWrapper">
+      <span class="field-icon">✉</span>
+      <input class="field-input" type="email" id="checkEmail" placeholder="Email" autocomplete="email">
+    </div>
+    <div class="field-wrapper" id="checkPhoneWrapper">
+      <span class="field-icon">📞</span>
+      <input class="field-input" type="tel" id="checkPhone" placeholder="Phone number">
+    </div>
+    <label class="remember-row">
+      <input type="checkbox" id="rememberMe" checked>
+      <span class="en-only">Remember me (saves email &amp; phone for 30 days)</span>
+      <span class="fr-only">Se souvenir de moi (sauvegarde email &amp; téléphone 30 jours)</span>
+    </label>
+    <button class="btn btn-primary" id="checkBtn" style="width:100%;justify-content:center;padding:14px 24px;border-radius:10px;font-size:1rem">
+      <span class="en-only">Check Status</span><span class="fr-only">Vérifier</span>
+    </button>
+    <div class="status-result" id="statusResult"></div>
+  </div>
+</div>
+
+<footer>
+  <span class="en-only">Vela — Server Installation. Simply.</span>
+  <span class="fr-only">Vela — Installation de serveurs. Simplement.</span>
+</footer>
+
+<script>
+const API = 'http://192.168.1.30:8581';
+const COOKIE_NAME = 'vela_order_check';
+const STATUSES = ['received','confirmed','hardware ready','installing','completed'];
+
+function getCookie(name) {
+  const match = document.cookie.match('(^|;)\\s*' + name + '\\s*=\\s*([^;]+)');
+  return match ? decodeURIComponent(match[2]) : null;
+}
+
+function setCookie(name, value, days) {
+  const d = new Date();
+  d.setTime(d.getTime() + days * 86400000);
+  document.cookie = name + '=' + encodeURIComponent(value) + ';expires=' + d.toUTCString() + ';path=/';
+}
+
+function deleteCookie(name) {
+  document.cookie = name + '=;expires=Thu, 01 Jan 1970 00:00:00 UTC;path=/';
+}
+
+// Restore saved email/phone from cookie
+(function() {
+  const saved = getCookie(COOKIE_NAME);
+  if (saved) {
+    try {
+      const parsed = JSON.parse(saved);
+      if (parsed.email) document.getElementById('checkEmail').value = parsed.email;
+      if (parsed.phone) document.getElementById('checkPhone').value = parsed.phone;
+    } catch(e) {}
+  }
+})();
+
+// ── Theme ──
+window.toggleTheme = function() {
+  const html = document.documentElement;
+  html.classList.toggle('light');
+  const isLight = html.classList.contains('light');
+  localStorage.setItem('vela_theme', isLight ? 'light' : 'dark');
+  document.getElementById('themeToggle').textContent = isLight ? '🌙' : '☀️';
+};
+(function() {
+  const isLight = document.documentElement.classList.contains('light');
+  document.getElementById('themeToggle').textContent = isLight ? '🌙' : '☀️';
+})();
+
+// ── Check Status ──
+document.getElementById('checkBtn').addEventListener('click', async function() {
+  const email = document.getElementById('checkEmail').value.trim();
+  const phone = document.getElementById('checkPhone').value.trim();
+  const remember = document.getElementById('rememberMe').checked;
+  const result = document.getElementById('statusResult');
+  const isFr = document.documentElement.classList.contains('fr');
+
+  if (!email || !phone) {
+    result.className = 'status-result not-found';
+    result.textContent = isFr ? 'Veuillez entrer votre email et votre numéro.' : 'Please enter your email and phone.';
+    return;
+  }
+
+  // Save/clear cookie
+  if (remember) {
+    setCookie(COOKIE_NAME, JSON.stringify({email, phone}), 30);
+  } else {
+    deleteCookie(COOKIE_NAME);
+  }
+
+  try {
+    const resp = await fetch(API + '/api/status?email=' + encodeURIComponent(email) + '&phone=' + encodeURIComponent(phone));
+    if (resp.ok) {
+      const data = await resp.json();
+      let timelineHtml = '';
+      STATUSES.forEach((s, i) => {
+        const done = i <= data.status_index;
+        const active = i === data.status_index;
+        const labelsEn = {received:'Received',confirmed:'Confirmed','hardware ready':'Hardware Ready',installing:'Installing',completed:'Completed'};
+        const labelsFr = {received:'Reçue',confirmed:'Confirmée','hardware ready':'Matériel Prêt',installing:'Installation',completed:'Terminée'};
+        const label = isFr ? (labelsFr[s]||s) : (labelsEn[s]||s);
+        timelineHtml += '<div style="display:flex;align-items:center;gap:.75rem;margin-bottom:.6rem;opacity:'+(done?'1':'0.3')+'"><div style="width:26px;height:26px;border-radius:50%;background:'+(done?'var(--green)':'var(--border)')+';display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;flex-shrink:0;color:'+(done?'#fff':'var(--text-dim)')+'">'+(active?'●':done?'✓':'')+'</div><span style="font-size:.9rem;font-weight:'+(active?'600':'400')+'">'+label+'</span></div>';
+      });
+      if (data.status === 'cancelled') {
+        timelineHtml = '<div style="color:var(--red);font-weight:600;font-size:.9rem">'+(isFr?'❌ Commande annulée':'❌ Order cancelled')+'</div>';
+      }
+      const canDelete = data.status_index < 1;
+      const deleteBtn = canDelete
+        ? '<button class="btn btn-sm btn-ghost" onclick="deleteOrder(\'' + email + '\',\'' + phone + '\')" style="margin-top:.75rem">🗑 ' + (isFr ? 'Supprimer ma commande' : 'Delete my order') + '</button>'
+        : '';
+      result.className = 'status-result found';
+      result.innerHTML = '<div style="margin-bottom:.75rem;font-size:.82rem;color:var(--text-dim)"><strong style="color:var(--text)">#'+data.id+'</strong> — '+data.created_at.slice(0,10)+'</div>'+timelineHtml+deleteBtn;
+    } else if (resp.status === 404) {
+      result.className = 'status-result not-found';
+      result.innerHTML = isFr ? '❌ Aucune commande trouvée avec cet email et ce numéro.' : '❌ No order found with that email and phone.';
+    } else {
+      const err = await resp.json().catch(()=>({}));
+      result.className = 'status-result not-found';
+      result.textContent = err.detail || (isFr ? 'Erreur serveur.' : 'Server error.');
+    }
+  } catch (e) {
+    result.className = 'status-result not-found';
+    result.textContent = isFr ? 'Erreur de connexion au serveur.' : 'Server connection error.';
+  }
+});
+
+window.deleteOrder = async function(email, phone) {
+  const isFr = document.documentElement.classList.contains('fr');
+  if (!confirm(isFr ? 'Supprimer votre commande ? Cette action est irréversible.' : 'Delete your order? This cannot be undone.')) return;
+  try {
+    const resp = await fetch(API + '/api/submission?email=' + encodeURIComponent(email) + '&phone=' + encodeURIComponent(phone), { method: 'DELETE' });
+    const result = document.getElementById('statusResult');
+    if (resp.ok) {
+      result.className = 'status-result found';
+      result.innerHTML = isFr ? '✅ Commande supprimée.' : '✅ Order deleted.';
+      // Clear cookie since order is gone
+      deleteCookie(COOKIE_NAME);
+    } else {
+      const err = await resp.json().catch(()=>({}));
+      alert(err.detail || (isFr ? 'Erreur lors de la suppression.' : 'Error deleting order.'));
+    }
+  } catch (e) {
+    alert(isFr ? 'Erreur de connexion.' : 'Connection error.');
+  }
+};
+
+// Enter key support
+document.addEventListener('keydown', function(e) {
+  if (e.key === 'Enter') document.getElementById('checkBtn').click();
+});
+</script>
+</body>
+</html>
diff --git a/index.html b/index.html
index cf3c9d6..d801c90 100644
--- a/index.html
+++ b/index.html
@@ -1,688 +1,687 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>Tell us about you</title>
-  <style>
-    /* ===== Apple Reset & Base ===== */
-    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<title>Vela — Server Installation</title>
+<link rel="preconnect" href="https://fonts.googleapis.com">
+<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&family=JetBrains+Mono:wght@500&display=swap" rel="stylesheet">
+<script>
+(function(){
+  const lang = (navigator.language || navigator.userLanguage || 'en').slice(0, 2);
+  document.documentElement.classList.add(lang === 'fr' ? 'lang-fr' : 'lang-en');
+})();
+</script>
+<style>
+  *,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
+  :root{--bg:#0a0a0b;--bg-card:#121214;--bg-card-hover:#1a1a1e;--border:#1e1e22;--border-hover:#2a2a30;--text:#e8e8ed;--text-dim:#888891;--text-muted:#5c5c66;--accent:#6c5ce7;--accent-hover:#7f6ff0;--accent-glow:rgba(108,92,231,0.15);--green:#00c951;--red:#ff4757;--radius:12px;--radius-sm:8px;--nav-bg:rgba(10,10,11,0.8)}
+  .light{--bg:#f5f5f7;--bg-card:#ffffff;--bg-card-hover:#f0f0f2;--border:#d2d2d7;--border-hover:#c0c0c5;--text:#1d1d1f;--text-dim:#6e6e73;--text-muted:#aeaeb2;--accent:#5e5ce6;--accent-hover:#4a48d4;--accent-glow:rgba(94,92,230,0.12);--green:#34c759;--red:#ff3b30;--nav-bg:rgba(245,245,247,0.85)}
+  html{scroll-behavior:smooth}
+  body{font-family:'Inter',-apple-system,sans-serif;background:var(--bg);color:var(--text);line-height:1.6;-webkit-font-smoothing:antialiased}
+  .lang-en .fr-only,.lang-fr .en-only{display:none!important}
+  nav{position:fixed;top:0;left:0;right:0;z-index:100;padding:1rem 2rem;display:flex;align-items:center;justify-content:space-between;background:var(--nav-bg);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--border)}
+  .nav-logo{font-weight:800;font-size:1.3rem;letter-spacing:-0.03em;color:var(--text);text-decoration:none}
+  .nav-logo .dot{color:var(--accent)}
+  .nav-links{display:flex;gap:2rem;align-items:center}
+  .nav-links a{color:var(--text-dim);text-decoration:none;font-size:0.875rem;font-weight:500;transition:color .2s}
+  .nav-links a:hover{color:var(--text)}
+  .theme-btn{font-size:1.15rem;background:transparent;border:none;cursor:pointer;padding:.2rem;color:var(--text-dim);transition:color .2s;line-height:1;touch-action:manipulation;display:inline-flex;align-items:center}
+  .theme-btn:hover{color:var(--text)}
+  .btn{display:inline-flex;align-items:center;gap:.5rem;padding:.7rem 1.5rem;border-radius:var(--radius-sm);font-weight:600;font-size:.9rem;text-decoration:none;cursor:pointer;transition:all .2s;border:none;font-family:inherit}
+  .btn-primary{background:var(--accent);color:#fff;box-shadow:0 0 24px var(--accent-glow)}
+  .btn-primary:hover{background:var(--accent-hover);transform:translateY(-1px)}
+  .btn-ghost{background:transparent;color:var(--text);border:1px solid var(--border)}
+  .btn-ghost:hover{border-color:var(--border-hover);background:var(--bg-card)}
+  .btn-sm{padding:.4rem 1rem;font-size:.8rem}
+  .hero{min-height:100vh;display:flex;flex-direction:column;justify-content:center;padding:6rem 2rem 4rem;max-width:1200px;margin:0 auto}
+  .hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}
+  .hero-badge{display:inline-flex;align-items:center;gap:.5rem;padding:.35rem .85rem;border-radius:100px;background:rgba(108,92,231,.1);border:1px solid rgba(108,92,231,.2);font-size:.8rem;color:var(--accent);font-weight:500;margin-bottom:1.5rem;width:fit-content}
+  .hero-badge .pulse{width:6px;height:6px;border-radius:50%;background:var(--green);display:inline-block;animation:pulse 2s infinite}
+  @keyframes pulse{0%,100%{opacity:1}50%{opacity:.4}}
+  .hero h1{font-size:clamp(2.5rem,5vw,4rem);font-weight:900;letter-spacing:-.04em;line-height:1.1;margin-bottom:1.5rem}
+  .hero h1 .highlight{color:var(--accent)}
+  .hero p{font-size:1.1rem;color:var(--text-dim);max-width:520px;margin-bottom:2rem;line-height:1.7}
+  .hero-actions{display:flex;gap:1rem;flex-wrap:wrap}
+  .hero-stats{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
+  .stat-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:1.5rem}
+  .stat-card .number{font-size:2rem;font-weight:800;color:var(--text);letter-spacing:-.03em}
+  .stat-card .label{font-size:.85rem;color:var(--text-dim);margin-top:.25rem}
+  section{padding:5rem 2rem}
+  .section-inner{max-width:1200px;margin:0 auto}
+  .section-label{font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;color:var(--accent);font-weight:600;margin-bottom:.75rem}
+  .section-title{font-size:clamp(1.8rem,3.5vw,2.8rem);font-weight:800;letter-spacing:-.03em;margin-bottom:1rem}
+  .section-sub{color:var(--text-dim);font-size:1.05rem;max-width:600px;margin-bottom:3rem}
+  .tiers-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.5rem}
+  .tier-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:2rem;transition:all .2s;position:relative}
+  .tier-card:hover{border-color:var(--border-hover);background:var(--bg-card-hover)}
+  .tier-card.popular{border-color:var(--accent);background:linear-gradient(135deg,rgba(108,92,231,.06),transparent 60%)}
+  .tier-card.popular::before{content:'Best Value';position:absolute;top:-.7rem;right:1.5rem;background:var(--accent);color:#fff;font-size:.7rem;font-weight:600;padding:.2rem .7rem;border-radius:100px;text-transform:uppercase;letter-spacing:.04em}
+  .lang-fr .tier-card.popular::before{content:'Meilleur Rapport Q/P'}
+  .tier-card.recommended{border-color:var(--green);background:linear-gradient(135deg,rgba(0,201,81,.06),transparent 60%)}
+  .tier-card.recommended::before{content:'Recommended';position:absolute;top:-.7rem;right:1.5rem;background:var(--green);color:#fff;font-size:.7rem;font-weight:600;padding:.2rem .7rem;border-radius:100px;text-transform:uppercase;letter-spacing:.04em}
+  .lang-fr .tier-card.recommended::before{content:'Recommandé'}
+  .tier-name{font-size:1.1rem;font-weight:700;margin-bottom:.25rem}
+  .tier-tag{font-size:.75rem;color:var(--text-dim);font-family:'JetBrains Mono',monospace;margin-bottom:1.25rem}
+  .tier-price{font-size:.85rem;color:var(--text-dim);margin-bottom:1.25rem;display:flex;align-items:baseline;gap:.35rem}
+  .tier-price .amount{font-size:1.6rem;font-weight:800;color:var(--text)}
+  .tier-specs{list-style:none;margin-bottom:1.5rem}
+  .tier-specs li{padding:.5rem 0;font-size:.9rem;color:var(--text-dim);border-bottom:1px solid var(--border);display:flex;align-items:center;gap:.5rem}
+  .tier-specs li:last-child{border-bottom:none}
+  .tier-specs li .check{color:var(--green)}
+  .tier-specs li .x{color:var(--red)}
+  .tier-card .btn{width:100%;justify-content:center}
+  .why-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:1.5rem}
+  .why-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:2rem}
+  .why-card .icon{font-size:1.8rem;margin-bottom:1rem}
+  .why-card h3{font-weight:700;font-size:1.1rem;margin-bottom:.5rem}
+  .why-card p{color:var(--text-dim);font-size:.9rem;line-height:1.6}
+  .contact-row{display:flex;gap:1rem;flex-wrap:wrap;margin-top:1rem}
+  .contact-badge{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem 1rem;border-radius:100px;background:var(--bg-card);border:1px solid var(--border);font-size:.85rem;color:var(--text);text-decoration:none;transition:all .2s}
+  .contact-badge:hover{border-color:var(--accent);background:var(--bg-card-hover)}
+  .process-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:2rem;counter-reset:step}
+  .step{counter-increment:step;position:relative;padding-left:3.5rem}
+  .step::before{content:counter(step);position:absolute;left:0;top:0;width:2.5rem;height:2.5rem;background:var(--accent);border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.95rem;color:#fff}
+  .step h3{font-weight:700;font-size:1rem;margin-bottom:.35rem}
+  .step p{color:var(--text-dim);font-size:.85rem;line-height:1.5}
+  .form-section{background:linear-gradient(135deg,rgba(108,92,231,.08),transparent)}
+  .form-inner{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:start}
+  .form-heading h2{font-size:clamp(1.8rem,3vw,2.5rem);font-weight:800;letter-spacing:-.03em;margin-bottom:1rem}
+  .form-heading p{color:var(--text-dim);line-height:1.7}
+  .apple-form{width:100%;max-width:500px}
+  .form-step{display:none}
+  .form-step.current{display:block}
+  .form-step.animate-forward{animation:slideInLeft .35s cubic-bezier(.4,0,.2,1)}
+  .form-step.animate-back{animation:slideInRight .35s cubic-bezier(.4,0,.2,1)}
+  @keyframes slideInLeft{from{opacity:0;transform:translateX(28px)}to{opacity:1;transform:translateX(0)}}
+  @keyframes slideInRight{from{opacity:0;transform:translateX(-28px)}to{opacity:1;transform:translateX(0)}}
+  .step-label{font-size:.75rem;font-weight:500;color:var(--text-muted);margin-bottom:1.5rem;text-align:center}
+  .step-track{display:flex;justify-content:center;gap:8px;margin-bottom:2rem}
+  .step-dot{width:8px;height:8px;border-radius:50%;background:var(--text-muted);transition:all .35s cubic-bezier(.4,0,.2,1)}
+  .step-dot.active{background:var(--accent);transform:scale(1.5)}
+  .step-dot.done{background:var(--green)}
+  .field-wrapper{position:relative;display:flex;align-items:center;background:var(--bg-card);border-radius:10px;border:1.5px solid var(--border);transition:border-color .2s,box-shadow .2s}
+  .field-wrapper:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px rgba(108,92,231,.18)}
+  .field-wrapper.error{border-color:#e03131}
+  .field-icon{position:absolute;left:14px;top:50%;transform:translateY(-50%);font-size:18px;color:var(--text-muted);pointer-events:none;transition:color .2s}
+  .field-wrapper:focus-within .field-icon{color:var(--accent)}
+  .field-input{width:100%;padding:14px 14px 14px 42px;font-family:'Inter',-apple-system,sans-serif;font-size:17px;font-weight:400;color:var(--text);background:transparent;border:none;border-radius:10px;outline:none}
+  .field-input::placeholder{color:var(--text-muted)}
+  .field-error{font-size:13px;color:#e03131;margin-top:6px;margin-left:14px;opacity:0;max-height:0;overflow:hidden;transition:opacity .2s,max-height .2s}
+  .field-error.shown{opacity:1;max-height:24px}
+  .btn-row{margin-top:24px;display:flex;gap:12px}
+  .btn-row .btn{flex:1;padding:14px 24px;font-size:17px;border-radius:8px}
+  .btn-apple-secondary{background:transparent;color:var(--accent);border:1.5px solid var(--accent)}
+  .btn-apple-secondary:hover{background:var(--accent);color:#fff}
+  .success-card{display:none;text-align:center;padding:32px 0}
+  .success-card.visible{display:block;animation:fadeInUp .4s cubic-bezier(.4,0,.2,1)}
+  @keyframes fadeInUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
+  .checkmark-wrap{width:64px;height:64px;margin:0 auto 16px}
+  .checkmark-circle{fill:none;stroke:#34c759;stroke-width:2.5;stroke-dasharray:166;stroke-dashoffset:166}
+  .success-card.visible .checkmark-circle{animation:circleDraw .45s .05s cubic-bezier(.65,0,.45,1) forwards}
+  .checkmark-tick{fill:none;stroke:#34c759;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:48;stroke-dashoffset:48}
+  .success-card.visible .checkmark-tick{animation:tickDraw .3s .35s cubic-bezier(.65,0,.45,1) forwards}
+  @keyframes circleDraw{to{stroke-dashoffset:0}}
+  @keyframes tickDraw{to{stroke-dashoffset:0}}
+  .success-title{font-size:1.5rem;font-weight:700;margin-bottom:8px}
+  .success-sub{color:var(--text-dim);margin-bottom:24px;line-height:1.6}
+  .btn-restart{display:inline-block;padding:10px 36px;font-family:inherit;font-size:17px;color:var(--accent);background:transparent;border:1.5px solid var(--accent);border-radius:8px;cursor:pointer}
+  .btn-restart:hover{background:var(--accent);color:#fff}
 
-    :root {
-      --blue:        #0071e3;
-      --blue-hover:  #0077ed;
-      --link:        #0066cc;
-      --fg:          #1d1d1f;
-      --fg-secondary: rgba(0,0,0,0.8);
-      --fg-tertiary:  rgba(0,0,0,0.48);
-      --bg-light:    #f5f5f7;
-      --bg-dark:     #000000;
-      --white:       #ffffff;
-      --shadow:      rgba(0,0,0,0.22) 3px 5px 30px 0px;
-      --nav-bg:      rgba(0,0,0,0.8);
-    }
+  .status-section{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:2rem;max-width:600px;margin:0 auto}
+  .status-grid{display:flex;gap:1rem;flex-wrap:wrap}
+  .status-grid .field-wrapper{flex:1;min-width:200px}
+  .status-result{padding:1rem;border-radius:var(--radius-sm);margin-top:1rem;display:none}
+  .status-result.found{display:block;background:rgba(0,201,81,.08);border:1px solid rgba(0,201,81,.2)}
+  .status-result.not-found{display:block;background:rgba(255,71,87,.08);border:1px solid rgba(255,71,87,.2)}
+  .status-result .btn{margin-top:1rem}
 
-    html { height: 100%; }
-
-    body {
-      font-family: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
-      font-size: 17px;
-      font-weight: 400;
-      line-height: 1.47;
-      letter-spacing: -0.022px;
-      color: var(--fg);
-      background: var(--white);
-      min-height: 100%;
-      -webkit-font-smoothing: antialiased;
-      -moz-osx-font-smoothing: grayscale;
-    }
-
-    /* ===== Apple Glass Nav ===== */
-    .nav {
-      position: sticky;
-      top: 0;
-      z-index: 100;
-      height: 48px;
-      background: var(--nav-bg);
-      backdrop-filter: saturate(180%) blur(20px);
-      -webkit-backdrop-filter: saturate(180%) blur(20px);
-      display: flex;
-      align-items: center;
-      justify-content: center;
-    }
-
-    .nav-brand {
-      color: var(--white);
-      font-size: 14px;
-      font-weight: 500;
-      letter-spacing: -0.016px;
-      opacity: 0.92;
-    }
-
-    /* ===== Main Section ===== */
-    .section {
-      background: var(--bg-light);
-      min-height: calc(100vh - 48px);
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      padding: 40px 24px 80px;
-    }
-
-    .form-container {
-      width: 100%;
-      max-width: 500px;
-    }
-
-    /* ===== Typography ===== */
-    .heading {
-      font-size: 40px;
-      font-weight: 600;
-      line-height: 1.10;
-      letter-spacing: normal;
-      color: var(--fg);
-      text-align: center;
-      margin-bottom: 8px;
-    }
-
-    .caption {
-      font-size: 17px;
-      font-weight: 400;
-      line-height: 1.47;
-      letter-spacing: -0.022px;
-      color: var(--fg-secondary);
-      text-align: center;
-      margin-bottom: 12px;
-    }
-
-    /* ===== Step Indicator ===== */
-    .step-track {
-      display: flex;
-      justify-content: center;
-      gap: 10px;
-      margin-bottom: 40px;
-    }
-
-    .step-dot {
-      width: 8px;
-      height: 8px;
-      border-radius: 50%;
-      background: var(--fg-tertiary);
-      transition: background 0.35s cubic-bezier(0.4, 0, 0.2, 1), transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
-    }
-
-    .step-dot.active {
-      background: var(--blue);
-      transform: scale(1.5);
-    }
-
-    .step-dot.done {
-      background: #34c759;
-    }
-
-    /* ===== Step Counter ===== */
-    .step-label {
-      font-size: 13px;
-      font-weight: 500;
-      letter-spacing: -0.01px;
-      color: var(--fg-tertiary);
-      text-align: center;
-      margin-bottom: 28px;
-      transition: opacity 0.25s ease;
-    }
-
-    .step-label.pulse {
-      animation: labelPulse 0.35s cubic-bezier(0.4, 0, 0.2, 1);
-    }
-
-    @keyframes labelPulse {
-      0%   { opacity: 0.4; transform: translateY(-4px); }
-      100% { opacity: 1;   transform: translateY(0); }
-    }
-
-    /* ===== Form Steps ===== */
-    .step {
-      display: none;
-    }
-
-    .step.current {
-      display: block;
-    }
-
-    .step.animate-forward {
-      animation: slideInLeft 0.35s cubic-bezier(0.4, 0, 0.2, 1);
-    }
-
-    .step.animate-back {
-      animation: slideInRight 0.35s cubic-bezier(0.4, 0, 0.2, 1);
-    }
-
-    @keyframes slideInLeft {
-      from { opacity: 0; transform: translateX(28px); }
-      to   { opacity: 1; transform: translateX(0); }
-    }
-
-    @keyframes slideInRight {
-      from { opacity: 0; transform: translateX(-28px); }
-      to   { opacity: 1; transform: translateX(0); }
-    }
-
-    .field-wrapper {
-      position: relative;
-      display: flex;
-      align-items: center;
-      background: var(--white);
-      border-radius: 10px;
-      border: 1.5px solid transparent;
-      transition: border-color 0.2s ease, box-shadow 0.2s ease;
-    }
-
-    .field-wrapper:focus-within {
-      border-color: var(--blue);
-      box-shadow: 0 0 0 3px rgba(0,113,227,0.18);
-    }
-
-    .field-icon {
-      position: absolute;
-      left: 14px;
-      top: 50%;
-      transform: translateY(-50%);
-      font-size: 18px;
-      color: var(--fg-tertiary);
-      pointer-events: none;
-      transition: color 0.2s ease;
-    }
-
-    .field-wrapper:focus-within .field-icon {
-      color: var(--blue);
-    }
-
-    .field-input {
-      width: 100%;
-      padding: 14px 14px 14px 42px;
-      font-family: system-ui, -apple-system, sans-serif;
-      font-size: 17px;
-      font-weight: 400;
-      line-height: 1.47;
-      letter-spacing: -0.022px;
-      color: var(--fg);
-      background: transparent;
-      border: none;
-      border-radius: 10px;
-      outline: none;
-    }
-
-    .field-input::placeholder {
-      color: var(--fg-tertiary);
-    }
-
-    .field-error {
-      font-size: 13px;
-      font-weight: 400;
-      letter-spacing: -0.01px;
-      color: #e03131;
-      margin-top: 6px;
-      margin-left: 14px;
-      opacity: 0;
-      max-height: 0;
-      overflow: hidden;
-      transition: opacity 0.2s, max-height 0.2s;
-    }
-
-    .field-error.shown {
-      opacity: 1;
-      max-height: 24px;
-    }
-
-    .field-wrapper.error {
-      border-color: #e03131;
-    }
-
-    /* ===== Buttons Row ===== */
-    .btn-row {
-      margin-top: 28px;
-      display: flex;
-      gap: 12px;
-    }
-
-    .btn {
-      flex: 1;
-      padding: 14px 24px;
-      font-family: system-ui, -apple-system, sans-serif;
-      font-size: 17px;
-      font-weight: 400;
-      line-height: 1.47;
-      letter-spacing: -0.022px;
-      border-radius: 8px;
-      cursor: pointer;
-      transition: background 0.15s ease, box-shadow 0.15s ease;
-    }
-
-    .btn-primary {
-      color: var(--white);
-      background: var(--blue);
-      border: none;
-    }
-
-    .btn-primary:hover {
-      background: var(--blue-hover);
-      box-shadow: 0 2px 14px rgba(0,113,227,0.35);
-    }
-
-    .btn-secondary {
-      color: var(--blue);
-      background: transparent;
-      border: 1.5px solid var(--blue);
-    }
-
-    .btn-secondary:hover {
-      background: var(--blue);
-      color: var(--white);
-    }
-
-    .btn:focus-visible {
-      outline: 2px solid var(--blue);
-      outline-offset: 2px;
-    }
-
-    /* ===== Success State (inline) ===== */
-    .success-card {
-      display: none;
-      text-align: center;
-      padding: 32px 0;
-    }
-
-    .success-card.visible {
-      display: block;
-      animation: fadeInUp 0.4s cubic-bezier(0.4, 0, 0.2, 1);
-    }
-
-    @keyframes fadeInUp {
-      from { opacity: 0; transform: translateY(12px); }
-      to   { opacity: 1; transform: translateY(0); }
-    }
-
-    .checkmark-wrap {
-      width: 64px;
-      height: 64px;
-      margin: 0 auto 16px;
-    }
-
-    .checkmark-circle {
-      fill: none;
-      stroke: #34c759;
-      stroke-width: 2.5;
-      stroke-dasharray: 166;
-      stroke-dashoffset: 166;
-    }
-
-    .success-card.visible .checkmark-circle {
-      animation: circleDraw 0.45s 0.05s cubic-bezier(0.65, 0, 0.45, 1) forwards;
-    }
-
-    .checkmark-tick {
-      fill: none;
-      stroke: #34c759;
-      stroke-width: 2.5;
-      stroke-linecap: round;
-      stroke-linejoin: round;
-      stroke-dasharray: 48;
-      stroke-dashoffset: 48;
-    }
-
-    .success-card.visible .checkmark-tick {
-      animation: tickDraw 0.3s 0.35s cubic-bezier(0.65, 0, 0.45, 1) forwards;
-    }
-
-    @keyframes circleDraw {
-      to { stroke-dashoffset: 0; }
-    }
-
-    @keyframes tickDraw {
-      to { stroke-dashoffset: 0; }
-    }
-
-    .success-title {
-      font-size: 28px;
-      font-weight: 600;
-      line-height: 1.14;
-      letter-spacing: 0.007px;
-      color: var(--fg);
-      margin-bottom: 8px;
-    }
-
-    .success-sub {
-      font-size: 15px;
-      font-weight: 400;
-      line-height: 1.47;
-      letter-spacing: -0.02px;
-      color: var(--fg-secondary);
-      margin-bottom: 24px;
-    }
-
-    .btn-restart {
-      display: inline-block;
-      padding: 10px 36px;
-      font-family: system-ui, -apple-system, sans-serif;
-      font-size: 17px;
-      font-weight: 400;
-      letter-spacing: -0.022px;
-      color: var(--blue);
-      background: transparent;
-      border: 1.5px solid var(--blue);
-      border-radius: 8px;
-      cursor: pointer;
-      transition: background 0.15s ease, color 0.15s ease;
-    }
-
-    .btn-restart:hover {
-      background: var(--blue);
-      color: var(--white);
-    }
-
-    /* ===== Footer ===== */
-    .footer {
-      text-align: center;
-      font-size: 12px;
-      font-weight: 400;
-      letter-spacing: -0.01px;
-      color: var(--fg-tertiary);
-      margin-top: 32px;
-    }
-
-    /* ===== Responsive ===== */
-    @media (max-width: 480px) {
-      .heading { font-size: 32px; }
-      .caption { font-size: 15px; }
-    }
-  </style>
+  footer{border-top:1px solid var(--border);padding:2rem;text-align:center;color:var(--text-muted);font-size:.8rem}
+  @media(max-width:768px){.hero-grid,.form-inner{grid-template-columns:1fr;gap:2rem}.hero-stats{grid-template-columns:1fr 1fr}.nav-links a{display:none}.tiers-grid,.why-grid,.process-steps{grid-template-columns:1fr}}
+  .glow{position:fixed;width:600px;height:600px;border-radius:50%;background:radial-gradient(circle,rgba(108,92,231,.06) 0%,transparent 70%);pointer-events:none;z-index:-1;top:-200px;right:-200px}
+  .glow-2{bottom:-300px;left:-200px;width:500px;height:500px;background:radial-gradient(circle,rgba(108,92,231,.04) 0%,transparent 70%)}
+</style>
+<script>(function(){var t=localStorage.getItem('vela_theme');if(t==='light'||(!t&&window.matchMedia('(prefers-color-scheme:light)').matches))document.documentElement.classList.add('light')})();</script>
 </head>
 <body>
 
-  <!-- Apple Glass Nav -->
-  <nav class="nav">
-    <span class="nav-brand">Form</span>
-  </nav>
+<div class="glow"></div>
+<div class="glow glow-2"></div>
 
-  <!-- Form Section -->
-  <section class="section">
-    <div class="form-container">
-      <h1 class="heading">Tell us about you</h1>
-      <p class="caption">Three quick things and we're ready.</p>
+<nav>
+  <a href="#" class="nav-logo">VELA<span class="dot">.</span></a>
+  <div class="nav-links">
+    <a href="#tiers"><span class="en-only">Tiers</span><span class="fr-only">Offres</span></a>
+    <a href="#why"><span class="en-only">Why</span><span class="fr-only">Pourquoi</span></a>
+    <a href="#process">Process</a>
+    <a href="#faq">FAQ</a>
+    <a href="/check-order.html"><span class="en-only">Check Order</span><span class="fr-only">Suivi</span></a>
+    <a href="/backup-drives.html"><span class="en-only">Backup Drives</span><span class="fr-only">Disques Backup</span></a>
+    <button class="theme-btn" id="themeToggle" onclick="toggleTheme()" title="Toggle theme"></button>
+    <a href="#contact" class="btn btn-primary"><span class="en-only">Get a Quote</span><span class="fr-only">Demander un devis</span></a>
+  </div>
+</nav>
 
-      <!-- Step Dots -->
-      <div class="step-track" id="stepTrack">
-        <div class="step-dot" data-step="1"></div>
-        <div class="step-dot" data-step="2"></div>
-        <div class="step-dot" data-step="3"></div>
+<!-- Hero -->
+<section class="hero" id="hero">
+  <div class="hero-grid">
+    <div>
+      <div class="hero-badge">
+        <span class="pulse"></span>
+        <span class="en-only">Taking orders now</span><span class="fr-only">Commandes ouvertes</span>
       </div>
-
-      <!-- Step Label -->
-      <div class="step-label" id="stepLabel">Step 1 of 3</div>
-
-      <!-- Step 1: Email -->
-      <div class="step current" data-step="1" id="step1">
-        <div class="field-wrapper" id="emailWrapper">
-          <span class="field-icon">✉</span>
-          <input class="field-input" type="email" id="email" placeholder="Email address" autocomplete="email">
-        </div>
-        <div class="field-error" id="emailError">Please enter a valid email.</div>
-        <div class="btn-row">
-          <button type="button" class="btn btn-primary" id="next1">Next</button>
-        </div>
+      <h1>
+        <span class="en-only">Servers installed.<br><span class="highlight">Simply.</span></span>
+        <span class="fr-only">Serveurs installés.<br><span class="highlight">Simplement.</span></span>
+      </h1>
+      <p class="en-only">You pick a tier. We show up with the hardware, install it on-site, and hand you a working server. No upsells, no subscriptions, no runaround.</p>
+      <p class="fr-only">Vous choisissez une offre. Nous arrivons avec le matériel, installons sur place et vous remettons un serveur fonctionnel. Sans vente forcée, sans abonnement caché.</p>
+      <div class="hero-actions">
+        <a href="#tiers" class="btn btn-primary"><span class="en-only">See Tiers →</span><span class="fr-only">Voir les offres →</span></a>
+        <a href="#contact" class="btn btn-ghost"><span class="en-only">Talk to Us</span><span class="fr-only">Contactez-nous</span></a>
       </div>
-
-      <!-- Step 2: Name -->
-      <div class="step" data-step="2" id="step2">
-        <div class="field-wrapper" id="nameWrapper">
-          <span class="field-icon">👤</span>
-          <input class="field-input" type="text" id="name" placeholder="Your name" autocomplete="name">
-        </div>
-        <div class="field-error" id="nameError">Don't be a stranger — what's your name?</div>
-        <div class="btn-row">
-          <button type="button" class="btn btn-secondary" id="back2">Back</button>
-          <button type="button" class="btn btn-primary" id="next2">Next</button>
-        </div>
-      </div>
-
-      <!-- Step 3: Domain -->
-      <div class="step" data-step="3" id="step3">
-        <div class="field-wrapper" id="domainWrapper">
-          <span class="field-icon">🌐</span>
-          <input class="field-input" type="text" id="domain" placeholder="Domain name" autocomplete="url">
-        </div>
-        <div class="field-error" id="domainError">Please enter your domain name.</div>
-        <div class="btn-row">
-          <button type="button" class="btn btn-secondary" id="back3">Back</button>
-          <button type="button" class="btn btn-primary" id="submitBtn">Submit</button>
-        </div>
-      </div>
-
-      <!-- Success State -->
-      <div class="success-card" id="successCard">
-        <div class="checkmark-wrap">
-          <svg viewBox="0 0 52 52" width="64" height="64">
-            <circle class="checkmark-circle" cx="26" cy="26" r="24"/>
-            <path class="checkmark-tick" d="M16 27l7 7 13-13"/>
-          </svg>
-        </div>
-        <h2 class="success-title">Success!</h2>
-        <p class="success-sub">We'll be in touch.</p>
-        <button class="btn-restart" id="restartBtn">Start over</button>
-      </div>
-
-      <p class="footer">Your info stays with us. Always.</p>
     </div>
-  </section>
+    <div class="hero-stats">
+      <div class="stat-card"><div class="number">4</div><div class="label en-only">Server tiers — one fits your budget</div><div class="label fr-only">4 offres — une pour chaque budget</div></div>
+      <div class="stat-card"><div class="number">1</div><div class="label en-only">Week from message to installation</div><div class="label fr-only">1 semaine du message à l'installation</div></div>
+      <div class="stat-card"><div class="number">0</div><div class="label en-only">Hidden fees, subscriptions, or surprises</div><div class="label fr-only">Frais cachés, abonnements ou surprises</div></div>
+      <div class="stat-card"><div class="number">100%</div><div class="label en-only">On-site install. You don't touch a thing.</div><div class="label fr-only">Installation sur place. Vous ne touchez à rien.</div></div>
+    </div>
+  </div>
+</section>
 
-  <script>
-    (function() {
-      const totalSteps = 3;
-      let currentStep = 1;
+<!-- Tiers -->
+<section id="tiers">
+  <div class="section-inner">
+    <div class="section-label"><span class="en-only">Pricing</span><span class="fr-only">Tarifs</span></div>
+    <h2 class="section-title"><span class="en-only">Pick a tier. Get a server.</span><span class="fr-only">Choisissez une offre. Recevez un serveur.</span></h2>
+    <p class="section-sub en-only">Four options, from entry-level to redundant storage. All include hardware, on-site installation, and a working server before we leave.</p>
+    <p class="section-sub fr-only">Quatre options, de l'entrée de gamme au stockage redondant. Chaque offre inclut le matériel, l'installation sur place et un serveur opérationnel avant notre départ.</p>
+    <div class="tiers-grid">
+      <div class="tier-card">
+        <div class="tier-name">Rif</div>
+        <div class="tier-tag"><span class="en-only">entry-level</span><span class="fr-only">entrée de gamme</span></div>
+        <div class="tier-price"><span class="en-only">From</span><span class="fr-only">À partir de</span> <span class="amount">—</span></div>
+        <ul class="tier-specs">
+          <li><span class="check">✓</span> <span class="en-only">512 GB unified storage</span><span class="fr-only">512 Go stockage unifié</span></li>
+          <li><span class="check">✓</span> Mini PC</li>
+          <li><span class="check">✓</span> <span class="en-only">On-site install</span><span class="fr-only">Installation sur place</span></li>
+          <li><span class="x">✗</span> <span class="en-only">No backup drive</span><span class="fr-only">Pas de sauvegarde</span></li>
+        </ul>
+        <a href="#contact" class="btn btn-ghost"><span class="en-only">Get Pricing</span><span class="fr-only">Voir le prix</span></a>
+      </div>
+      <div class="tier-card popular">
+        <div class="tier-name">Rif<sup>+</sup></div>
+        <div class="tier-tag"><span class="en-only">best value</span><span class="fr-only">meilleur rapport Q/P</span></div>
+        <div class="tier-price"><span class="en-only">From</span><span class="fr-only">À partir de</span> <span class="amount">—</span></div>
+        <ul class="tier-specs">
+          <li><span class="check">✓</span> <span class="en-only">512 GB + 512 GB backup</span><span class="fr-only">512 Go + 512 Go sauvegarde</span></li>
+          <li><span class="check">✓</span> Mini PC</li>
+          <li><span class="check">✓</span> <span class="en-only">On-site install</span><span class="fr-only">Installation sur place</span></li>
+          <li><span class="check">✓</span> <span class="en-only">Automated backups</span><span class="fr-only">Sauvegardes automatisées</span></li>
+        </ul>
+        <a href="#contact" class="btn btn-primary"><span class="en-only">Get Pricing</span><span class="fr-only">Voir le prix</span></a>
+      </div>
+      <div class="tier-card">
+        <div class="tier-name">Atlas</div>
+        <div class="tier-tag"><span class="en-only">pro</span><span class="fr-only">pro</span></div>
+        <div class="tier-price"><span class="en-only">From</span><span class="fr-only">À partir de</span> <span class="amount">—</span></div>
+        <ul class="tier-specs">
+          <li><span class="check">✓</span> <span class="en-only">1 TB unified storage</span><span class="fr-only">1 To stockage unifié</span></li>
+          <li><span class="check">✓</span> Mini PC</li>
+          <li><span class="check">✓</span> <span class="en-only">On-site install</span><span class="fr-only">Installation sur place</span></li>
+          <li><span class="x">✗</span> <span class="en-only">No backup drive</span><span class="fr-only">Pas de sauvegarde</span></li>
+        </ul>
+        <a href="#contact" class="btn btn-ghost"><span class="en-only">Get Pricing</span><span class="fr-only">Voir le prix</span></a>
+      </div>
+      <div class="tier-card recommended">
+        <div class="tier-name">Atlas<sup>+</sup></div>
+        <div class="tier-tag"><span class="en-only">maximum</span><span class="fr-only">max</span></div>
+        <div class="tier-price"><span class="en-only">From</span><span class="fr-only">À partir de</span> <span class="amount">—</span></div>
+        <ul class="tier-specs">
+          <li><span class="check">✓</span> <span class="en-only">1 TB + 1 TB backup</span><span class="fr-only">1 To + 1 To sauvegarde</span></li>
+          <li><span class="check">✓</span> Mini PC</li>
+          <li><span class="check">✓</span> <span class="en-only">On-site install</span><span class="fr-only">Installation sur place</span></li>
+          <li><span class="check">✓</span> <span class="en-only">Automated backups</span><span class="fr-only">Sauvegardes automatisées</span></li>
+        </ul>
+        <a href="#contact" class="btn btn-primary"><span class="en-only">Get Pricing</span><span class="fr-only">Voir le prix</span></a>
+      </div>
+    </div>
+  </div>
+</section>
 
-      const steps    = Array.from(document.querySelectorAll('.step'));
-      const dots     = Array.from(document.querySelectorAll('.step-dot'));
-      const label    = document.getElementById('stepLabel');
-      const success  = document.getElementById('successCard');
-      const heading  = document.querySelector('.heading');
-      const caption  = document.querySelector('.caption');
-      const track    = document.getElementById('stepTrack');
+<!-- Why Vela -->
+<section id="why">
+  <div class="section-inner">
+    <div class="section-label"><span class="en-only">Why Vela</span><span class="fr-only">Pourquoi Vela</span></div>
+    <h2 class="section-title"><span class="en-only">You want a server that works. We don't make it complicated.</span><span class="fr-only">Vous voulez un serveur qui marche. On ne complique rien.</span></h2>
+    <div class="why-grid">
+      <div class="why-card"><div class="icon">🔧</div><h3 class="en-only">We install. You use.</h3><h3 class="fr-only">On installe. Vous utilisez.</h3><p class="en-only">We bring the hardware, set it up on-site, configure it, test it, and leave. You don't open a single box.</p><p class="fr-only">Nous apportons le matériel, installons sur place, configurons, testons et repartons.</p></div>
+      <div class="why-card"><div class="icon">💰</div><h3 class="en-only">One price. No subscriptions.</h3><h3 class="fr-only">Un prix. Pas d'abonnement.</h3><p class="en-only">You pay once for the hardware and install. No monthly fees, no licensing traps.</p><p class="fr-only">Vous payez une fois pour le matériel et l'installation.</p></div>
+      <div class="why-card"><div class="icon">⚡</div><h3 class="en-only">Mini PCs. Real power.</h3><h3 class="fr-only">Mini PCs. Vraie puissance.</h3><p class="en-only">Small footprint, low power draw, silent operation. Modern hardware built to run 24/7.</p><p class="fr-only">Encombrement réduit, faible consommation, fonctionnement silencieux.</p></div>
+      <div class="why-card"><div class="icon">📅</div><h3 class="en-only">1 week. Message to running server.</h3><h3 class="fr-only">1 semaine. Du message au serveur opérationnel.</h3><p class="en-only">You send a message. One week later, we hand you a working server.</p><p class="fr-only">Vous envoyez un message. Une semaine plus tard, serveur opérationnel.</p></div>
+      <div class="why-card"><div class="icon">🗣️</div><h3 class="en-only">You talk to the person who builds it.</h3><h3 class="fr-only">Direct avec le constructeur.</h3><p class="en-only">No account managers. You deal directly with the person who assembles and installs your server.</p><p class="fr-only">Pas de chargés de compte. Direct avec la personne qui monte votre serveur.</p></div>
+      <div class="why-card"><div class="icon">📲</div><h3 class="en-only">Reach us on WhatsApp or Telegram</h3><h3 class="fr-only">Contactez-nous sur WhatsApp ou Telegram</h3>
+        <p class="en-only">Prefer messaging? We're one tap away.</p>
+        <p class="fr-only">Vous préférez envoyer un message ? On est à un clic.</p>
+        <div class="contact-row">
+          <a href="https://wa.me/212600000000" class="contact-badge" target="_blank">💬 WhatsApp</a>
+          <a href="https://t.me/velaserver" class="contact-badge" target="_blank">✈️ Telegram</a>
+        </div>
+      </div>
+    </div>
+  </div>
+</section>
 
-      const fields = {
-        email:  { input: document.getElementById('email'),  wrapper: document.getElementById('emailWrapper'),  error: document.getElementById('emailError')  },
-        name:   { input: document.getElementById('name'),   wrapper: document.getElementById('nameWrapper'),   error: document.getElementById('nameError')   },
-        domain: { input: document.getElementById('domain'),  wrapper: document.getElementById('domainWrapper'), error: document.getElementById('domainError') }
-      };
+<!-- Process -->
+<section id="process">
+  <div class="section-inner">
+    <div class="section-label">Process</div>
+    <h2 class="section-title"><span class="en-only">One week to a running server.</span><span class="fr-only">Une semaine pour un serveur opérationnel.</span></h2>
+    <div class="process-steps">
+      <div class="step"><h3 class="en-only">You message us</h3><h3 class="fr-only">Vous nous contactez</h3><p class="en-only">Fill out the form or reach out on WhatsApp/Telegram. We'll confirm what fits and give you a price.</p><p class="fr-only">Remplissez le formulaire ou contactez-nous sur WhatsApp/Telegram. On vous confirme l'offre et le prix.</p></div>
+      <div class="step"><h3 class="en-only">We prepare the hardware</h3><h3 class="fr-only">On prépare le matériel</h3><p class="en-only">We source, test, and configure your mini PC.</p><p class="fr-only">On approvisionne, teste et configure votre Mini PC.</p></div>
+      <div class="step"><h3 class="en-only">We install on-site</h3><h3 class="fr-only">Installation sur place</h3><p class="en-only">We show up, set everything up, run tests, and hand you a working server.</p><p class="fr-only">On se déplace, installe, teste et vous remet un serveur fonctionnel.</p></div>
+      <div class="step"><h3 class="en-only">Done. In one week.</h3><h3 class="fr-only">Fait. En une semaine.</h3><p class="en-only">No ongoing fees. No mandatory support contract.</p><p class="fr-only">Pas de frais récurrents. Pas de contrat obligatoire.</p></div>
+    </div>
+  </div>
+</section>
 
-      const API_URL = ''; // relative — same origin
+<!-- FAQ -->
+<section id="faq">
+  <div class="section-inner">
+    <div class="section-label">FAQ</div>
+    <h2 class="section-title"><span class="en-only">Straight answers.</span><span class="fr-only">Réponses directes.</span></h2>
+    <div class="faq-list" style="max-width:720px">
+      <div class="faq-item" style="border-bottom:1px solid var(--border);padding:1.25rem 0">
+        <div class="faq-q" style="font-weight:600;cursor:pointer;display:flex;justify-content:space-between;align-items:center;user-select:none" onclick="this.parentElement.classList.toggle('open')">
+          <span class="en-only">What exactly do I get?</span><span class="fr-only">Qu'est-ce que je reçois exactement ?</span>
+          <span style="transition:transform .2s;color:var(--text-dim)">▾</span>
+        </div>
+        <div style="max-height:0;overflow:hidden;transition:max-height .3s, padding .3s;color:var(--text-dim);font-size:.9rem" class="faq-a"><div style="padding-top:1rem"><span class="en-only">A mini PC server installed at your location, configured and tested. On Plus tiers, a second drive with automated backup.</span><span class="fr-only">Un serveur Mini PC installé chez vous, configuré et testé. Sur les offres Plus, second disque avec sauvegarde automatisée.</span></div></div>
+      </div>
+      <div class="faq-item" style="border-bottom:1px solid var(--border);padding:1.25rem 0">
+        <div class="faq-q" style="font-weight:600;cursor:pointer;display:flex;justify-content:space-between;align-items:center;user-select:none" onclick="this.parentElement.classList.toggle('open')">
+          <span class="en-only">Which tier do you recommend?</span><span class="fr-only">Quelle offre recommandez-vous ?</span>
+          <span style="transition:transform .2s;color:var(--text-dim)">▾</span>
+        </div>
+        <div style="max-height:0;overflow:hidden;transition:max-height .3s, padding .3s;color:var(--text-dim);font-size:.9rem" class="faq-a"><div style="padding-top:1rem"><span class="en-only">Atlas<sup>+</sup>. 1 TB storage plus 1 TB backup gives you room to grow and peace of mind.</span><span class="fr-only">Atlas<sup>+</sup>. 1 To de stockage plus 1 To de sauvegarde, de la place pour évoluer.</span></div></div>
+      </div>
+      <div class="faq-item" style="border-bottom:1px solid var(--border);padding:1.25rem 0">
+        <div class="faq-q" style="font-weight:600;cursor:pointer;display:flex;justify-content:space-between;align-items:center;user-select:none" onclick="this.parentElement.classList.toggle('open')">
+          <span class="en-only">How long does it take?</span><span class="fr-only">Combien de temps ?</span>
+          <span style="transition:transform .2s;color:var(--text-dim)">▾</span>
+        </div>
+        <div style="max-height:0;overflow:hidden;transition:max-height .3s, padding .3s;color:var(--text-dim);font-size:.9rem" class="faq-a"><div style="padding-top:1rem"><span class="en-only">One week from your first message to installation.</span><span class="fr-only">Une semaine de votre premier message à l'installation.</span></div></div>
+      </div>
+    </div>
+  </div>
+</section>
 
-      function validateEmail(v) {
-        return /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(v.trim());
+<!-- Contact Form -->
+<section class="form-section" id="contact">
+  <div class="section-inner">
+    <div class="form-inner">
+      <div class="form-heading">
+        <div class="section-label"><span class="en-only">Get Started</span><span class="fr-only">Commencez</span></div>
+        <h2 class="en-only">Ready to get your server?</h2>
+        <h2 class="fr-only">Prêt à recevoir votre serveur ?</h2>
+        <p class="en-only">Tell us what you need. We'll get back to you within 24 hours with a price and timeline. No commitment.</p>
+        <p class="fr-only">Dites-nous ce dont vous avez besoin. Réponse sous 24h avec un prix et un délai. Sans engagement.</p>
+        <div class="contact-row">
+          <a href="https://wa.me/212600000000" class="contact-badge" target="_blank">💬 WhatsApp</a>
+          <a href="https://t.me/velaserver" class="contact-badge" target="_blank">✈️ Telegram</a>
+        </div>
+      </div>
+
+      <div class="apple-form" id="velaForm">
+        <div class="step-track" id="stepTrack">
+          <div class="step-dot" data-step="1"></div>
+          <div class="step-dot" data-step="2"></div>
+          <div class="step-dot" data-step="3"></div>
+        </div>
+        <div class="step-label" id="stepLabel"><span class="en-only">Step 1 of 3</span><span class="fr-only">Étape 1 sur 3</span></div>
+
+        <div class="form-step current" data-step="1" id="step1">
+          <div class="field-wrapper" id="emailWrapper">
+            <span class="field-icon">✉</span>
+            <input class="field-input" type="email" id="email" placeholder="Email" autocomplete="email">
+          </div>
+          <div class="field-error" id="emailError"><span class="en-only">Please enter a valid email.</span><span class="fr-only">Entrez un email valide.</span></div>
+          <div class="btn-row">
+            <button type="button" class="btn btn-primary" id="next1"><span class="en-only">Next</span><span class="fr-only">Suivant</span></button>
+          </div>
+        </div>
+
+        <div class="form-step" data-step="2" id="step2">
+          <div class="field-wrapper" id="nameWrapper">
+            <span class="field-icon">👤</span>
+            <input class="field-input" type="text" id="name" placeholder="Name" autocomplete="name">
+          </div>
+          <div class="field-error" id="nameError"><span class="en-only">Please enter your name.</span><span class="fr-only">Entrez votre nom.</span></div>
+          <div class="btn-row">
+            <button type="button" class="btn btn-apple-secondary" id="back2"><span class="en-only">Back</span><span class="fr-only">Retour</span></button>
+            <button type="button" class="btn btn-primary" id="next2"><span class="en-only">Next</span><span class="fr-only">Suivant</span></button>
+          </div>
+        </div>
+
+        <div class="form-step" data-step="3" id="step3">
+          <div class="field-wrapper" id="phoneWrapper">
+            <span class="field-icon">📞</span>
+            <input class="field-input" type="tel" id="phone" placeholder="Phone number">
+          </div>
+          <div class="field-error" id="phoneError"><span class="en-only">Please enter your phone number.</span><span class="fr-only">Entrez votre numéro.</span></div>
+          <div class="btn-row">
+            <button type="button" class="btn btn-apple-secondary" id="back3"><span class="en-only">Back</span><span class="fr-only">Retour</span></button>
+            <button type="button" class="btn btn-primary" id="submitBtn"><span class="en-only">Submit</span><span class="fr-only">Envoyer</span></button>
+          </div>
+        </div>
+
+        <div class="success-card" id="successCard">
+          <div class="checkmark-wrap">
+            <svg viewBox="0 0 52 52" width="64" height="64">
+              <circle class="checkmark-circle" cx="26" cy="26" r="24"/>
+              <path class="checkmark-tick" d="M16 27l7 7 13-13"/>
+            </svg>
+          </div>
+          <h2 class="success-title en-only">We'll be in touch!</h2>
+          <h2 class="success-title fr-only">On vous répond sous 24h !</h2>
+          <p class="success-sub en-only">Expect a response within 24 hours with your price and timeline.</p>
+          <p class="success-sub fr-only">Vous recevrez un devis et un délai sous 24h.</p>
+          <button class="btn-restart" id="restartBtn"><span class="en-only">Submit another</span><span class="fr-only">Soumettre à nouveau</span></button>
+        </div>
+      </div>
+    </div>
+  </div>
+</section>
+
+<!-- Check Order Status -->
+<section style="background:var(--bg-card);border-top:1px solid var(--border);border-bottom:1px solid var(--border)">
+  <div class="section-inner" style="text-align:center">
+    <div class="section-label"><span class="en-only">Already ordered?</span><span class="fr-only">Déjà commandé ?</span></div>
+    <h2 class="section-title" style="font-size:clamp(1.4rem,2.5vw,1.8rem)"><span class="en-only">Check your order status</span><span class="fr-only">Vérifier le statut de votre commande</span></h2>
+    <p style="color:var(--text-dim);margin-bottom:2rem"><span class="en-only">Enter your email and phone number to check your order. No password needed.</span><span class="fr-only">Entrez votre email et numéro pour vérifier votre commande. Sans mot de passe.</span></p>
+
+    <div class="status-section" id="statusSection">
+      <div class="status-grid">
+        <div class="field-wrapper" id="checkEmailWrapper">
+          <span class="field-icon">✉</span>
+          <input class="field-input" type="email" id="checkEmail" placeholder="Email" autocomplete="email">
+        </div>
+        <div class="field-wrapper" id="checkPhoneWrapper">
+          <span class="field-icon">📞</span>
+          <input class="field-input" type="tel" id="checkPhone" placeholder="Phone">
+        </div>
+        <button class="btn btn-primary" id="checkStatusBtn" style="flex:0 0 auto;padding:14px 24px;border-radius:10px">
+          <span class="en-only">Check</span><span class="fr-only">Vérifier</span>
+        </button>
+      </div>
+      <div class="status-result" id="statusResult"></div>
+    </div>
+  </div>
+</section>
+
+<footer>
+  <span class="en-only">Vela — Server Installation. Simply.</span>
+  <span class="fr-only">Vela — Installation de serveurs. Simplement.</span>
+  <div style="margin-top:.5rem;font-size:.7rem"><a href="/admin.html" style="color:var(--text-muted);text-decoration:none">Admin</a></div>
+</footer>
+
+<script>
+(function(){
+  const API_URL = 'http://192.168.1.30:8581';
+  const totalSteps = 3;
+  let currentStep = 1;
+
+  const steps = Array.from(document.querySelectorAll('.form-step'));
+  const dots = Array.from(document.querySelectorAll('.step-dot'));
+  const label = document.getElementById('stepLabel');
+  const success = document.getElementById('successCard');
+
+  const fields = {
+    email: { input: document.getElementById('email'), wrapper: document.getElementById('emailWrapper'), error: document.getElementById('emailError') },
+    name:  { input: document.getElementById('name'),  wrapper: document.getElementById('nameWrapper'),  error: document.getElementById('nameError') },
+    phone: { input: document.getElementById('phone'), wrapper: document.getElementById('phoneWrapper'), error: document.getElementById('phoneError') }
+  };
+
+  function validateEmail(v) { return /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(v.trim()); }
+
+  function clearErrors() {
+    Object.values(fields).forEach(f => {
+      if(f.wrapper) f.wrapper.classList.remove('error');
+      if(f.error) f.error.classList.remove('shown');
+    });
+  }
+
+  function showStep(n, dir) {
+    steps.forEach(s => s.classList.remove('current', 'animate-forward', 'animate-back'));
+    const stepEl = document.getElementById('step' + n);
+    if (stepEl) {
+      stepEl.classList.add('current');
+      if (dir) stepEl.classList.add(dir);
+    }
+    dots.forEach((d, i) => {
+      d.classList.remove('active', 'done');
+      if (i + 1 < n) d.classList.add('done');
+      if (i + 1 === n) d.classList.add('active');
+    });
+    const isFr = document.documentElement.classList.contains('lang-fr');
+    label.textContent = isFr ? 'Étape ' + n + ' sur ' + totalSteps : 'Step ' + n + ' of ' + totalSteps;
+    const input = stepEl ? stepEl.querySelector('input, select') : null;
+    if (input) setTimeout(() => input.focus(), 100);
+    currentStep = n;
+  }
+
+  function validateStep(n) {
+    clearErrors();
+    if (n === 1) {
+      const v = fields.email.input.value.trim();
+      if (!v || !validateEmail(v)) {
+        fields.email.wrapper.classList.add('error');
+        fields.email.error.classList.add('shown');
+        return false;
       }
+    }
+    if (n === 2) {
+      const v = fields.name.input.value.trim();
+      if (!v) {
+        fields.name.wrapper.classList.add('error');
+        fields.name.error.classList.add('shown');
+        return false;
+      }
+    }
+    if (n === 3) {
+      const v = fields.phone.input.value.trim();
+      if (!v) {
+        fields.phone.wrapper.classList.add('error');
+        fields.phone.error.classList.add('shown');
+        return false;
+      }
+    }
+    return true;
+  }
 
-      function clearErrors() {
-        Object.values(fields).forEach(f => {
-          f.wrapper.classList.remove('error');
-          f.error.classList.remove('shown');
+  function showSuccess() {
+    const circle = document.querySelector('#successCard .checkmark-circle');
+    const tick = document.querySelector('#successCard .checkmark-tick');
+    if (circle) { circle.style.animation = 'none'; void circle.offsetHeight; circle.style.animation = ''; }
+    if (tick) { tick.style.animation = 'none'; void tick.offsetHeight; tick.style.animation = ''; }
+    steps.forEach(s => s.classList.remove('current'));
+    success.classList.remove('visible');
+    void success.offsetWidth;
+    success.classList.add('visible');
+  }
+
+  async function submitForm() {
+    const payload = {
+      email: fields.email.input.value.trim(),
+      name: fields.name.input.value.trim(),
+      phone: fields.phone.input.value.trim()
+    };
+    try {
+      const resp = await fetch(API_URL + '/api/submit', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify(payload)
+      });
+      if (resp.ok) {
+        showSuccess();
+      } else {
+        const isFr = document.documentElement.classList.contains('lang-fr');
+        alert(isFr ? 'Échec de l\'envoi. Réessayez.' : 'Submission failed. Please try again.');
+      }
+    } catch (e) {
+      const isFr = document.documentElement.classList.contains('lang-fr');
+      alert(isFr ? 'Impossible de contacter le serveur.' : 'Could not reach the server.');
+    }
+  }
+
+  function resetForm() {
+    success.classList.remove('visible');
+    Object.values(fields).forEach(f => { if (f.input) f.input.value = ''; });
+    clearErrors();
+    currentStep = 1;
+    showStep(1);
+  }
+
+  Object.values(fields).forEach(f => {
+    if (f.input) {
+      f.input.addEventListener('input', function() {
+        f.wrapper.classList.remove('error');
+        if (f.error) f.error.classList.remove('shown');
+      });
+    }
+  });
+
+  document.addEventListener('keydown', function(e) {
+    if (e.key === 'Enter' && currentStep <= totalSteps) {
+      e.preventDefault();
+      if (validateStep(currentStep)) {
+        if (currentStep < totalSteps) showStep(currentStep + 1, 'animate-forward');
+        else submitForm();
+      }
+    }
+  });
+
+  document.getElementById('next1').addEventListener('click', function() {
+    if (validateStep(1)) showStep(2, 'animate-forward');
+  });
+  document.getElementById('back2').addEventListener('click', function() { showStep(1, 'animate-back'); });
+  document.getElementById('next2').addEventListener('click', function() {
+    if (validateStep(2)) showStep(3, 'animate-forward');
+  });
+  document.getElementById('back3').addEventListener('click', function() { showStep(2, 'animate-back'); });
+  document.getElementById('submitBtn').addEventListener('click', function() {
+    if (validateStep(3)) submitForm();
+  });
+  document.getElementById('restartBtn').addEventListener('click', resetForm);
+  showStep(1);
+
+  // ── Cookie helpers for status check ──
+  const STATUS_COOKIE = 'vela_order_check';
+  function getVelaCookie(name) {
+    const m = document.cookie.match('(^|;)\\s*' + name + '\\s*=\\s*([^;]+)');
+    return m ? decodeURIComponent(m[2]) : null;
+  }
+  function setVelaCookie(name, value, days) {
+    const d = new Date();
+    d.setTime(d.getTime() + days * 86400000);
+    document.cookie = name + '=' + encodeURIComponent(value) + ';expires=' + d.toUTCString() + ';path=/';
+  }
+
+  // Restore saved email/phone from cookie
+  (function() {
+    const saved = getVelaCookie(STATUS_COOKIE);
+    if (saved) {
+      try {
+        const parsed = JSON.parse(saved);
+        if (parsed.email) document.getElementById('checkEmail').value = parsed.email;
+        if (parsed.phone) document.getElementById('checkPhone').value = parsed.phone;
+      } catch(e) {}
+    }
+  })();
+
+  // ── Check Order Status ──
+  document.getElementById('checkStatusBtn').addEventListener('click', async function() {
+    const email = document.getElementById('checkEmail').value.trim();
+    const phone = document.getElementById('checkPhone').value.trim();
+    const result = document.getElementById('statusResult');
+    const isFr = document.documentElement.classList.contains('lang-fr');
+
+    if (!email || !phone) {
+      result.className = 'status-result not-found';
+      result.textContent = isFr ? 'Veuillez entrer votre email et votre numéro.' : 'Please enter your email and phone.';
+      return;
+    }
+
+    try {
+      const resp = await fetch(API_URL + '/api/status?email=' + encodeURIComponent(email) + '&phone=' + encodeURIComponent(phone));
+      if (resp.ok) {
+        const data = await resp.json();
+        // Save email/phone to cookie for 30 days
+        setVelaCookie(STATUS_COOKIE, JSON.stringify({email, phone}), 30);
+        const statuses = ['received','confirmed','hardware ready','installing','completed'];
+        let timelineHtml = '';
+        statuses.forEach((s,i) => {
+          const done = i <= data.status_index;
+          const active = i === data.status_index;
+          const labels = {received:'Received',confirmed:'Confirmed','hardware ready':'Hardware Ready',installing:'Installing',completed:'Completed'};
+          timelineHtml += '<div style="display:flex;align-items:center;gap:.75rem;margin-bottom:.5rem;opacity:'+(done?'1':'0.3')+'"><div style="width:24px;height:24px;border-radius:50%;background:'+(done?'var(--green)':'var(--border)')+';display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;flex-shrink:0">'+(active?'●':done?'✓':'')+'</div><span style="font-size:.9rem;font-weight:'+(active?'600':'400')+'">'+(isFr?{received:'Reçue',confirmed:'Confirmée','hardware ready':'Matériel Prêt',installing:'Installation',completed:'Terminée'}[s]||s:labels[s])+'</span></div>';
         });
+        if (data.status === 'cancelled') {
+          timelineHtml = '<div style="color:var(--red);font-weight:600">'+(isFr?'❌ Commande annulée':'❌ Order cancelled')+'</div>';
+        }
+        const canDelete = data.status_index < 1; // only 'received' can be deleted
+        const deleteBtn = canDelete
+          ? '<button class="btn btn-sm btn-ghost" onclick="deleteOrder(\'' + email + '\',\'' + phone + '\')" style="margin-top:1rem">🗑 ' + (isFr ? 'Supprimer ma commande' : 'Delete my order') + '</button>'
+          : '';
+        const cancelledMsg = data.status === 'cancelled'
+          ? '<div style="margin-top:1rem;padding:.75rem;border-radius:var(--radius-sm);background:rgba(255,71,87,.08);border:1px solid rgba(255,71,87,.2);font-size:.85rem;color:var(--red)">' + (isFr ? 'Cette commande a été annulée. Contactez-nous pour plus d\'infos.' : 'This order has been cancelled. Contact us for details.') + '</div>'
+          : '';
+        result.className = 'status-result found';
+        result.innerHTML = isFr
+          ? '<div style="margin-bottom:1rem;font-size:.85rem;color:var(--text-dim)">Commande #'+data.id+' — '+data.created_at.slice(0,10)+'</div>'+timelineHtml+deleteBtn+cancelledMsg
+          : '<div style="margin-bottom:1rem;font-size:.85rem;color:var(--text-dim)">Order #'+data.id+' — '+data.created_at.slice(0,10)+'</div>'+timelineHtml+deleteBtn+cancelledMsg;
+      } else {
+        result.className = 'status-result not-found';
+        result.textContent = isFr ? '❌ Aucune commande trouvée avec cet email et ce numéro.' : '❌ No order found with that email and phone.';
       }
+    } catch (e) {
+      result.className = 'status-result not-found';
+      result.textContent = isFr ? 'Erreur de connexion au serveur.' : 'Server connection error.';
+    }
+  });
 
-      function showStep(n, dir) {
-        const prevEl = document.getElementById('step' + currentStep);
-
-        steps.forEach(s => {
-          s.classList.remove('current', 'animate-forward', 'animate-back');
-        });
-
-        const stepEl = document.getElementById('step' + n);
-        if (stepEl) {
-          stepEl.classList.add('current');
-          if (dir) stepEl.classList.add(dir);
-        }
-
-        dots.forEach((d, i) => {
-          d.classList.remove('active', 'done');
-          if (i + 1 < n) d.classList.add('done');
-          if (i + 1 === n) d.classList.add('active');
-        });
-
-        // Pulse the step label
-        label.classList.remove('pulse');
-        void label.offsetWidth; // force reflow
-        label.textContent = 'Step ' + n + ' of ' + totalSteps;
-        label.classList.add('pulse');
-
-        // Focus the input in the new step
-        const input = stepEl ? stepEl.querySelector('input') : null;
-        if (input) setTimeout(() => input.focus(), 100);
-
-        currentStep = n;
+  window.deleteOrder = async function(email, phone) {
+    const isFr = document.documentElement.classList.contains('lang-fr');
+    if (!confirm(isFr ? 'Supprimer votre commande ? Cette action est irréversible.' : 'Delete your order? This cannot be undone.')) return;
+    try {
+      const resp = await fetch(API_URL + '/api/submission?email=' + encodeURIComponent(email) + '&phone=' + encodeURIComponent(phone), { method: 'DELETE' });
+      if (resp.ok) {
+        document.getElementById('statusResult').className = 'status-result found';
+        document.getElementById('statusResult').innerHTML = isFr ? '✅ Commande supprimée.' : '✅ Order deleted.';
+      } else {
+        alert(isFr ? 'Erreur lors de la suppression.' : 'Error deleting order.');
       }
+    } catch (e) {
+      alert(isFr ? 'Erreur de connexion.' : 'Connection error.');
+    }
+  };
 
-      function validateStep(n) {
-        clearErrors();
-        if (n === 1) {
-          const v = fields.email.input.value.trim();
-          if (!v || !validateEmail(v)) {
-            fields.email.wrapper.classList.add('error');
-            fields.email.error.classList.add('shown');
-            return false;
-          }
-        }
-        if (n === 2) {
-          const v = fields.name.input.value.trim();
-          if (!v) {
-            fields.name.wrapper.classList.add('error');
-            fields.name.error.classList.add('shown');
-            return false;
-          }
-        }
-        if (n === 3) {
-          const v = fields.domain.input.value.trim();
-          if (!v) {
-            fields.domain.wrapper.classList.add('error');
-            fields.domain.error.classList.add('shown');
-            return false;
-          }
-        }
-        return true;
-      }
+  // ── Theme Toggle ──
+  window.toggleTheme = function() {
+    const html = document.documentElement;
+    html.classList.toggle('light');
+    const isLight = html.classList.contains('light');
+    localStorage.setItem('vela_theme', isLight ? 'light' : 'dark');
+    document.getElementById('themeToggle').textContent = isLight ? '🌙' : '☀️';
+  };
 
-      function showSuccess() {
-        // Reset SVG strokes for replay
-        const circle = success.querySelector('.checkmark-circle');
-        const tick   = success.querySelector('.checkmark-tick');
-        if (circle) {
-          circle.style.animation = 'none';
-          circle.offsetHeight;
-          circle.style.animation = '';
-        }
-        if (tick) {
-          tick.style.animation = 'none';
-          tick.offsetHeight;
-          tick.style.animation = '';
-        }
-
-        steps.forEach(s => s.classList.remove('current'));
-        heading.style.display = 'none';
-        caption.style.display = 'none';
-        track.style.display = 'none';
-        label.style.display = 'none';
-        success.classList.remove('visible');
-        void success.offsetWidth; // force reflow to retrigger animation
-        success.classList.add('visible');
-      }
-
-      async function submitForm() {
-        const payload = {
-          email:  fields.email.input.value.trim(),
-          name:   fields.name.input.value.trim(),
-          domain: fields.domain.input.value.trim()
-        };
-
-        try {
-          const resp = await fetch(API_URL + '/api/submit', {
-            method: 'POST',
-            headers: { 'Content-Type': 'application/json' },
-            body: JSON.stringify(payload)
-          });
-
-          if (resp.ok) {
-            const data = await resp.json();
-            console.log('Submitted:', data);
-            showSuccess();
-          } else {
-            const err = await resp.json().catch(() => ({}));
-            alert('Error: ' + (err.error || err.detail || 'Submission failed. Please try again.'));
-          }
-        } catch (e) {
-          console.error('Fetch error:', e);
-          alert('Could not reach the server. Please check your connection.');
-        }
-      }
-
-      function resetForm() {
-        success.classList.remove('visible');
-        heading.style.display = '';
-        caption.style.display = '';
-        track.style.display = '';
-        label.style.display = '';
-        Object.values(fields).forEach(f => f.input.value = '');
-        clearErrors();
-        currentStep = 1;
-        showStep(1);
-      }
-
-      // Clear error on input for all fields
-      Object.values(fields).forEach(f => {
-        f.input.addEventListener('input', function() {
-          f.wrapper.classList.remove('error');
-          f.error.classList.remove('shown');
-        });
-      });
-
-      // Allow Enter key to advance
-      document.addEventListener('keydown', function(e) {
-        if (e.key === 'Enter' && currentStep <= totalSteps) {
-          e.preventDefault();
-          if (validateStep(currentStep)) {
-            if (currentStep < totalSteps) {
-              showStep(currentStep + 1, 'animate-forward');
-            } else {
-              submitForm();
-            }
-          }
-        }
-      });
-
-      // Step 1: Next
-      document.getElementById('next1').addEventListener('click', function() {
-        if (validateStep(1)) showStep(2, 'animate-forward');
-      });
-
-      // Step 2: Back / Next
-      document.getElementById('back2').addEventListener('click', function() {
-        showStep(1, 'animate-back');
-      });
-      document.getElementById('next2').addEventListener('click', function() {
-        if (validateStep(2)) showStep(3, 'animate-forward');
-      });
-
-      // Step 3: Back / Submit
-      document.getElementById('back3').addEventListener('click', function() {
-        showStep(2, 'animate-back');
-      });
-      document.getElementById('submitBtn').addEventListener('click', function() {
-        if (validateStep(3)) submitForm();
-      });
-
-      // Restart
-      document.getElementById('restartBtn').addEventListener('click', resetForm);
-
-      // Start
-      showStep(1);
-    })();
-  </script>
+  (function initThemeIcon() {
+    const isLight = document.documentElement.classList.contains('light');
+    document.getElementById('themeToggle').textContent = isLight ? '🌙' : '☀️';
+  })();
+})();
+</script>
 
 </body>
 </html>
diff --git a/server.py b/server.py
index 5f1b9ff..05c29a9 100644
--- a/server.py
+++ b/server.py
@@ -371,6 +371,13 @@ def delete_submission(email: str = "", phone: str = ""):
         db.close()
         raise HTTPException(404, "No submission found with that email and phone")
     sub_id = rows[0]["id"]
+    # Get current status
+    sub = db.execute("SELECT status FROM submissions WHERE id = ?", (sub_id,)).fetchone()
+    if sub:
+        status_idx = STATUSES.index(sub["status"]) if sub["status"] in STATUSES else 0
+        if status_idx >= STATUSES.index("confirmed"):
+            db.close()
+            raise HTTPException(400, "This order has already been confirmed and can no longer be deleted. Contact us via WhatsApp or Telegram.")
     db.execute("DELETE FROM submission_tags WHERE submission_id = ?", (sub_id,))
     db.execute("DELETE FROM reply_drafts WHERE submission_id = ?", (sub_id,))
     db.execute("DELETE FROM submission_data WHERE submission_id = ?", (sub_id,))