fix: modified section heading sizes to accomodate for Starlight font

Author: steadyfall

src/components/About.tsx

@@ -3,7 +3,7 @@ import { ArrowUpRight } from "lucide-react"
 const About = () => {
   return (
     <section id="about" className="mb-12">
-        <h2 className="text-2xl font-bold mb-4">About</h2>
+        <h2 className="text-2xl md:text-3xl lg:text-4xl font-section mb-4">About</h2>
         <p className="text-gray-700 dark:text-gray-300">
             I am a junior at the University of Waterloo, pursuing a major in Computational Mathematics.
             With a passion for technology and innovation, I am constantly exploring new

src/components/Experiences.tsx

@@ -11,7 +11,7 @@ export function Experiences({ arr }: ExperiencesProps) {
     const [experiences, setExperiences] = useState(arr)
     return (
         <section id="experience" className="mb-12">
-            <h2 className="text-2xl font-bold mb-4">Experience</h2>
+            <h2 className="text-2xl md:text-3xl lg:text-4xl font-section mb-4">Experience</h2>
             {experiences && experiences.length > 0 ? (
             <div className="relative space-y-6">
                 <div 

src/components/Header.tsx

@@ -19,7 +19,7 @@ const Header = () => {
             </div>
             <div className="flex-grow text-center md:text-left">
             <div className="flex items-center justify-center md:justify-start">
-                <h1 className="text-3xl md:text-4xl lg:text-5xl font-bold mr-4">Himank Dave</h1>
+                <h1 className="text-4xl md:text-5xl lg:text-6xl font-bold mr-4">Himank Dave</h1>
                 <ThemeSwitch />
             </div>
             <div className="flex justify-center md:justify-start mt-4 space-x-4">

src/components/Projects.tsx

@@ -9,7 +9,7 @@ export function Projects({ arr }: ProjectProps) {
     const [projects, setProjects] = useState(arr)
     return (
         <section id="projects" className="mb-12">
-            <h2 className="text-2xl font-bold mb-4">Projects</h2>
+            <h2 className="text-2xl md:text-3xl lg:text-4xl font-section font-bold mb-4">Projects</h2>
             {projects && projects.length > 0 ? (
                 <div className="space-y-4">
                     {projects.map((project, index) => (