Update styling and add new heading font

The styling of multiple components has been updated for consistency and readability. A new heading font has been added to improve visual hierarchy. Changes include updating font sizes, adding a new heading font, and adjusting borders and padding over several components.

apps/web/app/(marketing)/_components/site-page-header.tsx

@@ -7,10 +7,12 @@ export function SitePageHeader(props: {
 }) {
   return (
     <div className={cn('border-b py-8 xl:py-12 2xl:py-14', props.className)}>
-      <div className={'container flex flex-col space-y-4'}>
-        <h1 className={'font-base text-3xl xl:text-5xl'}>{props.title}</h1>
+      <div className={'container flex flex-col space-y-2 lg:space-y-4'}>
+        <h1 className={'font-base font-heading text-3xl xl:text-5xl'}>
+          {props.title}
+        </h1>
 
-        <h2 className={'text-muted-foreground xl:text-lg 2xl:text-xl'}>
+        <h2 className={'text-lg text-muted-foreground 2xl:text-2xl'}>
           {props.subtitle}
         </h2>
       </div>