fix: eliminate excessive top space under navigation bar across all pages and links page

src/components/About.tsx

@@ -20,7 +20,7 @@ export default function About({ settings, experience, education = [] }: AboutPro
   const hasEducation = education && education.length > 0;
 
   return (
-    <section id="about" className="py-20 relative">
+    <section id="about" className="py-12 sm:py-16 relative">
       <div className="max-w-6xl mx-auto px-4 sm:px-6 relative z-10">
 
         {/* Section Header */}

src/components/Certifications.tsx

@@ -36,7 +36,7 @@ export default function Certifications({ certifications, extraCerts = [] }: Prop
   };
 
   return (
-    <section id="certifications" className="py-16 sm:py-20 relative">
+    <section id="certifications" className="pt-6 sm:pt-10 pb-16 sm:pb-20 relative">
       <div className="max-w-6xl mx-auto px-4 sm:px-6 relative z-10">
 
         {/* Section Header */}

src/components/Hero.tsx

@@ -204,7 +204,7 @@ export default function Hero({
   return (
     <section
       id="home"
-      className="relative min-h-screen flex flex-col md:flex-row items-center justify-center pt-24 md:pt-28 pb-10 md:pb-0 overflow-hidden"
+      className="relative min-h-[calc(100vh-60px)] flex flex-col md:flex-row items-center justify-center pt-6 sm:pt-8 pb-10 md:pb-12 overflow-hidden"
     >
       <div className="container mx-auto px-6 max-w-5xl relative z-10 grid grid-cols-1 md:grid-cols-12 gap-8 md:gap-12 items-center">
         {/* Left Column: Text & Actions */}

src/pages/about.astro

@@ -20,7 +20,7 @@ const socialLinks = await getSocialLinks();
 >
 	<Navbar fullName={settings.fullName} logoImage={settings.logoImage} client:load />
 
-	<main class="flex-1 pt-24 pb-16">
+	<main class="flex-1 pb-16">
 		<AboutDetails settings={settings} experience={experience} education={education} client:load />
 		<SkillsList skills={skills} client:visible />
 	</main>

src/pages/certifications.astro

@@ -17,7 +17,7 @@ const socialLinks = await getSocialLinks();
 >
   <Navbar fullName={settings.fullName} logoImage={settings.logoImage} client:load />
 
-  <main class="flex-1 min-h-screen pt-8 pb-16">
+  <main class="flex-1 min-h-screen pb-16">
     <Certifications certifications={certifications} client:visible />
   </main>
 

src/pages/contact.astro

@@ -16,7 +16,7 @@ const socialLinks = await getSocialLinks();
 >
 	<Navbar fullName={settings.fullName} logoImage={settings.logoImage} client:load />
 
-	<main class="flex-1 pt-32 pb-24">
+	<main class="flex-1 pt-6 sm:pt-10 pb-16">
 		<ContactForm 
 			socialLinks={socialLinks}
 			contactHeading={settings.contactHeading}

src/pages/gallery.astro

@@ -17,7 +17,7 @@ const socialLinks = await getSocialLinks();
 >
   <Navbar fullName={settings.fullName} logoImage={settings.logoImage} client:load />
 
-  <main class="flex-1 min-h-screen pt-24 pb-16 px-4 sm:px-6">
+  <main class="flex-1 min-h-screen pt-6 sm:pt-8 pb-16 px-4 sm:px-6">
     <div class="max-w-6xl mx-auto">
       <PhotoGallery items={galleryItems} client:load />
     </div>

src/pages/links.astro

@@ -53,11 +53,17 @@ const getIconSvg = (platform: string) => {
   title={`Links & Socials | ${settings.fullName}`}
   description="Official social links, contact options, and developer directory for Cris Charles Garcia."
 >
+  <style is:global>
+    body {
+      padding-top: 0 !important;
+    }
+  </style>
+
   {/* True Linktree Style: No Header Nav and No Footer */}
-  <main class="min-h-screen py-10 px-4 sm:px-6 flex flex-col items-center justify-center relative">
+  <main class="min-h-screen pt-6 sm:pt-8 pb-12 px-4 sm:px-6 flex flex-col items-center justify-center relative">
     
     {/* Return to Main Portfolio Pill */}
-    <div class="w-full max-w-md flex justify-between items-center mb-6">
+    <div class="w-full max-w-md flex justify-between items-center mb-5">
       <a
         href="/"
         class="inline-flex items-center gap-1.5 px-3 py-1.5 rounded-full bg-foreground-custom/5 hover:bg-foreground-custom/10 text-muted-foreground-custom hover:text-foreground-custom text-xs font-mono border border-border-custom transition-all"

src/pages/projects.astro

@@ -17,7 +17,7 @@ const socialLinks = await getSocialLinks();
 >
 	<Navbar fullName={settings.fullName} logoImage={settings.logoImage} client:load />
 
-	<main class="flex-1 pt-32 pb-24">
+	<main class="flex-1 pt-6 sm:pt-10 pb-16">
 		<div class="container mx-auto px-6 max-w-5xl text-center mb-12">
 			<h1 class="text-4xl md:text-6xl font-bold font-heading mb-4 text-glow bg-clip-text text-transparent bg-gradient-to-r from-foreground-custom to-primary-custom">
 				All Work

src/pages/projects/[slug].astro

@@ -22,7 +22,7 @@ if (!project) {
 >
 	<Navbar fullName={settings.fullName} logoImage={settings.logoImage} client:load />
 
-	<main class="flex-1 pt-32 pb-24 relative overflow-hidden">
+	<main class="flex-1 pt-6 sm:pt-10 pb-16 relative overflow-hidden">
 		<!-- Background elements -->
 		<div className="absolute inset-0 z-0 overflow-hidden pointer-events-none">
 			<div className="absolute -top-40 left-1/4 w-[500px] h-[500px] rounded-full bg-primary-custom/5 blur-3xl" />