476 lines
28 KiB
PHP
476 lines
28 KiB
PHP
<?php
|
|
|
|
namespace App\Views;
|
|
|
|
class MilitaryCulturePitch
|
|
{
|
|
public static function render(): string
|
|
{
|
|
return <<<'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>
|
|
<!-- Google Fonts: Cairo -->
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
<link href="https://fonts.googleapis.com/css2?family=Cairo:wght@400;600;700;800;900&display=swap" rel="stylesheet">
|
|
|
|
<!-- Pure Self-Contained Luxury CSS (Military Heritage Dark Theme) -->
|
|
<style>
|
|
:root {
|
|
--bg-dark: #07101E;
|
|
--bg-card: #111D33;
|
|
--bg-card-hover: #182845;
|
|
--border: #233759;
|
|
--border-gold: #FFD166;
|
|
--text-primary: #FFFFFF;
|
|
--text-secondary: #CBD5E1;
|
|
--text-muted: #8E9FB8;
|
|
--accent-gold: #FFD166;
|
|
--accent-gold-dark: #D97706;
|
|
--accent-cyan: #00F5D4;
|
|
--accent-green: #10B981;
|
|
--accent-red: #EF4444;
|
|
--military-badge: #1E3A8A;
|
|
}
|
|
|
|
* { box-sizing: border-box; margin: 0; padding: 0; font-family: 'Cairo', system-ui, -apple-system, sans-serif; }
|
|
|
|
body {
|
|
background-color: var(--bg-dark);
|
|
color: var(--text-primary);
|
|
min-height: 100vh;
|
|
overflow-x: hidden;
|
|
background-image:
|
|
radial-gradient(circle at 20% 15%, rgba(255, 209, 102, 0.07) 0%, transparent 45%),
|
|
radial-gradient(circle at 80% 35%, rgba(0, 245, 212, 0.05) 0%, transparent 45%),
|
|
linear-gradient(to right, rgba(255, 255, 255, 0.02) 1px, transparent 1px),
|
|
linear-gradient(to bottom, rgba(255, 255, 255, 0.02) 1px, transparent 1px);
|
|
background-size: 100% 100%, 100% 100%, 36px 36px, 36px 36px;
|
|
}
|
|
|
|
.container { max-width: 1200px; margin: 0 auto; padding: 0 24px; width: 100%; }
|
|
|
|
/* Header */
|
|
header {
|
|
border-bottom: 1px solid var(--border);
|
|
background-color: rgba(7, 16, 30, 0.95);
|
|
backdrop-filter: blur(16px);
|
|
position: sticky;
|
|
top: 0;
|
|
z-index: 50;
|
|
}
|
|
.header-content { height: 72px; display: flex; align-items: center; justify-content: space-between; }
|
|
.logo-area { display: flex; align-items: center; gap: 12px; text-decoration: none; }
|
|
.logo-badge {
|
|
width: 44px; height: 44px; border-radius: 12px;
|
|
background: linear-gradient(135deg, #FFD166, #D97706);
|
|
display: flex; align-items: center; justify-content: center;
|
|
color: #07101E; font-size: 22px; font-weight: 900;
|
|
box-shadow: 0 0 24px rgba(255, 209, 102, 0.35);
|
|
}
|
|
.brand-title { font-size: 20px; font-weight: 900; color: #FFFFFF; }
|
|
.military-pill {
|
|
font-size: 11.5px; font-weight: 800; padding: 3px 12px; border-radius: 999px;
|
|
background: rgba(255, 209, 102, 0.12); color: var(--accent-gold);
|
|
border: 1px solid rgba(255, 209, 102, 0.35); margin-right: 8px;
|
|
}
|
|
|
|
.header-cta {
|
|
padding: 8px 20px; font-size: 13.5px; font-weight: 800; border-radius: 10px; text-decoration: none;
|
|
background: linear-gradient(135deg, #FFD166, #D97706); color: #07101E;
|
|
box-shadow: 0 4px 16px rgba(255, 209, 102, 0.3); transition: 0.2s;
|
|
}
|
|
.header-cta:hover { transform: translateY(-1px); }
|
|
|
|
/* Executive Banner */
|
|
.exec-hero { padding: 60px 0 50px; text-align: center; }
|
|
.flag-tag {
|
|
display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 900;
|
|
background: rgba(255, 209, 102, 0.1); border: 1px solid rgba(255, 209, 102, 0.35);
|
|
color: var(--accent-gold); padding: 6px 18px; border-radius: 999px; margin-bottom: 24px;
|
|
}
|
|
.exec-title {
|
|
font-size: clamp(28px, 4.5vw, 48px); font-weight: 900; line-height: 1.3; color: #FFFFFF;
|
|
max-width: 960px; margin: 0 auto 20px;
|
|
}
|
|
.exec-title-gold {
|
|
background: linear-gradient(135deg, #FFD166, #F59E0B);
|
|
-webkit-background-clip: text; -webkit-text-fill-color: transparent;
|
|
}
|
|
.exec-desc {
|
|
font-size: clamp(15px, 2vw, 17.5px); color: var(--text-secondary); max-width: 820px;
|
|
margin: 0 auto 36px; line-height: 1.8;
|
|
}
|
|
|
|
.exec-cta-box {
|
|
background: var(--bg-card); border: 1px solid var(--border); border-radius: 20px;
|
|
padding: 24px; max-width: 700px; margin: 0 auto 50px; display: flex; align-items: center;
|
|
justify-content: space-between; gap: 20px; flex-wrap: wrap; text-align: right;
|
|
}
|
|
.exec-cta-btn {
|
|
padding: 12px 28px; font-size: 14.5px; font-weight: 900; border-radius: 12px; text-decoration: none;
|
|
background: linear-gradient(135deg, var(--accent-cyan), var(--accent-cyan-dark)); color: #07101E;
|
|
box-shadow: 0 4px 20px rgba(0, 245, 212, 0.3); transition: 0.2s; white-space: nowrap;
|
|
}
|
|
.exec-cta-btn:hover { transform: translateY(-2px); }
|
|
|
|
/* Strategic Value Matrix */
|
|
.value-matrix {
|
|
display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 20px; margin-bottom: 70px;
|
|
}
|
|
.matrix-card {
|
|
background: var(--bg-card); border: 1px solid var(--border); border-radius: 20px; padding: 28px;
|
|
transition: transform 0.2s, border-color 0.2s;
|
|
}
|
|
.matrix-card:hover { transform: translateY(-3px); border-color: var(--accent-gold); }
|
|
.matrix-num { font-size: 32px; font-weight: 900; color: var(--accent-gold); margin-bottom: 8px; }
|
|
.matrix-title { font-size: 17px; font-weight: 800; color: #FFF; margin-bottom: 8px; }
|
|
.matrix-desc { font-size: 13px; color: var(--text-muted); line-height: 1.65; }
|
|
|
|
/* Pillars Section */
|
|
.section-header { text-align: center; margin-bottom: 44px; }
|
|
.section-tag {
|
|
font-size: 11.5px; font-weight: 800; color: var(--accent-cyan); background: rgba(0,245,212,0.1);
|
|
border: 1px solid rgba(0,245,212,0.3); padding: 4px 14px; border-radius: 999px; display: inline-block; margin-bottom: 12px;
|
|
}
|
|
.section-title { font-size: 30px; font-weight: 900; color: #FFFFFF; margin-bottom: 10px; }
|
|
.section-subtitle { font-size: 14.5px; color: var(--text-muted); max-width: 650px; margin: 0 auto; line-height: 1.6; }
|
|
|
|
.pillars-grid {
|
|
display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: 24px; margin-bottom: 70px;
|
|
}
|
|
.pillar-card {
|
|
background: var(--bg-card); border: 1px solid var(--border); border-radius: 20px; padding: 32px;
|
|
position: relative; overflow: hidden;
|
|
}
|
|
.pillar-card.gold-border { border-color: rgba(255, 209, 102, 0.4); }
|
|
.pillar-icon {
|
|
width: 48px; height: 48px; border-radius: 12px; background: rgba(255, 209, 102, 0.12);
|
|
border: 1px solid rgba(255, 209, 102, 0.3); display: flex; align-items: center; justify-content: center;
|
|
font-size: 22px; margin-bottom: 18px; color: var(--accent-gold);
|
|
}
|
|
.pillar-title { font-size: 18px; font-weight: 900; color: #FFFFFF; margin-bottom: 10px; }
|
|
.pillar-desc { font-size: 13.5px; color: var(--text-secondary); line-height: 1.7; }
|
|
.pillar-points { list-style: none; margin-top: 14px; display: flex; flex-direction: column; gap: 8px; font-size: 12.5px; color: var(--text-muted); }
|
|
.pillar-points li { display: flex; align-items: center; gap: 8px; }
|
|
.pillar-points li::before { content: "•"; color: var(--accent-cyan); font-weight: 900; font-size: 16px; }
|
|
|
|
/* Roadmap Section */
|
|
.roadmap-box {
|
|
background: linear-gradient(135deg, #111D33 0%, #15243F 100%);
|
|
border: 1px solid var(--border); border-radius: 24px; padding: 40px; margin-bottom: 70px;
|
|
}
|
|
.roadmap-grid {
|
|
display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 24px; margin-top: 28px;
|
|
}
|
|
.step-card {
|
|
background: rgba(7, 16, 30, 0.7); border: 1px solid var(--border); border-radius: 18px; padding: 24px;
|
|
}
|
|
.step-badge {
|
|
font-size: 11px; font-weight: 900; color: var(--accent-cyan); background: rgba(0,245,212,0.1);
|
|
padding: 3px 10px; border-radius: 6px; display: inline-block; margin-bottom: 10px;
|
|
}
|
|
.step-title { font-size: 16px; font-weight: 800; color: #FFF; margin-bottom: 8px; }
|
|
.step-desc { font-size: 12.5px; color: var(--text-muted); line-height: 1.6; }
|
|
|
|
/* Demo Request Form */
|
|
.demo-section {
|
|
background: var(--bg-card); border: 1px solid rgba(255, 209, 102, 0.4); border-radius: 24px;
|
|
padding: 44px; margin-bottom: 70px; box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4);
|
|
}
|
|
.demo-grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: 36px; align-items: center; }
|
|
@media (max-width: 860px) { .demo-grid { grid-template-columns: 1fr; } }
|
|
|
|
.form-group { margin-bottom: 16px; }
|
|
.form-label { display: block; font-size: 12px; font-weight: 700; color: var(--text-secondary); margin-bottom: 6px; }
|
|
.input-text {
|
|
width: 100%; background: #07101E; border: 1px solid var(--border); border-radius: 10px;
|
|
padding: 12px 14px; font-size: 13.5px; color: #FFFFFF; outline: none; transition: 0.2s;
|
|
}
|
|
.input-text:focus { border-color: var(--accent-gold); }
|
|
|
|
footer {
|
|
border-top: 1px solid var(--border); background: #040912; padding: 36px 0 24px; color: var(--text-muted); font-size: 12.5px;
|
|
}
|
|
.footer-content { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 14px; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
<!-- Header -->
|
|
<header>
|
|
<div class="container">
|
|
<div class="header-content">
|
|
<a href="/" class="logo-area">
|
|
<div class="logo-badge">صـ</div>
|
|
<div>
|
|
<span class="brand-title">منصة صَقِل</span>
|
|
<span class="military-pill">مبادرة الثقافة العسكرية 🇯🇴</span>
|
|
</div>
|
|
</a>
|
|
|
|
<div style="display: flex; align-items: center; gap: 12px;">
|
|
<a href="/" style="font-size: 13px; color: var(--text-secondary); text-decoration: none; margin-left: 10px;">الرئيسية</a>
|
|
<a href="#demo_request_form" class="header-cta">طلب عرض تنفيذي للقيادة ←</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
<!-- Hero -->
|
|
<section class="exec-hero">
|
|
<div class="container">
|
|
<div class="flag-tag">
|
|
<span>🇯🇴 مبادرة استراتيجية لمدارس الجيش العربي والأجهزة الأمنية</span>
|
|
</div>
|
|
|
|
<h1 class="exec-title">
|
|
نحو تحقيق أعلى نسب تفوق وزاري لأبناء القوات المسلحة: <br>
|
|
<span class="exec-title-gold">نبيعكم الناتج والتمكين الأكاديمي</span> بأقل التكاليف التشغيلية
|
|
</h1>
|
|
|
|
<p class="exec-desc">
|
|
عرض تقني وتربوي متكامل موجه لقيادة ومديرية التربية والتعليم والثقافة العسكرية، لتوحيد جودة تدريس التوجيهي عبر كافة مدارس المملكة والبادية، وتوفير غرفة قيادة وسيطرة مركزية تقيس مستوى تحصيل كل مدرسة وطالب لحظياً.
|
|
</p>
|
|
|
|
<div class="exec-cta-box">
|
|
<div>
|
|
<strong style="font-size: 15px; color: #FFF; display: block;">عرض المنظومة والتجربة الميدانية المباشرة</strong>
|
|
<span style="font-size: 12.5px; color: var(--text-muted);">جاهزون لتقديم عرض تنفيذي حي (Live Demo) في مبنى المديرية في أي وقت تحددونه.</span>
|
|
</div>
|
|
<a href="#demo_request_form" class="exec-cta-btn">حجز موعد العرض التنفيذي 📅</a>
|
|
</div>
|
|
|
|
<!-- Value Matrix -->
|
|
<div class="value-matrix">
|
|
<div class="matrix-card">
|
|
<div class="matrix-num">100%</div>
|
|
<div class="matrix-title">عدالة تعليمية جغرافية</div>
|
|
<div class="matrix-desc">طالب مدرسة القويرة أو الصفاوي يتلقى نفس شرح وتدريب كبار معلمي العاصمة بدون عناء التنقل.</div>
|
|
</div>
|
|
|
|
<div class="matrix-card">
|
|
<div class="matrix-num">80%</div>
|
|
<div class="matrix-title">توفير في النفقات الإثرائية</div>
|
|
<div class="matrix-desc">إلغاء تكاليف المراكز، المطبوعات الورقية، وباصات التنقل عبر بنية سحابية موحدة وذكية.</div>
|
|
</div>
|
|
|
|
<div class="matrix-card">
|
|
<div class="matrix-num">0s</div>
|
|
<div class="matrix-title">تقارير لحظية للقيادة</div>
|
|
<div class="matrix-desc">غرفة عمليات مركزية لمدير التعليم والضباط لمتابعة نسب الإنجاز والمؤشر الوزاري لكل شعبة.</div>
|
|
</div>
|
|
|
|
<div class="matrix-card">
|
|
<div class="matrix-num">100%</div>
|
|
<div class="matrix-title">سيادة رقمية وأمان عالي</div>
|
|
<div class="matrix-desc">استضافة محلية آمنة، تشفير بيانات الطلاب، ومنع تام لتسريب أو قرصنة المحتوى الدراسي.</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Strategic Pillars -->
|
|
<section style="padding: 20px 0;">
|
|
<div class="container">
|
|
<div class="section-header">
|
|
<span class="section-tag">أركان المبادرة الاستراتيجية</span>
|
|
<h2 class="section-title">كيف تضمن منصة صَقِل تفوق طلبة الثقافة العسكرية؟</h2>
|
|
<p class="section-subtitle">
|
|
النموذج التقليدي يعتمد على المشاهدة السلبية. نحن نلزم الطالب بالاشتباك الذهني ونقيس استيعابه في كل ثانية.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="pillars-grid">
|
|
<!-- Pillar 1 -->
|
|
<div class="pillar-card gold-border">
|
|
<div class="pillar-icon">🎖️</div>
|
|
<h3 class="pillar-title">1. غرفة القيادة والسيطرة التعليمية المركزية (Command Dashboard)</h3>
|
|
<p class="pillar-desc">
|
|
لوحة تحكم تنفيذية مخصصة لمدير التعليم وضباط الإشراف التربوي بالمديرية لمتابعة الإنجاز اليومي:
|
|
</p>
|
|
<ul class="pillar-points">
|
|
<li>نسبة مشاهدة وإكمال الحصص لكل مدرسة على مستوى المحافظات.</li>
|
|
<li>كشف فوري للشعب والمدارس التي تواجه تعثراً في مواد محددة (كالفيزياء أو الرياضيات).</li>
|
|
<li>مؤشر الجاهزية للوزاري التراكمي (Tawjihi Readiness Index).</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<!-- Pillar 2 -->
|
|
<div class="pillar-card">
|
|
<div class="pillar-icon">⏱️</div>
|
|
<h3 class="pillar-title">2. مشغل الكويزات الصدمية (Socratic Checkpoints)</h3>
|
|
<p class="pillar-desc">
|
|
الحل الحاسم لمشكلة تشتت الطالب أو فتح الفيديو دون تركيز:
|
|
</p>
|
|
<ul class="pillar-points">
|
|
<li>يتوقف الفيديو إجبارياً عند الدقيقة المحددة (مثلاً 08:30) لسؤال الطالب حول المفهوم المشروح.</li>
|
|
<li>إذا أخطأ: يعيده المشغل تلقائياً 45 ثانية للخلف لإعادة التركيز وفهم المفهوم.</li>
|
|
<li>لا يُعتبر الدرس مكتملاً إلا بعد اجتياز كافة نقاط التوقف السقراطية.</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<!-- Pillar 3 -->
|
|
<div class="pillar-card">
|
|
<div class="pillar-icon">📲</div>
|
|
<h3 class="pillar-title">3. تقارير أولياء الأمور المؤتمتة عبر الواتساب</h3>
|
|
<p class="pillar-desc">
|
|
ربط مباشر مع أولياء الأمور من ضباط وضباط صف القوات المسلحة والأجهزة الأمنية:
|
|
</p>
|
|
<ul class="pillar-points">
|
|
<li>إشعار دوري على الواتساب بنتائج ابنه وساعات دراسته ومستوى تقدمه.</li>
|
|
<li>تنبيه استباقي فوري لولي الأمر في حال انخفاض مؤشر الجاهزية للوزاري.</li>
|
|
<li>تسهيل المتابعة الأسرية حتى أثناء فترات مناوبات الضباط في الميدان.</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<!-- Pillar 4 -->
|
|
<div class="pillar-card">
|
|
<div class="pillar-icon">🤖</div>
|
|
<h3 class="pillar-title">4. محرك الذكاء الاصطناعي لسد الثغرات المعرفية</h3>
|
|
<p class="pillar-desc">
|
|
تشخيص دقيق ومخصص لكل طالب بدلاً من التعليم الجماعي الموحد:
|
|
</p>
|
|
<ul class="pillar-points">
|
|
<li>تحديد نقاط الضعف الدقيقة لكل طالب بناءً على أخطائه في الامتحانات.</li>
|
|
<li>توليد امتحانات علاجية مخصصة لسد الثغرات تلقائياً قبل الامتحانات الوزارية.</li>
|
|
<li>تقارير تشخيصية توضح للمعلم أين تكمن المشكلة بالضبط.</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<!-- Pillar 5 -->
|
|
<div class="pillar-card">
|
|
<div class="pillar-icon">📡</div>
|
|
<h3 class="pillar-title">5. جاهزية العمل في البادية والمناطق النائية</h3>
|
|
<p class="pillar-desc">
|
|
بنية تحتية مصممة خصيصاً للتعامل مع تحديات سرعة الإنترنت:
|
|
</p>
|
|
<ul class="pillar-points">
|
|
<li>بث متكيف (Adaptive Bitrate Streaming) يعمل بسلاسة حتى على شبكات 3G/4G الضعيفة.</li>
|
|
<li>إمكانية تحميل المحاضرات مسبقاً بشكل مشفر داخل معامل الحاسوب المدرسية.</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<!-- Pillar 6 -->
|
|
<div class="pillar-card">
|
|
<div class="pillar-icon">🔒</div>
|
|
<h3 class="pillar-title">6. السيادة الرقمية والحماية الأمنية (Zero-Trust)</h3>
|
|
<p class="pillar-desc">
|
|
أعلى معايير الأمن السيبراني لحماية بيانات أبناء القوات المسلحة:
|
|
</p>
|
|
<ul class="pillar-points">
|
|
<li>تشفير كامل لقواعد البيانات والاتصالات السلكية واللاسلكية.</li>
|
|
<li>علامة مائية ديناميكية تمنع تصوير الشاشات أو تسريب المواد التعليمية.</li>
|
|
<li>استضافة محلية تخضع للسيادة الأردنية الكاملة.</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Phased Implementation Plan -->
|
|
<div class="roadmap-box">
|
|
<div style="text-align: center;">
|
|
<span class="section-tag">خطة التنفيذ والتشغيل المقترحة</span>
|
|
<h2 style="font-size: 26px; font-weight: 900; color: #FFF;">مراحل تفعيل المنظومة مع مديرية الثقافة العسكرية</h2>
|
|
</div>
|
|
|
|
<div class="roadmap-grid">
|
|
<div class="step-card">
|
|
<span class="step-badge">المرحلة الأولى (14 يوماً)</span>
|
|
<h4 class="step-title">الإطلاق التجريبي الاستطلاعي (Pilot Phase)</h4>
|
|
<p class="step-desc">
|
|
اختيار 5 مدارس نموذجية تابعة للمديرية (شمال، وسط، جنوب، وبادية) لتطبيق النظام على طلاب التوجيهي وربط المعلمين بالاستوديو.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="step-card">
|
|
<span class="step-badge">المرحلة الثانية (30 يوماً)</span>
|
|
<h4 class="step-title">قياس الأثر ومؤشر الجاهزية</h4>
|
|
<p class="step-desc">
|
|
استعراض تقارير غرفة العمليات المركزية، وقياس نسبة تحسن الطلاب في الامتحانات التجريبية، وتدريب المشرفين التربويين.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="step-card">
|
|
<span class="step-badge">المرحلة الثالثة</span>
|
|
<h4 class="step-title">التعميم الشامل والاعتماد المؤسسي</h4>
|
|
<p class="step-desc">
|
|
تعميم المنظومة رسمياً على كافة مدارس ومديريات الثقافة العسكرية في المملكة لتصبح المنصة الرقمية المعتمدة لأبناء الجيش العربي.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Executive Demo Request Form -->
|
|
<div id="demo_request_form" class="demo-section">
|
|
<div class="demo-grid">
|
|
<div>
|
|
<span class="section-tag">التواصل والتنسيق التنفيذي</span>
|
|
<h2 style="font-size: 28px; font-weight: 900; color: #FFF; margin-bottom: 12px;">طلب جلسة تقديم العرض التنفيذي للقيادة</h2>
|
|
<p style="font-size: 14px; color: var(--text-secondary); line-height: 1.7; margin-bottom: 20px;">
|
|
يسعدنا تقديم عرض عملي مباشر لكافة مزايا المنظومة أمام عطوفة المدير وضباط التعليم، مع تقديم تقرير الجدوى الاقتصادية والأثر التربوي.
|
|
</p>
|
|
|
|
<div style="background: rgba(7, 16, 30, 0.8); border: 1px solid var(--border); border-radius: 14px; padding: 18px; margin-bottom: 16px;">
|
|
<span style="font-size: 12px; color: var(--text-muted); display: block;">مسؤول التنسيق والتنفيذ المباشر:</span>
|
|
<strong style="font-size: 16px; color: var(--accent-gold); display: block; margin-top: 2px;">الأستاذ حمزة النجار</strong>
|
|
<span style="font-size: 13px; color: var(--text-secondary);">المؤسس والمعماري التقني لمنظومة صَقِل التعليمية</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div>
|
|
<form onsubmit="event.preventDefault(); alert('تم استلام طلبكم بنجاح! سيتم التواصل معكم فوراً لترتيب موعد العرض التنفيذي.');">
|
|
<div class="form-group">
|
|
<label class="form-label">الرتبة والاسم الكامل للمسؤول / الضابط المنسق</label>
|
|
<input type="text" placeholder="مثال: الرائد محمد ..." class="input-text" required>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label class="form-label">الجهة أو المدرسة التابعة للمديرية</label>
|
|
<input type="text" placeholder="مثال: قسم الإشراف التربوي / مدرسة ..." class="input-text" required>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label class="form-label">رقم الهاتف / الواتساب للتنسيق المباشر</label>
|
|
<input type="tel" placeholder="0790000000" class="input-text" required>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label class="form-label">الموعد أو اليوم المقترح للعرض التوضيحي</label>
|
|
<input type="text" placeholder="مثال: الثلاثاء القادم الساعة 10:00 صباحاً" class="input-text">
|
|
</div>
|
|
|
|
<button type="submit" class="exec-cta-btn" style="width: 100%; padding: 14px; border: none; cursor: pointer; font-size: 15px;">
|
|
تأكيد طلب موعد العرض التنفيذي 🇯🇴
|
|
</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Footer -->
|
|
<footer>
|
|
<div class="container">
|
|
<div class="footer-content">
|
|
<span>مبادرة التمكين الأكاديمي لمدارس مديرية التربية والتعليم والثقافة العسكرية — منصة صَقِل © 2026</span>
|
|
<div style="display: flex; gap: 18px;">
|
|
<a href="/" style="color: var(--text-muted); text-decoration: none;">الرئيسية</a>
|
|
<a href="/student" style="color: var(--text-muted); text-decoration: none;">بوابة الطالب</a>
|
|
<a href="/teacher" style="color: var(--text-muted); text-decoration: none;">استوديو المعلمين</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
|
|
</body>
|
|
</html>
|
|
HTML;
|
|
}
|
|
}
|