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:3/4;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 @@
|
||||
<!-- prog-slider-css -->
|
||||
<style>
|
||||
.prog-slider{position:relative;width:100%;height:100%;overflow:hidden;border-radius:inherit;}
|
||||
.prog-slider img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 18%;opacity:0;transform:scale(1);transition:opacity 1s cubic-bezier(.4,0,.2,1);}
|
||||
.prog-slider img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;transform:scale(1);transition:opacity 1s cubic-bezier(.4,0,.2,1);}
|
||||
.prog-slider img.active{opacity:1;z-index:1;}
|
||||
.prog-slider img.kb{animation:progKenBurns 5.5s ease-out forwards;}
|
||||
@keyframes progKenBurns{from{transform:scale(1);}to{transform:scale(1.08);}}
|
||||
@@ -466,18 +466,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>
|
||||
@@ -485,7 +485,7 @@
|
||||
|
||||
<div class="breadcrumb">
|
||||
<div class="container">
|
||||
<a href="homepage-prototype.html">الرئيسية</a><span class="sep">/</span><a href="homepage-prototype.html#programs">البرامج</a><span class="sep">/</span><span class="current">ذوي الهمم</span>
|
||||
<a href="index.html">الرئيسية</a><span class="sep">/</span><a href="index.html#programs">البرامج</a><span class="sep">/</span><span class="current">ذوي الهمم</span>
|
||||
</div>
|
||||
</div>
|
||||
<section class="program-banner">
|
||||
@@ -497,7 +497,7 @@
|
||||
<h1>برنامج ذوي الهمم</h1>
|
||||
<p class="lead">برنامج رياضي متكامل يجمع الكيك بوكسينغ والكاراتيه والمواي تاي والتايكوندو، مصمَّم خصيصًا لأصحاب الهمم بإشراف مدرب متخصص وبيئة صبورة ومحفِّزة.</p>
|
||||
</div>
|
||||
<div class="banner-visual" style="background:url(images/special-needs-1.jpg); background-size:cover; background-position:center;"></div>
|
||||
<div class="banner-visual" style="background:url(images/special-needs/1.jpg) center/contain no-repeat, radial-gradient(circle at 40% 35%, rgba(184,146,62,.22), transparent 65%), var(--navy-deep);"></div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
@@ -519,7 +519,7 @@
|
||||
<div class="audience-pill"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M20 6L9 17l-5-5"/></svg> بيئة داعمة وخالية من الضغط</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="desc-visual reveal" style="background:url(images/special-needs-2.jpg); background-size:cover; background-position:center;"></div>
|
||||
<div class="desc-visual reveal"><div class="prog-slider"><img src="images/special-needs/1.jpg" alt="" class="active kb"><img src="images/special-needs/2.jpg" alt="" class=""><img src="images/special-needs/3.jpg" alt="" class=""><img src="images/special-needs/4.jpeg" alt="" class=""><img src="images/special-needs/5.jpeg" alt="" class=""><img src="images/special-needs/6.jpeg" alt="" class=""><button type="button" class="prog-nav prev" onclick="progSlide(-1)" aria-label="السابق"><svg viewBox="0 0 24 24" width="18" height="18" fill="none" stroke="#221C33" stroke-width="2.4"><path d="M9 6l6 6-6 6"/></svg></button><button type="button" class="prog-nav next" onclick="progSlide(1)" aria-label="التالي"><svg viewBox="0 0 24 24" width="18" height="18" fill="none" stroke="#221C33" stroke-width="2.4"><path d="M15 6l-6 6 6 6"/></svg></button><div class="prog-dots"><button type="button" class="prog-dot active" onclick="progSlideTo(0)" aria-label="صورة 1"></button><button type="button" class="prog-dot" onclick="progSlideTo(1)" aria-label="صورة 2"></button><button type="button" class="prog-dot" onclick="progSlideTo(2)" aria-label="صورة 3"></button><button type="button" class="prog-dot" onclick="progSlideTo(3)" aria-label="صورة 4"></button><button type="button" class="prog-dot" onclick="progSlideTo(4)" aria-label="صورة 5"></button><button type="button" class="prog-dot" onclick="progSlideTo(5)" aria-label="صورة 6"></button></div></div></div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
@@ -568,9 +568,9 @@
|
||||
<div class="eyebrow">المدرب المسؤول</div>
|
||||
<h2 class="section-title">بإشراف مدرب متخصص</h2>
|
||||
<div class="coach-card reveal">
|
||||
<div class="coach-avatar">أ.ح</div>
|
||||
<img class="coach-avatar" src="images/coaches/special-needs.jpg" alt="الكابتن أحمد حبيب" style="object-fit:cover;">
|
||||
<div>
|
||||
<h4>الكابتن أحمد محمود حبيب</h4>
|
||||
<h4>الكابتن أحمد حبيب</h4>
|
||||
<div class="role">مدرب معتمد دوليًا بدرجة ماستر — لياقة بدنية ودفاع عن النفس</div>
|
||||
<p>خبرة تزيد عن 10 سنوات في تدريب اللياقة البدنية والدفاع عن النفس للأطفال والبالغين، عضو النقابة العامة للمهن الرياضية، وقدّم خدماته لآلاف المتدربين. يشغل حاليًا منصب الرئيس التنفيذي لأكاديمية الكاف الرياضية.</p>
|
||||
<a href="page-coaches.html#coach-special-needs" class="program-link" style="margin-top:14px;display:inline-flex;">عرض الملف الكامل <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 5l-7 7 7 7"/></svg></a>
|
||||
@@ -606,6 +606,11 @@
|
||||
<div class="final-cta reveal">
|
||||
<h2>جاهز يبدأ طفلك رحلته؟</h2>
|
||||
<p>عبّي النموذج التالي وسيتواصل معك فريقنا لمناقشة حالة طفلك وتأكيد حصة ذوي الهمم التجريبية.</p>
|
||||
<div style="display:inline-grid;gap:6px;background:var(--surface);border-radius:14px;padding:16px 22px;margin-top:20px;">
|
||||
<div style="display:flex;justify-content:space-between;gap:26px;font-size:13.5px;color:var(--gray);"><span>نشاط واحد (12 حصة)</span><strong style="color:var(--navy);font-family:'Poppins';font-size:16px;">1999 ريال</strong></div>
|
||||
<div style="display:flex;justify-content:space-between;gap:26px;font-size:13.5px;color:var(--gray);"><span>نشاطين</span><strong style="color:var(--navy);font-family:'Poppins';font-size:16px;">3499 ريال</strong></div>
|
||||
</div>
|
||||
<p style="font-size:12.5px;color:rgba(255,255,255,.6);margin-top:8px;">+ المشاركة في بطولات المملكة ضمن البرنامج.</p>
|
||||
</div>
|
||||
<div class="reveal" style="max-width:640px;margin:36px auto 0;background:#fff;border-radius:var(--radius);padding:36px 32px;box-shadow:0 20px 50px -30px rgba(11,36,71,.35);">
|
||||
<form id="trialForm" onsubmit="return sendTrialRequest(event)">
|
||||
@@ -629,9 +634,13 @@
|
||||
<select id="tf-sport" style="width:100%;padding:12px 14px;border:1px solid rgba(11,36,71,.15);border-radius:10px;font-family:'Cairo',sans-serif;font-size:14px;background:#fff;">
|
||||
<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="ذوي الهمم" selected>ذوي الهمم</option>
|
||||
</select>
|
||||
@@ -659,7 +668,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