From b86104c8ceb6cd9213d4c220ed9aca3bf6b24743 Mon Sep 17 00:00:00 2001
From: ErenYeager139 <105733627+ErenYeager139@users.noreply.github.com>
Date: Fri, 14 Mar 2025 12:02:24 +0530
Subject: [PATCH] Update Hero.jsx

---
 src/Hero.jsx | 42 ++++++++++++++++++------------------------
 1 file changed, 18 insertions(+), 24 deletions(-)

diff --git a/src/Hero.jsx b/src/Hero.jsx
index 704e02a..597afaa 100644
--- a/src/Hero.jsx
+++ b/src/Hero.jsx
@@ -5,35 +5,35 @@ import Carousel from './Caras0I';
 import Program from './Program';
 import About from './About';
 import Contact from './Cntact';
-
-
 import TrainingCard from './Training';
+
 const HeroSection = () => {
   return (
     <>
+      {/* SEO Optimization */}
       <Helmet>
-        <title > Fitness Revolution - Unleash Your Inner Strength</title>
+        <title>The Fitness Connection - Unleash Your Inner Strength</title>
         <meta
           name="description"
           content="Join our community of fitness enthusiasts. World-class facilities, expert trainers, and personalized programs designed to take your fitness journey to the next level."
         />
         <meta
           name="keywords"
-          content="fitness, gym, workout, strength, health, fitness revolution, fitness programs"
+          content="fitness, gym, workout, strength, health, The Fitness Connection, fitness programs"
         />
         <meta name="robots" content="index, follow" />
       </Helmet>
 
-      
-      <div className="max-w-[85rem] mx-auto px-4 sm:px-6 lg:px-8 bg-black mt-12 h-[100vh] flex items-center">
-        {/* Grid */}
-        <div className="grid md:grid-cols-2 gap-4 md:gap-8 xl:gap-20 md:items-center">
-          {/* Text Section */}
+      {/* Hero Section */}
+      <div className="max-w-[85rem] mx-auto px-4 sm:px-6 lg:px-8 bg-black mt-12 min-h-screen flex items-center">
+        <div className="grid md:grid-cols-2 gap-4 md:gap-8 xl:gap-20 md:items-center h-full">
+          
+          {/* Left Text Section */}
           <div className="text-center lg:text-left">
-            <h1 className="text-3xl sm:text-4xl lg:text-5xl font-extrabold text-teal-500 leading-tight tracking-wider dark:text-white mt-12 pt-16">
+            <h1 className="text-3xl sm:text-4xl lg:text-5xl font-extrabold text-teal-500 leading-tight tracking-wider dark:text-white">
               Unleash Your Inner Strength
               <br />
-              <span className="text-white text-2xl sm:text-3xl mt-3">Join the Fitness Revolution</span>
+              <span className="text-white text-2xl sm:text-3xl">Join The Fitness Connection</span>
             </h1>
             <p className="mt-4 text-lg sm:text-xl text-white dark:text-neutral-400">
               Join our community of fitness enthusiasts. World-class facilities, expert trainers, and personalized programs designed to take your fitness journey to the next level.
@@ -43,7 +43,7 @@ const HeroSection = () => {
             <div className="mt-8 flex justify-center sm:justify-start space-x-4">
               <a
                 href="#"
-                className="py-3 px-6 inline-flex items-center justify-center gap-x-2 text-lg font-semibold rounded-lg bg-teal-600 text-white hover:bg-teal-700 focus:outline-none focus:bg-teal-700"
+                className="py-3 px-6 inline-flex items-center justify-center gap-x-2 text-lg font-semibold rounded-lg bg-teal-600 text-white hover:bg-teal-700"
               >
                 Start Your Transformation
                 <svg
@@ -63,33 +63,27 @@ const HeroSection = () => {
               </a>
               <Link 
                 to="/contact" 
-                className="py-3 px-6 inline-flex items-center justify-center gap-x-2 text-lg font-semibold rounded-lg bg-white text-gray-800 shadow-md hover:bg-gray-50 focus:outline-none focus:bg-gray-50 dark:bg-neutral-900 dark:border-neutral-700 dark:text-white dark:hover:bg-neutral-800 dark:focus:bg-neutral-800"
+                className="py-3 px-6 inline-flex items-center justify-center gap-x-2 text-lg font-semibold rounded-lg bg-white text-gray-800 shadow-md hover:bg-gray-50"
               >
                 Contact Us
               </Link>
             </div>
-            {/* End Buttons */}
           </div>
 
-          {/* Image Section */}
-          <div className="relative mt-8 lg:mt-0">
+          {/* Right Carousel Section (Fixed Margins & Height) */}
+          <div className="relative mt-4 lg:mt-0 flex justify-center h-full">
             <Carousel />
           </div>
         </div>
-        {/* End Grid */}
       </div>
+
+      {/* Other Sections */}
       <Program />
       <About />
-   
-      <TrainingCard/>
+      <TrainingCard />
       <Contact />
     </>
   );
 };
 
 export default HeroSection;
-
-
-
-
-