fix: update marketing page content and formatting in index.html

marketing/index.html

@@ -109,7 +109,18 @@ header.scrolled{background:var(--nav-bg);backdrop-filter:blur(16px);-webkit-back
 .lang-menu button{display:block;width:100%;text-align:start;padding:9px 12px;border:0;background:transparent;
   color:var(--text);font-family:inherit;font-size:15px;border-radius:8px;cursor:pointer}
 .lang-menu button:hover,.lang-menu button.active{background:var(--bg-alt);color:var(--brand-500)}
-.menu-toggle{display:none}
+.menu-toggle{display:none;width:44px;height:44px;border-radius:10px;border:1px solid var(--border);background:transparent;
+  color:var(--text);cursor:pointer;place-items:center;transition:.2s}
+.menu-toggle:hover{border-color:var(--brand-500);color:var(--brand-500)}
+.mobile-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:99;opacity:0;transition:opacity .3s}
+.mobile-overlay.show{display:block;opacity:1}
+.mobile-drawer{display:none;position:fixed;top:72px;inset-inline:0;background:var(--card);border-bottom:1px solid var(--border);
+  box-shadow:var(--shadow-lg);z-index:101;padding:16px 24px 24px;transform:translateY(-10px);opacity:0;
+  transition:transform .3s var(--ease),opacity .3s;max-height:calc(100svh - 72px);overflow-y:auto}
+.mobile-drawer.open{display:block;transform:none;opacity:1}
+.mobile-drawer a{display:block;padding:14px 0;font-size:17px;font-weight:600;color:var(--text);border-bottom:1px solid var(--border)}
+.mobile-drawer a:last-child{border-bottom:none}
+.mobile-drawer .btn{width:100%;justify-content:center;margin-top:12px}
 
 /* ============ HERO ============ */
 /* ============ GRAIN TEXTURE (dark sections) ============ */
@@ -265,6 +276,7 @@ html[dir="ltr"] .scroll-cue .chev{transform:rotate(-45deg)}
 .field label .val{color:var(--signal-400);font-weight:700;float:inline-end}
 input[type=range]{-webkit-appearance:none;width:100%;height:6px;border-radius:6px;
   background:linear-gradient(90deg,var(--brand-500) var(--p,40%),#28345c 0);outline:none}
+html[dir="rtl"] input[type=range]{background:linear-gradient(to left,var(--brand-500) var(--p,40%),#28345c 0)}
 input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;border-radius:50%;
   background:#fff;border:4px solid var(--brand-500);cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,.4)}
 .row2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@@ -425,7 +437,7 @@ html[dir=ltr] .transit-sec{background-image:radial-gradient(760px 420px at 88% 0
 
 /* ============ COMPARISON ============ */
 .cmp-table{width:100%;border-collapse:separate;border-spacing:0;font-size:15px}
-.cmp-table th,.cmp-table td{padding:16px 18px;text-align:start;border-bottom:1px solid var(--border)}
+.cmp-table th,.cmp-table td{padding:16px 18px;text-align:start;border-bottom:1px solid var(--border);white-space:nowrap}
 .cmp-table thead th{font-family:var(--font-display);font-size:16px}
 .cmp-table thead th.us{color:var(--brand-500)}
 .cmp-table tbody tr:hover{background:var(--bg-alt)}
@@ -767,6 +779,9 @@ footer{background:var(--midnight-900);color:#8A99C2;padding:64px 0 32px;border-t
       <a href="#how" data-i18n="nav.how">كيف نطلق</a>
       <a href="#faq" data-i18n="nav.faq">الأسئلة</a>
     </nav>
+    <button class="menu-toggle" id="menuToggle" aria-label="Menu" aria-expanded="false">
+      <svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round"><line x1="3" y1="6" x2="21" y2="6"/><line x1="3" y1="12" x2="21" y2="12"/><line x1="3" y1="18" x2="21" y2="18"/></svg>
+    </button>
     <div class="nav-right">
       <div class="lang-wrap" id="langWrap">
         <button class="icon-btn" id="langBtn" aria-label="Language" aria-haspopup="true">
@@ -785,6 +800,16 @@ footer{background:var(--midnight-900);color:#8A99C2;padding:64px 0 32px;border-t
       <a href="#demo" class="btn btn-primary" style="padding:11px 20px" data-i18n="nav.demo">جرّب الديمو</a>
     </div>
   </div>
+  <div class="mobile-overlay" id="mobileOverlay"></div>
+  <div class="mobile-drawer" id="mobileDrawer">
+    <a href="#product" data-i18n="nav.product">المنتج</a>
+    <a href="#addons" data-i18n="nav.addons">الإضافات</a>
+    <a href="#calc" data-i18n="nav.savings">حاسبة التوفير</a>
+    <a href="#pricing" data-i18n="nav.pricing">التسعير</a>
+    <a href="#how" data-i18n="nav.how">كيف نطلق</a>
+    <a href="#faq" data-i18n="nav.faq">الأسئلة</a>
+    <a href="#demo" class="btn btn-primary" data-i18n="nav.demo">جرّب الديمو</a>
+  </div>
 </header>
 
 <!-- ================= HERO ================= -->
@@ -828,7 +853,7 @@ footer{background:var(--midnight-900);color:#8A99C2;padding:64px 0 32px;border-t
         <div class="laptop-frame">
           <div class="laptop-screen">
             <video autoplay loop muted playsinline poster="assets/mock_rider.png" class="video-laptop">
-              <source src="assets/videos/A_sleek_modern_laptop_on_a_des.mp4" type="video/mp4">
+              <source src="assets/videos/Prompt_Hero_Laptop_Showcas.mp4" type="video/mp4">
             </video>
             <div class="video-overlay-badge"><i class="fa-solid fa-bolt" style="color:#ffd700;margin-inline-end:6px"></i> إطلاق منصتك خلال 30 يوماً</div>
           </div>
@@ -877,8 +902,8 @@ footer{background:var(--midnight-900);color:#8A99C2;padding:64px 0 32px;border-t
 
       <div class="pillar-card reveal">
         <div class="pillar-card-media">
-          <video autoplay loop muted playsinline poster="https://images.unsplash.com/photo-1563986768609-322da13575f3?auto=format&fit=crop&w=1200&q=80" style="width:100%;height:100%;object-fit:cover;display:block;">
+          <video autoplay loop muted playsinline poster="assets/mock_hub.png" style="width:100%;height:100%;object-fit:cover;display:block;">
-            <source src="assets/videos/Cinematic_K_video_of_a_modern.mp4" type="video/mp4">
+            <source src="assets/videos/Prompt_Data_Sovereignty_.mp4" type="video/mp4">
           </video>
           <div class="pillar-card-overlay"></div>
           <div class="pillar-card-badge"><i class="fa-solid fa-shield-halved" style="color:#10b981"></i> عقد تصدير كود وبيانات مكتوب</div>
@@ -895,8 +920,8 @@ footer{background:var(--midnight-900);color:#8A99C2;padding:64px 0 32px;border-t
           <p data-i18n="pillars.p2.d">أسعارنا معلنة بالكامل دون أي رسوم خفية أو أسرار في الفاتورة، مع توفير حقيقي يضمن نموك المالي.</p>
         </div>
         <div class="pillar-card-media">
-          <video autoplay loop muted playsinline poster="https://images.unsplash.com/photo-1554224155-8d04cb21cd6c?auto=format&fit=crop&w=1200&q=80" style="width:100%;height:100%;object-fit:cover;display:block;">
+          <video autoplay loop muted playsinline poster="assets/mock_dispatch.png" style="width:100%;height:100%;object-fit:cover;display:block;">
-            <source src="assets/videos/Ultra_modern_financial_tech_da.mp4" type="video/mp4">
+            <source src="assets/videos/Prompt_Transparent_Pricing.mp4" type="video/mp4">
           </video>
           <div class="pillar-card-overlay"></div>
           <div class="pillar-card-badge"><i class="fa-solid fa-calculator" style="color:#3b82f6"></i> أسعار معلنة وحاسبة توفير فائقة</div>
@@ -905,8 +930,8 @@ footer{background:var(--midnight-900);color:#8A99C2;padding:64px 0 32px;border-t
 
       <div class="pillar-card reveal">
         <div class="pillar-card-media">
-          <video autoplay loop muted playsinline poster="https://images.unsplash.com/photo-1519389950473-47ba0277781c?auto=format&fit=crop&w=1200&q=80" style="width:100%;height:100%;object-fit:cover;display:block;">
+          <video autoplay loop muted playsinline poster="assets/mock_rider.png" style="width:100%;height:100%;object-fit:cover;display:block;">
-            <source src="assets/videos/Fast_action_cinematic_drone_sh.mp4" type="video/mp4">
+            <source src="assets/videos/Prompt_Rapid_Day_Launch.mp4" type="video/mp4">
           </video>
           <div class="pillar-card-overlay"></div>
           <div class="pillar-card-badge"><i class="fa-solid fa-bolt" style="color:#ffd700"></i> إطلاق جاهز خلال 30 يوماً</div>
@@ -975,7 +1000,7 @@ footer{background:var(--midnight-900);color:#8A99C2;padding:64px 0 32px;border-t
       </div>
       <div class="mock-img-wrap">
         <video autoplay loop muted playsinline poster="assets/mock_rider.png" class="mock-video">
-          <source src="assets/videos/Close_up_shot_of_a_smartphone.mp4" type="video/mp4">
+          <source src="assets/videos/Prompt_Rapid_Day_Launch.mp4" type="video/mp4">
         </video>
       </div>
     </div>
@@ -991,7 +1016,7 @@ footer{background:var(--midnight-900);color:#8A99C2;padding:64px 0 32px;border-t
       </div>
       <div class="mock-img-wrap">
         <video autoplay loop muted playsinline poster="assets/mock_driver.png" class="mock-video">
-          <source src="assets/videos/Close_up_shot_of_a_smartphone.mp4" type="video/mp4">
+          <source src="assets/videos/Prompt_Rapid_Day_Launch.mp4" type="video/mp4">
         </video>
       </div>
     </div>
@@ -1007,7 +1032,7 @@ footer{background:var(--midnight-900);color:#8A99C2;padding:64px 0 32px;border-t
       </div>
       <div class="mock-img-wrap">
         <video autoplay loop muted playsinline poster="assets/mock_dispatch.png" class="mock-video">
-          <source src="assets/videos/Ultra_modern_executive_laptop.mp4" type="video/mp4">
+          <source src="assets/videos/Prompt_Fleet_Dispatch_Co.mp4" type="video/mp4">
         </video>
       </div>
     </div>
@@ -1023,7 +1048,7 @@ footer{background:var(--midnight-900);color:#8A99C2;padding:64px 0 32px;border-t
       </div>
       <div class="mock-img-wrap">
         <video autoplay loop muted playsinline poster="assets/mock_hub.png" class="mock-video">
-          <source src="assets/videos/Cinematic_K_video_of_a_modern.mp4" type="video/mp4">
+          <source src="assets/videos/Prompt_Data_Sovereignty_.mp4" type="video/mp4">
         </video>
       </div>
     </div>
@@ -1229,7 +1254,7 @@ footer{background:var(--midnight-900);color:#8A99C2;padding:64px 0 32px;border-t
       <div class="addon-card">
         <div class="addon-badge available" data-i18n="addon.badge.now"></div>
         <video autoplay loop muted playsinline class="transit-video" style="max-height:160px;margin-bottom:14px;border-radius:14px;">
-          <source src="assets/videos/Close_up_cinematic_video_of_a.mp4" type="video/mp4">
+          <source src="assets/videos/Prompt_Fleet_Dispatch_Co.mp4" type="video/mp4">
         </video>
         <h3 data-i18n="addons.m1.name"></h3>
         <p data-i18n="addons.m1.desc"></p>
@@ -1287,7 +1312,7 @@ footer{background:var(--midnight-900);color:#8A99C2;padding:64px 0 32px;border-t
       <div class="transit-card">
         <div class="addon-badge available" data-i18n="addon.badge.now"></div>
         <video autoplay loop muted playsinline class="transit-video">
-          <source src="assets/videos/A_modern_electric_city_bus_tra.mp4" type="video/mp4">
+          <source src="assets/videos/Prompt_Public_Transit_Bu.mp4" type="video/mp4">
         </video>
         <div class="transit-price"><span class="num">$299</span><span data-i18n="transit.period"></span></div>
         <div class="transit-setup" data-i18n="transit.setup"></div>
@@ -1772,25 +1797,25 @@ const I18N = {
 const FAQS={
  ar:[["من يملك بيانات الركاب والسائقين؟","أنت. تصدّرها كاملة في أي وقت، والعقد يلزمنا بفترة انتقال 60 يوماً إن قررت المغادرة."],
      ["ماذا لو أفلستم أو أغلقتم؟","باقة «سيادة» تعمل من خوادم داخل بلدك، ولكل الباقات ضمان تصدير + escrow اختياري للكود."],
-     ["كم النسبة بالضبط؟","مكتوبة في صفحة التسعير: 5% (انطلاقة) · 2.5% (علامة) · 2% (أسطول+) · 1% (سيادة) — تنازلية مع نمو GMV."],
+     ["كم النسبة بالضبط؟","مكتوبة في صفحة التسعير: 3.5% (انطلاقة) · 2.5% (علامة) · 2% (أسطول+) · 1% (سيادة) — تنازلية مع نمو GMV."],
      ["هل أحتاج فريقاً تقنياً؟","لا. النشر والتحديثات والمتاجر علينا. أنت تدير التشغيل من لوحة عربية."],
      ["عندي تطبيق قديم وسائقون نشطون — هل أخسرهم؟","لا: نرحّل السائقين والأرصدة والسجلات بلا يوم توقف."],
      ["هل يدعم الدفع كاش؟","نعم، الكاش افتراضي أساسي، والمحافظ والبطاقات إضافات حسب بلدك (Paymob في مصر وبوابات محلية أخرى)."]],
  en:[["Who owns the rider and driver data?","You do. Export it in full anytime, and the contract binds us to a 60-day transition period if you decide to leave."],
      ["What if you go bankrupt or shut down?","The Sovereign plan runs from servers inside your country, and every plan has an export guarantee + optional code escrow."],
-     ["What exactly is the rate?","Written on the pricing page: 5% (Startup) · 2.5% (Brand) · 2% (Fleet+) · 1% (Sovereign) — descending as GMV grows."],
+     ["What exactly is the rate?","Written on the pricing page: 3.5% (Startup) · 2.5% (Brand) · 2% (Fleet+) · 1% (Sovereign) — descending as GMV grows."],
      ["Do I need a technical team?","No. Publishing, updates and the stores are on us. You run operations from an Arabic-first panel."],
      ["I have a legacy app and active drivers — will I lose them?","No: we migrate drivers, balances and records with zero downtime."],
      ["Does it support cash payment?","Yes, cash is the core default, and wallets and cards are add-ons per country (Paymob in Egypt and other local gateways)."]],
  fr:[["Qui possède les données des passagers et chauffeurs ?","Vous. Exportez-les intégralement à tout moment ; le contrat nous oblige à une transition de 60 jours si vous partez."],
      ["Et si vous faites faillite ou fermez ?","Le forfait Souveraineté tourne sur des serveurs dans votre pays, et chaque forfait a une garantie d'export + escrow de code optionnel."],
-     ["Quel est exactement le taux ?","Écrit sur la page tarifs : 5% (Démarrage) · 2,5% (Marque) · 2% (Flotte+) · 1% (Souveraineté) — dégressif selon le GMV."],
+     ["Quel est exactement le taux ?","Écrit sur la page tarifs : 3,5% (Démarrage) · 2,5% (Marque) · 2% (Flotte+) · 1% (Souveraineté) — dégressif selon le GMV."],
      ["Ai-je besoin d'une équipe technique ?","Non. Publication, mises à jour et stores sont pour nous. Vous gérez depuis un panneau pensé pour l'arabe."],
      ["J'ai une ancienne app et des chauffeurs actifs — vais-je les perdre ?","Non : nous migrons chauffeurs, soldes et historiques sans interruption."],
      ["Le paiement en espèces est-il pris en charge ?","Oui, l'espèce est le défaut de base ; portefeuilles et cartes sont des options selon le pays (Paymob en Égypte et autres passerelles locales)."]],
  es:[["¿Quién es dueño de los datos de pasajeros y conductores?","Tú. Expórtalos completos en cualquier momento; el contrato nos obliga a 60 días de transición si decides irte."],
      ["¿Qué pasa si quiebran o cierran?","El plan Soberanía corre en servidores dentro de tu país, y todos los planes tienen garantía de exportación + escrow de código opcional."],
-     ["¿Cuál es exactamente la tarifa?","Escrita en la página de precios: 5% (Inicio) · 2,5% (Marca) · 2% (Flota+) · 1% (Soberanía) — decreciente al crecer el GMV."],
+     ["¿Cuál es exactamente la tarifa?","Escrita en la página de precios: 3,5% (Inicio) · 2,5% (Marca) · 2% (Flota+) · 1% (Soberanía) — decreciente al crecer el GMV."],
      ["¿Necesito un equipo técnico?","No. Publicación, actualizaciones y tiendas corren por nuestra cuenta. Tú operas desde un panel pensado en árabe."],
      ["Tengo una app antigua y conductores activos — ¿los perderé?","No: migramos conductores, saldos y registros sin tiempo de inactividad."],
      ["¿Admite pago en efectivo?","Sí, el efectivo es el predeterminado base; billeteras y tarjetas son complementos según el país (Paymob en Egipto y otras pasarelas locales)."]]
@@ -1883,8 +1908,8 @@ function calc(){
 
   const minMonthly = monthlyTrips * minRate;
   const tripz = base + Math.max(minMonthly, gmvFee);
-  const commission = gmv * 0.15;
+  const commission = monthlyTrips * 0.10;
-  const floor = monthlyTrips * 0.10;
+  const floor = monthlyTrips * 0.05;
   
   $("#rTripz").textContent = fmt(tripz);
   $("#rComm").textContent = fmt(commission);
@@ -1962,6 +1987,17 @@ $$(".lang-menu button").forEach(b=>b.addEventListener("click",()=>{applyLang(b.d
 /* ============ NAV SCROLL ============ */
 addEventListener("scroll",()=>{$("#hdr").classList.toggle("scrolled",scrollY>80);});
 
+/* ============ MOBILE MENU ============ */
+(function(){
+  const toggle=$("#menuToggle"),drawer=$("#mobileDrawer"),overlay=$("#mobileOverlay");
+  if(!toggle||!drawer)return;
+  function close(){drawer.classList.remove("open");overlay.classList.remove("show");toggle.setAttribute("aria-expanded","false");}
+  function open(){drawer.classList.add("open");overlay.classList.add("show");toggle.setAttribute("aria-expanded","true");}
+  toggle.addEventListener("click",()=>{drawer.classList.contains("open")?close():open();});
+  overlay.addEventListener("click",close);
+  drawer.querySelectorAll("a").forEach(a=>a.addEventListener("click",close));
+})();
+
 /* ============ CALC INPUTS ============ */
 ["trips","fare","cur","plan"].forEach(id=>$("#"+id).addEventListener("input",calc));