<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!-- Google Tag Manager -->
    <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
    new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
    j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
    'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
    })(window,document,'script','dataLayer','GTM-W53KXNJT');</script>
    <!-- End Google Tag Manager -->
    <title>Training With Fahmi</title>
    <link rel="stylesheet" href="styles.css" >
    <script src="https://kit.fontawesome.com/a02245452e.js" crossorigin="anonymous"></script>
    <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=Poppins:wght@400;700&display=swap" rel="stylesheet">
</head>
<body>
    <!-- Google Tag Manager (noscript) -->
    <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-W53KXNJT"
    height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
    <!-- End Google Tag Manager (noscript) -->
    <nav class="navbar">
        <a href="/" class="navbar__logo">TRAINING WITH FAHMI</a>
        <div class="navbar__toggle" id="mobile-menu">
            <span class="bar"></span>
            <span class="bar"></span>
            <span class="bar"></span>
        </div>
        <div class="navbar__menu">
            <a href="/" class="navbar__link">Home</a>
            <a href="/services.html" class="navbar__link">Services</a>
            <a href="/plans.html" class="navbar__link">Plans</a>
            <a href="/about.html" class="navbar__link">About</a>

        </div>
        <!-- Hero Section -->
    </nav>
    <div class="hero">
        <div class="hero__content">
            <h1 class="animate-hero">Training with</h1>
            <h1 class="animate-hero">Fahmi</h1>
            <p  class="animate-hero">Develop Excel Succeed</p>
            <a href="plans.html" class="button">Get Started</a>
        </div>
    </div>
    <!-- Team Section-->
<div class="team">
    <div class="team__wrapper">
        <div class="team__text animate-team">
            <p class="topline">Meet Fahmi</p>
            <h1>Meet Fahmi Ibrahim</h1>
            <p class="team__desc">
                I've dedicated over two decades to playing soccer, honing my skills and passion for the game. My journey has taken me through several esteemed academies in the Bay Area, including De Anza Academy and the San Jose Earthquakes Academy.
I had the privilege of playing collegiate soccer at UC Berkeley and Duke University, where I developed both my athletic and academic skills. 
            </p>
        </div>
        <div class="team__text">
            <p class="topline">Meet Fahmi Ibrahim</p>
            <h1>Why Soccer?</h1>
            <p class="team__desc">
                My professional career includes the San Jose Earthquakes' first team, Detroit Mercy, Colorado Hailstorm FC, and more. Soccer isn't just a sport for me; it's a lifelong passion that I've been fortunate to turn into a career. Now, as a personal trainer, I aim to recycle my knowledge and pass it on to the next generation. I am deeply passionate about teaching, coaching, mentoring, and fitness.
                I believe in the power of sports to transform lives and am committed to helping others achieve their goals both on and off the field. Whether it's through individualized training sessions or motivational mentoring, my goal is to inspire and empower athletes to reach their full potential.
               </p>
        </div>
        <div class="team__card animate-team">
            <p>Fahmi Ibrahim</p>
            <img src="./images/P1191312 2.jpg" alt="person" class="team__img">
        </div>
        <div class="team__card animate-team">
            <p>San Jose Earthquakes</p>
            <img src="./images/IMG_1966.jpg" alt="person" class="team__img">
        </div>
        <div class="team__card animate-team">
            <p>Duke University</p>
            <img src="./images/IMG_6683 2.jpg" alt="person" class="team__img">
        </div>
        <div class="team__card animate-team">
            <p>UC Berkeley</p>
            <img src="./images/IMG_5708 2.jpg" alt="person" class="team__img">
        </div>
    </div>
</div>
<!--Services Section-->
<div class="services">
    <div class="services__container">
        <div>
            <p class="topline animate-services">Features</p>
            <h1 class="services__heading animate-services">What We Offer</h1>
            <div class="services__features">
                <p class="sevices__feature animate-services">
                    1. Technical Training

                    Dribbling, passing, shooting, ball control
                    Individual Training Plans

                </p>
                <p class="sevices__feature animate-services">
                    2. Personalized workouts and position-specific drills
                    College Recruiting Help
                   
                </p>
                <p class="sevices__feature animate-services">
                    3. Recruitment guidance, highlight video creation, coach communication
                    Tactical Training
                </p>
                <p class="sevices__feature animate-services">
                    4. Game strategy, positioning, team play
                    Fitness and Conditioning
                </p>
                <p class="sevices__feature animate-services">
                    5. Endurance, speed, strength, injury prevention
                    Mental Training
                </p>
                <p class="sevices__feature animate-services">
                    6. Confidence building, focus techniques, goal setting
                    Video Analysis
                </p>
            </p>
            <p class="sevices__feature animate-services">
                7. Game footage review, performance feedback
                Group Training
            </p>
        </p>
        <p class="sevices__feature animate-services">
            8. Small group drills, team building, match simulations
        </p>
            </div>
        </div>
        <img src="./images/IMG_7146.JPG" alt="gym" class="services__img animate-img">
        <div>
        </div>
    </div>
</div>
<!-- Membership Section-->
<div class="memberships">
    <h1 class="animate-membership">View Our Plans</h1>
    <p class="membership__desc animate-membership">Get Started today and Book Your First Session!</p>
    <div class="membership__wrapper">
        <div class="membership__card animate-card">
            <div class="membership__title">
                <i class="fas fa-dumbbell card-icon"></i>
                <h3>Personal Training Session</h3>
            </div>
            <div class="membership__perks">
                <p>Customized Skill Development</p>
                <p>Fitness and Conditioning Routines</p>
                <p>Performance Analysis</p>
            </div>
            <a href="https://trainingwithfahmi.setmore.com?utm_source=qr-code&utm_medium=more-share-bp" class="button" id="book-button">Book Now</a>
        </div>
        <div class="membership__card animate-card">
            <div class="membership__title">
                <i class="fas fa-laptop card-icon"></i>
                <h3>Online Training </h3>
            </div>
            <div class="membership__perks">
                <p>Virtual Coaching Sessions</p>
                <p>Custom Training Plans</p>
                <p>Performance tracking and feedback</p>
            </div>
            <a href="https://trainingwithfahmi.setmore.com?utm_source=qr-code&utm_medium=more-share-bp" class="button" id="book-button">Book Now</a>
        </div>
        <div class="membership__card animate-card">
            <div class="membership__title">
                <i class="fas fa-dumbbell card-icon"></i>
                <h3>Team Camps and Clinics</h3>
            </div>
            <div class="membership__perks">
                <p>Pre-season training camps</p>
                <p>Position-specific clinics</p>
                <p>Tactical workshops</p>
                <p>In-person and online options</p>
            </div>
            <a href="https://trainingwithfahmi.setmore.com?utm_source=qr-code&utm_medium=more-share-bp" class="button" id="book-button">Book Now</a> 
            <!-- Line above link to Calendely Website -->
        </div>
    </div>
</div>
<!-- Email Section -->
<div class="email">
    <div class="email__content">
        <h1 class ="animate-email">Get Access to Members Only Perks</h1>
        <p class ="animate-email">Sign Up for our Newsletter</p>
        <form action="#" class ="animate-email">
            <div class="form__wrap">
                <label for="email">
                  <input type="email" placeholder="Enter your email" id="email">   
                </label>
                <button class="button" type="submit">Sign Up</button>
            </div>
        </form>
    </div>
</div>
<!--Footer-->
<div class="footer">
    <div class="footer__wrapper">
        <div class="footer__desc">
            <h1>Training with Fahmi</h1>
            <p>Trainings with Fahmi are located in the Bay Area.</p>
        </div>
        <div class="footer__links">
            <h2 class="footer__title">Contact Us</h2>
            <p id="email">510-838-5276</p>
            <p id="email">trainingwithfahmi@gmail.com</p>
        </div>
    </div>
    <div class="footer__wrapper">
        <div class="footer__links">
            <h2 class="footer__title">Social Media</h2>
            <a href="https://www.instagram.com/trainingwithfahmi?igsh=MzRlODBiNWFlZA==" class="footer__link" href="/">Instagram</a>
            <a href="https://www.youtube.com/channel/UC-HQHEKnkXrQNrtY2GFwaVA" class="footer__link" href="/">Youtube</a>
            <a href="https://www.tiktok.com/@fahmi.ibrahim7?_t=8oRVsEaYeKs&_r=1" class="footer__link" href="/">TikTok</a>
        </div>
    </div>
</div>
<script src="https://cdn.jsdelivr.net/npm/gsap@3.12.5/dist/gsap.min.js"></script>
<script src=https://cdn.jsdelivr.net/npm/gsap@3.12.5/dist/ScrollTrigger.min.js></script>
    <script src="app.js"></script>
</body>
</html>