feat: change main font to Schibsted Grotesk, adjust sizes

components/comments/comments.tsx

@@ -51,7 +51,7 @@ const Comments = async ({ slug }: { slug: string }) => {
           ))}
         </div>
       ) : (
-        <div className="py-8 text-center text-lg font-medium tracking-tight text-foreground/80">
+        <div className="py-8 text-center text-lg font-medium text-foreground/80">
           Be the first to comment!
         </div>
       )}

components/layout/header.tsx

@@ -93,7 +93,7 @@ const contactLinks = [
   {
     label: "Mastodon",
     value: authorConfig.social.mastodon,
-    href: `https://${authorConfig.social.mastodon}`,
+    href: authorConfig.social.mastodon.replace(/^@([^@]+)@(.+)$/, "https://$2/@$1"),
     Icon: (props: React.SVGProps<SVGSVGElement>) => (
       <svg
         xmlns="http://www.w3.org/2000/svg"
@@ -317,12 +317,7 @@ const Header = ({ className }: { className?: string }) => {
               quality={75}
               priority
             />
-            <span
-              className={cn(
-                "text-[17.5px] font-medium tracking-[-0.0375em] whitespace-nowrap",
-                "max-md:sr-only",
-              )}
-            >
+            <span className={cn("text-[17.5px] font-medium whitespace-nowrap", "max-md:sr-only")}>
               {siteConfig.name}
             </span>
           </Link>

components/layout/page-title.tsx

@@ -11,10 +11,7 @@ const PageTitle = ({
   canonical: string;
 }) => (
   <h1
-    className={cn(
-      "not-prose mt-0 mb-6 text-left text-2xl font-medium tracking-tight lowercase",
-      className,
-    )}
+    className={cn("not-prose mt-0 mb-6 text-left text-2xl font-medium lowercase", className)}
     {...rest}
   >
     <Link

components/post-stats.tsx

@@ -72,7 +72,7 @@ const PostStats = ({ slug }: { slug: string }) => {
       {viewCount > 0 && (
         <Badge
           variant="secondary"
-          className="gap-[5px] text-[11px] text-foreground/80 tabular-nums"
+          className="gap-[5px] text-xs font-medium tracking-wide text-foreground/80"
         >
           <IconEye className="text-foreground/65" aria-hidden="true" />
           {numberFormatter.format(viewCount)}
@@ -82,7 +82,7 @@ const PostStats = ({ slug }: { slug: string }) => {
       {commentCount > 0 && (
         <Badge
           variant="secondary"
-          className="gap-[5px] text-[11px] text-foreground/80 tabular-nums"
+          className="gap-[5px] text-xs font-medium tracking-wide text-foreground/80"
           render={
             <Link
               href={`/${slug}#comments`}