الملفات
aman-lp/about.html
sana-abboud@gma c7d4997303 full website
2026-03-29 02:16:21 +03:00

250 أسطر
24 KiB
HTML

<!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>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.5/gsap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.5/ScrollTrigger.min.js"></script>
<link href="https://fonts.googleapis.com/css2?family=Cairo:wght@200;400;600;900&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Noto+Kufi+Arabic:wght@400;700&display=swap" rel="stylesheet">
<style>
:root { --paper:#FAFAF8; --ink:#1A1A1A; --night:#0a1e2e; --accent-soft:#D6EDF0; --accent-bold:#0F3858; --sage:#36909E; }
* { margin:0; padding:0; box-sizing:border-box; -webkit-font-smoothing:antialiased; }
body { font-family:'Cairo',sans-serif; background-color:var(--paper); color:var(--ink); overflow-x:hidden; }
.serif { font-family:'Noto Kufi Arabic',sans-serif; }
#mainNav { transition: background 0.4s ease, box-shadow 0.4s ease, padding 0.4s ease; }
#mainNav.scrolled { background:rgba(10,30,46,0.95); backdrop-filter:blur(16px); box-shadow:0 4px 30px rgba(0,0,0,0.25); padding-top:1.25rem; padding-bottom:1.25rem; }
#mainNav.scrolled a { color:#E0F4F6; }
.reveal-up { opacity:0; transform:translateY(60px); }
.glass-card { background:rgba(255,255,255,0.6); backdrop-filter:blur(12px); border:1px solid rgba(0,0,0,0.03); box-shadow:0 20px 40px -10px rgba(0,0,0,0.05); transition:transform 0.5s cubic-bezier(0.16,1,0.3,1); }
.glass-card:hover { transform:translateY(-3px); }
.page-hero { background:var(--night); min-height:50vh; display:flex; align-items:center; padding:10rem 2rem 5rem; position:relative; overflow:hidden; }
.page-hero::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse at 20% 50%, rgba(54,144,158,0.2) 0%, transparent 60%); }
.value-card { padding:2.5rem; border:1px solid rgba(0,0,0,0.06); border-radius:12px; transition:all 0.3s ease; }
.value-card:hover { border-color:var(--sage); background:white; }
.timeline-item { position:relative; padding-right:3rem; }
.timeline-item::before { content:''; position:absolute; right:0; top:0; bottom:-2rem; width:2px; background:var(--accent-soft); }
.timeline-item::after { content:''; position:absolute; right:-6px; top:4px; width:14px; height:14px; border-radius:50%; background:var(--sage); }
.team-card { text-align:center; padding:2rem; }
nav a.active-page { color:var(--sage) !important; border-bottom:2px solid var(--sage); }
nav a.nav-link:hover { color:var(--sage) !important; }
</style>
</head>
<body>
<nav id="mainNav" class="fixed top-0 w-full z-50 px-6 md:px-16 py-6 flex justify-between items-center transition-all duration-500">
<div class="flex gap-6 md:gap-8 text-xs tracking-[0.2em] font-bold text-white">
<a href="index.html" class="nav-link">الرئيسية</a>
<a href="violence.html" class="nav-link">العنف الرقمي</a>
<a href="support.html" class="nav-link">الدعم</a>
<a href="about.html" class="nav-link active-page">من نحن</a>
<a href="faq.html" class="nav-link">أسئلة</a>
</div>
<a href="index.html"><img src="Malazlogo.png" alt="ملاذ" class="h-8 w-auto" style="filter:brightness(0) invert(1);" onerror="this.style.display='none'"></a>
</nav>
<!-- Page Hero -->
<div class="page-hero">
<div class="max-w-4xl mx-auto relative z-10">
<p class="text-xs font-bold tracking-[0.3em] text-[#36909E] mb-4">قصتنا</p>
<h1 class="text-5xl md:text-7xl font-black text-white leading-tight mb-6">منصة<br><span class="text-[#36909E]">ملاذ</span></h1>
<p class="text-white/70 text-xl max-w-2xl serif leading-relaxed">نحن منصة توعوية تعمل على جعل الفضاء الرقمي أكثر أماناً وإنسانية للجميع.</p>
</div>
</div>
<!-- Mission -->
<section class="py-24 px-6 md:px-20 bg-white">
<div class="max-w-6xl mx-auto">
<div class="grid md:grid-cols-2 gap-16 items-center">
<div>
<h2 class="text-xs font-bold tracking-[0.2em] text-[var(--sage)] mb-4 reveal-up">من نحن</h2>
<h3 class="text-4xl font-black leading-tight mb-6 reveal-up">نؤمن بفضاء رقمي<br>أكثر أماناً</h3>
<p class="text-black/70 leading-loose serif text-lg mb-6 reveal-up">
نحن منصة توعوية تهدف إلى بناء بيئة رقمية أكثر أماناً واحتراماً للجميع. نعمل على نشر الوعي حول أشكال العنف الرقمي المختلفة، مثل التنمر الإلكتروني، الابتزاز، انتهاك الخصوصية، وخطاب الكراهية، ونسعى لتمكين الأفراد بالمعرفة والأدوات التي تساعدهم على حماية أنفسهم والتعامل مع هذه التحديات بوعي وثقة.
نؤمن بأن الفضاء الرقمي يجب أن يكون مساحة آمنة للتعبير والتواصل، لذلك نركز على تقديم محتوى توعوي مبسط، من امثلة واقعية وإرشادات مبنية على أسس علمية تساعد المستخدمين من مختلف الأعمار والخلفيات.
في ملاذ، نعمل معاً لنحوّل الوعي إلى حماية، والمعرفة إلى قوة.
</p>
</div>
<div class="flex justify-center reveal-up">
<img src="Malazlogo.png" alt="ملاذ" class="w-64 md:w-80 opacity-90" onerror="this.outerHTML='<div class=\'w-64 h-64 bg-[#0F3858] rounded-full flex items-center justify-center\'><span class=\'text-white text-6xl font-black\'>ملاذ</span></div>'">
</div>
</div>
</div>
</section>
<!-- Vision & Mission -->
<section class="py-24 px-6 md:px-20 bg-[var(--paper)]">
<div class="max-w-6xl mx-auto">
<div class="grid md:grid-cols-2 gap-8 mb-20">
<div class="bg-[#0F3858] text-white p-10 rounded-sm reveal-up">
<span class="text-xs font-bold tracking-[0.3em] text-[#36909E] mb-4 block">رؤيتنا</span>
<h3 class="text-2xl font-black mb-4">مجتمع رقمي واعٍ</h3>
<p class="text-white/70 serif leading-relaxed">
رؤيتنا هي مجتمع رقمي واعٍ يحترم الخصوصية ويواجه العنف الإلكتروني بثقافة المعرفة والمسؤولية. نسعى لبناء بيئة رقمية تصبح فيها الحقوق الرقمية معروفة ومحمية للجميع.
</p>
</div>
<div class="bg-[#D6EDF0] p-10 rounded-sm reveal-up">
<span class="text-xs font-bold tracking-[0.3em] text-[#0F3858] mb-4 block">رسالتنا</span>
<h3 class="text-2xl font-black text-[#0F3858] mb-4">التمكين والحماية</h3>
<p class="text-black/70 serif leading-relaxed">
رسالتنا هي تمكين الأفراد، دعم الضحايا، والمساهمة في نشر سلوك رقمي صحي وإيجابي. في ملاذ، نعمل معاً لنحوّل الوعي إلى حماية، والمعرفة إلى قوة.
</p>
</div>
</div>
<!-- Values -->
<div class="text-center mb-12">
<h2 class="text-xs font-bold tracking-[0.2em] text-[var(--sage)] mb-4 reveal-up">قيمنا</h2>
<h3 class="text-4xl font-black reveal-up">ما الذي يُحرّكنا</h3>
</div>
<div class="grid md:grid-cols-3 gap-6">
<div class="value-card reveal-up">
<div class="text-3xl mb-4">🛡️</div>
<h4 class="font-bold text-xl mb-3">الأمان أولاً</h4>
<p class="text-black/60 serif text-sm leading-relaxed">كل ما نبنيه وكل قرار نتخذه يضع أمان الضحايا وسرية بياناتهم في المقام الأول. لا تنازل عن هذا المبدأ.</p>
</div>
<div class="value-card reveal-up">
<div class="text-3xl mb-4">🤝</div>
<h4 class="font-bold text-xl mb-3">الكرامة الإنسانية</h4>
<p class="text-black/60 serif text-sm leading-relaxed">نتعامل مع كل شخص يتواصل معنا بكامل الاحترام والكرامة بصرف النظر عن خلفيته أو ظروفه.</p>
</div>
<div class="value-card reveal-up">
<div class="text-3xl mb-4">💡</div>
<h4 class="font-bold text-xl mb-3">التمكين بالمعرفة</h4>
<p class="text-black/60 serif text-sm leading-relaxed">نؤمن أن المعرفة هي أقوى سلاح. نسعى لجعل المعلومات القانونية والتقنية متاحة للجميع بلغة مبسطة.</p>
</div>
<div class="value-card reveal-up">
<div class="text-3xl mb-4">🌍</div>
<h4 class="font-bold text-xl mb-3">الشمولية</h4>
<p class="text-black/60 serif text-sm leading-relaxed">خدماتنا متاحة للجميع بصرف النظر عن الجنس أو العمر أو المنطقة الجغرافية. العنف الرقمي لا يميز.</p>
</div>
<div class="value-card reveal-up">
<div class="text-3xl mb-4"></div>
<h4 class="font-bold text-xl mb-3">الاستجابة السريعة</h4>
<p class="text-black/60 serif text-sm leading-relaxed">في حالات العنف الرقمي، الوقت عامل حاسم. نلتزم بالاستجابة السريعة والمساعدة الفورية لمن يحتاجها.</p>
</div>
<div class="value-card reveal-up">
<div class="text-3xl mb-4">🔍</div>
<h4 class="font-bold text-xl mb-3">الشفافية</h4>
<p class="text-black/60 serif text-sm leading-relaxed">نكون صادقين مع مجتمعنا حول ما نستطيع وما لا نستطيع فعله. الثقة تُبنى على الصدق والشفافية.</p>
</div>
</div>
</div>
</section>
<!-- What we do -->
<section class="py-24 px-6 md:px-20 bg-white">
<div class="max-w-6xl mx-auto">
<div class="text-center mb-16">
<h2 class="text-xs font-bold tracking-[0.2em] text-[var(--sage)] mb-4 reveal-up">عملنا</h2>
<h3 class="text-4xl font-black reveal-up">ماذا نقدم بالضبط؟</h3>
</div>
<div class="grid md:grid-cols-2 gap-8">
<div class="glass-card p-8 rounded-sm reveal-up">
<div class="w-14 h-14 rounded-full bg-[#D6EDF0] flex items-center justify-center text-2xl mb-6">📚</div>
<h4 class="text-xl font-bold mb-3">التوعية والتثقيف</h4>
<p class="text-black/60 serif leading-relaxed">ننشر محتوى توعوياً مبسطاً حول أشكال العنف الرقمي وكيفية حماية النفس منها. أمثلة واقعية، إرشادات عملية، وتحديثات مستمرة.</p>
</div>
<div class="glass-card p-8 rounded-sm reveal-up">
<div class="w-14 h-14 rounded-full bg-[#cce4e8] flex items-center justify-center text-2xl mb-6">💙</div>
<h4 class="text-xl font-bold mb-3">الدعم</h4>
<p class="text-black/60 serif leading-relaxed">فريقنا يوفر الاستماع والدعم العاطفي لضحايا العنف الرقمي. أحياناً أول ما تحتاجه هو أن يسمعك أحد.</p>
</div>
<div class="glass-card p-8 rounded-sm reveal-up">
<div class="w-14 h-14 rounded-full bg-[#b8d9de] flex items-center justify-center text-2xl mb-6">⚖️</div>
<h4 class="text-xl font-bold mb-3">الإرشاد القانوني</h4>
<p class="text-black/60 serif leading-relaxed">نوجّهك حول حقوقك القانونية وخياراتك القانونية بموجب قانون الجرائم المعلوماتية السوري رقم 20 لعام 2022.</p>
</div>
</div>
</div>
</section>
<!-- Join CTA -->
<section class="py-20 px-6 md:px-20 bg-[var(--paper)] text-center">
<div class="max-w-2xl mx-auto reveal-up">
<h3 class="text-4xl font-black mb-4">انضم إلى مجتمعنا</h3>
<p class="text-black/60 serif mb-8">كن جزءاً من الحل. انضم إلى مجتمع ملاذ على تيليغرام وساهم في نشر الوعي.</p>
<div class="flex flex-col sm:flex-row gap-4 justify-center">
<a href="https://t.me/malaz_community" target="_blank" class="inline-flex items-center gap-3 bg-[#229ED9] text-white px-8 py-4 rounded-full font-bold hover:opacity-90 transition">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="w-5 h-5 fill-current"><path d="M11.944 0A12 12 0 0 0 0 12a12 12 0 0 0 12 12 12 12 0 0 0 12-12A12 12 0 0 0 12 0a12 12 0 0 0-.056 0zm4.962 7.224c.1-.002.321.023.465.14a.506.506 0 0 1 .171.325c.016.093.036.306.02.472-.18 1.898-.962 6.502-1.36 8.627-.168.9-.499 1.201-.82 1.23-.696.065-1.225-.46-1.9-.902-1.056-.693-1.653-1.124-2.678-1.8-1.185-.78-.417-1.21.258-1.91.177-.184 3.247-2.977 3.307-3.23.007-.032.014-.15-.056-.212s-.174-.041-.249-.024c-.106.024-1.793 1.14-5.061 3.345-.48.33-.913.49-1.302.48-.428-.008-1.252-.241-1.865-.44-.752-.245-1.349-.374-1.297-.789.027-.216.325-.437.893-.663 3.498-1.524 5.83-2.529 6.998-3.014 3.332-1.386 4.025-1.627 4.476-1.635z"/></svg>
انضم الآن
</a>
<a href="support.html" class="inline-block border-2 border-[var(--ink)] px-8 py-4 rounded-full font-bold hover:bg-[var(--ink)] hover:text-white transition">
تواصل معنا
</a>
</div>
</div>
</section>
<!-- Footer -->
<footer class="bg-[var(--ink)] text-white pt-20 pb-12 px-6 md:px-20 relative overflow-hidden">
<div class="absolute top-0 left-0 w-full h-2 bg-gradient-to-l from-[#36909E] via-[#D6EDF0] to-[#0F3858]"></div>
<div class="max-w-7xl mx-auto grid grid-cols-1 md:grid-cols-4 gap-12 mb-16">
<div class="md:col-span-2">
<p class="text-2xl font-black mb-3">ملاذ</p>
<p class="text-sm text-white/50 leading-relaxed mb-6 max-w-md">منصة رقمية تهدف لتوفير ملاذ رقمي آمن للناجيين والناجيات من العنف الإلكتروني في سوريا.</p>
<div class="flex gap-4">
<!-- Telegram -->
<a href="https://t.me/malaz_community" target="_blank" aria-label="تيليغرام" class="w-10 h-10 rounded-full border border-white/20 flex items-center justify-center hover:bg-white/10 hover:border-[#229ED9] transition">
<svg xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 fill-white" viewBox="0 0 24 24"><path d="M11.944 0A12 12 0 0 0 0 12a12 12 0 0 0 12 12 12 12 0 0 0 12-12A12 12 0 0 0 12 0a12 12 0 0 0-.056 0zm4.962 7.224c.1-.002.321.023.465.14a.506.506 0 0 1 .171.325c.016.093.036.306.02.472-.18 1.898-.962 6.502-1.36 8.627-.168.9-.499 1.201-.82 1.23-.696.065-1.225-.46-1.9-.902-1.056-.693-1.653-1.124-2.678-1.8-1.185-.78-.417-1.21.258-1.91.177-.184 3.247-2.977 3.307-3.23.007-.032.014-.15-.056-.212s-.174-.041-.249-.024c-.106.024-1.793 1.14-5.061 3.345-.48.33-.913.49-1.302.48-.428-.008-1.252-.241-1.865-.44-.752-.245-1.349-.374-1.297-.789.027-.216.325-.437.893-.663 3.498-1.524 5.83-2.529 6.998-3.014 3.332-1.386 4.025-1.627 4.476-1.635z"/></svg>
</a>
<!-- Instagram -->
<a href="https://instagram.com/malaz_sy" target="_blank" aria-label="انستغرام" class="w-10 h-10 rounded-full border border-white/20 flex items-center justify-center hover:bg-white/10 hover:border-pink-400 transition">
<svg xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 fill-white" viewBox="0 0 24 24"><path d="M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zM12 0C8.741 0 8.333.014 7.053.072 2.695.272.273 2.69.073 7.052.014 8.333 0 8.741 0 12c0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98C8.333 23.986 8.741 24 12 24c3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98C15.668.014 15.259 0 12 0zm0 5.838a6.162 6.162 0 1 0 0 12.324 6.162 6.162 0 0 0 0-12.324zM12 16a4 4 0 1 1 0-8 4 4 0 0 1 0 8zm6.406-11.845a1.44 1.44 0 1 0 0 2.881 1.44 1.44 0 0 0 0-2.881z"/></svg>
</a>
<!-- LinkedIn -->
<a href="https://linkedin.com/company/malaz-sy" target="_blank" aria-label="لينكدإن" class="w-10 h-10 rounded-full border border-white/20 flex items-center justify-center hover:bg-white/10 hover:border-[#0A66C2] transition">
<svg xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 fill-white" viewBox="0 0 24 24"><path d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433a2.062 2.062 0 0 1-2.063-2.065 2.064 2.064 0 1 1 2.063 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z"/></svg>
</a>
</div>
</div>
<div>
<h4 class="font-bold text-sm mb-5 tracking-wider">روابط سريعة</h4>
<ul class="space-y-3 text-sm text-white/50">
<li><a href="index.html" class="hover:text-white transition">الرئيسية</a></li>
<li><a href="violence.html" class="hover:text-white transition">العنف الرقمي</a></li>
<li><a href="support.html" class="hover:text-white transition">الدعم</a></li>
<li><a href="about.html" class="hover:text-white transition">من نحن</a></li>
<li><a href="faq.html" class="hover:text-white transition">الأسئلة الشائعة</a></li>
</ul>
</div>
<div>
<h4 class="font-bold text-sm mb-5 tracking-wider">تواصل معنا</h4>
<ul class="space-y-3 text-sm text-white/50">
<li><a href="https://t.me/malaz_community" target="_blank" class="hover:text-white transition flex items-center gap-2">
<svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4 fill-current flex-shrink-0" viewBox="0 0 24 24"><path d="M11.944 0A12 12 0 0 0 0 12a12 12 0 0 0 12 12 12 12 0 0 0 12-12A12 12 0 0 0 12 0a12 12 0 0 0-.056 0zm4.962 7.224c.1-.002.321.023.465.14a.506.506 0 0 1 .171.325c.016.093.036.306.02.472-.18 1.898-.962 6.502-1.36 8.627-.168.9-.499 1.201-.82 1.23-.696.065-1.225-.46-1.9-.902-1.056-.693-1.653-1.124-2.678-1.8-1.185-.78-.417-1.21.258-1.91.177-.184 3.247-2.977 3.307-3.23.007-.032.014-.15-.056-.212s-.174-.041-.249-.024c-.106.024-1.793 1.14-5.061 3.345-.48.33-.913.49-1.302.48-.428-.008-1.252-.241-1.865-.44-.752-.245-1.349-.374-1.297-.789.027-.216.325-.437.893-.663 3.498-1.524 5.83-2.529 6.998-3.014 3.332-1.386 4.025-1.627 4.476-1.635z"/></svg>
تيليغرام
</a></li>
<li><a href="https://instagram.com/malaz_sy" target="_blank" class="hover:text-white transition flex items-center gap-2">
<svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4 fill-current flex-shrink-0" viewBox="0 0 24 24"><path d="M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zM12 0C8.741 0 8.333.014 7.053.072 2.695.272.273 2.69.073 7.052.014 8.333 0 8.741 0 12c0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98C8.333 23.986 8.741 24 12 24c3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98C15.668.014 15.259 0 12 0zm0 5.838a6.162 6.162 0 1 0 0 12.324 6.162 6.162 0 0 0 0-12.324zM12 16a4 4 0 1 1 0-8 4 4 0 0 1 0 8zm6.406-11.845a1.44 1.44 0 1 0 0 2.881 1.44 1.44 0 0 0 0-2.881z"/></svg>
انستغرام
</a></li>
<li><a href="https://linkedin.com/company/malaz-sy" target="_blank" class="hover:text-white transition flex items-center gap-2">
<svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4 fill-current flex-shrink-0" viewBox="0 0 24 24"><path d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433a2.062 2.062 0 0 1-2.063-2.065 2.064 2.064 0 1 1 2.063 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z"/></svg>
لينكدإن
</a></li>
</ul>
</div>
</div>
<div class="border-t border-white/10 pt-8 flex flex-col md:flex-row justify-between items-center gap-4">
<div class="flex items-center gap-2">
<span class="w-2 h-2 bg-[var(--sage)] rounded-full animate-pulse inline-block"></span>
<span class="text-xs text-white/30">اتصالك بهذه الصفحة آمن ومشفر بالكامل</span>
</div>
<p class="text-xs text-white/20">© 2026 ملاذ. جميع الحقوق محفوظة.</p>
</div>
</footer>
<script>
const mainNav=document.getElementById('mainNav');
function handleNav(){if(window.innerWidth<=1024||window.scrollY>80){mainNav.classList.add('scrolled')}else{mainNav.classList.remove('scrolled')}}
window.addEventListener('scroll',handleNav);window.addEventListener('resize',handleNav);handleNav();
gsap.registerPlugin(ScrollTrigger);
gsap.utils.toArray('.reveal-up').forEach(elem=>{gsap.to(elem,{y:0,opacity:1,duration:1,ease:"power3.out",scrollTrigger:{trigger:elem,start:"top 85%",toggleActions:"play none none reverse"}})});
</script>
</body>
</html>