Update src/app/styles/variables.css

Merge version_2 into main

src/app/page.tsx

@@ -10,13 +10,12 @@ import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCar
 import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
 import Link from "next/link";
 import { Sparkles, Shield, Zap, Users, Star, Clock, Heart, Award } from "lucide-react";
-import { useState } from "react";
 
 const navItems = [
   { name: "Home", id: "/" },
   { name: "Services", id: "/services" },
   { name: "Membership", id: "/membership" },
-  { name: "Assessment", id: "#fitness-assessment" },
+  { name: "About", id: "/about" },
   { name: "Contact", id: "/contact" },
 ];
 
@@ -56,24 +55,6 @@ const footerColumns = [
 ];
 
 export default function HomePage() {
-  const [weight, setWeight] = useState("");
-  const [fitnessGoal, setFitnessGoal] = useState("");
-  const [hoursPerWeek, setHoursPerWeek] = useState("");
-  const [assessmentComplete, setAssessmentComplete] = useState(false);
-
-  const handleSubmitAssessment = (e: React.FormEvent) => {
-    e.preventDefault();
-    if (weight && fitnessGoal && hoursPerWeek) {
-      setAssessmentComplete(true);
-      setTimeout(() => {
-        setAssessmentComplete(false);
-        setWeight("");
-        setFitnessGoal("");
-        setHoursPerWeek("");
-      }, 2000);
-    }
-  };
-
   return (
     <ThemeProvider
       defaultButtonVariant="text-stagger"
@@ -131,7 +112,7 @@ export default function HomePage() {
 
       <div id="metrics" data-section="metrics" className="w-full py-16">
         <MetricCardOne
-          title="Why Choose Ignite Fitness Club"
+          title="Ignite Fitness Club by the Numbers"
           description="Trust indicators backed by real numbers and quality service"
           tag="Trust Indicators"
           tagIcon={Shield}
@@ -210,84 +191,6 @@ export default function HomePage() {
         />
       </div>
 
-      <div id="fitness-assessment" data-section="fitness-assessment" className="w-full py-20">
-        <div className="mx-auto max-w-4xl px-6">
-          <div className="mb-12 text-center">
-            <h2 className="mb-4 text-4xl font-bold md:text-5xl">Personalized Fitness Assessment</h2>
-            <p className="text-lg text-foreground/80">Let us understand your fitness goals and create a personalized plan for you</p>
-          </div>
-
-          <div className="mx-auto max-w-2xl rounded-lg bg-card p-8 shadow-lg">
-            {assessmentComplete ? (
-              <div className="text-center">
-                <div className="mb-4 text-5xl">✅</div>
-                <h3 className="mb-2 text-2xl font-bold text-primary-cta">Assessment Submitted!</h3>
-                <p className="text-foreground/80">Thank you for completing your fitness assessment. Our trainers will review your information and reach out soon with a personalized plan.</p>
-              </div>
-            ) : (
-              <form onSubmit={handleSubmitAssessment} className="space-y-6">
-                <div>
-                  <label className="mb-2 block text-sm font-semibold text-foreground">
-                    Current Weight (kg)
-                  </label>
-                  <input
-                    type="number"
-                    step="0.1"
-                    placeholder="Enter your weight"
-                    value={weight}
-                    onChange={(e) => setWeight(e.target.value)}
-                    className="w-full rounded-lg border border-accent bg-background px-4 py-3 text-foreground placeholder-foreground/50 focus:border-primary-cta focus:outline-none"
-                    required
-                  />
-                </div>
-
-                <div>
-                  <label className="mb-2 block text-sm font-semibold text-foreground">
-                    Fitness Goal
-                  </label>
-                  <select
-                    value={fitnessGoal}
-                    onChange={(e) => setFitnessGoal(e.target.value)}
-                    className="w-full rounded-lg border border-accent bg-background px-4 py-3 text-foreground focus:border-primary-cta focus:outline-none"
-                    required
-                  >
-                    <option value="">Select your primary goal</option>
-                    <option value="weight-loss">Weight Loss</option>
-                    <option value="muscle-gain">Muscle Gain</option>
-                    <option value="strength">Build Strength</option>
-                    <option value="endurance">Improve Endurance</option>
-                    <option value="general-fitness">General Fitness</option>
-                    <option value="flexibility">Increase Flexibility</option>
-                  </select>
-                </div>
-
-                <div>
-                  <label className="mb-2 block text-sm font-semibold text-foreground">
-                    Hours Devoted to Fitness Per Week
-                  </label>
-                  <input
-                    type="number"
-                    step="0.5"
-                    placeholder="e.g., 3.5"
-                    value={hoursPerWeek}
-                    onChange={(e) => setHoursPerWeek(e.target.value)}
-                    className="w-full rounded-lg border border-accent bg-background px-4 py-3 text-foreground placeholder-foreground/50 focus:border-primary-cta focus:outline-none"
-                    required
-                  />
-                </div>
-
-                <button
-                  type="submit"
-                  className="w-full rounded-lg bg-primary-cta px-6 py-3 font-semibold text-primary-cta-text transition-all hover:opacity-90"
-                >
-                  Submit Assessment
-                </button>
-              </form>
-            )}
-          </div>
-        </div>
-      </div>
-
       <div id="testimonials" data-section="testimonials" className="w-full py-20">
         <TestimonialCardTen
           title="Testimonials from Our Community"

src/app/styles/variables.css

@@ -2,23 +2,23 @@
   /* Base units */
   /* --vw is set by ThemeProvider */
 
-  /* --background: #ffffff;;
-  --card: #f9f9f9;;
-  --foreground: #120a00e6;;
-  --primary-cta: #ff8c42;;
-  --secondary-cta: #f9f9f9;;
-  --accent: #e2e2e2;;
-  --background-accent: #c4c4c4;; */
+  /* --background: #0a1f3d;;
+  --card: #0f2f52;;
+  --foreground: #e6f0ff;;
+  --primary-cta: #106EFB;;
+  --secondary-cta: #0e1a29;;
+  --accent: #3f5c79;;
+  --background-accent: #004a93;; */
 
-  --background: #ffffff;;
-  --card: #f9f9f9;;
-  --foreground: #120a00e6;;
-  --primary-cta: #ff8c42;;
+  --background: #0a1f3d;;
+  --card: #0f2f52;;
+  --foreground: #e6f0ff;;
+  --primary-cta: #106EFB;;
   --primary-cta-text: #ffffff;;
-  --secondary-cta: #f9f9f9;;
+  --secondary-cta: #0e1a29;;
   --secondary-cta-text: #120a00e6;;
-  --accent: #e2e2e2;;
-  --background-accent: #c4c4c4;;
+  --accent: #3f5c79;;
+  --background-accent: #004a93;;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);