239 أسطر
22 KiB
HTML
239 أسطر
22 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); }
|
||
.chat-input-line { background:transparent; border:none; border-bottom:2px solid var(--ink); padding:1rem 0; width:100%; font-size:1.1rem; font-family:'Cairo',sans-serif; outline:none; }
|
||
.chat-input-line:focus { border-color: var(--accent-bold); }
|
||
.msg-user { background:var(--accent-bold); color:white; border-radius:4px 4px 20px 4px; padding:16px 24px; }
|
||
.msg-bot { background:#D6EDF0; color:#0F3858; border-radius:4px 4px 4px 20px; padding:16px 24px; }
|
||
.page-hero { background:var(--night); min-height:45vh; display:flex; align-items:center; padding:10rem 2rem 4rem; position:relative; overflow:hidden; }
|
||
.page-hero::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse at 30% 50%, rgba(54,144,158,0.18) 0%, transparent 60%); }
|
||
.support-option { border:2px solid transparent; border-radius:12px; padding:2rem; cursor:pointer; transition:all 0.3s ease; background:white; }
|
||
.support-option:hover { border-color:var(--sage); transform:translateY(-3px); box-shadow:0 15px 40px rgba(0,0,0,0.1); }
|
||
.support-option.active { border-color:var(--accent-bold); background:linear-gradient(135deg, #f0f8fa, white); }
|
||
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 active-page">الدعم</a>
|
||
<a href="about.html" class="nav-link">من نحن</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><br>الشفاء</h1>
|
||
<p class="text-white/70 text-lg max-w-xl serif leading-relaxed">هذه القناة مشفرة بالكامل. رسائلك تمحى فور إغلاق الجلسة. أنت في أمان هنا.</p>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Support Options -->
|
||
<section class="py-20 px-6 md:px-20 bg-white">
|
||
<div class="max-w-5xl mx-auto">
|
||
<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-3xl font-black reveal-up">كيف يمكننا مساعدتك؟</h3>
|
||
</div>
|
||
<div class="grid md:grid-cols-3 gap-6 mb-16">
|
||
<a href="https://t.me/malaz_support" target="_blank" rel="noopener noreferrer" class="support-option active reveal-up block">
|
||
<div class="text-3xl mb-4">💬</div>
|
||
<h4 class="font-bold text-xl mb-2">الدعم الفوري</h4>
|
||
<p class="text-black/60 serif text-sm">تحدّث إلينا عبر تيليغرام. مجاني وسري بالكامل.</p>
|
||
</a>
|
||
<a href="https://t.me/malaz_community" target="_blank" rel="noopener noreferrer" class="support-option reveal-up block">
|
||
<div class="text-3xl mb-4">📱</div>
|
||
<h4 class="font-bold text-xl mb-2">مجتمع ملاذ</h4>
|
||
<p class="text-black/60 serif text-sm">انضم لمجتمعنا على تيليغرام للدعم المتبادل والمحتوى التوعوي المستمر.</p>
|
||
</a>
|
||
<a href="https://t.me/malaz_support?start=legal" target="_blank" rel="noopener noreferrer" class="support-option reveal-up block">
|
||
<div class="text-3xl mb-4">⚖️</div>
|
||
<h4 class="font-bold text-xl mb-2">الاستشارة القانونية</h4>
|
||
<p class="text-black/60 serif text-sm">تواصل مع محامٍ متخصص في جرائم المعلوماتية لفهم خياراتك القانونية.</p>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Telegram Redirect Section -->
|
||
<section class="py-16 px-6 md:px-20 bg-[var(--paper)]" id="chatSection">
|
||
<div class="max-w-7xl mx-auto grid grid-cols-1 md:grid-cols-12 gap-16 items-start">
|
||
<!-- Sidebar info -->
|
||
<div class="md:col-span-4">
|
||
<span class="text-xs font-bold tracking-[0.2em] text-[var(--sage)] mb-6 block reveal-up">كيف تعمل</span>
|
||
<div class="space-y-4 mt-4 text-sm">
|
||
<div class="flex items-start gap-3 reveal-up">
|
||
<span class="w-8 h-8 rounded-full bg-[var(--ink)] text-white flex items-center justify-center font-bold flex-shrink-0">١</span>
|
||
<div>
|
||
<p class="font-bold mb-1">اضغط على الزر</p>
|
||
<p class="text-black/50 serif text-xs">سيفتح تيليغرام مباشرةً مع فريق الدعم</p>
|
||
</div>
|
||
</div>
|
||
<div class="flex items-start gap-3 reveal-up">
|
||
<span class="w-8 h-8 rounded-full border border-[var(--ink)] flex items-center justify-center font-bold text-xs flex-shrink-0">٢</span>
|
||
<div>
|
||
<p class="font-bold mb-1 opacity-70">صف ما تتعرض له</p>
|
||
<p class="text-black/50 serif text-xs">فريقنا سيردّ عليك بتوجيهات مختصة</p>
|
||
</div>
|
||
</div>
|
||
<div class="flex items-start gap-3 reveal-up">
|
||
<span class="w-8 h-8 rounded-full border border-[var(--ink)] flex items-center justify-center font-bold text-xs flex-shrink-0 opacity-40">٣</span>
|
||
<div>
|
||
<p class="font-bold mb-1 opacity-50">خطوات عملية</p>
|
||
<p class="text-black/50 serif text-xs">احصل على خطة واضحة للتعامل مع موقفك</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="mt-10 p-5 bg-[#0F3858] rounded-sm text-white reveal-up">
|
||
<p class="font-bold mb-2 text-[#36909E] text-xs tracking-widest">ضماناتنا</p>
|
||
<ul class="space-y-2 text-sm text-white/70 serif">
|
||
<li class="flex items-center gap-2"><span>🔒</span> تشفير كامل من طرف لطرف</li>
|
||
<li class="flex items-center gap-2"><span>🚫</span> لا نحتفظ بأي سجلات</li>
|
||
<li class="flex items-center gap-2"><span>👤</span> يمكنك البقاء مجهول الهوية</li>
|
||
<li class="flex items-center gap-2"><span>⏰</span> متاحون 24/7</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Telegram CTA Box -->
|
||
<div class="md:col-span-8 glass-card p-6 md:p-10 rounded-sm shadow-xl border-r-4 border-[#229ED9] reveal-up">
|
||
<div class="flex flex-col items-center text-center gap-8 py-8">
|
||
<div class="w-24 h-24 bg-[#229ED9] rounded-full flex items-center justify-center shadow-2xl shadow-[#229ED9]/30">
|
||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="w-12 h-12 fill-white">
|
||
<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>
|
||
</div>
|
||
<div>
|
||
<h3 class="text-3xl font-black text-[#0F3858] mb-3">الدعم الآمن عبر تيليغرام</h3>
|
||
<p class="text-black/60 serif text-lg leading-relaxed max-w-md mx-auto">
|
||
فريقنا جاهز لاستقبالك. المحادثة مشفرة وسرية بالكامل.
|
||
</p>
|
||
</div>
|
||
<div class="w-full grid grid-cols-2 gap-3 max-w-lg">
|
||
<a target="_blank" class="text-center text-sm bg-[#f0f8fa] hover:bg-[#D6EDF0] border border-[#0F3858]/15 rounded-xl px-4 py-3 transition font-bold text-[#0F3858]">
|
||
💰 ابتزاز إلكتروني
|
||
</a>
|
||
<a target="_blank" class="text-center text-sm bg-[#f0f8fa] hover:bg-[#D6EDF0] border border-[#0F3858]/15 rounded-xl px-4 py-3 transition font-bold text-[#0F3858]">
|
||
🧨 تنمر إلكتروني
|
||
</a>
|
||
<a target="_blank" class="text-center text-sm bg-[#f0f8fa] hover:bg-[#D6EDF0] border border-[#0F3858]/15 rounded-xl px-4 py-3 transition font-bold text-[#0F3858]">
|
||
⚖️ استشارة قانونية
|
||
</a>
|
||
<a target="_blank" class="text-center text-sm bg-[#f0f8fa] hover:bg-[#D6EDF0] border border-[#0F3858]/15 rounded-xl px-4 py-3 transition font-bold text-[#0F3858]">
|
||
💙 دعم نفسي
|
||
</a>
|
||
</div>
|
||
<a href="https://t.me/malaz_support" target="_blank" rel="noopener noreferrer"
|
||
class="inline-flex items-center gap-3 bg-[#229ED9] text-white px-10 py-5 rounded-full font-bold text-xl hover:opacity-90 hover:-translate-y-1 transition-all duration-300 shadow-lg shadow-[#229ED9]/30">
|
||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="w-7 h-7 fill-white flex-shrink-0">
|
||
<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>
|
||
<div class="flex items-center gap-2 text-xs text-black/40 bg-[#D6EDF0]/40 px-5 py-3 rounded-full">
|
||
<span>🔒</span>
|
||
<span>المحادثة محمية بتشفير من طرف إلى طرف. هويتك في أمان تام.</span>
|
||
</div>
|
||
</div>
|
||
</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>
|