fonts changed

src/components/Card.tsx

@@ -79,7 +79,7 @@ const Card = ({ paper, onSelect, isSelected }: CardProps) => {
 
         <div className="justify-center">
           <div className="flex flex-row items-center justify-between px-4 pb-2">
-            <div className="font-sans text-sm font-medium">
+            <div className="play text-md font-medium">
               {extractBracketContent(paper.subject)}
             </div>
             <div className="flex gap-2">

src/components/UpcomingPaper.tsx

@@ -35,16 +35,16 @@ export default function PaperCard({ subject, slots }: PaperCardProps) {
     >
       {/* Course Code */}
       <div className="border-b-2 border-[#453D60] p-2">
-        <h3 className="vipnabd inline-block rounded-t-lg px-2 py-1 text-base md:text-lg md:tracking-widest">
+        <h3 className="play font-bold inline-block rounded-t-lg px-2 py-1 text-base md:text-lg md:tracking-widest">
           {courseCode} {/* Replace with dynamic code if needed */}
         </h3>
       </div>
 
       {/* Subject Name */}
       <div className="flex flex-col justify-between p-4">
-        <h2 className="mt-2 text-base font-bold md:text-xl">{courseName}</h2>
+        <h2 className="play mt-2 text-base font-bold md:text-xl">{courseName}</h2>
         {/* Slot Buttons */}
-        <div className="mt-4 flex gap-2">
+        <div className="play mt-4 flex gap-2">
           {slots?.map((slotValue, index) => capsule(slotValue))}
         </div>
         {/* See Papers Link */}

src/components/screens/Faq.tsx

@@ -56,11 +56,11 @@ function Faq() {
     <>
       <div
         id="faq"
-        className="mb-8 w-full px-6 text-center text-4xl font-bold text-[#120020] dark:text-white lg:text-left lg:text-5xl"
+        className="vipnabd mb-8 w-full px-6 text-center text-4xl font-bold text-[#120020] dark:text-white lg:text-left lg:text-5xl"
       >
         Frequently Asked Questions
       </div>
-      <div className="mx-auto w-full space-y-6 px-6">
+      <div className="mx-auto play w-full space-y-6 px-6">
         {faqs.map((faq, index) => (
           <div
             key={index}
@@ -80,11 +80,10 @@ function Faq() {
               </button>
             </div>
             <div
-              className={`overflow-hidden transition-all duration-300 ease-in-out ${
-                faqActive === index
-                  ? "max-h-40 opacity-100"
-                  : "max-h-0 opacity-0"
-              }`}
+              className={`overflow-hidden transition-all duration-300 ease-in-out ${faqActive === index
+                ? "max-h-40 opacity-100"
+                : "max-h-0 opacity-0"
+                }`}
             >
               <p className="mt-2 text-black dark:text-white">{faq.answer}</p>
             </div>

src/components/screens/Info.tsx

@@ -10,15 +10,15 @@ function Info() {
       className="flex scroll-mt-24 flex-col items-center justify-between px-6 py-12 md:scroll-mt-32 lg:flex-row"
     >
       <div className="w-full text-center lg:w-[50%] lg:text-left">
-        <div className="mb-8 block text-3xl font-extrabold text-black dark:text-white lg:text-5xl">
+        <div className="vipnabd mb-8 block text-3xl font-extrabold text-black dark:text-white lg:text-5xl">
           <span>Prepare to excel in </span>
           <span>your CATs and FATs </span>
           <span>with CodeChef-</span>
           <span>VIT’s dedicated </span>
           <span>repository of past</span>
           <span>exam papers</span>
         </div>
-        <div className="grid gap-4 text-[12px] text-black dark:text-white md:grid-cols-3 xl:text-[16px]">
+        <div className="grid play gap-4 text-[12px] text-black dark:text-white md:grid-cols-3 xl:text-[16px]">
           <FeatureCard icon={<User size={32} />} text="No Sign-up required" />
           <FeatureCard
             isHighlight