Files
caf-academy/page-coaches.html
2026-08-19 13:34:01 +03:00

740 lines
46 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!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>
<meta name="description" content="تعرّف على فريق مدربي أكاديمية الكاف الرياضية بالرياض — مدرب معتمد متخصص لكل رياضة على حدة.">
<link rel="icon" type="image/png" href="caf-logo.png">
<meta property="og:type" content="website">
<meta property="og:locale" content="ar_SA">
<meta property="og:title" content="فريق المدربين — أكاديمية الكاف الرياضية">
<meta property="og:description" content="تعرّف على فريق مدربي أكاديمية الكاف الرياضية بالرياض — مدرب معتمد متخصص لكل رياضة على حدة.">
<meta property="og:image" content="caf-logo.png">
<link rel="preconnect" href="https://fonts.googleapis.com">
<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:#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 */
--bg:#F7F5F1; /* warm off-white, echoes the gold warmth */
--surface:#EFEBE3;
--text:#221C33;
--gray:#6E6579;
--green:#B8923E; /* CTA color now uses brand gold, not an invented green */
--white:#FFFFFF;
--black:#0A0A0C;
--radius:18px;
}
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
font-family:'Cairo',sans-serif;
background:var(--bg);
color:var(--text);
line-height:1.7;
overflow-x:hidden;
}
.num{font-family:'Poppins',sans-serif;}
a{text-decoration:none;color:inherit;}
ul{list-style:none;}
img,svg{display:block;max-width:100%;}
.container{max-width:1180px;margin:0 auto;padding:0 24px;}
.eyebrow{
display:inline-flex;align-items:center;gap:8px;
font-family:'Poppins',sans-serif;font-size:12px;font-weight:700;
letter-spacing:.12em;text-transform:uppercase;color:var(--orange);
margin-bottom:14px;
}
.eyebrow::before{content:"";width:22px;height:2px;background:var(--orange);display:inline-block;}
h1,h2,h3{font-family:'Cairo',sans-serif;font-weight:800;color:var(--navy);}
.section-title{font-size:clamp(26px,3.4vw,38px);margin-bottom:14px;}
.section-lead{color:var(--gray);font-size:16px;max-width:620px;margin-bottom:44px;}
.btn{
display:inline-flex;align-items:center;gap:10px;
font-family:'Cairo',sans-serif;font-weight:700;font-size:15px;
padding:15px 30px;border-radius:100px;border:none;cursor:pointer;
transition:transform .25s ease, box-shadow .25s ease;
}
.btn:hover{transform:translateY(-2px);}
.btn-primary{background:var(--green);color:#fff;box-shadow:0 10px 24px -8px rgba(46,204,113,.55);}
.btn-primary:hover{box-shadow:0 14px 30px -8px rgba(46,204,113,.7);}
.btn-outline{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.55);}
.btn-outline:hover{background:rgba(255,255,255,.12);}
.btn-navy{background:var(--navy);color:#fff;}
/* ===== HEADER ===== */
header{
position:sticky;top:0;z-index:50;
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:#fff;}
.logo-badge{
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:#fff;transition:color .2s;}
nav a:hover{color:var(--orange);}
.header-cta{display:flex;align-items:center;gap:14px;}
.burger{display:none;}
/* ===== HERO ===== */
.hero{
position:relative;color:#fff;overflow:hidden;
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%, #2E4468 100%);
padding:96px 0 110px;
}
.hero::after{
content:"";position:absolute;inset:0;opacity:.10;
background-image:
repeating-linear-gradient(45deg, #fff 0 2px, transparent 2px 34px);
pointer-events:none;
}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:center;position:relative;}
.hero-eyebrow{
display:inline-flex;align-items:center;gap:8px;
background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);
padding:8px 16px;border-radius:100px;font-size:13px;font-weight:700;margin-bottom:22px;
}
.hero-eyebrow span.dot{width:7px;height:7px;border-radius:50%;background:var(--green);display:inline-block;}
.hero h1{
font-size:clamp(34px,4.6vw,56px);color:#fff;line-height:1.28;font-weight:900;margin-bottom:20px;
}
.hero h1 em{font-style:normal;color:var(--gold);}
.hero p.lead{font-size:18px;color:rgba(255,255,255,.78);max-width:520px;margin-bottom:34px;}
.hero-actions{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:44px;}
.hero-meta{display:flex;gap:30px;flex-wrap:wrap;}
.hero-meta div{display:flex;flex-direction:column;gap:2px;}
.hero-meta .n{font-family:'Poppins';font-weight:800;font-size:26px;color:var(--gold);}
.hero-meta .l{font-size:12.5px;color:rgba(255,255,255,.65);}
/* Hero visual: signature element = the real crest, glowing, with a couple of orbiting sport marks */
.hero-visual{position:relative;height:420px;display:flex;align-items:center;justify-content:center;}
.crest-glow{
position:absolute;width:360px;height:360px;border-radius:50%;
background:radial-gradient(circle, rgba(184,146,62,.30), transparent 68%);
filter:blur(4px);
}
.crest-main{
position:relative;width:300px;height:300px;object-fit:contain;
filter:drop-shadow(0 30px 50px rgba(0,0,0,.55));
animation:crestFloat 7s ease-in-out infinite;
}
@keyframes crestFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
@media (prefers-reduced-motion: reduce){.crest-main{animation:none;}}
.badge-orbit{position:absolute;inset:0;}
.sport-badge{
position:absolute;width:96px;height:96px;border-radius:26px;
background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);
backdrop-filter:blur(6px);
display:flex;align-items:center;justify-content:center;
box-shadow:0 20px 40px -18px rgba(0,0,0,.5);
animation:float 6s ease-in-out infinite;
}
.sport-badge svg{width:44px;height:44px;}
.sport-badge.b1{top:6%;right:8%;animation-delay:0s;background:rgba(255,107,53,.18);border-color:rgba(255,107,53,.4);}
.sport-badge.b2{top:34%;right:46%;animation-delay:.6s;background:rgba(255,193,69,.18);border-color:rgba(255,193,69,.4);width:120px;height:120px;}
.sport-badge.b2 svg{width:56px;height:56px;}
.sport-badge.b3{top:2%;right:52%;animation-delay:1.1s;}
.sport-badge.b4{bottom:12%;right:4%;animation-delay:1.6s;}
.sport-badge.b5{bottom:2%;right:38%;animation-delay:2.1s;}
.sport-badge.b6{top:52%;right:2%;animation-delay:2.6s;}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
@media (prefers-reduced-motion: reduce){.sport-badge{animation:none;}}
/* ===== TRUST BAR ===== */
.trust{background:var(--navy);padding:22px 0;}
.trust .container{display:flex;justify-content:space-between;flex-wrap:wrap;gap:18px;color:rgba(255,255,255,.85);}
.trust-item{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:600;}
.trust-item svg{width:20px;height:20px;color:var(--gold);flex-shrink:0;}
section{padding:96px 0;}
.alt{background:var(--surface);}
/* ===== ABOUT ===== */
.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%, #2E4468 100%);
position:relative;overflow:hidden;
display:flex;align-items:center;justify-content:center;
}
.about-visual .quote{color:#fff;text-align:center;padding:40px;font-weight:800;font-size:24px;position:relative;z-index:2;}
.about-visual::before{
content:"";position:absolute;width:340px;height:340px;border-radius:50%;
border:1px dashed rgba(255,255,255,.25);top:50%;left:50%;transform:translate(-50%,-50%);
}
.about-visual::after{
content:"";position:absolute;width:240px;height:240px;border-radius:50%;
background:radial-gradient(circle, rgba(255,193,69,.35), transparent 70%);
top:20%;right:-40px;
}
.about-list{margin-top:26px;display:grid;gap:14px;}
.about-list li{display:flex;gap:12px;align-items:flex-start;font-size:15px;color:var(--text);}
.about-list svg{width:22px;height:22px;color:var(--green);flex-shrink:0;margin-top:2px;}
/* ===== PROGRAMS ===== */
.programs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;}
.program-card{
background:#fff;border-radius:var(--radius);padding:30px 26px;
border:1px solid rgba(11,36,71,.07);
transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease;
cursor:pointer;position:relative;overflow:hidden;
}
.program-card::before{
content:"";position:absolute;top:0;right:0;width:100%;height:4px;
background:var(--accent,var(--orange));
}
.program-card:hover{transform:translateY(-6px);box-shadow:0 22px 40px -22px rgba(11,36,71,.35);border-color:transparent;}
.program-icon{
width:58px;height:58px;border-radius:16px;margin-bottom:18px;
display:flex;align-items:center;justify-content:center;
background:color-mix(in srgb, var(--accent,var(--orange)) 14%, white);
}
.program-icon svg{width:30px;height:30px;color:var(--accent,var(--orange));}
.program-card h3{font-size:19px;margin-bottom:8px;}
.program-card p{font-size:14px;color:var(--gray);margin-bottom:16px;}
.program-tags{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px;}
.tag{font-size:11.5px;font-weight:700;background:var(--surface);color:var(--navy);padding:5px 10px;border-radius:100px;}
.program-link{font-size:13.5px;font-weight:700;color:var(--navy);display:inline-flex;align-items:center;gap:6px;}
.program-link svg{width:15px;height:15px;transition:transform .2s;}
.program-card:hover .program-link svg{transform:translateX(-4px);}
/* ===== WHY US ===== */
.why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:36px 30px;}
.why-item{display:flex;gap:16px;}
.why-icon{
width:52px;height:52px;border-radius:14px;flex-shrink:0;
background:var(--navy);display:flex;align-items:center;justify-content:center;
}
.why-icon svg{width:26px;height:26px;color:var(--gold);}
.why-item h4{font-size:16.5px;margin-bottom:6px;color:var(--navy);}
.why-item p{font-size:13.8px;color:var(--gray);}
/* ===== STATS (signature: badge path) ===== */
.stats-section{
background:linear-gradient(160deg,var(--navy-deep), var(--navy));
position:relative;overflow:hidden;
}
.stats-path{display:flex;justify-content:space-between;align-items:center;position:relative;}
.stats-path::before{
content:"";position:absolute;top:38px;right:8%;left:8%;height:2px;
background:repeating-linear-gradient(90deg, rgba(255,193,69,.5) 0 10px, transparent 10px 20px);
z-index:0;
}
.stat{position:relative;z-index:1;text-align:center;flex:1;}
.stat-badge{
width:76px;height:76px;border-radius:50%;margin:0 auto 18px;
background:radial-gradient(circle at 35% 30%, var(--gold-light), var(--orange) 60%);
display:flex;align-items:center;justify-content:center;
box-shadow:0 0 0 6px rgba(255,193,69,.15);
}
.stat-badge svg{width:32px;height:32px;color:var(--navy);}
.stat .n{font-family:'Poppins';font-size:38px;font-weight:800;color:#fff;}
.stat .l{font-size:13.5px;color:rgba(255,255,255,.65);margin-top:4px;}
/* ===== TESTIMONIALS ===== */
.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.testi-card{background:#fff;border-radius:var(--radius);padding:28px;border:1px solid rgba(11,36,71,.07);}
.stars{color:var(--gold);font-size:15px;letter-spacing:2px;margin-bottom:14px;}
.testi-card p.txt{font-size:14.5px;color:var(--text);margin-bottom:20px;}
.testi-person{display:flex;align-items:center;gap:12px;}
.avatar{
width:44px;height:44px;border-radius:50%;flex-shrink:0;
display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-family:'Poppins';
}
.testi-person .name{font-weight:700;font-size:14px;color:var(--navy);}
.testi-person .role{font-size:12px;color:var(--gray);}
/* ===== FINAL CTA ===== */
.final-cta{
background:linear-gradient(120deg,var(--black) 0%, var(--navy-deep) 55%, var(--navy) 100%);
border:1px solid rgba(184,146,62,.35);
border-radius:32px;padding:64px 50px;text-align:center;position:relative;overflow:hidden;
margin:0 24px;
}
.final-cta::before{
content:"";position:absolute;width:400px;height:400px;border-radius:50%;
background:radial-gradient(circle, rgba(184,146,62,.18), transparent 70%);top:-180px;left:-100px;
}
.final-cta h2{color:#fff;font-size:clamp(24px,3.2vw,34px);margin-bottom:14px;}
.final-cta p{color:rgba(255,255,255,.72);margin-bottom:30px;font-size:15.5px;}
/* ===== FOOTER ===== */
footer{background:var(--navy-deep);color:rgba(255,255,255,.7);padding:64px 0 26px;}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:40px;margin-bottom:48px;}
.footer-col h5{color:#fff;font-size:15px;margin-bottom:16px;}
.footer-col ul{display:grid;gap:10px;font-size:13.5px;}
.footer-col ul a:hover{color:var(--gold);}
.footer-logo{display:block;text-align:right;color:#fff;font-weight:900;font-size:19px;margin-bottom:10px;}
.footer-logo .logo-badge{display:inline-block;width:150px;height:150px;max-width:100%;border-radius:16px;margin-bottom:6px;}
.footer-logo span{display:block;text-align:right;}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1);padding-top:22px;display:flex;justify-content:space-between;font-size:12.5px;flex-wrap:wrap;gap:10px;}
.reveal{opacity:0;transform:translateY(26px);transition:opacity .7s ease, transform .7s ease;}
.reveal.in{opacity:1;transform:translateY(0);}
@media (max-width:920px){
nav, .header-cta .btn-outline{display:none;}
.hero-grid{grid-template-columns:1fr;}
.hero-visual{height:260px;}
.about-grid{grid-template-columns:1fr;}
.programs-grid, .why-grid, .testi-grid{grid-template-columns:1fr 1fr;}
.footer-grid{grid-template-columns:1fr 1fr;}
.stats-path{flex-wrap:wrap;gap:26px;}
.stats-path::before{display:none;}
}
@media (max-width:600px){
.programs-grid, .why-grid, .testi-grid, .footer-grid{grid-template-columns:1fr;}
.hero{padding:64px 0 80px;}
.final-cta{padding:44px 24px;margin:0;}
}
.mobile-sticky{
display:none;position:fixed;bottom:0;right:0;left:0;z-index:60;
background:#fff;box-shadow:0 -8px 24px rgba(11,36,71,.12);padding:12px 18px;
}
@media (max-width:600px){.mobile-sticky{display:flex;}}
.mobile-sticky .btn-primary{width:100%;justify-content:center;}
/* ===== PROGRAM PAGE ADDITIONS ===== */
.breadcrumb{background:var(--surface);padding:16px 0;font-size:13px;color:var(--gray);}
.breadcrumb a{color:var(--gray);}
.breadcrumb a:hover{color:var(--orange);}
.breadcrumb .sep{margin:0 8px;opacity:.6;}
.breadcrumb .current{color:var(--navy);font-weight:700;}
.program-banner{
position:relative;color:#fff;overflow:hidden;padding:70px 0 60px;
background:
radial-gradient(900px 420px at 88% -10%, rgba(184,146,62,.28), transparent 60%),
linear-gradient(155deg, var(--black) 0%, var(--navy-deep) 45%, var(--navy) 100%);
}
.program-banner::after{
content:"";position:absolute;inset:0;opacity:.08;
background-image:repeating-linear-gradient(45deg,#fff 0 2px, transparent 2px 34px);
pointer-events:none;
}
.banner-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:50px;align-items:center;position:relative;}
.banner-icon{
width:88px;height:88px;border-radius:24px;margin-bottom:22px;
background:rgba(184,146,62,.16);border:1px solid rgba(184,146,62,.4);
display:flex;align-items:center;justify-content:center;
}
.banner-icon svg{width:44px;height:44px;color:var(--orange);}
.program-banner h1{color:#fff;font-size:clamp(30px,4vw,46px);margin-bottom:16px;}
.program-banner p.lead{color:rgba(255,255,255,.75);font-size:16.5px;max-width:520px;margin-bottom:30px;}
.banner-visual{
aspect-ratio:1/1;border-radius:28px;position:relative;overflow:hidden;
background:radial-gradient(circle at 40% 35%, rgba(184,146,62,.22), transparent 65%), rgba(255,255,255,.04);
border:1px solid rgba(255,255,255,.12);
display:flex;align-items:center;justify-content:center;
}
.banner-visual svg{width:46%;height:46%;color:rgba(184,146,62,.55);}
.quickfacts{background:var(--navy-deep);padding:0;}
.quickfacts .container{display:flex;justify-content:space-between;flex-wrap:wrap;}
.qf-item{flex:1;min-width:150px;padding:22px 16px;text-align:center;border-inline-start:1px solid rgba(255,255,255,.08);}
.qf-item:first-child{border-inline-start:none;}
.qf-item .n{font-family:'Poppins';font-weight:800;font-size:20px;color:var(--orange);display:block;margin-bottom:4px;}
.qf-item .l{font-size:12.5px;color:rgba(255,255,255,.6);}
.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%, #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);}
.audience-grid{display:flex;gap:14px;flex-wrap:wrap;margin-top:24px;}
.audience-pill{
display:flex;align-items:center;gap:8px;background:var(--surface);
padding:10px 16px;border-radius:100px;font-size:13.5px;font-weight:700;color:var(--navy);
}
.audience-pill svg{width:16px;height:16px;color:var(--orange);}
/* Level path timeline */
.level-path{display:flex;justify-content:space-between;position:relative;margin-top:20px;}
.level-path::before{
content:"";position:absolute;top:34px;right:6%;left:6%;height:2px;
background:repeating-linear-gradient(90deg, rgba(184,146,62,.5) 0 10px, transparent 10px 20px);
z-index:0;
}
.level{position:relative;z-index:1;text-align:center;flex:1;padding:0 8px;}
.level-dot{
width:68px;height:68px;border-radius:50%;margin:0 auto 16px;
background:#fff;border:3px solid var(--orange);
display:flex;align-items:center;justify-content:center;color:var(--navy);font-weight:800;font-family:'Poppins';
box-shadow:0 10px 24px -12px rgba(11,36,71,.3);
}
.level h4{font-size:14.5px;margin-bottom:4px;color:var(--navy);}
.level p{font-size:12px;color:var(--gray);}
.components-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:18px;}
.component-card{background:#fff;border-radius:16px;padding:22px 16px;text-align:center;border:1px solid rgba(11,36,71,.07);}
.component-card .ci{
width:48px;height:48px;border-radius:14px;margin:0 auto 14px;
background:var(--surface);display:flex;align-items:center;justify-content:center;
}
.component-card .ci svg{width:24px;height:24px;color:var(--orange);}
.component-card h5{font-size:13.5px;margin-bottom:4px;color:var(--navy);}
.component-card p{font-size:12px;color:var(--gray);}
.skills-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;}
.skill-item{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid rgba(11,36,71,.07);border-radius:14px;padding:16px 18px;}
.skill-item svg{width:22px;height:22px;color:var(--orange);flex-shrink:0;}
.skill-item span{font-size:14.5px;font-weight:700;color:var(--navy);}
.coach-card{
display:flex;align-items:center;gap:26px;background:#fff;border-radius:24px;padding:30px;
border:1px solid rgba(11,36,71,.07);
}
.coach-avatar{
width:100px;height:100px;border-radius:20px;flex-shrink:0;
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);}
.coach-card .role{color:var(--orange);font-size:13.5px;font-weight:700;margin-bottom:10px;}
.coach-card p{font-size:14px;color:var(--gray);}
.faq-item{border-bottom:1px solid rgba(11,36,71,.1);}
.faq-q{
display:flex;justify-content:space-between;align-items:center;
padding:22px 4px;cursor:pointer;font-weight:700;font-size:15.5px;color:var(--navy);
}
.faq-q svg{width:20px;height:20px;color:var(--orange);transition:transform .25s ease;flex-shrink:0;}
.faq-item.open .faq-q svg{transform:rotate(45deg);}
.faq-a{max-height:0;overflow:hidden;transition:max-height .3s ease;}
.faq-item.open .faq-a{max-height:220px;}
.faq-a p{padding:0 4px 22px;font-size:14px;color:var(--gray);}
.dual-cta{display:flex;gap:16px;flex-wrap:wrap;margin-top:34px;}
.price-chip{
display:inline-flex;align-items:baseline;gap:6px;background:var(--surface);
padding:14px 22px;border-radius:14px;
}
.price-chip .amt{font-family:'Poppins';font-weight:800;font-size:22px;color:var(--navy);}
.price-chip .per{font-size:12.5px;color:var(--gray);}
@media (max-width:920px){
.banner-grid, .desc-grid{grid-template-columns:1fr;}
.quickfacts .container{flex-wrap:wrap;}
.qf-item{flex:1 1 50%;border-inline-start:none;border-top:1px solid rgba(255,255,255,.08);}
.components-grid{grid-template-columns:repeat(2,1fr);}
.level-path{flex-wrap:wrap;gap:20px;}
.level-path::before{display:none;}
}
@media (max-width:600px){
.skills-grid{grid-template-columns:1fr;}
.components-grid{grid-template-columns:1fr 1fr;}
.coach-card{flex-direction:column;text-align:center;}
}
</style>
</head>
<body>
<header>
<div class="container nav-wrap">
<a href="index.html" class="logo"><span class="logo-badge"><img src="caf-logo.png" alt="شعار أكاديمية الكاف"></span> أكاديمية الكاف الرياضية</a>
<nav>
<ul>
<li><a href="index.html#programs">البرامج</a></li>
<li><a href="page-about.html">من نحن</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">اتصل بنا</a>
<a href="#trial" class="btn btn-primary">حجز حصة تجريبية</a>
</div>
</div>
</header>
<div class="breadcrumb">
<div class="container">
<a href="index.html">الرئيسية</a><span class="sep">/</span><span class="current">فريق المدربين</span>
</div>
</div>
<section class="program-banner">
<div class="container" style="text-align:center;">
<div class="banner-icon" style="margin:0 auto 22px;">
<svg viewBox="0 0 24 24" fill="none" stroke="var(--orange)" stroke-width="1.7"><path d="M17 21v-2a4 4 0 00-4-4H5a4 4 0 00-4 4v2"/><circle cx="9" cy="7" r="4"/><path d="M23 21v-2a4 4 0 00-3-3.87M16 3.13a4 4 0 010 7.75"/></svg>
</div>
<h1>فريق المدربين</h1>
<p class="lead" style="margin:0 auto;">مدرب معتمد متخصص لكل رياضة على حدة — لا يوجد مدرب عام يشرف على كل الأنشطة.</p>
</div>
</section>
<section>
<div class="container">
<div class="eyebrow">نبذة عن الفريق</div>
<h2 class="section-title">نخبة من المدربين المعتمدين</h2>
<p class="section-lead">فريق المدربين والمدربات المعتمدين في أكاديمية الكاف الرياضية — مدرب متخصص لكل رياضة.</p>
<div id="coach-football" class="coach-card reveal" style="flex-direction:column;align-items:stretch;gap:18px;margin-bottom:24px;">
<div style="display:flex;align-items:center;gap:22px;flex-wrap:wrap;">
<img class="coach-avatar" src="images/coaches/football.webp" alt="مروان محمد" style="width:96px;height:96px;flex-shrink:0;object-fit:cover;">
<div style="flex:1;min-width:200px;">
<h4 style="font-size:19px;">الكابتن مروان محمد</h4>
<div class="role">مدرب كرة قدم معتمد</div>
</div>
</div>
<p style="color:var(--gray);font-size:14.5px;">خبرة في تدريب فئات الناشئين وتأسيس المهارات الأساسية لكرة القدم ضمن بيئة تدريبية منظمة ومحفزة.</p>
<a href="program-football.html#coach" class="program-link">عرض برنامج كرة القدم <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 5l-7 7 7 7"/></svg></a>
</div>
<div id="coach-swimming" class="coach-card reveal" style="flex-direction:column;align-items:stretch;gap:18px;margin-bottom:24px;">
<div style="display:flex;align-items:center;gap:22px;flex-wrap:wrap;">
<img class="coach-avatar" src="images/coaches/swimming.webp" alt="عبدالرحمن محمد" style="width:96px;height:96px;flex-shrink:0;object-fit:cover;">
<div style="flex:1;min-width:200px;">
<h4 style="font-size:19px;">الكابتن عبدالرحمن محمد</h4>
<div class="role">مدرب سباحة معتمد من الاتحاد السعودي للسباحة</div>
</div>
</div>
<p style="color:var(--gray);font-size:14.5px;">بكالوريوس التربية الرياضية، وحاصل على شهادة إنقاذ معتمدة من الاتحاد الدولي للغوص والإنقاذ، بخبرة عملية كمنقذ ومدرب لياقة بدنية.</p>
<div class="audience-grid" style="margin-top:0;">
<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 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>
<a href="program-swimming.html#coach" class="program-link">عرض برنامج السباحة <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 5l-7 7 7 7"/></svg></a>
</div>
<div id="coach-karate" class="coach-card reveal" style="flex-direction:column;align-items:stretch;gap:18px;margin-bottom:24px;">
<div style="display:flex;align-items:center;gap:22px;flex-wrap:wrap;">
<img class="coach-avatar" src="images/coaches/karate.webp" alt="الكابتن عبدالرحمن خليل" style="width:96px;height:96px;flex-shrink:0;object-fit:cover;">
<div style="flex:1;min-width:200px;">
<h4 style="font-size:19px;">الكابتن عبدالرحمن خليل</h4>
<div class="role">مدرب معتمد في الكاراتيه</div>
</div>
</div>
<p style="color:var(--gray);font-size:14.5px;">مدرب متخصص في تدريب الأطفال والشباب على أساسيات الكاراتيه ونظام الأحزمة.</p>
<a href="program-karate.html#coach" class="program-link">عرض برنامج الكاراتيه <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 5l-7 7 7 7"/></svg></a>
</div>
<div id="coach-taekwondo" class="coach-card reveal" style="flex-direction:column;align-items:stretch;gap:18px;margin-bottom:24px;">
<div style="display:flex;align-items:center;gap:22px;flex-wrap:wrap;">
<img class="coach-avatar" src="images/coaches/taekwondo.webp" alt="أمنية حمامي" style="width:96px;height:96px;flex-shrink:0;object-fit:cover;">
<div style="flex:1;min-width:200px;">
<h4 style="font-size:19px;">الكابتن أمنية حمامي</h4>
<div class="role">مدربة تايكوندو معتمدة دوليًا (الدرجة الأولى)</div>
</div>
</div>
<p style="color:var(--gray);font-size:14.5px;">بكالوريوس التربية البدنية والرياضة من جامعة الرياضة بتونس، بخبرة تمتد لأكثر من 5 سنوات في تدريب التايكوندو وفنون القتال.</p>
<a href="program-taekwondo.html#coach" class="program-link">عرض برنامج التايكوندو <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 5l-7 7 7 7"/></svg></a>
</div>
<div id="coach-gymnastics" class="coach-card reveal" style="flex-direction:column;align-items:stretch;gap:18px;margin-bottom:24px;">
<div style="display:flex;align-items:center;gap:22px;flex-wrap:wrap;">
<img class="coach-avatar" src="images/coaches/gymnastics.webp" alt="الكابتن إسراء محمد" style="width:96px;height:96px;flex-shrink:0;object-fit:cover;">
<div style="flex:1;min-width:200px;">
<h4 style="font-size:19px;">الكابتن إسراء محمد</h4>
<div class="role">مدربة معتمدة في الجمباز</div>
</div>
</div>
<p style="color:var(--gray);font-size:14.5px;">بكالوريوس التربية البدنية والرياضة، ومدربة إيروبيك معتمدة دوليًا (الدرجة الثانية)، بخبرة في تدريب المرونة والتوازن للأطفال.</p>
<a href="program-gymnastics.html#coach" class="program-link">عرض برنامج الجمباز <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 5l-7 7 7 7"/></svg></a>
</div>
<div id="coach-kickboxing" class="coach-card reveal" style="flex-direction:column;align-items:stretch;gap:18px;">
<div style="display:flex;align-items:center;gap:22px;flex-wrap:wrap;">
<img class="coach-avatar" src="images/coaches/kickboxing.webp" alt="أحمد حبيب" style="width:96px;height:96px;flex-shrink:0;object-fit:cover;">
<div style="flex:1;min-width:200px;">
<h4 style="font-size:19px;">الكابتن أحمد حبيب</h4>
<div class="role">مدرب معتمد دوليًا بدرجة ماستر — الكيك بوكسينغ</div>
</div>
</div>
<p style="color:var(--gray);font-size:14.5px;">خبرة تزيد عن 10 سنوات في تدريب الكيك بوكسينغ، وعضو النقابة العامة للمهن الرياضية.</p>
<div class="audience-grid" style="margin-top:0;">
<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> معتمد من المنظمة الدولية WAKO للكيك بوكسينغ</div>
<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>
<a href="program-kickboxing.html#coach" class="program-link">عرض برنامج الكيك بوكسينغ <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 5l-7 7 7 7"/></svg></a>
</div>
<div id="coach-special-needs" class="coach-card reveal" style="flex-direction:column;align-items:stretch;gap:18px;margin-top:24px;border:1.5px solid var(--orange);">
<div style="display:flex;align-items:center;gap:22px;flex-wrap:wrap;">
<img class="coach-avatar" src="images/coaches/special-needs.webp" alt="الكابتن أحمد حبيب" style="width:96px;height:96px;flex-shrink:0;object-fit:cover;">
<div style="flex:1;min-width:200px;">
<h4 style="font-size:19px;">الكابتن أحمد حبيب</h4>
<div class="role">مدرب منتخب السعودي لذوي الهمم في الكيك بوكسينغ · الرئيس التنفيذي لأكاديمية الكاف الرياضية</div>
</div>
</div>
<p style="color:var(--gray);font-size:14.5px;">خبرة تزيد عن 10 سنوات في تدريب ذوي الهمم، عضو النقابة العامة للمهن الرياضية، وقدّم خدماته لآلاف المتدربين قبل أن يتولى رئاسة الأكاديمية تنفيذيًا.</p>
<div class="audience-grid" style="margin-top:0;">
<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> معتمد من الاتحاد الدولي LFMA للملاكمة التايلندية (المواي تاي)</div>
<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> معتمد من المنظمة الدولية WAKO للكيك بوكسينغ</div>
<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>
<a href="program-special-needs.html#coach" class="program-link">عرض برنامج ذوي الهمم <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 5l-7 7 7 7"/></svg></a>
</div>
<div id="coach-muaythai" class="coach-card reveal" style="flex-direction:column;align-items:stretch;gap:18px;margin-top:24px;">
<div style="display:flex;align-items:center;gap:22px;flex-wrap:wrap;">
<img class="coach-avatar" src="images/coaches/muaythai.webp" alt="أحمد حبيب" style="width:96px;height:96px;flex-shrink:0;object-fit:cover;">
<div style="flex:1;min-width:200px;">
<h4 style="font-size:19px;">الكابتن أحمد حبيب</h4>
<div class="role">مدرب معتمد دوليًا بدرجة ماستر — المواي تاي</div>
</div>
</div>
<p style="color:var(--gray);font-size:14.5px;">خبرة تزيد عن 10 سنوات في تدريب المواي تاي (الملاكمة التايلندية)، وعضو النقابة العامة للمهن الرياضية.</p>
<div class="audience-grid" style="margin-top:0;">
<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> معتمد من الاتحاد الدولي LFMA للمواي تاي</div>
<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>
<a href="program-muaythai.html#coach" class="program-link">عرض برنامج المواي تاي <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 5l-7 7 7 7"/></svg></a>
</div>
<div id="coach-basketball" class="coach-card reveal" style="flex-direction:column;align-items:stretch;gap:18px;margin-top:24px;">
<div style="display:flex;align-items:center;gap:22px;flex-wrap:wrap;">
<img class="coach-avatar" src="images/coaches/basketball.webp" alt="ميري محمد" style="width:96px;height:96px;flex-shrink:0;object-fit:cover;">
<div style="flex:1;min-width:200px;">
<h4 style="font-size:19px;">الكابتن ميري محمد</h4>
<div class="role">مدربة كرة سلة معتمدة</div>
</div>
</div>
<p style="color:var(--gray);font-size:14.5px;">خبرة في تدريب فئات الناشئين وتأسيس أساسيات اللعب الجماعي في بيئة تدريبية محفزة.</p>
<a href="program-basketball.html#coach" class="program-link">عرض برنامج كرة السلة <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 5l-7 7 7 7"/></svg></a>
</div>
<div id="coach-personal-training" class="coach-card reveal" style="flex-direction:column;align-items:stretch;gap:18px;margin-top:24px;">
<div style="display:flex;align-items:center;gap:22px;flex-wrap:wrap;">
<img class="coach-avatar" src="images/coaches/personal-training.webp" alt="الكابتن أحمد حبيب" style="width:96px;height:96px;flex-shrink:0;object-fit:cover;">
<div style="flex:1;min-width:200px;">
<h4 style="font-size:19px;">الكابتن أحمد حبيب</h4>
<div class="role">مدرب معتمد دوليًا بدرجة ماستر — التدريب الشخصي</div>
</div>
</div>
<p style="color:var(--gray);font-size:14.5px;">خبرة تزيد عن 10 سنوات في التدريب الشخصي، وعضو النقابة العامة للمهن الرياضية.</p>
<div class="audience-grid" style="margin-top:0;">
<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> معتمد من الاتحاد الدولي LFMA للملاكمة التايلندية (المواي تاي)</div>
<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> معتمد من المنظمة الدولية WAKO للكيك بوكسينغ</div>
<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>
<a href="program-personal-training.html#coach" class="program-link">عرض برنامج التدريب الشخصي <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 5l-7 7 7 7"/></svg></a>
</div>
</div>
</section>
<section id="trial" class="alt">
<div class="container">
<div class="final-cta reveal">
<h2>جاهز تقابل المدرب المناسب لطفلك؟</h2>
<p>احجز حصة تجريبية مجانية ويلتقي طفلك بالمدرب المختص قبل أي التزام.</p>
<a href="index.html#trial" class="btn btn-navy" style="background:#fff;color:var(--orange);">احجز حصة تجريبية مجانية ←</a>
</div>
</div>
</section>
<footer id="contact">
<div class="container">
<div class="footer-grid">
<div class="footer-col">
<div class="footer-logo"><span class="logo-badge"><img src="caf-logo.png" alt="شعار أكاديمية الكاف"></span><span>أكاديمية الكاف الرياضية</span></div>
<p style="font-size:13.5px;">المملكة العربية السعودية، الرياض</p>
<p style="font-size:13.5px;margin-top:6px;">"نصنع أبطال الغد، بخطوة اليوم"</p>
</div>
<div class="footer-col">
<h5>روابط سريعة</h5>
<ul>
<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>
<li><a href="page-coaches.html">فريق المدربين</a></li>
<li><a href="page-privacy.html">سياسة الخصوصية</a></li>
</ul>
</div>
<div class="footer-col">
<h5>ساعات العمل</h5>
<ul>
<li>السبت – الخميس</li>
<li>3:00م – 9:00م</li>
</ul>
</div>
<div class="footer-col">
<h5>تواصل معنا</h5>
<ul>
<li><a href="tel:+966559695266">0559695266</a></li>
<li><a href="mailto:Contact@caf-academy.com">Contact@caf-academy.com</a></li>
</ul>
<div style="display:flex;gap:10px;margin-top:16px;">
<a href="https://www.instagram.com/caf_academy_?igsi=aDZmaTlhZmttd3E3" target="_blank" rel="noopener" aria-label="Instagram" style="width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.75);transition:background .2s,color .2s;"><svg viewBox="0 0 24 24" width="17" height="17" fill="none" stroke="currentColor" stroke-width="2"><rect x="2" y="2" width="20" height="20" rx="5" ry="5"></rect><path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"></path><line x1="17.5" y1="6.5" x2="17.51" y2="6.5"></line></svg></a>
<a href="https://www.tiktok.com/@caf_academy?_r=1&amp;_t=ZS-98y2YmrQpY8" target="_blank" rel="noopener" aria-label="TikTok" style="width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.75);transition:background .2s,color .2s;"><svg viewBox="0 0 24 24" width="15" height="15" fill="currentColor"><path d="M16.5 3c.3 2.1 1.7 3.6 3.9 3.9v3c-1.3 0-2.6-.4-3.7-1.2v6.4a5.7 5.7 0 1 1-5.7-5.7c.2 0 .5 0 .7.1v3.1a2.6 2.6 0 1 0 1.8 2.5V3h3z"/></svg></a>
<a href="https://www.snapchat.com/add/alsahari_2025" target="_blank" rel="noopener" aria-label="Snapchat" style="width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.75);transition:background .2s,color .2s;"><svg viewBox="0 0 24 24" width="16" height="16" fill="currentColor"><path d="M12 2c3 0 4.7 2.3 4.8 5 0 1 0 2 .1 2.4.2.3.9.4 1.4.2.4-.1.9 0 1 .5.1.5-.2.9-.7 1.1-.3.1-.8.3-.8.6 0 .5.9 1.7 2.4 2.1.3.1.5.4.4.7-.2.7-1.4 1-2.2 1.1-.1.3-.2.7-.3 1-.1.3-.4.4-.7.4-.5 0-1-.1-1.6-.1-.9 0-1.4.6-2.9.6s-2-.6-2.9-.6c-.6 0-1.1.1-1.6.1-.3 0-.6-.1-.7-.4-.1-.3-.2-.7-.3-1-.8-.1-2-.4-2.2-1.1-.1-.3.1-.6.4-.7 1.5-.4 2.4-1.6 2.4-2.1 0-.3-.5-.5-.8-.6-.5-.2-.8-.6-.7-1.1.1-.5.6-.6 1-.5.5.2 1.2.1 1.4-.2.1-.4.1-1.4.1-2.4C7.3 4.3 9 2 12 2z"/></svg></a>
<a href="https://www.facebook.com/share/18RGgydYWL/" target="_blank" rel="noopener" aria-label="Facebook" style="width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.75);transition:background .2s,color .2s;"><svg viewBox="0 0 24 24" width="16" height="16" fill="none" stroke="currentColor" stroke-width="2"><path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"></path></svg></a>
<a href="https://www.youtube.com/@cafacademy" target="_blank" rel="noopener" aria-label="YouTube" style="width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.75);transition:background .2s,color .2s;"><svg viewBox="0 0 24 24" width="17" height="17" fill="none" stroke="currentColor" stroke-width="2"><path d="M22.54 6.42a2.78 2.78 0 0 0-1.94-2C18.88 4 12 4 12 4s-6.88 0-8.6.46a2.78 2.78 0 0 0-1.94 2A29 29 0 0 0 1 11.75a29 29 0 0 0 .46 5.33A2.78 2.78 0 0 0 3.4 19c1.72.46 8.6.46 8.6.46s6.88 0 8.6-.46a2.78 2.78 0 0 0 1.94-2 29 29 0 0 0 .46-5.25 29 29 0 0 0-.46-5.33z"></path><polygon points="9.75 15.02 15.5 11.75 9.75 8.48 9.75 15.02"></polygon></svg></a>
<a href="https://wa.me/966559695266" target="_blank" rel="noopener" aria-label="WhatsApp" style="width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.75);transition:background .2s,color .2s;"><svg viewBox="0 0 24 24" width="16" height="16" fill="currentColor"><path d="M17.6 6.32A8.86 8.86 0 0 0 12.05 4a8.94 8.94 0 0 0-7.75 13.4L3 21l3.72-1.24a8.9 8.9 0 0 0 4.33 1.1h0a8.93 8.93 0 0 0 8.94-8.86 8.83 8.83 0 0 0-2.4-6.68zM12.05 19.4a7.4 7.4 0 0 1-3.78-1.04l-.27-.16-2.8.9.9-2.7-.18-.28a7.4 7.4 0 1 1 6.13 3.28zm4.07-5.53c-.22-.11-1.3-.64-1.5-.72s-.35-.11-.5.11-.58.72-.71.86-.26.16-.48.05a6.06 6.06 0 0 1-1.78-1.1 6.64 6.64 0 0 1-1.23-1.53c-.13-.22 0-.34.1-.45s.22-.26.33-.38a1.5 1.5 0 0 0 .22-.37.4.4 0 0 0 0-.38c-.05-.11-.5-1.2-.68-1.64s-.37-.38-.5-.38h-.43a.82.82 0 0 0-.6.28 2.5 2.5 0 0 0-.78 1.86 4.34 4.34 0 0 0 .91 2.3 9.94 9.94 0 0 0 3.8 3.36c.53.23.94.36 1.26.46a3 3 0 0 0 1.39.09 2.27 2.27 0 0 0 1.49-1.05 1.85 1.85 0 0 0 .13-1.05c-.05-.09-.2-.15-.42-.26z"/></svg></a>
</div>
</div>
</div>
<div class="footer-bottom">
<span>© 2026 أكاديمية الكاف الرياضية — جميع الحقوق محفوظة</span>
<span>تصميم: محمد الشيخ — <a href="https://wa.me/966566785756" target="_blank" rel="noopener" style="text-decoration:underline;">واتساب 0566785756</a></span>
</div>
</div>
</footer>
<div class="mobile-sticky">
<a href="#trial" class="btn btn-primary">احجز حصة تجريبية مجانية</a>
</div>
<script>
// scroll reveal
const reveals = document.querySelectorAll('.reveal');
const io = new IntersectionObserver((entries)=>{
entries.forEach(e=>{ if(e.isIntersecting){ e.target.classList.add('in'); io.unobserve(e.target);} });
},{threshold:.15});
reveals.forEach(r=>io.observe(r));
// counters
const counters = document.querySelectorAll('[data-count]');
const cio = new IntersectionObserver((entries)=>{
entries.forEach(e=>{
if(e.isIntersecting){
const el = e.target;
const target = +el.dataset.count;
let cur = 0;
const step = Math.max(1, Math.ceil(target/40));
const t = setInterval(()=>{
cur += step;
if(cur >= target){ cur = target; clearInterval(t); }
el.textContent = cur;
}, 30);
cio.unobserve(el);
}
});
},{threshold:.6});
counters.forEach(c=>cio.observe(c));
</script>
<script>
document.querySelectorAll('.faq-q').forEach(q=>{
q.addEventListener('click', ()=>{
const item = q.parentElement;
const wasOpen = item.classList.contains('open');
document.querySelectorAll('.faq-item.open').forEach(i=>i.classList.remove('open'));
if(!wasOpen) item.classList.add('open');
});
});
</script>
</body>
</html>