service page done

app/services/page.tsx

@@ -1,13 +1,14 @@
 import { OurService, Video } from "@/components/pages/home";
-import { ServiceBanner } from "@/components/pages/services";
+import { ServiceBanner, ServiceFaq } from "@/components/pages/services";
 import React from "react";
 
 export default function Page() {
   return (
-    <div className="mb-90">
+    <div className="">
       <ServiceBanner />
       <OurService />
       <Video />
+      <ServiceFaq />
     </div>
   );
 }

components/pages/faq/answearQuestions.tsx

@@ -1,44 +1,6 @@
 import Link from "next/link";
 import FAQAccordion from "./faqAccardion";
-
+import { faqItems } from "@/lib/demoData";
-const faqItems = [
-  {
-    id: "faq-1",
-    question: "How do I become a firefighter?",
-    answer:
-      "Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel sit amet adipiscing sem neque.",
-  },
-  {
-    id: "faq-2",
-    question: "What equipment do firefighters use?",
-    answer:
-      "Firefighters use specialized equipment including protective gear, breathing apparatus, fire hoses, ladders, and various rescue tools. Each piece of equipment is designed to keep firefighters safe while they perform their duties. Our team is trained extensively on all equipment and safety protocols.",
-  },
-  {
-    id: "faq-3",
-    question: "Do firefighters only fight fires?",
-    answer:
-      "No, modern firefighters respond to a wide variety of emergencies including medical calls, vehicle accidents, hazardous material incidents, and rescue operations. They serve as first responders and are trained in emergency medical services to provide life-saving care to the community.",
-  },
-  {
-    id: "faq-4",
-    question: "What are the work hours for firefighters?",
-    answer:
-      "Firefighters typically work shifts that vary by department. Many operate on a schedule of 24 hours on duty followed by 48-72 hours off duty. This schedule allows for adequate rest and recovery while ensuring continuous emergency response coverage for the community.",
-  },
-  {
-    id: "faq-5",
-    question: "How long is firefighter training?",
-    answer:
-      "Initial firefighter training typically takes 12-18 weeks of full-time instruction at a fire academy. After this, firefighters continue receiving ongoing training throughout their careers. Our department invests heavily in continuous education to maintain the highest standards of service.",
-  },
-  {
-    id: "faq-6",
-    question: "What is required to apply for the firefighter position?",
-    answer:
-      "Candidates must be at least 18 years old, have a high school diploma or GED, possess a valid drivers license, and pass a background check and medical examination. Physical fitness is essential, and candidates must pass the Candidate Physical Ability Test (CPAT).",
-  },
-];
 
 export function Togle() {
   return (
@@ -72,7 +34,10 @@ export function Togle() {
             Nullam dictum felis eu pede mollis pretium integer tincidunt.
           </p>
           <div className="w-full flex items-center justify-center">
-            <Link href={'/contact'} className="mx-auto shadow-[0px_0px_2px_8px_#ff01015c] bg-red-600 hover:bg-red-700 text-white font-bold py-3 px-8 rounded-full transition duration-300 transform hover:scale-105 w-fit">
+            <Link
+              href={"/contact"}
+              className="mx-auto shadow-[0px_0px_2px_8px_#ff01015c] bg-red-600 hover:bg-red-700 text-white font-bold py-3 px-8 rounded-full transition duration-300 transform hover:scale-105 w-fit"
+            >
               ASK A QUESTION
             </Link>
           </div>

components/pages/faq/faqAccardion.tsx

@@ -19,7 +19,7 @@ export default function FAQAccordion({ items }: FAQAccordionProps) {
       {items.map((item, index) => (
         <Accordion.Item key={item.id} value={item.id} className="border-b border-slate-700 py-6">
           <Accordion.Trigger className="group flex w-full items-center justify-between text-left">
-            <h3 className="text-lg font-bold uppercase tracking-wide text-white transition-colors duration-300 group-hover:text-red-600 md:text-xl">
+            <h3 className="text-lg font-bold uppercase tracking-wide text-white transition-colors duration-300 group-hover:cursor-pointer md:text-xl">
               {item.question}
             </h3>
             <div className="ml-4 shrink-0">

components/pages/services/index.ts

@@ -1 +1,2 @@
 export { ServiceBanner } from "./serviceBanner";
+export { ServiceFaq } from "./serviceFaq";

components/pages/services/serviceFaq.tsx

@@ -0,0 +1,27 @@
+import DotAnimatsiya from "@/components/dot/DotAnimatsiya";
+import FAQAccordion from "../faq/faqAccardion";
+import { faqItems } from "@/lib/demoData";
+
+export function ServiceFaq() {
+  return (
+    <div className="bg-[#1e1d1c] py-20 pb-50 space-y-8">
+      {/* header */}
+      <div className="space-y-4 w-full ">
+        <div className="flex items-center gap-3 justify-center text-white text-xl">
+          <DotAnimatsiya /> FAQ
+        </div>
+        <h1
+          className="text-center bg-linear-to-br from-white via-white/50 to-black
+  text-transparent bg-clip-text text-3xl font-bold uppercase leading-tight sm:text-4xl md:text-5xl lg:text-6xl"
+        >
+          General Questions
+        </h1>
+      </div>
+
+      {/* FAQ Section */}
+      <div className="md:col-span-2 max-w-6xl mx-auto w-full">
+        <FAQAccordion items={faqItems} />
+      </div>
+    </div>
+  );
+}

lib/demoData.ts

@@ -27,4 +27,43 @@ export const DATA = [
       "/images/products/products.webp",
     ],
   },
+];
+
+export const faqItems = [
+  {
+    id: "faq-1",
+    question: "How do I become a firefighter?",
+    answer:
+      "Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel sit amet adipiscing sem neque.",
+  },
+  {
+    id: "faq-2",
+    question: "What equipment do firefighters use?",
+    answer:
+      "Firefighters use specialized equipment including protective gear, breathing apparatus, fire hoses, ladders, and various rescue tools. Each piece of equipment is designed to keep firefighters safe while they perform their duties. Our team is trained extensively on all equipment and safety protocols.",
+  },
+  {
+    id: "faq-3",
+    question: "Do firefighters only fight fires?",
+    answer:
+      "No, modern firefighters respond to a wide variety of emergencies including medical calls, vehicle accidents, hazardous material incidents, and rescue operations. They serve as first responders and are trained in emergency medical services to provide life-saving care to the community.",
+  },
+  {
+    id: "faq-4",
+    question: "What are the work hours for firefighters?",
+    answer:
+      "Firefighters typically work shifts that vary by department. Many operate on a schedule of 24 hours on duty followed by 48-72 hours off duty. This schedule allows for adequate rest and recovery while ensuring continuous emergency response coverage for the community.",
+  },
+  {
+    id: "faq-5",
+    question: "How long is firefighter training?",
+    answer:
+      "Initial firefighter training typically takes 12-18 weeks of full-time instruction at a fire academy. After this, firefighters continue receiving ongoing training throughout their careers. Our department invests heavily in continuous education to maintain the highest standards of service.",
+  },
+  {
+    id: "faq-6",
+    question: "What is required to apply for the firefighter position?",
+    answer:
+      "Candidates must be at least 18 years old, have a high school diploma or GED, possess a valid drivers license, and pass a background check and medical examination. Physical fitness is essential, and candidates must pass the Candidate Physical Ability Test (CPAT).",
+  },
 ];