Hamza-AyedandClaude Opus 5
75b80bd299
- marketing: index.html من 2274 إلى 775 سطراً، والباقي إلى styles/ (tokens·base·components·sections·responsive) و js/ (app·i18n·calculator·analytics) و i18n/ بخمس لغات (ar·en·fr·es·tr) عبر سمة data-i18n. - docs/05 + docs/33 + لوحة السوبر-أدمن: الباقات صارت ثلاثاً (إطلاق · نمو · سيادة) بدل الأربع، وتحديث docs/31 بما يطابقها. - docs/36: توثيق سيرو إكسبرس للتوصيل. - تنظيف استيرادات غير مستعملة في apps/rider و apps/driver. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
776 lines
44 KiB
HTML
776 lines
44 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="ar" dir="rtl" data-theme="dark">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title data-i18n="page.title">Tripz — أطلق تطبيق النقل بعلامتك التجارية</title>
|
||
<meta name="description" content="أطلق تطبيق نقل بعلامتك التجارية خلال 30 يوماً — بياناتك تبقى لك. تطبيقا راكب وسائق، لوحة تحكم وdispatch، بتكلفة معلنة على الموقع.">
|
||
<meta property="og:title" content="Tripz — Launch ride-hailing under your brand">
|
||
<meta property="og:description" content="Rider & driver apps on both stores, admin panel and dispatch — pricing published, data export guaranteed.">
|
||
<meta property="og:type" content="website">
|
||
<link rel="alternate" hreflang="ar" href="/ar/"><link rel="alternate" hreflang="en" href="/en/">
|
||
<link rel="alternate" hreflang="fr" href="/fr/"><link rel="alternate" hreflang="es" href="/es/">
|
||
<link rel="alternate" hreflang="tr" href="/tr/">
|
||
<link rel="alternate" hreflang="x-default" href="/ar/">
|
||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||
<link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Arabic:wght@400;500;600;700&family=Inter:wght@400;500;600;700&family=Space+Grotesk:wght@500;600;700&display=swap" rel="stylesheet">
|
||
<link rel="stylesheet" href="styles/tokens.css">
|
||
<link rel="stylesheet" href="styles/base.css">
|
||
<link rel="stylesheet" href="styles/components.css">
|
||
<link rel="stylesheet" href="styles/sections.css">
|
||
<link rel="stylesheet" href="styles/responsive.css">
|
||
</head>
|
||
<body>
|
||
|
||
<!-- ================= HEADER ================= -->
|
||
<header id="hdr">
|
||
<div class="wrap nav">
|
||
<a href="#" class="brand" aria-label="Tripz">
|
||
<span class="brand-badge"><img src="assets/logotripz.png" alt="Tripz"></span>
|
||
</a>
|
||
<nav class="nav-links">
|
||
<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>
|
||
</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">
|
||
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="10"/><path d="M2 12h20M12 2a15 15 0 010 20M12 2a15 15 0 000 20"/></svg>
|
||
</button>
|
||
<div class="lang-menu" role="menu">
|
||
<button data-lang="ar" class="active">العربية</button>
|
||
<button data-lang="en">English</button>
|
||
<button data-lang="fr">Français</button>
|
||
<button data-lang="es">Español</button>
|
||
<button data-lang="tr">Türkçe</button>
|
||
</div>
|
||
</div>
|
||
<button class="icon-btn" id="themeBtn" aria-label="Theme">
|
||
<svg id="thmIcon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 12.8A9 9 0 1111.2 3a7 7 0 009.8 9.8z"/></svg>
|
||
</button>
|
||
<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>
|
||
<div class="mobile-drawer-lang" style="display:flex;gap:8px;flex-wrap:wrap;padding:14px 0;border-bottom:1px solid var(--border)">
|
||
<button data-lang="ar" class="btn btn-ghost" style="padding:8px 14px;font-size:14px">العربية</button>
|
||
<button data-lang="en" class="btn btn-ghost" style="padding:8px 14px;font-size:14px">English</button>
|
||
<button data-lang="fr" class="btn btn-ghost" style="padding:8px 14px;font-size:14px">Français</button>
|
||
<button data-lang="es" class="btn btn-ghost" style="padding:8px 14px;font-size:14px">Español</button>
|
||
<button data-lang="tr" class="btn btn-ghost" style="padding:8px 14px;font-size:14px">Türkçe</button>
|
||
</div>
|
||
<a href="#demo" class="btn btn-primary" data-i18n="nav.demo">جرّب الديمو</a>
|
||
</div>
|
||
</header>
|
||
|
||
<!-- ================= HERO ================= -->
|
||
<section class="hero grain" id="top">
|
||
<svg class="hero-map" viewBox="0 0 1200 600" preserveAspectRatio="xMidYMid slice" aria-hidden="true">
|
||
<g stroke="#1b2a52" stroke-width="1.5" fill="none" opacity=".7">
|
||
<path d="M0 120 H1200 M0 260 H1200 M0 400 H1200 M0 540 H1200"/>
|
||
<path d="M180 0 V600 M420 0 V600 M660 0 V600 M900 0 V600 M1080 0 V600"/>
|
||
</g>
|
||
<path id="road1" d="M-50 400 C 250 400 300 180 620 180 S 1000 260 1260 260" stroke="#2E4BFF" stroke-width="3" fill="none" opacity=".6"/>
|
||
<path id="road2" d="M-50 120 C 300 120 380 460 720 460 S 1100 400 1260 420" stroke="#D6DBEE" stroke-width="2.5" fill="none" opacity=".35"/>
|
||
<path id="road3" d="M-50 540 C 200 540 260 320 560 320 S 950 140 1260 100" stroke="#8AA0FF" stroke-width="2" fill="none" opacity=".3"/>
|
||
<circle cx="620" cy="180" r="4" fill="#2E4BFF" opacity=".8"><animate attributeName="r" values="4;9;4" dur="2.6s" repeatCount="indefinite"/><animate attributeName="opacity" values=".8;0;.8" dur="2.6s" repeatCount="indefinite"/></circle>
|
||
<circle cx="720" cy="460" r="4" fill="#D6DBEE" opacity=".7"><animate attributeName="r" values="4;9;4" dur="3.2s" begin="-1s" repeatCount="indefinite"/><animate attributeName="opacity" values=".7;0;.7" dur="3.2s" begin="-1s" repeatCount="indefinite"/></circle>
|
||
<circle r="6" fill="#fff"><animateMotion dur="9s" repeatCount="indefinite"><mpath href="#road1"/></animateMotion></circle>
|
||
<circle r="5" fill="#D6DBEE"><animateMotion dur="12s" repeatCount="indefinite"><mpath href="#road2"/></animateMotion></circle>
|
||
<circle r="5" fill="#8AA0FF"><animateMotion dur="14s" begin="-4s" repeatCount="indefinite"><mpath href="#road1"/></animateMotion></circle>
|
||
<circle r="4.5" fill="#2E4BFF"><animateMotion dur="10s" begin="-2s" repeatCount="indefinite"><mpath href="#road3"/></animateMotion></circle>
|
||
<circle r="4" fill="#fff" opacity=".8"><animateMotion dur="16s" begin="-7s" repeatCount="indefinite"><mpath href="#road2"/></animateMotion></circle>
|
||
</svg>
|
||
<a href="#why" class="scroll-cue" aria-label="Scroll down"><span data-i18n="hero.scroll"></span><span class="chev"></span></a>
|
||
<div class="wrap hero-grid">
|
||
<div class="hero-copy">
|
||
<h1 id="heroTitle"></h1>
|
||
<p class="hero-sub" data-i18n="hero.sub"></p>
|
||
<div class="hero-cta">
|
||
<a href="#demo" class="btn btn-primary btn-lg" data-i18n="hero.cta1">جرّب الديمو الحي</a>
|
||
<a href="https://wa.me/201023248456" target="_blank" rel="noopener" class="btn btn-wa btn-lg" data-i18n="hero.cta2">
|
||
<svg width="20" height="20" viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-8.6 15l-1.3 4.7 4.8-1.3A10 10 0 1012 2zm0 18a8 8 0 01-4-1.1l-.3-.2-2.9.8.8-2.8-.2-.3A8 8 0 1112 20zm4.4-6c-.2-.1-1.4-.7-1.6-.8s-.4-.1-.6.1-.6.8-.8.9-.3.2-.6 0a6.5 6.5 0 01-1.9-1.2 7.3 7.3 0 01-1.4-1.7c-.1-.3 0-.4.1-.5l.4-.5.3-.5v-.4l-.8-1.9c-.2-.5-.4-.4-.6-.4h-.5a1 1 0 00-.7.3 3 3 0 00-.9 2.2 5.2 5.2 0 001.1 2.7 11.8 11.8 0 004.5 4c.6.2 1.1.4 1.5.5.6.2 1.2.2 1.6.1.5-.1 1.4-.6 1.6-1.1s.2-1 .1-1.1z"/></svg>
|
||
<span data-i18n="hero.cta2">تحدّث معنا على واتساب</span>
|
||
</a>
|
||
</div>
|
||
<p class="trust-line">
|
||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="#25D366" stroke-width="2.5"><path d="M20 6L9 17l-5-5"/></svg>
|
||
<b data-i18n="hero.trust"></b>
|
||
</p>
|
||
</div>
|
||
<div class="hero-visual">
|
||
<!-- 3D Laptop Video Showroom -->
|
||
<div class="hero-showroom">
|
||
<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/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> <span data-i18n="hero.badge">إطلاق منصتك خلال 30 يوماً</span></div>
|
||
</div>
|
||
</div>
|
||
<div class="laptop-base"></div>
|
||
|
||
<!-- Floating Rider Phone -->
|
||
<div class="phone-float phone-rider">
|
||
<div class="p-notch"></div>
|
||
<div class="p-screen" style="padding:0">
|
||
<img src="assets/mock_rider.png" alt="Tripz Rider App" style="width:100%;height:auto;display:block">
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Floating Driver Phone -->
|
||
<div class="phone-float phone-driver">
|
||
<div class="p-notch"></div>
|
||
<div class="p-screen" style="padding:0">
|
||
<img src="assets/mock_driver.png" alt="Tripz Driver App" style="width:100%;height:auto;display:block">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ================= STATS ================= -->
|
||
<section class="stats" style="padding:48px 0">
|
||
<div class="wrap stats-grid">
|
||
<div class="stat reveal"><div class="n"><span class="count" data-to="2019" data-plain="1">2019</span></div><div class="l" data-i18n="stat.since"></div></div>
|
||
<div class="stat reveal"><div class="n">$<span class="count" data-to="0.02" data-dec="2">0.02</span></div><div class="l" data-i18n="stat.min"></div></div>
|
||
<div class="stat reveal"><div class="n"><span class="count" data-to="30">30</span> <span data-i18n="stat.days"></span></div><div class="l" data-i18n="stat.launch"></div></div>
|
||
<div class="stat reveal"><div class="n"><span class="count" data-to="4">4</span></div><div class="l" data-i18n="stat.lang"></div></div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ================= PILLARS ================= -->
|
||
<section id="why">
|
||
<div class="wrap">
|
||
<div class="center reveal">
|
||
<div class="eyebrow" data-i18n="pillars.eyebrow"></div>
|
||
<h2 class="sec" data-i18n="pillars.title"></h2>
|
||
<p class="sec-lead" data-i18n="pillars.lead"></p>
|
||
</div>
|
||
<div class="feature-rows">
|
||
|
||
<div class="pillar-card reveal">
|
||
<div class="pillar-card-media">
|
||
<video autoplay loop muted playsinline poster="assets/mock_hub.png" style="width:100%;height:100%;object-fit:cover;display:block;">
|
||
<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> <span data-i18n="pillar.badge.1">عقد تصدير كود وبيانات مكتوب</span></div>
|
||
</div>
|
||
<div class="pillar-card-content">
|
||
<h3 data-i18n="pillars.p1.t">بياناتك سيادتك</h3>
|
||
<p data-i18n="pillars.p1.d">تصدير كامل في أي وقت، فترة انتقال 60 يوماً مكتوبة في العقد، وخيار نشر داخل بلدك.</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="pillar-card reverse reveal">
|
||
<div class="pillar-card-content">
|
||
<h3 data-i18n="pillars.p2.t">تكلفة بلا مفاجآت</h3>
|
||
<p data-i18n="pillars.p2.d">أسعارنا معلنة بالكامل دون أي رسوم خفية أو أسرار في الفاتورة، مع توفير حقيقي يضمن نموك المالي.</p>
|
||
</div>
|
||
<div class="pillar-card-media">
|
||
<video autoplay loop muted playsinline poster="assets/mock_dispatch.png" style="width:100%;height:100%;object-fit:cover;display:block;">
|
||
<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> <span data-i18n="pillar.badge.2">أسعار معلنة وحاسبة توفير فائقة</span></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="pillar-card reveal">
|
||
<div class="pillar-card-media">
|
||
<video autoplay loop muted playsinline poster="assets/mock_rider.png" style="width:100%;height:100%;object-fit:cover;display:block;">
|
||
<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> <span data-i18n="pillar.badge.3">إطلاق جاهز خلال 30 يوماً</span></div>
|
||
</div>
|
||
<div class="pillar-card-content">
|
||
<h3 data-i18n="pillars.p3.t">أسرع من أن تتردد</h3>
|
||
<p data-i18n="pillars.p3.d">نطلق لك منصة وتطبيقات نقل متكاملة باسمك وشعارك على آبل وجوجل في 30 يوماً فقط!</p>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ================= BRANDS WE POWER ================= -->
|
||
<section id="brands" style="background:var(--bg-alt);padding:72px 0">
|
||
<div class="wrap">
|
||
<div class="center reveal">
|
||
<div class="eyebrow" data-i18n="brands.eyebrow"></div>
|
||
<h2 class="sec" style="font-size:clamp(24px,3vw,32px)" data-i18n="brands.title"></h2>
|
||
</div>
|
||
<div class="brand-logos reveal">
|
||
<div class="blogo-card">
|
||
<img src="assets/logotripz.png" alt="Tripz">
|
||
<span data-i18n="brand.label">Tripz — العلامة الرئيسية</span>
|
||
</div>
|
||
<div class="blogo-card">
|
||
<img src="assets/logo_siro.png" alt="Siro">
|
||
<span data-i18n="brands.siro"></span>
|
||
</div>
|
||
<div class="blogo-card">
|
||
<img src="assets/intaleq.png" alt="Intalaq">
|
||
<span data-i18n="brands.intalaq"></span>
|
||
</div>
|
||
<div class="blogo-card blogo-more">
|
||
<div class="blogo-plus">+</div>
|
||
<span data-i18n="brands.next"></span>
|
||
</div>
|
||
</div>
|
||
<p class="brands-note" data-i18n="brands.note"></p>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ================= PRODUCT TABS ================= -->
|
||
<section id="product" class="ambient" style="background:var(--bg-alt)">
|
||
<div class="wrap">
|
||
<div class="center reveal">
|
||
<div class="eyebrow" data-i18n="prod.eyebrow"></div>
|
||
<h2 class="sec" data-i18n="prod.title"></h2>
|
||
</div>
|
||
<div style="display:flex;justify-content:center"><div class="tabs-nav reveal">
|
||
<button class="tab-btn active" data-tab="rider" data-i18n="prod.tab.rider"></button>
|
||
<button class="tab-btn" data-tab="driver" data-i18n="prod.tab.driver"></button>
|
||
<button class="tab-btn" data-tab="dispatch" data-i18n="prod.tab.dispatch"></button>
|
||
<button class="tab-btn" data-tab="hub" data-i18n="prod.tab.hub"></button>
|
||
</div></div>
|
||
|
||
<div class="tab-panel active" data-panel="rider">
|
||
<div>
|
||
<h3 style="font-size:28px;margin-bottom:10px" data-i18n="prod.rider.h"></h3>
|
||
<ul class="feat-list">
|
||
<li><span class="ck">✓</span><span data-i18n="prod.rider.1"></span></li>
|
||
<li><span class="ck">✓</span><span data-i18n="prod.rider.2"></span></li>
|
||
<li><span class="ck">✓</span><span data-i18n="prod.rider.3"></span></li>
|
||
</ul>
|
||
</div>
|
||
<div class="mock-img-wrap">
|
||
<video autoplay loop muted playsinline poster="assets/mock_rider.png" class="mock-video">
|
||
<source src="assets/videos/Prompt_Rapid_Day_Launch.mp4" type="video/mp4">
|
||
</video>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="tab-panel" data-panel="driver">
|
||
<div>
|
||
<h3 style="font-size:28px;margin-bottom:10px" data-i18n="prod.driver.h"></h3>
|
||
<ul class="feat-list">
|
||
<li><span class="ck">✓</span><span data-i18n="prod.driver.1"></span></li>
|
||
<li><span class="ck">✓</span><span data-i18n="prod.driver.2"></span></li>
|
||
<li><span class="ck">✓</span><span data-i18n="prod.driver.3"></span></li>
|
||
</ul>
|
||
</div>
|
||
<div class="mock-img-wrap">
|
||
<video autoplay loop muted playsinline poster="assets/mock_driver.png" class="mock-video">
|
||
<source src="assets/videos/Prompt_Rapid_Day_Launch.mp4" type="video/mp4">
|
||
</video>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="tab-panel" data-panel="dispatch">
|
||
<div>
|
||
<h3 style="font-size:28px;margin-bottom:10px" data-i18n="prod.dispatch.h"></h3>
|
||
<ul class="feat-list">
|
||
<li><span class="ck">✓</span><span data-i18n="prod.dispatch.1"></span></li>
|
||
<li><span class="ck">✓</span><span data-i18n="prod.dispatch.2"></span></li>
|
||
<li><span class="ck">✓</span><span data-i18n="prod.dispatch.3"></span></li>
|
||
</ul>
|
||
</div>
|
||
<div class="mock-img-wrap">
|
||
<video autoplay loop muted playsinline poster="assets/mock_dispatch.png" class="mock-video">
|
||
<source src="assets/videos/Prompt_Fleet_Dispatch_Co.mp4" type="video/mp4">
|
||
</video>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="tab-panel" data-panel="hub">
|
||
<div>
|
||
<h3 style="font-size:28px;margin-bottom:10px" data-i18n="prod.hub.h"></h3>
|
||
<ul class="feat-list">
|
||
<li><span class="ck">✓</span><span data-i18n="prod.hub.1"></span></li>
|
||
<li><span class="ck">✓</span><span data-i18n="prod.hub.2"></span></li>
|
||
<li><span class="ck">✓</span><span data-i18n="prod.hub.3"></span></li>
|
||
</ul>
|
||
</div>
|
||
<div class="mock-img-wrap">
|
||
<video autoplay loop muted playsinline poster="assets/mock_hub.png" class="mock-video">
|
||
<source src="assets/videos/Prompt_Data_Sovereignty_.mp4" type="video/mp4">
|
||
</video>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ================= AI MODULES & NABEH INTEGRATION ================= -->
|
||
<!-- ================= CALCULATOR ================= -->
|
||
<section class="calc grain" id="calc">
|
||
<div class="wrap">
|
||
<div class="center reveal">
|
||
<div class="eyebrow" style="color:#8AA0FF" data-i18n="calc.eyebrow"></div>
|
||
<h2 class="sec" data-i18n="calc.title"></h2>
|
||
<p class="sec-lead" data-i18n="calc.lead"></p>
|
||
</div>
|
||
<div class="calc-grid reveal">
|
||
<div class="calc-panel">
|
||
<div class="field">
|
||
<label data-i18n="calc.trips"></label>
|
||
<input type="range" id="trips" min="50" max="5000" step="50" value="1500">
|
||
<div style="display:flex;justify-content:space-between;font-size:12px;color:#7C8DBB;margin-top:6px"><span>50</span><span id="tripsVal" class="num" style="color:#D6DBEE;font-weight:700;font-size:16px">1,500 / day</span><span>5,000</span></div>
|
||
</div>
|
||
<div class="row2">
|
||
<div class="field">
|
||
<label data-i18n="calc.fare"></label>
|
||
<input type="number" class="txtin num" id="fare" value="2.2" step="0.1" min="0.1">
|
||
</div>
|
||
<div class="field">
|
||
<label data-i18n="calc.currency"></label>
|
||
<select id="cur">
|
||
<option value="JOD:1.41">JOD — دينار أردني</option>
|
||
<option value="EGP:0.021">EGP — جنيه مصري</option>
|
||
<option value="SYP:0.00007">SYP — ليرة سورية</option>
|
||
<option value="USD:1">USD — دولار</option>
|
||
<option value="EUR:1.08">EUR — يورو</option>
|
||
<option value="MAD:0.10">MAD — درهم مغربي</option>
|
||
<option value="XOF:0.0017">XOF — فرنك غرب أفريقيا</option>
|
||
</select>
|
||
</div>
|
||
</div>
|
||
<div class="field" style="margin-bottom:0">
|
||
<label data-i18n="calc.plan"></label>
|
||
<select id="plan">
|
||
<option value="349:0.025:0.04:launch">إطلاق — $349/mo · 2.5%</option>
|
||
<option value="599:0.02:0.03:growth" selected>نمو — $599/mo · 2%</option>
|
||
<option value="879:0.01:0.02:sov">سيادة — $879/mo · 1%</option>
|
||
</select>
|
||
</div>
|
||
</div>
|
||
<div class="result">
|
||
<div class="cmp-row tripz"><span class="lbl" data-i18n="calc.r.tripz"></span><span class="amt num" id="rTripz">$—</span></div>
|
||
<div class="cmp-row rival"><span class="lbl" data-i18n="calc.r.commission"></span><span class="amt num" id="rComm">$—</span></div>
|
||
<div class="cmp-row rival"><span class="lbl" data-i18n="calc.r.floor"></span><span class="amt num" id="rFloor">$—</span></div>
|
||
<div class="savings" id="savings">
|
||
<div class="cap" data-i18n="calc.r.savecap"></div>
|
||
<div class="big num" id="saveBig">$—</div>
|
||
</div>
|
||
<a href="#wa" class="btn btn-wa calc-cta" id="waCalc"><span data-i18n="calc.r.send"></span></a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ================= TIMELINE / HOW ================= -->
|
||
<section id="how">
|
||
<div class="wrap">
|
||
<div class="center reveal">
|
||
<div class="eyebrow" data-i18n="how.eyebrow"></div>
|
||
<h2 class="sec" data-i18n="how.title"></h2>
|
||
<p class="sec-lead" data-i18n="how.lead"></p>
|
||
</div>
|
||
<div class="zig-timeline reveal" id="timeline">
|
||
<div class="zig-line"></div><div class="zig-fill" id="tlFill"></div>
|
||
<div class="zig-row a"><div class="zig-card"><div class="zig-day" data-i18n="how.s1.d"></div><h3 data-i18n="how.s1.t"></h3><p data-i18n="how.s1.p"></p></div><div class="zig-node">1</div></div>
|
||
<div class="zig-row b"><div class="zig-node">2</div><div class="zig-card"><div class="zig-day" data-i18n="how.s2.d"></div><h3 data-i18n="how.s2.t"></h3><p data-i18n="how.s2.p"></p></div></div>
|
||
<div class="zig-row a"><div class="zig-card"><div class="zig-day" data-i18n="how.s3.d"></div><h3 data-i18n="how.s3.t"></h3><p data-i18n="how.s3.p"></p></div><div class="zig-node">3</div></div>
|
||
<div class="zig-row b"><div class="zig-node">4</div><div class="zig-card"><div class="zig-day" data-i18n="how.s4.d"></div><h3 data-i18n="how.s4.t"></h3><p data-i18n="how.s4.p"></p></div></div>
|
||
<div class="zig-row a"><div class="zig-card"><div class="zig-day" data-i18n="how.s5.d"></div><h3 data-i18n="how.s5.t"></h3><p data-i18n="how.s5.p"></p></div><div class="zig-node">5</div></div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ================= PRICING ================= -->
|
||
<section id="pricing" class="ambient" style="background:var(--bg-alt)">
|
||
<div class="wrap">
|
||
<div class="center reveal">
|
||
<div class="eyebrow" data-i18n="price.eyebrow"></div>
|
||
<h2 class="sec" data-i18n="price.title"></h2>
|
||
<p class="sec-lead" data-i18n="price.lead"></p>
|
||
</div>
|
||
<div class="toggle-wrap reveal">
|
||
<span class="toggle-lbl active" id="lblM" data-i18n="price.monthly"></span>
|
||
<button class="toggle" id="billToggle" aria-label="billing"><span class="knob"></span></button>
|
||
<span class="toggle-lbl" id="lblY" data-i18n="price.yearly"></span>
|
||
<span class="badge-save" data-i18n="price.save15"></span>
|
||
</div>
|
||
<div class="price-grid">
|
||
<!-- Launch -->
|
||
<div class="plan reveal">
|
||
<h3 data-i18n="plan.launch.n"></h3>
|
||
<div class="price" data-m="349" data-y="297">$349<small>/mo</small></div>
|
||
<div class="setup"><span data-i18n="plan.setup"></span> $4,900</div>
|
||
<span class="gmv">GMV 2.5% · min $0.04</span>
|
||
<ul>
|
||
<li><span class="ck">✓</span><span data-i18n="plan.launch.1"></span></li>
|
||
<li><span class="ck">✓</span><span data-i18n="plan.launch.2"></span></li>
|
||
<li><span class="ck">✓</span><span data-i18n="plan.launch.3"></span></li>
|
||
<li><span class="ck">✓</span><span data-i18n="plan.launch.4"></span></li>
|
||
</ul>
|
||
<a href="https://wa.me/201023248456" target="_blank" rel="noopener" class="btn btn-ghost" data-i18n="plan.launch.cta"></a>
|
||
</div>
|
||
<!-- Growth featured -->
|
||
<div class="plan featured reveal">
|
||
<span class="tag" data-i18n="plan.popular"></span>
|
||
<h3 data-i18n="plan.growth.n"></h3>
|
||
<div class="price" data-m="599" data-y="509">$599<small>/mo</small></div>
|
||
<div class="setup"><span data-i18n="plan.setup"></span> $8,500</div>
|
||
<span class="gmv">GMV 2% · min $0.03</span>
|
||
<div class="plan-inherit" data-i18n="plan.growth.0"></div>
|
||
<ul>
|
||
<li><span class="ck">✓</span><span data-i18n="plan.growth.1"></span></li>
|
||
<li><span class="ck">✓</span><span data-i18n="plan.growth.2"></span></li>
|
||
<li><span class="ck">✓</span><span data-i18n="plan.growth.3"></span></li>
|
||
<li><span class="ck">✓</span><span class="plan-incl" data-i18n="plan.growth.4"></span></li>
|
||
</ul>
|
||
<a href="https://calendly.com/sefertraveling/30min" target="_blank" rel="noopener" class="btn btn-primary" data-i18n="plan.growth.cta"></a>
|
||
</div>
|
||
<!-- Sovereign -->
|
||
<div class="plan reveal">
|
||
<h3 data-i18n="plan.sov.n"></h3>
|
||
<div class="price" data-m="879" data-y="747">$879<small>/mo</small></div>
|
||
<div class="setup"><span data-i18n="plan.setup"></span> $13,500+</div>
|
||
<span class="gmv">GMV 1% · min $0.02</span>
|
||
<div class="plan-inherit" data-i18n="plan.sov.0"></div>
|
||
<ul>
|
||
<li><span class="ck">✓</span><span data-i18n="plan.sov.1"></span></li>
|
||
<li><span class="ck">✓</span><span data-i18n="plan.sov.2"></span></li>
|
||
<li><span class="ck">✓</span><span data-i18n="plan.sov.3"></span></li>
|
||
<li><span class="ck">✓</span><span class="plan-incl" data-i18n="plan.sov.4"></span></li>
|
||
</ul>
|
||
<a href="https://calendly.com/sefertraveling/30min" target="_blank" rel="noopener" class="btn btn-ghost" data-i18n="plan.sov.cta"></a>
|
||
</div>
|
||
</div>
|
||
<p class="gmv-note" data-i18n="price.gmvnote"></p>
|
||
|
||
<div class="contract-box reveal">
|
||
<div class="ci"><h4>① <span data-i18n="price.c1.t"></span></h4><p data-i18n="price.c1.d"></p></div>
|
||
<div class="ci"><h4>② <span data-i18n="price.c2.t"></span></h4><p data-i18n="price.c2.d"></p></div>
|
||
<div class="ci"><h4>③ <span data-i18n="price.c3.t"></span></h4><p data-i18n="price.c3.d"></p></div>
|
||
</div>
|
||
<div class="founder reveal">
|
||
<div><strong style="font-size:18px;color:#fff" data-i18n="price.founder.t"></strong><div style="font-size:14px;opacity:.9;margin-top:4px" data-i18n="price.founder.d"></div></div>
|
||
<span class="seats"><span data-i18n="price.founder.seats"></span> 3 / 3</span>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ================= ADD-ONS / MODULES ================= -->
|
||
<section id="addons" class="ambient" style="background:var(--bg)">
|
||
<div class="wrap">
|
||
<div class="center reveal">
|
||
<div class="eyebrow" data-i18n="addons.eyebrow"></div>
|
||
<h2 class="sec" data-i18n="addons.title"></h2>
|
||
<p class="sec-lead" data-i18n="addons.lead"></p>
|
||
</div>
|
||
|
||
<!-- ملحق بالنواة: لا يُباع -->
|
||
<div class="core-band reveal">
|
||
<div class="core-band-head">
|
||
<span class="core-lock">
|
||
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="11" width="18" height="11" rx="2"/><path d="M7 11V7a5 5 0 0110 0v4"/></svg>
|
||
</span>
|
||
<div>
|
||
<h3 data-i18n="core.title"></h3>
|
||
<p data-i18n="core.lead"></p>
|
||
</div>
|
||
</div>
|
||
<div class="core-items">
|
||
<div class="core-item"><b data-i18n="core.i1.t"></b><span data-i18n="core.i1.d"></span></div>
|
||
<div class="core-item"><b data-i18n="core.i2.t"></b><span data-i18n="core.i2.d"></span></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="addons-grid three reveal">
|
||
<!-- 1. AI Suite -->
|
||
<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/Prompt_Fleet_Dispatch_Co.mp4" type="video/mp4">
|
||
</video>
|
||
<h3 data-i18n="addons.m1.name"></h3>
|
||
<p data-i18n="addons.m1.desc"></p>
|
||
<div class="addon-price"><span class="num">$149</span><span data-i18n="addons.m1.period"></span></div>
|
||
</div>
|
||
|
||
<!-- 2. Pricing Intelligence -->
|
||
<div class="addon-card featured">
|
||
<div class="addon-badge available" data-i18n="addon.badge.now"></div>
|
||
<div class="addon-ico" style="background:rgba(214,219,238,.15);color:#D6DBEE">
|
||
<svg width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 3h18v18H3z" stroke-width="1.5"/><path d="M6 15l4-6 4 3 5-8"/><circle cx="6" cy="16" r="1"/></svg>
|
||
</div>
|
||
<h3 data-i18n="addons.m2.name"></h3>
|
||
<p data-i18n="addons.m2.desc"></p>
|
||
<div class="addon-price"><span class="num">$249</span><span data-i18n="addons.m2.period"></span><div class="addon-setup" data-i18n="addons.m2.setup"></div></div>
|
||
</div>
|
||
|
||
<!-- 3. Growth Suite -->
|
||
<div class="addon-card">
|
||
<div class="addon-badge available" data-i18n="addon.badge.now"></div>
|
||
<div class="addon-ico" style="background:rgba(18,183,106,.15);color:#12B76A">
|
||
<svg width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="23 6 13.5 15.5 8.5 10.5 1 17"/><polyline points="17 6 23 6 23 12"/></svg>
|
||
</div>
|
||
<h3 data-i18n="addons.m3.name"></h3>
|
||
<p data-i18n="addons.m3.desc"></p>
|
||
<div class="addon-price"><span class="num">$129</span><span data-i18n="addons.m3.period"></span></div>
|
||
</div>
|
||
</div>
|
||
|
||
<p class="addons-note reveal" data-i18n="addons.note"></p>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ================= TRANSIT (منتج مستقل) ================= -->
|
||
<section id="transit" class="transit-sec grain">
|
||
<div class="wrap">
|
||
<div class="transit-grid reveal">
|
||
<div class="transit-text">
|
||
<div class="eyebrow" style="color:#8AA0FF" data-i18n="transit.eyebrow"></div>
|
||
<h2 class="sec" style="color:#fff" data-i18n="transit.title"></h2>
|
||
<p class="sec-lead" style="color:#B7C4E6" data-i18n="transit.lead"></p>
|
||
<div class="transit-for">
|
||
<span data-i18n="transit.for1"></span>
|
||
<span data-i18n="transit.for2"></span>
|
||
<span data-i18n="transit.for3"></span>
|
||
<span data-i18n="transit.for4"></span>
|
||
</div>
|
||
<ul class="feat-list" style="margin-bottom:26px">
|
||
<li><span class="ck">✓</span><span data-i18n="transit.f1"></span></li>
|
||
<li><span class="ck">✓</span><span data-i18n="transit.f2"></span></li>
|
||
<li><span class="ck">✓</span><span data-i18n="transit.f3"></span></li>
|
||
<li><span class="ck">✓</span><span data-i18n="transit.f4"></span></li>
|
||
</ul>
|
||
</div>
|
||
<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/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>
|
||
<div class="transit-sep"></div>
|
||
<p class="transit-note" data-i18n="transit.note"></p>
|
||
<a href="https://wa.me/201023248456?text=Transit" target="_blank" rel="noopener" class="btn btn-primary" style="width:100%;justify-content:center" data-i18n="transit.cta"></a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ================= COMPARISON ================= -->
|
||
<section id="compare" class="ambient">
|
||
<div class="wrap">
|
||
<div class="center reveal">
|
||
<div class="eyebrow" data-i18n="cmp.eyebrow"></div>
|
||
<h2 class="sec" data-i18n="cmp.title"></h2>
|
||
</div>
|
||
<div class="cmp-scroll reveal">
|
||
<table class="cmp-table">
|
||
<thead><tr>
|
||
<th data-i18n="cmp.col.feature"></th>
|
||
<th class="us">Tripz<span class="us-badge" data-i18n="cmp.badge"></span></th><th data-i18n="cmp.col.other"></th><th data-i18n="cmp.col.custom"></th>
|
||
</tr></thead>
|
||
<tbody>
|
||
<tr><td data-i18n="cmp.r1"></td><td class="us">$4,900–13,500</td><td>$4,500–23,000</td><td>$150k–500k</td></tr>
|
||
<tr><td data-i18n="cmp.r2"></td><td class="us" data-i18n="cmp.r2.us"></td><td data-i18n="cmp.r2.on"></td><td data-i18n="cmp.r2.cu"></td></tr>
|
||
<tr><td data-i18n="cmp.r3"></td><td class="us">$0.02–0.05</td><td>$0.10</td><td>—</td></tr>
|
||
<tr><td data-i18n="cmp.r4"></td><td class="us yes">✓</td><td class="no">✕</td><td>—</td></tr>
|
||
<tr><td data-i18n="cmp.r5"></td><td class="us yes">✓</td><td class="no">✕</td><td class="yes">✓</td></tr>
|
||
<tr><td data-i18n="cmp.r6"></td><td class="us yes" data-i18n="cmp.r6.us"></td><td class="no">✕</td><td class="yes">✓</td></tr>
|
||
<tr><td data-i18n="cmp.r7"></td><td class="us yes">✓ RTL</td><td data-i18n="cmp.r7.on"></td><td data-i18n="cmp.r7.cu"></td></tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ================= MARKET LANDSCAPE ================= -->
|
||
<section id="landscape" class="ambient" style="background:var(--bg-alt)">
|
||
<div class="wrap">
|
||
<div class="center reveal">
|
||
<div class="eyebrow" data-i18n="land.eyebrow"></div>
|
||
<h2 class="sec" data-i18n="land.title"></h2>
|
||
<p class="sec-lead" data-i18n="land.lead"></p>
|
||
</div>
|
||
<div class="cmp-scroll reveal">
|
||
<table class="cmp-table">
|
||
<thead><tr>
|
||
<th data-i18n="land.col.platform"></th>
|
||
<th data-i18n="land.col.model"></th>
|
||
<th data-i18n="land.col.setup"></th>
|
||
<th data-i18n="land.col.monthly"></th>
|
||
<th data-i18n="land.col.pertrip"></th>
|
||
</tr></thead>
|
||
<tbody>
|
||
<tr>
|
||
<td class="us">Tripz<span class="us-badge" data-i18n="cmp.badge"></span></td>
|
||
<td class="us" data-i18n="land.m.tripz"></td>
|
||
<td class="us">$4,900–13,500</td><td class="us">$349–879</td><td class="us" data-i18n="land.p.tripz"></td>
|
||
</tr>
|
||
<tr>
|
||
<td data-i18n="land.c1">المنصات الأجنبية المنافسة</td>
|
||
<td data-i18n="land.m.onde"></td>
|
||
<td>$4,500–23,000</td>
|
||
<td>$299–1,500</td>
|
||
<td data-i18n="land.p.onde"></td>
|
||
</tr>
|
||
<tr>
|
||
<td data-i18n="land.c2">التطوير المخصص من الصفر</td>
|
||
<td data-i18n="land.c2.m">كود مخصص مستقل</td>
|
||
<td>$150,000–500,000</td>
|
||
<td data-i18n="land.c2.mo">صيانة وسيرفرات مستقلة</td>
|
||
<td data-i18n="land.c2.pt">— (تكلفة رأس مال ضخمة)</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
<p class="brands-note" data-i18n="land.note"></p>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ================= CASE STUDY ================= -->
|
||
<section class="case ambient" id="case">
|
||
<div class="wrap case-grid">
|
||
<div class="reveal">
|
||
<div class="eyebrow" data-i18n="case.eyebrow"></div>
|
||
<h2 class="sec" data-i18n="case.title"></h2>
|
||
<p data-i18n="case.p1"></p>
|
||
<p data-i18n="case.p2"></p>
|
||
<div class="case-stats">
|
||
<div class="cs"><div class="n num">2,500</div><div class="l" data-i18n="case.s1"></div></div>
|
||
<div class="cs"><div class="n num">6,000</div><div class="l" data-i18n="case.s2"></div></div>
|
||
<div class="cs"><div class="n num">3</div><div class="l" data-i18n="case.s3"></div></div>
|
||
</div>
|
||
<div class="quote"><span data-i18n="case.quote"></span><span class="who" data-i18n="case.who"></span></div>
|
||
</div>
|
||
<div class="case-visual reveal">
|
||
<div class="dash-row"><span data-i18n="case.s1"></span><b class="num">2,500</b></div>
|
||
<div class="dash-row"><span data-i18n="case.s2"></span><b class="num">6,000</b></div>
|
||
<div class="dash-row"><span data-i18n="case.d4"></span><b>Cairo · Alexandria · Damascus</b></div>
|
||
<div class="dash-bars"><span style="height:45%"></span><span style="height:60%"></span><span style="height:52%"></span><span style="height:78%"></span><span style="height:66%"></span><span style="height:90%"></span><span style="height:82%"></span><span style="height:97%"></span></div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ================= SECURITY ================= -->
|
||
<section class="sec-strip grain" style="padding:56px 0">
|
||
<div class="wrap">
|
||
<h3 style="color:#fff;font-size:22px" data-i18n="sec.title"></h3>
|
||
<div class="badges">
|
||
<div class="sbadge"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><path d="M20 6L9 17l-5-5"/></svg><span data-i18n="sec.b1"></span></div>
|
||
<div class="sbadge"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><path d="M20 6L9 17l-5-5"/></svg>3-D Secure</div>
|
||
<div class="sbadge"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><path d="M20 6L9 17l-5-5"/></svg><span data-i18n="sec.b2"></span></div>
|
||
<div class="sbadge"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><path d="M20 6L9 17l-5-5"/></svg><span data-i18n="sec.b3"></span></div>
|
||
<div class="sbadge"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><path d="M20 6L9 17l-5-5"/></svg><span data-i18n="sec.b4"></span></div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ================= FAQ ================= -->
|
||
<section id="faq" class="ambient">
|
||
<div class="wrap">
|
||
<div class="center reveal">
|
||
<div class="eyebrow" data-i18n="faq.eyebrow"></div>
|
||
<h2 class="sec" data-i18n="faq.title"></h2>
|
||
</div>
|
||
<div class="faq-list" id="faqList"></div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ================= FINAL CTA / REAL APPS ================= -->
|
||
<section class="final grain" id="demo">
|
||
<div class="wrap">
|
||
<h2 data-i18n="final.title"></h2>
|
||
<p class="demo-lead" data-i18n="demo.lead"></p>
|
||
<div class="store-groups">
|
||
<div class="store-group">
|
||
<div class="store-group-label" data-i18n="demo.rider"></div>
|
||
<div class="store-badges">
|
||
<a href="https://apps.apple.com/eg/app/tripz-rider/id6458734951" target="_blank" rel="noopener" class="store-badge">
|
||
<svg width="22" height="22" viewBox="0 0 24 24" fill="currentColor"><path d="M16.7 1.3c0 1.1-.4 2-1.2 2.9-.9 1-2 1.6-3.1 1.5-.1-1.1.4-2.2 1.2-3 .8-.9 2.1-1.5 3.1-1.4zM20.9 17c-.5 1.1-.7 1.6-1.4 2.6-.9 1.4-2.2 3.1-3.8 3.1-1.4 0-1.8-.9-3.7-.9s-2.4.9-3.7.9c-1.6 0-2.8-1.6-3.7-3-2.5-3.9-2.8-8.5-1.2-10.9 1.1-1.7 2.9-2.7 4.6-2.7 1.7 0 2.8 1 4.2 1s2.2-1 4.2-1c1.5 0 3.1.8 4.2 2.2-3.7 2-3.1 7.2.3 8.7z"/></svg>
|
||
<span><small data-i18n="demo.appstore"></small><b>Tripz Rider</b></span>
|
||
</a>
|
||
<a href="https://play.google.com/store/apps/details?id=com.mobileapp.store.ride" target="_blank" rel="noopener" class="store-badge">
|
||
<svg width="22" height="22" viewBox="0 0 24 24" fill="currentColor"><path d="M3.6 2.6c-.4.3-.6.8-.6 1.4v16c0 .6.2 1.1.6 1.4l9-9.4-9-9.4zm10.2 9.9l2.4-2.5 3.9 2.2c.7.4.7 1.4 0 1.8l-3.9 2.2-2.4-2.5-.7.7 2.7 2.9 4.9-2.8c1.4-.8 1.4-2.9 0-3.7l-4.9-2.8-2.7 2.9.7.7zM4.6 3l8.7 8.9-8.7 8.9c-.1-.2-.1-.4-.1-.6V3.6c0-.2 0-.4.1-.6z"/></svg>
|
||
<span><small data-i18n="demo.googleplay"></small><b>Tripz Rider</b></span>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
<div class="store-group">
|
||
<div class="store-group-label" data-i18n="demo.driver"></div>
|
||
<div class="store-badges">
|
||
<a href="https://apps.apple.com/eg/app/tripz-driver/id6502189302" target="_blank" rel="noopener" class="store-badge">
|
||
<svg width="22" height="22" viewBox="0 0 24 24" fill="currentColor"><path d="M16.7 1.3c0 1.1-.4 2-1.2 2.9-.9 1-2 1.6-3.1 1.5-.1-1.1.4-2.2 1.2-3 .8-.9 2.1-1.5 3.1-1.4zM20.9 17c-.5 1.1-.7 1.6-1.4 2.6-.9 1.4-2.2 3.1-3.8 3.1-1.4 0-1.8-.9-3.7-.9s-2.4.9-3.7.9c-1.6 0-2.8-1.6-3.7-3-2.5-3.9-2.8-8.5-1.2-10.9 1.1-1.7 2.9-2.7 4.6-2.7 1.7 0 2.8 1 4.2 1s2.2-1 4.2-1c1.5 0 3.1.8 4.2 2.2-3.7 2-3.1 7.2.3 8.7z"/></svg>
|
||
<span><small data-i18n="demo.appstore"></small><b>Tripz Driver</b></span>
|
||
</a>
|
||
<a href="https://play.google.com/store/apps/details?id=com.sefer_driver" target="_blank" rel="noopener" class="store-badge">
|
||
<svg width="22" height="22" viewBox="0 0 24 24" fill="currentColor"><path d="M3.6 2.6c-.4.3-.6.8-.6 1.4v16c0 .6.2 1.1.6 1.4l9-9.4-9-9.4zm10.2 9.9l2.4-2.5 3.9 2.2c.7.4.7 1.4 0 1.8l-3.9 2.2-2.4-2.5-.7.7 2.7 2.9 4.9-2.8c1.4-.8 1.4-2.9 0-3.7l-4.9-2.8-2.7 2.9.7.7zM4.6 3l8.7 8.9-8.7 8.9c-.1-.2-.1-.4-.1-.6V3.6c0-.2 0-.4.1-.6z"/></svg>
|
||
<span><small data-i18n="demo.googleplay"></small><b>Tripz Driver</b></span>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="btn-group" style="margin-top:32px">
|
||
<a href="https://wa.me/201023248456" target="_blank" rel="noopener" class="btn btn-wa btn-lg" data-i18n="hero.cta2"></a>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ================= FOOTER ================= -->
|
||
<footer class="grain">
|
||
<div class="wrap">
|
||
<div class="foot-grid">
|
||
<div class="foot-brand">
|
||
<div class="brand"><span class="brand-badge"><img src="assets/logotripz.png" alt="Tripz"></span></div>
|
||
<p data-i18n="foot.tag"></p>
|
||
</div>
|
||
<div class="foot-col"><h5 data-i18n="foot.product"></h5><a href="#product" data-i18n="prod.tab.rider"></a><a href="#product" data-i18n="prod.tab.driver"></a><a href="#product" data-i18n="prod.tab.dispatch"></a><a href="#product" data-i18n="prod.tab.hub"></a></div>
|
||
<div class="foot-col"><h5 data-i18n="foot.solutions"></h5><a href="#" data-i18n="foot.fleets"></a><a href="#" data-i18n="foot.startups"></a><a href="#" data-i18n="plan.sov.n"></a></div>
|
||
<div class="foot-col"><h5 data-i18n="foot.resources"></h5><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="#case" data-i18n="foot.case"></a></div>
|
||
<div class="foot-col"><h5 data-i18n="foot.legal"></h5><a href="#" data-i18n="foot.privacy"></a><a href="#" data-i18n="foot.terms"></a><a href="#" data-i18n="foot.dpa"></a></div>
|
||
</div>
|
||
<div class="foot-bottom">
|
||
<span>© 2026 Tripz. <span data-i18n="foot.rights"></span></span>
|
||
<span data-i18n="foot.built"></span>
|
||
</div>
|
||
</div>
|
||
</footer>
|
||
|
||
<a href="https://wa.me/201023248456" target="_blank" rel="noopener" class="wa-float" aria-label="WhatsApp">
|
||
<svg width="28" height="28" viewBox="0 0 24 24" fill="#fff"><path d="M12 2a10 10 0 00-8.6 15l-1.3 4.7 4.8-1.3A10 10 0 1012 2zm0 18a8 8 0 01-4-1.1l-.3-.2-2.9.8.8-2.8-.2-.3A8 8 0 1112 20zm4.4-6c-.2-.1-1.4-.7-1.6-.8s-.4-.1-.6.1-.6.8-.8.9-.3.2-.6 0a6.5 6.5 0 01-1.9-1.2 7.3 7.3 0 01-1.4-1.7c-.1-.3 0-.4.1-.5l.4-.5.3-.5v-.4l-.8-1.9c-.2-.5-.4-.4-.6-.4h-.5a1 1 0 00-.7.3 3 3 0 00-.9 2.2 5.2 5.2 0 001.1 2.7 11.8 11.8 0 004.5 4c.6.2 1.1.4 1.5.5.6.2 1.2.2 1.6.1.5-.1 1.4-.6 1.6-1.1s.2-1 .1-1.1z"/></svg>
|
||
</a>
|
||
|
||
<!-- ================= CONSENT ================= -->
|
||
<div class="consent" id="consent" role="dialog" aria-live="polite">
|
||
<h4 data-i18n="consent.t"></h4>
|
||
<p data-i18n="consent.d"></p>
|
||
<div class="consent-btns">
|
||
<button class="btn btn-primary" id="consentYes" data-i18n="consent.yes"></button>
|
||
<button class="btn btn-ghost" id="consentNo" data-i18n="consent.no"></button>
|
||
</div>
|
||
</div>
|
||
|
||
<script src="js/i18n.js"></script>
|
||
<script src="js/calculator.js"></script>
|
||
<script src="js/app.js"></script>
|
||
<script src="js/analytics.js"></script>
|
||
|
||
</body>
|
||
</html>
|