Refactor styles in Hero2.astro and index.astro for improved responsiveness and layout

- Adjusted padding and margin for elements in Hero2.astro to enhance layout consistency.
- Updated font sizes and margins for .neon-title and .neon-subtitle in index.astro to improve readability on various screen sizes.
- Introduced new media queries for better responsiveness across laptop, tablet, and mobile devices, ensuring a more adaptable design.

src/components/widgets/Hero2.astro

@@ -29,7 +29,7 @@ const {
   <div class="relative w-full px-0">
     <div class="pt-0 md:pt-[76px] pointer-events-none"></div>
     <div class="py-12 md:py-20 lg:py-0 lg:flex lg:items-center lg:h-screen lg:gap-8">
-      <div class="basis-1/2 text-center lg:text-left pb-10 md:pb-16 mx-auto pl-4 md:pl-8 lg:pl-12">
+      <div class="basis-1/2 text-center lg:text-left pb-10 md:pb-16 lg:pb-0 mx-auto pl-4 md:pl-8 lg:pl-12">
         {
           tagline && (
             <p
@@ -74,15 +74,15 @@ const {
         </div>
         {content && <Fragment set:html={content} />}
       </div>
-      <div class="basis-1/2">
+      <div class="basis-1/2 hidden lg:flex items-center justify-center px-4 md:px-8 lg:px-12">
         {
           image && (
-            <div class="relative m-auto max-w-5xl z-10">
+            <div class="relative w-full max-w-2xl z-10">
               {typeof image === 'string' ? (
                 <Fragment set:html={image} />
               ) : (
                 <Image
-                  class="mx-auto rounded-md w-full"
+                  class="rounded-md w-full"
                   widths={[400, 768, 1024, 2040]}
                   sizes="(max-width: 767px) 400px, (max-width: 1023px) 768px, (max-width: 2039px) 1024px, 2040px"
                   loading="eager"