| <!DOCTYPE html> |
| <html lang="ar" dir="rtl"> |
| <head> |
| <meta charset="UTF-8"> |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| <title>دار كاسا - موقع عقاري</title> |
| <script src="https://cdn.tailwindcss.com"></script> |
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> |
| <style> |
| @import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@300;400;500;700&display=swap'); |
| |
| body { |
| font-family: 'Tajawal', sans-serif; |
| } |
| |
| .hero-section { |
| background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('https://images.unsplash.com/photo-1560518883-ce09059eeffa?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1473&q=80'); |
| background-size: cover; |
| background-position: center; |
| } |
| |
| .property-card:hover { |
| transform: translateY(-5px); |
| box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1); |
| } |
| |
| .testimonial-card:hover { |
| transform: translateY(-5px); |
| box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1); |
| } |
| |
| .stat-item:hover .stat-number { |
| transform: scale(1.1); |
| } |
| |
| .search-box { |
| box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1); |
| } |
| </style> |
| </head> |
| <body class="bg-gray-50"> |
| |
| <header class="bg-white shadow-md"> |
| <div class="container mx-auto px-4 py-4 flex justify-between items-center"> |
| <div class="flex items-center"> |
| <img src="https://dar-casa.web.app/site-top-logo.png" alt="DAR.CASA" class="h-12"> |
| </div> |
| <nav class="hidden md:flex space-x-8 space-x-reverse"> |
| <a href="#" class="text-gray-700 hover:text-blue-600 font-medium">الرئيسية</a> |
| <a href="#" class="text-gray-700 hover:text-blue-600 font-medium">العقارات</a> |
| <a href="#" class="text-gray-700 hover:text-blue-600 font-medium">عن دار كاسا</a> |
| <a href="#" class="text-gray-700 hover:text-blue-600 font-medium">اتصل بنا</a> |
| </nav> |
| <div class="flex items-center space-x-4 space-x-reverse"> |
| <button class="bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-lg font-medium transition duration-300"> |
| تسجيل الدخول |
| </button> |
| <button class="md:hidden text-gray-700"> |
| <i class="fas fa-bars text-xl"></i> |
| </button> |
| </div> |
| </div> |
| </header> |
|
|
| |
| <section class="hero-section text-white py-20"> |
| <div class="container mx-auto px-4 text-center"> |
| <h1 class="text-4xl md:text-5xl font-bold mb-6">أفضل طريقة للبحث عن المنازل</h1> |
| <p class="text-xl md:text-2xl mb-8">ابحث عن عقارك المثالي</p> |
| <p class="text-lg mb-12">اكتشف أفضل العقارات في إيطاليا</p> |
| |
| |
| <div class="search-box bg-white rounded-xl p-6 max-w-4xl mx-auto"> |
| <div class="grid grid-cols-1 md:grid-cols-3 gap-4"> |
| <div> |
| <label class="block text-gray-700 text-right mb-2">نوع البحث</label> |
| <select class="w-full p-3 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500"> |
| <option>للبيع</option> |
| <option>للإيجار</option> |
| </select> |
| </div> |
| <div> |
| <label class="block text-gray-700 text-right mb-2">المدينة</label> |
| <select class="w-full p-3 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500"> |
| <option>الرياض</option> |
| <option>جدة</option> |
| <option>مكة</option> |
| <option>المدينة</option> |
| </select> |
| </div> |
| <div> |
| <label class="block text-gray-700 text-right mb-2">نوع العقار</label> |
| <select class="w-full p-3 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500"> |
| <option>شقة</option> |
| <option>فيلا</option> |
| <option>أرض</option> |
| <option>مكتب</option> |
| </select> |
| </div> |
| <div> |
| <label class="block text-gray-700 text-right mb-2">المساحة (م²)</label> |
| <input type="text" class="w-full p-3 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500" placeholder="أدخل المساحة"> |
| </div> |
| <div> |
| <label class="block text-gray-700 text-right mb-2">السعر (€)</label> |
| <input type="text" class="w-full p-3 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500" placeholder="أدخل السعر"> |
| </div> |
| <div class="flex items-end"> |
| <button class="w-full bg-blue-600 hover:bg-blue-700 text-white py-3 px-6 rounded-lg font-medium transition duration-300"> |
| بحث <i class="fas fa-search mr-2"></i> |
| </button> |
| </div> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section class="py-16 bg-white"> |
| <div class="container mx-auto px-4"> |
| <div class="text-center mb-12"> |
| <h2 class="text-3xl font-bold text-gray-800 mb-4">أحدث العقارات المضافة</h2> |
| <p class="text-gray-600 max-w-2xl mx-auto">تعرف على أحدث العقارات التي تم إضافتها مؤخرًا إلى منصتنا</p> |
| </div> |
| |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8"> |
| |
| <div class="property-card bg-white rounded-xl overflow-hidden shadow-md transition duration-300"> |
| <div class="relative"> |
| <img src="https://images.unsplash.com/photo-1580587771525-78b9dba3b914?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" alt="Property" class="w-full h-64 object-cover"> |
| <div class="absolute top-4 left-4 bg-blue-600 text-white px-3 py-1 rounded-lg text-sm font-medium">جديد</div> |
| <div class="absolute top-4 right-4 bg-white text-blue-600 p-2 rounded-full"> |
| <i class="far fa-heart"></i> |
| </div> |
| </div> |
| <div class="p-6"> |
| <div class="flex justify-between items-start mb-2"> |
| <h3 class="text-xl font-bold text-gray-800">فيلا فاخرة في الرياض</h3> |
| <span class="text-blue-600 font-bold">€250,000</span> |
| </div> |
| <p class="text-gray-600 mb-4">مساحة: 320 م² | غرف: 5 | حمامات: 3</p> |
| <div class="flex items-center text-gray-500"> |
| <i class="fas fa-map-marker-alt ml-1"></i> |
| <span>حي النخيل، الرياض</span> |
| </div> |
| <div class="mt-6 pt-4 border-t border-gray-100 flex justify-between"> |
| <span class="flex items-center text-gray-500"> |
| <i class="far fa-calendar-alt ml-1"></i> |
| 2 يوم مضت |
| </span> |
| <button class="text-blue-600 hover:text-blue-800 font-medium"> |
| عرض التفاصيل <i class="fas fa-arrow-left ml-1"></i> |
| </button> |
| </div> |
| </div> |
| </div> |
| |
| |
| <div class="property-card bg-white rounded-xl overflow-hidden shadow-md transition duration-300"> |
| <div class="relative"> |
| <img src="https://images.unsplash.com/photo-1512917774080-9991f1c4c750?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" alt="Property" class="w-full h-64 object-cover"> |
| <div class="absolute top-4 right-4 bg-white text-blue-600 p-2 rounded-full"> |
| <i class="far fa-heart"></i> |
| </div> |
| </div> |
| <div class="p-6"> |
| <div class="flex justify-between items-start mb-2"> |
| <h3 class="text-xl font-bold text-gray-800">شقة أنيقة في جدة</h3> |
| <span class="text-blue-600 font-bold">€180,000</span> |
| </div> |
| <p class="text-gray-600 mb-4">مساحة: 150 م² | غرف: 3 | حمامات: 2</p> |
| <div class="flex items-center text-gray-500"> |
| <i class="fas fa-map-marker-alt ml-1"></i> |
| <span>حي الصفا، جدة</span> |
| </div> |
| <div class="mt-6 pt-4 border-t border-gray-100 flex justify-between"> |
| <span class="flex items-center text-gray-500"> |
| <i class="far fa-calendar-alt ml-1"></i> |
| 5 يوم مضت |
| </span> |
| <button class="text-blue-600 hover:text-blue-800 font-medium"> |
| عرض التفاصيل <i class="fas fa-arrow-left ml-1"></i> |
| </button> |
| </div> |
| </div> |
| </div> |
| |
| |
| <div class="property-card bg-white rounded-xl overflow-hidden shadow-md transition duration-300"> |
| <div class="relative"> |
| <img src="https://images.unsplash.com/photo-1564013799919-ab600027ffc6?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" alt="Property" class="w-full h-64 object-cover"> |
| <div class="absolute top-4 right-4 bg-white text-blue-600 p-2 rounded-full"> |
| <i class="far fa-heart"></i> |
| </div> |
| </div> |
| <div class="p-6"> |
| <div class="flex justify-between items-start mb-2"> |
| <h3 class="text-xl font-bold text-gray-800">منزل عائلي في مكة</h3> |
| <span class="text-blue-600 font-bold">€320,000</span> |
| </div> |
| <p class="text-gray-600 mb-4">مساحة: 400 م² | غرف: 6 | حمامات: 4</p> |
| <div class="flex items-center text-gray-500"> |
| <i class="fas fa-map-marker-alt ml-1"></i> |
| <span>حي العزيزية، مكة</span> |
| </div> |
| <div class="mt-6 pt-4 border-t border-gray-100 flex justify-between"> |
| <span class="flex items-center text-gray-500"> |
| <i class="far fa-calendar-alt ml-1"></i> |
| 1 أسبوع مضى |
| </span> |
| <button class="text-blue-600 hover:text-blue-800 font-medium"> |
| عرض التفاصيل <i class="fas fa-arrow-left ml-1"></i> |
| </button> |
| </div> |
| </div> |
| </div> |
| </div> |
| |
| <div class="text-center mt-12"> |
| <button class="bg-blue-600 hover:bg-blue-700 text-white px-6 py-3 rounded-lg font-medium transition duration-300"> |
| عرض جميع العقارات <i class="fas fa-arrow-left ml-2"></i> |
| </button> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section class="py-16 bg-gray-50"> |
| <div class="container mx-auto px-4"> |
| <div class="text-center mb-12"> |
| <h2 class="text-3xl font-bold text-gray-800 mb-4">لماذا تختار دار كاسا؟</h2> |
| <p class="text-gray-600 max-w-2xl mx-auto">نقدم لك أفضل الخدمات العقارية مع ضمان الجودة والموثوقية</p> |
| </div> |
| |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-5 gap-6"> |
| <div class="bg-white p-6 rounded-xl shadow-md text-center hover:shadow-lg transition duration-300"> |
| <div class="bg-blue-100 w-16 h-16 mx-auto rounded-full flex items-center justify-center mb-4"> |
| <i class="fas fa-search text-blue-600 text-2xl"></i> |
| </div> |
| <h3 class="text-lg font-bold text-gray-800 mb-2">بحث سريع</h3> |
| <p class="text-gray-600">ابحث عن العقارات بسهولة وسرعة باستخدام فلاتر متقدمة</p> |
| </div> |
| |
| <div class="bg-white p-6 rounded-xl shadow-md text-center hover:shadow-lg transition duration-300"> |
| <div class="bg-blue-100 w-16 h-16 mx-auto rounded-full flex items-center justify-center mb-4"> |
| <i class="fas fa-check-circle text-blue-600 text-2xl"></i> |
| </div> |
| <h3 class="text-lg font-bold text-gray-800 mb-2">عقارات موثقة</h3> |
| <p class="text-gray-600">جميع العقارات مراجعة ومؤكدة من قبل خبراء العقارات</p> |
| </div> |
| |
| <div class="bg-white p-6 rounded-xl shadow-md text-center hover:shadow-lg transition duration-300"> |
| <div class="bg-blue-100 w-16 h-16 mx-auto rounded-full flex items-center justify-center mb-4"> |
| <i class="fas fa-headset text-blue-600 text-2xl"></i> |
| </div> |
| <h3 class="text-lg font-bold text-gray-800 mb-2">دعم 24/7</h3> |
| <p class="text-gray-600">فريق دعم متاح على مدار الساعة لمساعدتك في أي وقت</p> |
| </div> |
| |
| <div class="bg-white p-6 rounded-xl shadow-md text-center hover:shadow-lg transition duration-300"> |
| <div class="bg-blue-100 w-16 h-16 mx-auto rounded-full flex items-center justify-center mb-4"> |
| <i class="fas fa-tag text-blue-600 text-2xl"></i> |
| </div> |
| <h3 class="text-lg font-bold text-gray-800 mb-2">أسعار تنافسية</h3> |
| <p class="text-gray-600">أفضل الأسعار في السوق مع خيارات تمويل مرنة</p> |
| </div> |
| |
| <div class="bg-white p-6 rounded-xl shadow-md text-center hover:shadow-lg transition duration-300"> |
| <div class="bg-blue-100 w-16 h-16 mx-auto rounded-full flex items-center justify-center mb-4"> |
| <i class="fas fa-lock text-blue-600 text-2xl"></i> |
| </div> |
| <h3 class="text-lg font-bold text-gray-800 mb-2">أمان وسرية</h3> |
| <p class="text-gray-600">بياناتك محمية بنظام أمان متكامل</p> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section class="py-16 bg-blue-600 text-white"> |
| <div class="container mx-auto px-4"> |
| <div class="text-center mb-12"> |
| <h2 class="text-3xl font-bold mb-4">إحصائيات دار كاسا</h2> |
| <p class="text-blue-100 max-w-2xl mx-auto">أرقام تتحدث عن نجاحنا</p> |
| </div> |
| |
| <div class="grid grid-cols-1 md:grid-cols-3 gap-8"> |
| <div class="stat-item text-center"> |
| <div class="text-5xl font-bold mb-2"> |
| <span class="counter" data-target="1250">0</span>+ |
| </div> |
| <p class="text-xl">عقار متاح</p> |
| </div> |
| |
| <div class="stat-item text-center"> |
| <div class="text-5xl font-bold mb-2"> |
| <span class="counter" data-target="850">0</span>+ |
| </div> |
| <p class="text-xl">عميل راضي</p> |
| </div> |
| |
| <div class="stat-item text-center"> |
| <div class="text-5xl font-bold mb-2"> |
| <span class="counter" data-target="35">0</span>+ |
| </div> |
| <p class="text-xl">مدينة</p> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section class="py-16 bg-white"> |
| <div class="container mx-auto px-4"> |
| <div class="text-center mb-12"> |
| <h2 class="text-3xl font-bold text-gray-800 mb-4">آراء العملاء</h2> |
| <p class="text-gray-600 max-w-2xl mx-auto">ماذا يقول عملاؤنا عن تجربتهم مع دار كاسا</p> |
| </div> |
| |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6"> |
| |
| <div class="testimonial-card bg-white p-6 rounded-xl shadow-md transition duration-300"> |
| <div class="flex items-center mb-4"> |
| <img src="https://randomuser.me/api/portraits/men/32.jpg" alt="أحمد العتيبي" class="w-12 h-12 rounded-full object-cover"> |
| <div class="mr-3"> |
| <h4 class="font-bold text-gray-800">أحمد العتيبي</h4> |
| <p class="text-gray-500 text-sm">نحف</p> |
| </div> |
| <div class="ml-auto text-yellow-400"> |
| <i class="fas fa-star"></i> |
| <i class="fas fa-star"></i> |
| <i class="fas fa-star"></i> |
| <i class="fas fa-star"></i> |
| <i class="fas fa-star"></i> |
| </div> |
| </div> |
| <p class="text-gray-600">"خدمة ممتازة وسرعة في التواصل. وجدت العقار المناسب لعائلتي بسهولة!"</p> |
| </div> |
| |
| |
| <div class="testimonial-card bg-white p-6 rounded-xl shadow-md transition duration-300"> |
| <div class="flex items-center mb-4"> |
| <img src="https://randomuser.me/api/portraits/women/44.jpg" alt="سارة المالكي" class="w-12 h-12 rounded-full object-cover"> |
| <div class="mr-3"> |
| <h4 class="font-bold text-gray-800">سارة المالكي</h4> |
| <p class="text-gray-500 text-sm">الناصرة</p> |
| </div> |
| <div class="ml-auto text-yellow-400"> |
| <i class="fas fa-star"></i> |
| <i class="fas fa-star"></i> |
| <i class="fas fa-star"></i> |
| <i class="fas fa-star"></i> |
| <i class="fas fa-star"></i> |
| </div> |
| </div> |
| <p class="text-gray-600">"موقع رائع وسهل الاستخدام. فريق الدعم متعاون جدًا."</p> |
| </div> |
| |
| |
| <div class="testimonial-card bg-white p-6 rounded-xl shadow-md transition duration-300"> |
| <div class="flex items-center mb-4"> |
| <img src="https://randomuser.me/api/portraits/men/65.jpg" alt="محمد الزهراني" class="w-12 h-12 rounded-full object-cover"> |
| <div class="mr-3"> |
| <h4 class="font-bold text-gray-800">محمد الزهراني</h4> |
| <p class="text-gray-500 text-sm">يافا</p> |
| </div> |
| <div class="ml-auto text-yellow-400"> |
| <i class="fas fa-star"></i> |
| <i class="fas fa-star"></i> |
| <i class="fas fa-star"></i> |
| <i class="fas fa-star"></i> |
| <i class="fas fa-star-half-alt"></i> |
| </div> |
| </div> |
| <p class="text-gray-600">"تنوع كبير في العقارات وأسعار مناسبة. أنصح الجميع باستخدام دار كاسا."</p> |
| </div> |
| |
| |
| <div class="testimonial-card bg-white p-6 rounded-xl shadow-md transition duration-300"> |
| <div class="flex items-center mb-4"> |
| <img src="https://randomuser.me/api/portraits/women/68.jpg" alt="نورة السبيعي" class="w-12 h-12 rounded-full object-cover"> |
| <div class="mr-3"> |
| <h4 class="font-bold text-gray-800">نورة السبيعي</h4> |
| <p class="text-gray-500 text-sm">الطيرة</p> |
| </div> |
| <div class="ml-auto text-yellow-400"> |
| <i class="fas fa-star"></i> |
| <i class="fas fa-star"></i> |
| <i class="fas fa-star"></i> |
| <i class="fas fa-star"></i> |
| <i class="fas fa-star"></i> |
| </div> |
| </div> |
| <p class="text-gray-600">"تجربة رائعة من البداية للنهاية. شكراً لكم!"</p> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section class="py-16 bg-gray-50"> |
| <div class="container mx-auto px-4"> |
| <div class="flex flex-col lg:flex-row items-center"> |
| <div class="lg:w-1/2 mb-10 lg:mb-0 lg:pr-10"> |
| <h2 class="text-3xl font-bold text-gray-800 mb-6">من نحن</h2> |
| <p class="text-gray-600 mb-6"> |
| دار كاسا هي منصة عقارية رائدة تهدف إلى تسهيل عملية البحث، البيع، والشراء للعقارات في جميع أنحاء المملكة. نؤمن بأن لكل شخص الحق في إيجاد المسكن المثالي أو الاستثمار العقاري المناسب بسهولة وشفافية. |
| </p> |
| |
| <div class="mb-6"> |
| <h3 class="text-xl font-bold text-gray-800 mb-2">رؤيتنا</h3> |
| <p class="text-gray-600"> |
| أن نكون الخيار الأول في المنظقة للبحث عن العقارات، من خلال تقديم تجربة رقمية متكاملة تجمع بين الحداثة والموثوقية. |
| </p> |
| </div> |
| |
| <div> |
| <h3 class="text-xl font-bold text-gray-800 mb-2">رسالتنا</h3> |
| <p class="text-gray-600"> |
| تمكين الأفراد والعائلات والمستثمرين من اتخاذ قرارات عقارية ذكية عبر توفير معلومات دقيقة، دعم متواصل، وخدمات مبتكرة. |
| </p> |
| </div> |
| </div> |
| |
| <div class="lg:w-1/2"> |
| <img src="https://dar-casa.web.app/about-illustration.svg" alt="عن دار كاسا" class="w-full rounded-lg"> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section class="py-16 bg-blue-600 text-white"> |
| <div class="container mx-auto px-4 text-center"> |
| <h2 class="text-3xl font-bold mb-4">اشترك في نشرتنا البريدية</h2> |
| <p class="text-blue-100 max-w-2xl mx-auto mb-8">احصل على آخر العروض والعقارات الجديدة مباشرة إلى بريدك الإلكتروني</p> |
| |
| <div class="max-w-md mx-auto flex"> |
| <input type="email" placeholder="أدخل بريدك الإلكتروني" class="flex-grow p-3 rounded-r-lg focus:outline-none text-gray-800"> |
| <button class="bg-blue-800 hover:bg-blue-900 px-6 py-3 rounded-l-lg font-medium transition duration-300"> |
| اشتراك <i class="fas fa-paper-plane mr-2"></i> |
| </button> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <footer class="bg-gray-900 text-white pt-16 pb-8"> |
| <div class="container mx-auto px-4"> |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8 mb-12"> |
| <div> |
| <img src="https://dar-casa.web.app/site-top-logo.png" alt="DAR.CASA" class="h-12 mb-4"> |
| <p class="text-gray-400 mb-4"> |
| منصة عقارية رائدة تهدف إلى تسهيل عملية البحث، البيع، والشراء للعقارات بسهولة وشفافية. |
| </p> |
| <div class="flex space-x-4 space-x-reverse"> |
| <a href="#" class="text-gray-400 hover:text-white"> |
| <i class="fab fa-facebook-f"></i> |
| </a> |
| <a href="#" class="text-gray-400 hover:text-white"> |
| <i class="fab fa-twitter"></i> |
| </a> |
| <a href="#" class="text-gray-400 hover:text-white"> |
| <i class="fab fa-instagram"></i> |
| </a> |
| <a href="#" class="text-gray-400 hover:text-white"> |
| <i class="fab fa-linkedin-in"></i> |
| </a> |
| </div> |
| </div> |
| |
| <div> |
| <h3 class="text-lg font-bold mb-4">روابط سريعة</h3> |
| <ul class="space-y-2"> |
| <li><a href="#" class="text-gray-400 hover:text-white">الرئيسية</a></li> |
| <li><a href="#" class="text-gray-400 hover:text-white">العقارات</a></li> |
| <li><a href="#" class="text-gray-400 hover:text-white">عن الشركة</a></li> |
| <li><a href="#" class="text-gray-400 hover:text-white">المدونة</a></li> |
| <li><a href="#" class="text-gray-400 hover:text-white">اتصل بنا</a></li> |
| </ul> |
| </div> |
| |
| <div> |
| <h3 class="text-lg font-bold mb-4">خدماتنا</h3> |
| <ul class="space-y-2"> |
| <li><a href="#" class="text-gray-400 hover:text-white">بيع العقارات</a></li> |
| <li><a href="#" class="text-gray-400 hover:text-white">شراء العقارات</a></li> |
| <li><a href="#" class="text-gray-400 hover:text-white">تأجير العقارات</a></li> |
| <li><a href="#" class="text-gray-400 hover:text-white">تقييم العقارات</a></li> |
| <li><a href="#" class="text-gray-400 hover:text-white">الاستشارات العقارية</a></li> |
| </ul> |
| </div> |
| |
| <div> |
| <h3 class="text-lg font-bold mb-4">اتصل بنا</h3> |
| <ul class="space-y-2"> |
| <li class="flex items-center text-gray-400"> |
| <i class="fas fa-map-marker-alt ml-2"></i> |
| <span>الرياض، المملكة العربية السعودية</span> |
| </li> |
| <li class="flex items-center text-gray-400"> |
| <i class="fas fa-phone ml-2"></i> |
| <span>+966 12 345 6789</span> |
| </li> |
| <li class="flex items-center text-gray-400"> |
| <i class="fas fa-envelope ml-2"></i> |
| <span>info@dar-casa.com</span> |
| </li> |
| </ul> |
| </div> |
| </div> |
| |
| <div class="pt-8 border-t border-gray-800 text-center text-gray-400"> |
| <p>© 2023 دار كاسا. جميع الحقوق محفوظة.</p> |
| </div> |
| </div> |
| </footer> |
|
|
| <script> |
| |
| const counters = document.querySelectorAll('.counter'); |
| const speed = 200; |
| |
| counters.forEach(counter => { |
| const updateCount = () => { |
| const target = +counter.getAttribute('data-target'); |
| const count = +counter.innerText; |
| |
| const inc = target / speed; |
| |
| if(count < target) { |
| counter.innerText = Math.ceil(count + inc); |
| setTimeout(updateCount, 1); |
| } else { |
| counter.innerText = target; |
| } |
| } |
| |
| updateCount(); |
| }); |
| |
| |
| document.querySelector('.md\\:hidden').addEventListener('click', function() { |
| alert('Mobile menu would open here'); |
| }); |
| </script> |
| <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=hkais/darcasa" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> |
| </html> |
