Football IQ — موقع أكاديمية كرة القدم

موقع صفحة واحدة (Landing) يروي "رحلة اللاعب" من اللمسة الأولى حتى الاحتراف، بكرة ثلاثية الأبعاد تتحرك مع السكرول، وفيديوهات حقيقية تُفرَّك (scrub) مع التمرير، ثنائي اللغة (عربي أساسي / إنجليزي).

التشغيل

يكفي فتح index.html بالنقر المزدوج — يعمل مباشرة من الجهاز (يلزم إنترنت لتحميل المكتبات والوسائط). لتجربة أقرب للإنتاج يمكن استخدام خادم محلي:

# أي خادم ثابت يكفي — مثال:
npx serve football-iq
# أو
python -m http.server 8080 --directory football-iq

ثم افتح http://localhost:3000 (أو المنفذ الذي يظهر لك).

للنشر: ارفع مجلد football-iq كما هو إلى Netlify / Vercel / GitHub Pages / أي استضافة ثابتة.

الملفات

football-iq/
├── index.html        # الهيكل والمحتوى (النصوص العربية الافتراضية داخل الـ HTML)
├── css/style.css     # التصميم — أخضر ملعب + ذهبي، RTL/LTR
└── js/
    ├── i18n.js       # قاموس النصوص (ar / en) — عدّل النصوص هنا
    └── main.js       # Three.js (الكرة والمرمى) + GSAP ScrollTrigger + Lenis + النموذج

ما يجب تعديله قبل الإطلاق

1. رقم الواتساب والبريد — أعلى js/main.js:

   const CONFIG = { whatsapp: '9647700000000', email: 'info@footballiq.com', phoneDisplay: '+964 770 000 0000' };

2. أسماء المدربين وقصص النجاح والأرقام — كلها نصوص تجريبية (placeholder) في js/i18n.js وفي index.html (الأرقام في data-count).
3. الصور والفيديوهات — حالياً روابط مجانية مباشرة من Unsplash / Pexels / Mixkit (رخصها تسمح بالاستخدام التجاري بدون إسناد). للأداء الأفضل والاستقلالية، نزّلها إلى مجلد assets/ واستبدل الروابط في index.html.
4. النموذج — لا يوجد Backend؛ عند الإرسال يُبنى رابط واتساب مع بيانات اللاعب. لربطه بخدمة بريد (Formspree / EmailJS / API خاص) عدّل دالة form() في main.js.

المكتبات (عبر CDN)

• Three.js 0.160 — الكرة، المرمى، الجزيئات
• GSAP 3.12 + ScrollTrigger — الحركة المرتبطة بالسكرول
• Lenis 1.1 — سكرول ناعم
• خطوط Google: Cairo (عربي/إنجليزي) + Oswald (عناوين إنجليزية)

ملاحظات تقنية

• على الهواتف/الشاشات اللمسية تُشغَّل فيديوهات الفصول بشكل عادي بدل الفرك بالسكرول (أداء أفضل).
• عند تفعيل prefers-reduced-motion تُعطَّل الحركة والـ 3D تلقائياً.
• اللغة المختارة تُحفظ في localStorage (fiq-lang).