feat:change all section color

src/components/FAQSection.tsx

@@ -5,8 +5,9 @@ import {
   AccordionTrigger,
 } from "@/components/ui/accordion";
 import { motion, useInView, useScroll, useSpring } from "framer-motion";
-import { ArrowUpRight, ShieldQuestion, Sparkles } from "lucide-react";
+import { Sparkles } from "lucide-react";
 import { useRef, useState } from "react";
+import PremiumBadge from "./shared/PremiumBadge";
 
 const faqs = [
   {
@@ -61,18 +62,11 @@ export default function FAQSection() {
       <div className="mx-auto px-6 max-w-6xl">
         <div className="flex flex-col gap-10">
           <div className="flex flex-col items-center">
-            <div className="flex items-center gap-2 mb-6">
-              <div className="p-2 bg-primary rounded-lg text-primary-foreground">
-                <ShieldQuestion size={20} />
-              </div>
-              <span className="text-sm font-bold uppercase text-primary/80">
-                Got Questions?
-              </span>
-            </div>
+            <PremiumBadge text="Got Questions?" />
 
             <h2 className="text-4xl md:text-5xl font-bold">
-              Clear Answers {" "}
-              <span className="text-transparent bg-clip-text bg-gradient-to-r from-primary to-primary-foreground">
+              Clear Answers{" "}{" "}
+              <span className="text-transparent bg-clip-text bg-gradient-to-r from-primary to-accent-foreground">
                 For Big Ideas.
               </span>
             </h2>
@@ -139,7 +133,6 @@ export default function FAQSection() {
                   <AccordionContent className="px-6 pb-8 md:pl-[104px]">
                     <div className="text-muted-foreground text-base md:text-lg leading-relaxed max-w-2xl border-l-2 border-primary/20 pl-6">
                       {faq.answer}
-                      
                     </div>
                   </AccordionContent>
                 </AccordionItem>