finall update Sq
This commit is contained in:
@@ -16,8 +16,8 @@
|
||||
<link href="https://fonts.googleapis.com/css2?family=Cairo:wght@400;600;700;800;900&family=Poppins:wght@400;600;700;800&display=swap" rel="stylesheet">
|
||||
<style>
|
||||
:root{
|
||||
--navy:#342B4A; /* deep purple — sampled from logo */
|
||||
--navy-deep:#1C1730; /* deepest purple/black — from logo shadow tones */
|
||||
--navy:#18253A; /* navy blue — sampled from the new logo */
|
||||
--navy-deep:#071A38; /* deepest navy — from the new logo shield fill */
|
||||
--orange:#B8923E; /* refined antique gold — brightened from logo for UI legibility */
|
||||
--gold:#8F703A; /* raw brand gold — exact logo sample */
|
||||
--gold-light:#E8D6A8; /* light gold tint for subtle fills */
|
||||
@@ -70,20 +70,20 @@
|
||||
/* ===== HEADER ===== */
|
||||
header{
|
||||
position:sticky;top:0;z-index:50;
|
||||
background:rgba(247,249,252,.85);backdrop-filter:blur(10px);
|
||||
border-bottom:1px solid rgba(11,36,71,.08);
|
||||
background:rgba(24,37,58,.82);backdrop-filter:blur(10px);
|
||||
border-bottom:1px solid rgba(255,255,255,.08);
|
||||
}
|
||||
.nav-wrap{display:flex;align-items:center;justify-content:space-between;height:78px;}
|
||||
.logo{display:flex;align-items:center;gap:10px;font-weight:900;font-size:19px;color:var(--navy);}
|
||||
.logo{display:flex;align-items:center;gap:10px;font-weight:900;font-size:19px;color:#fff;}
|
||||
.logo-badge{
|
||||
width:46px;height:46px;border-radius:10px;
|
||||
background:var(--black);
|
||||
width:60px;height:60px;border-radius:12px;
|
||||
background:transparent;
|
||||
display:flex;align-items:center;justify-content:center;overflow:hidden;
|
||||
flex-shrink:0;
|
||||
}
|
||||
.logo-badge img{width:100%;height:100%;object-fit:contain;padding:2px;}
|
||||
nav ul{display:flex;gap:34px;font-weight:600;font-size:15px;}
|
||||
nav a{position:relative;color:var(--text);transition:color .2s;}
|
||||
nav a{position:relative;color:#fff;transition:color .2s;}
|
||||
nav a:hover{color:var(--orange);}
|
||||
.header-cta{display:flex;align-items:center;gap:14px;}
|
||||
.burger{display:none;}
|
||||
@@ -94,7 +94,7 @@
|
||||
background:
|
||||
radial-gradient(1100px 500px at 85% -10%, rgba(255,107,53,.35), transparent 60%),
|
||||
radial-gradient(900px 500px at -10% 110%, rgba(255,193,69,.22), transparent 60%),
|
||||
linear-gradient(155deg, var(--navy-deep) 0%, var(--navy) 55%, #4A3D66 100%);
|
||||
linear-gradient(155deg, var(--navy-deep) 0%, var(--navy) 55%, #2E4468 100%);
|
||||
padding:96px 0 110px;
|
||||
}
|
||||
.hero::after{
|
||||
@@ -168,7 +168,7 @@
|
||||
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center;}
|
||||
.about-visual{
|
||||
aspect-ratio:1/1;border-radius:28px;
|
||||
background:linear-gradient(160deg,var(--navy) 0%, #4A3D66 100%);
|
||||
background:linear-gradient(160deg,var(--navy) 0%, #2E4468 100%);
|
||||
position:relative;overflow:hidden;
|
||||
display:flex;align-items:center;justify-content:center;
|
||||
}
|
||||
@@ -353,7 +353,7 @@
|
||||
.desc-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:60px;align-items:center;}
|
||||
.desc-visual{
|
||||
aspect-ratio:4/3;border-radius:24px;
|
||||
background:linear-gradient(150deg, var(--navy) 0%, #4A3D66 100%);
|
||||
background:linear-gradient(150deg, var(--navy) 0%, #2E4468 100%);
|
||||
display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;
|
||||
}
|
||||
.desc-visual svg{width:34%;height:34%;color:rgba(255,255,255,.4);}
|
||||
@@ -402,7 +402,7 @@
|
||||
}
|
||||
.coach-avatar{
|
||||
width:100px;height:100px;border-radius:20px;flex-shrink:0;
|
||||
background:linear-gradient(150deg,var(--navy),#4A3D66);
|
||||
background:linear-gradient(150deg,var(--navy),#2E4468);
|
||||
display:flex;align-items:center;justify-content:center;color:var(--orange);font-family:'Poppins';font-weight:800;font-size:26px;
|
||||
}
|
||||
.coach-card h4{font-size:19px;margin-bottom:4px;color:var(--navy);}
|
||||
@@ -446,7 +446,7 @@
|
||||
.story-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;}
|
||||
.story-visual{
|
||||
aspect-ratio:1/1;border-radius:28px;position:relative;overflow:hidden;
|
||||
background:linear-gradient(160deg,var(--navy) 0%, #4A3D66 100%);
|
||||
background:linear-gradient(160deg,var(--navy) 0%, #2E4468 100%);
|
||||
display:flex;align-items:center;justify-content:center;
|
||||
}
|
||||
.story-visual img{width:56%;height:56%;object-fit:contain;filter:drop-shadow(0 20px 30px rgba(0,0,0,.4));}
|
||||
@@ -476,7 +476,7 @@
|
||||
.team-card{background:#fff;border-radius:var(--radius);padding:24px 18px;text-align:center;border:1px solid rgba(11,36,71,.07);}
|
||||
.team-avatar{
|
||||
width:76px;height:76px;border-radius:50%;margin:0 auto 16px;
|
||||
background:linear-gradient(150deg,var(--navy),#4A3D66);
|
||||
background:linear-gradient(150deg,var(--navy),#2E4468);
|
||||
display:flex;align-items:center;justify-content:center;color:var(--orange);font-family:'Poppins';font-weight:800;font-size:20px;
|
||||
}
|
||||
.team-card h5{font-size:14.5px;margin-bottom:4px;color:var(--navy);}
|
||||
@@ -537,18 +537,18 @@
|
||||
|
||||
<header>
|
||||
<div class="container nav-wrap">
|
||||
<a href="homepage-prototype.html" class="logo"><span class="logo-badge"><img src="caf-logo.png" alt="شعار أكاديمية الكاف"></span> أكاديمية الكاف</a>
|
||||
<a href="index.html" class="logo"><span class="logo-badge"><img src="caf-logo.png" alt="شعار أكاديمية الكاف"></span> أكاديمية الكاف الرياضية</a>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="homepage-prototype.html#programs">البرامج</a></li>
|
||||
<li><a href="index.html#programs">البرامج</a></li>
|
||||
<li><a href="page-about.html">من نحن</a></li>
|
||||
<li><a href="homepage-prototype.html#stats">إنجازاتنا</a></li>
|
||||
<li><a href="homepage-prototype.html#testimonials">آراء الأهالي</a></li>
|
||||
<li><a href="index.html#stats">إنجازاتنا</a></li>
|
||||
<li><a href="index.html#testimonials">آراء الأهالي</a></li>
|
||||
<li><a href="#contact">تواصل</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
<div class="header-cta">
|
||||
<a href="#contact" class="btn btn-outline" style="color:var(--navy);border-color:rgba(11,36,71,.3);">اتصل بنا</a>
|
||||
<a href="#contact" class="btn btn-outline">اتصل بنا</a>
|
||||
<a href="#trial" class="btn btn-primary">حجز حصة تجريبية</a>
|
||||
</div>
|
||||
</div>
|
||||
@@ -556,7 +556,7 @@
|
||||
|
||||
<div class="breadcrumb">
|
||||
<div class="container">
|
||||
<a href="homepage-prototype.html">الرئيسية</a><span class="sep">/</span><span class="current">من نحن</span>
|
||||
<a href="index.html">الرئيسية</a><span class="sep">/</span><span class="current">من نحن</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -568,15 +568,21 @@
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section style="padding:40px 0 0;">
|
||||
<div class="container">
|
||||
<img src="images/about-banner.jpg" alt="أكاديمية الكاف الرياضية" style="width:100%;border-radius:24px;box-shadow:0 30px 60px -30px rgba(11,36,71,.4);" loading="lazy">
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="story">
|
||||
<div class="container story-grid">
|
||||
<div class="reveal">
|
||||
<div class="eyebrow">قصتنا</div>
|
||||
<h2 class="section-title">لماذا أسّسنا أكاديمية الكاف</h2>
|
||||
<p style="color:var(--gray);font-size:15.5px;margin-bottom:16px;">انطلقت أكاديمية الكاف الرياضية من حي القدس بالرياض بفكرة بسيطة: أن كل طفل يستحق بيئة رياضية آمنة ومحترفة تساعده على اكتشاف شغفه، سواء كان في الملعب أو حمام السباحة أو حلبة التدريب.</p>
|
||||
<p style="color:var(--gray);font-size:15.5px;">اليوم نقدّم سبعة برامج رياضية مختلفة تحت سقف واحد، بإشراف مدربين متخصصين لكل رياضة على حدة، وبمتابعة مستمرة تطمئن كل ولي أمر على تقدّم طفله خطوة بخطوة.</p>
|
||||
<p style="color:var(--gray);font-size:15.5px;">اليوم نقدّم أحد عشر برنامجًا رياضيًا مختلفًا تحت سقف واحد، بإشراف مدربين متخصصين لكل رياضة على حدة، وبمتابعة مستمرة تطمئن كل ولي أمر على تقدّم طفله خطوة بخطوة.</p>
|
||||
</div>
|
||||
<div class="story-visual reveal" style="background:linear-gradient(165deg, rgba(28,23,48,.55) 0%, rgba(52,43,74,.35) 100%), url(images/karate-1.jpg); background-size:cover; background-position:center;">
|
||||
<div class="story-visual reveal" style="background:linear-gradient(165deg, rgba(28,23,48,.55) 0%, rgba(52,43,74,.35) 100%), url(images/karate/1.jpeg); background-size:cover; background-position:center;">
|
||||
<img src="caf-logo.png" alt="شعار أكاديمية الكاف الرياضية" style="width:34%;height:34%;filter:drop-shadow(0 10px 20px rgba(0,0,0,.5));">
|
||||
</div>
|
||||
</div>
|
||||
@@ -588,7 +594,7 @@
|
||||
<h2 class="section-title">من الملعب إلى قيادة أكاديمية الكاف</h2>
|
||||
<div class="coach-avatar" style="width:84px;height:84px;font-size:22px;margin:8px auto 22px;">أ.ح</div>
|
||||
<p style="color:var(--text);font-size:17px;line-height:1.9;font-style:italic;margin-bottom:22px;">"بدأت رحلتي في الملاعب الرياضية، وبعد أكثر من 10 سنوات في تدريب اللياقة البدنية والدفاع عن النفس لآلاف المتدربين، آمنت أن كل طفل يستحق بيئة رياضية آمنة ومحترفة تكتشف شغفه وتبني ثقته بنفسه. من هذا الإيمان انطلقت أكاديمية الكاف — وهدفنا واضح دايمًا: نصنع أبطال الغد، بخطوة اليوم."</p>
|
||||
<div style="font-weight:800;color:var(--navy);font-size:15.5px;">الكابتن أحمد محمود حبيب</div>
|
||||
<div style="font-weight:800;color:var(--navy);font-size:15.5px;">الكابتن أحمد حبيب</div>
|
||||
<div style="font-size:13px;color:var(--orange);font-weight:700;margin-top:2px;">الرئيس التنفيذي — أكاديمية الكاف الرياضية</div>
|
||||
</div>
|
||||
</section>
|
||||
@@ -635,7 +641,7 @@
|
||||
<div class="value-card reveal">
|
||||
<div class="value-badge"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M17 20v-1a4 4 0 00-4-4H7a4 4 0 00-4 4v1M14 6a3 3 0 11-6 0 3 3 0 016 0z"/></svg></div>
|
||||
<h4>الشمولية</h4>
|
||||
<p>سبعة برامج رياضية مختلفة لتناسب شخصية وميول كل طفل.</p>
|
||||
<p>أحد عشر برنامجًا رياضيًا مختلفًا لتناسب شخصية وميول كل طفل.</p>
|
||||
</div>
|
||||
<div class="value-card reveal">
|
||||
<div class="value-badge"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M12 2l2.6 6.4L21 9l-5 4.4L17.4 21 12 17.3 6.6 21 8 13.4 3 9l6.4-.6z"/></svg></div>
|
||||
@@ -652,11 +658,11 @@
|
||||
<h2 class="section-title">مدربون متخصصون لكل رياضة</h2>
|
||||
<p class="section-lead">نموذج توضيحي لبيانات المدربين — يُستبدل بصور ومؤهلات المدربين الفعليين بعد توفيرها من الأكاديمية.</p>
|
||||
<div class="team-grid">
|
||||
<a href="page-coaches.html#coach-football" class="team-card reveal"><div class="team-avatar">ع.ف</div><h5>عمر الفارس</h5><div class="role">مدرب كرة القدم</div></a>
|
||||
<a href="page-coaches.html#coach-swimming" class="team-card reveal"><div class="team-avatar">س.ح</div><h5>سارة الحربي</h5><div class="role">مدربة السباحة</div></a>
|
||||
<a href="page-coaches.html#coach-karate" class="team-card reveal"><div class="team-avatar">م.خ</div><h5>محمد الخالدي</h5><div class="role">مدرب الكاراتيه والتايكوندو</div></a>
|
||||
<a href="page-coaches.html#coach-gymnastics" class="team-card reveal"><div class="team-avatar">ن.ق</div><h5>نورة القحطاني</h5><div class="role">مدربة الجمباز</div></a>
|
||||
<a href="page-coaches.html#coach-kickboxing" class="team-card reveal"><div class="team-avatar">ب.ع</div><h5>بندر العتيبي</h5><div class="role">مدرب الكيك بوكسينغ</div></a>
|
||||
<a href="page-coaches.html#coach-football" class="team-card reveal"><img class="team-avatar" src="images/coaches/football.jpg" alt="مروان محمد" style="object-fit:cover;"><h5>مروان محمد</h5><div class="role">مدرب كرة القدم</div></a>
|
||||
<a href="page-coaches.html#coach-swimming" class="team-card reveal"><img class="team-avatar" src="images/coaches/swimming.jpg" alt="عبدالرحمن محمد" style="object-fit:cover;"><h5>عبدالرحمن محمد</h5><div class="role">مدرب السباحة</div></a>
|
||||
<a href="page-coaches.html#coach-karate" class="team-card reveal"><img class="team-avatar" src="images/coaches/karate.jpg" alt="أمنية حمامي" style="object-fit:cover;"><h5>أمنية حمامي</h5><div class="role">مدربة الكاراتيه والتايكوندو</div></a>
|
||||
<a href="page-coaches.html#coach-gymnastics" class="team-card reveal"><img class="team-avatar" src="images/coaches/gymnastics.jpg" alt="أمنية حمامي" style="object-fit:cover;"><h5>أمنية حمامي</h5><div class="role">مدربة الجمباز</div></a>
|
||||
<a href="page-coaches.html#coach-kickboxing" class="team-card reveal"><img class="team-avatar" src="images/coaches/kickboxing.jpg" alt="أحمد حبيب" style="object-fit:cover;"><h5>الكابتن أحمد حبيب</h5><div class="role">مدرب الكيك بوكسينغ</div></a>
|
||||
</div>
|
||||
<div style="text-align:center;margin-top:32px;">
|
||||
<a href="page-coaches.html" class="btn btn-navy">عرض الملف الكامل لكل مدرب ←</a>
|
||||
@@ -710,9 +716,13 @@
|
||||
<option value="" selected disabled>اختر الرياضة</option>
|
||||
<option value="كرة القدم">كرة القدم</option>
|
||||
<option value="السباحة">السباحة</option>
|
||||
<option value="الكاراتيه / التايكوندو">الكاراتيه / التايكوندو</option>
|
||||
<option value="الكاراتيه">الكاراتيه</option>
|
||||
<option value="التايكوندو">التايكوندو</option>
|
||||
<option value="الجمباز">الجمباز</option>
|
||||
<option value="الكيك بوكسينغ">الكيك بوكسينغ</option>
|
||||
<option value="المواي تاي">المواي تاي</option>
|
||||
<option value="كرة السلة">كرة السلة</option>
|
||||
<option value="تدريب شخصي">تدريب شخصي</option>
|
||||
<option value="باقة متعددة الأنشطة">باقة متعددة الأنشطة</option>
|
||||
<option value="ذوي الهمم">ذوي الهمم</option>
|
||||
</select>
|
||||
@@ -740,7 +750,7 @@
|
||||
<div class="footer-col">
|
||||
<h5>روابط سريعة</h5>
|
||||
<ul>
|
||||
<li><a href="homepage-prototype.html#programs">البرامج التدريبية</a></li>
|
||||
<li><a href="index.html#programs">البرامج التدريبية</a></li>
|
||||
<li><a href="page-about.html">من نحن</a></li>
|
||||
<li><a href="page-pricing.html">الباقات والأسعار</a></li>
|
||||
<li><a href="page-blog.html">المدونة</a></li>
|
||||
|
||||
Reference in New Issue
Block a user