HEX

File: /home/pymuuvxdio/npms.novlla.com/ar.html
<!DOCTYPE html>
<html lang="ar" dir="rtl">
<head>
<meta charset="UTF-8">
<title>Novlla Parking v1.0.1 | نظام إدارة الجراجات الذكي</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">

<style>
:root {
  --primary:#0f2a44;
  --secondary:#1abc9c;
  --dark:#0b1c2d;
  --light:#f4f7fb;
}

* {
  margin:0;
  padding:0;
  box-sizing:border-box;
  font-family: "Segoe UI", Tahoma, sans-serif;
}

body {
  background:var(--light);
  color:#333;
  line-height:1.7;
}

/* Header */
header {
  background:linear-gradient(135deg, var(--primary), var(--dark));
  color:#fff;
  padding:80px 20px;
}

.container {
  max-width:1200px;
  margin:auto;
}

header .logo {
  display:flex;
  align-items:center;
  gap:15px;
  margin-bottom:30px;
}

header .logo img {
  width:100px;
  border-radius:50%;
}

header h1 {
  font-size:42px;
  margin-bottom:15px;
}

header p {
  max-width:700px;
  font-size:18px;
  opacity:.9;
}

.btn {
  display:inline-block;
  margin-top:30px;
  padding:14px 30px;
  background:var(--secondary);
  color:#fff;
  text-decoration:none;
  border-radius:6px;
  font-weight:600;
  transition:.3s;
}

.btn:hover {
  background:#17a589;
}

/* Sections */
section {
  padding:70px 20px;
}

.section-title {
  text-align:center;
  margin-bottom:50px;
}

.section-title h2 {
  font-size:34px;
  color:var(--primary);
}

.section-title p {
  max-width:700px;
  margin:10px auto 0;
  color:#666;
}

/* Grid */
.grid {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:30px;
}

.card {
  background:#fff;
  padding:30px;
  border-radius:12px;
  box-shadow:0 10px 30px rgba(0,0,0,.05);
}

.card h3 {
  margin-bottom:15px;
  color:var(--primary);
}

/* Images */
.image-section {
  background:#fff;
}

.image-grid img {
  width:100%;
  border-radius:12px;
  height:240px;
  object-fit:cover;
}

/* Problems */
.problems {
  background:#0f2a44;
  color:#fff;
}

.problems h2 {
  color:#fff;
}

.problems ul {
  max-width:900px;
  margin:auto;
  list-style:none;
}

.problems li {
  padding:12px 0;
  border-bottom:1px solid rgba(255,255,255,.15);
}

/* Footer */
footer {
  background:#0b1c2d;
  color:#ccc;
  padding:40px 20px;
  text-align:center;
}

footer strong {
  color:#fff;
}

@media(max-width:768px){
  header h1 {
    font-size:32px;
  }
}
</style>
</head>

<body>

<!-- HERO -->
<header>
  <div class="container">

    <!-- Language Switch -->
    <div style="text-align:left; margin-bottom:10px;">
      <a href="index.html"><img src="assets/images/flag-en.png" width="28"></a>
      <a href="ar.html"><img src="assets/images/flag-ar.png" width="28"></a>
    </div>

    <div class="logo">
      <img src="assets/images/logo.png" alt="Novlla Logo">
      <div>
        <strong>Novlla Parking</strong><br>
        <small>v1.0.1</small>
      </div>
    </div>

    <h1>نظام ذكي لإدارة الجراجات وساحات انتظار السيارات</h1>
    <p>
      نظام قوي ومرن وسهل الاستخدام لإدارة ساحات الانتظار والجراجات بكفاءة عالية
      دون تعقيد أو تكاليف مرتفعة أو قيود على المعدات.
    </p>

    <a href="https://demo.novlla.com/ar" class="btn">جرّب النظام الآن</a>
  </div>
</header>

<!-- FEATURES -->
<section>
  <div class="container">
    <div class="section-title">
      <h2>لماذا Novlla Parking؟</h2>
      <p>تم تطويره بناءً على مشاكل تشغيل حقيقية.</p>
    </div>

    <div class="grid">
      <div class="card">
        <h3>سهل وعملي</h3>
        <p>مصمم لموظفين بدون خلفية تقنية.</p>
      </div>

      <div class="card">
        <h3>عدد غير محدود من البوابات</h3>
        <p>دعم كامل لبوابات الدخول والخروج.</p>
      </div>

      <div class="card">
        <h3>غير مرتبط بمعدات محددة</h3>
        <p>يعمل مع مختلف الشركات وأنواع الاتصال.</p>
      </div>

      <div class="card">
        <h3>نظام اشتراكات ذكي</h3>
        <p>أسبوعي، شهري، نصف سنوي، وسنوي مع طباعة فورية.</p>
      </div>

      <div class="card">
        <h3>بدون حساسات</h3>
        <p>معرفة عدد السيارات بدون أجهزة إضافية.</p>
      </div>

      <div class="card">
        <h3>يعمل أونلاين وأوفلاين</h3>
        <p>تشغيل محلي أو عبر الإنترنت دون انقطاع.</p>
      </div>
    </div>
  </div>
</section>

<!-- IMAGES -->
<section class="image-section">
  <div class="container">
    <div class="section-title">
      <h2>مصمم لبيئات الجراجات الحقيقية</h2>
      <p>جراجات، بوابات، معدات تشغيل.</p>
    </div>

    <div class="grid image-grid">
      <img src="assets/images/parking-1.jpg">
      <img src="assets/images/parking-2.jpg">
      <img src="assets/images/parking-3.jpg">
    </div>
  </div>
</section>

<!-- PROBLEMS -->
<section class="problems">
  <div class="container">
    <div class="section-title">
      <h2>المشاكل التي تم حلها</h2>
    </div>

    <ul>
      <li>❌ أنظمة معقدة لا تناسب الجراجات الصغيرة والمتوسطة</li>
      <li>❌ تكاليف مرتفعة لأي تعديل بسيط</li>
      <li>❌ الاعتماد على شركات معدات محددة</li>
      <li>❌ ضعف أو توقف الدعم الفني</li>
      <li>❌ أنظمة لا تعكس واقع التشغيل</li>
    </ul>
  </div>
</section>

<!-- CTA -->
<section>
  <div class="container" style="text-align:center;">
    <h2 style="color:var(--primary);">هل أنت مستعد لتجربة نظام أفضل؟</h2>
    <p>جرّب Novlla Parking وشاهد الفرق بنفسك.</p>
    <a href="https://demo.novlla.com/ar" class="btn">طلب تجربة</a>
  </div>
</section>

<footer>
  <p>
    © 2026 <strong>شركة نوفلا للحلول الرقمية</strong><br>
    Smart Systems • Real Solutions<br>
    📧 sales@novlla.com
  </p>
</footer>

</body>
</html>