diff --git a/packages/app/cypress/component/footer.cy.tsx b/packages/app/cypress/component/footer.cy.tsx
index 15c1baa..5c1dcb3 100644
--- a/packages/app/cypress/component/footer.cy.tsx
+++ b/packages/app/cypress/component/footer.cy.tsx
@@ -25,48 +25,45 @@ describe('Footer', () => {
     cy.get('[data-testid="footer-copyright"]').should('contain', year);
   });
 
-  it('shows the GitHub star CTA linking to GitHub repo', () => {
+  it('shows the GitHub star CTA', () => {
     cy.get('[data-testid="footer-star-cta"]').should('be.visible');
-    cy.get('[data-testid="footer-star-cta"]')
-      .should('have.attr', 'href')
-      .and('include', 'github.com/SemiAnalysisAI/InferenceX');
-  });
-
-  it('footer star CTA opens in new tab', () => {
-    cy.get('[data-testid="footer-star-cta"]').should('have.attr', 'target', '_blank');
+    cy.get('[data-testid="footer-star-cta"]').should('contain', 'Star');
   });
 
   it('shows social share buttons', () => {
-    cy.get('[data-testid="social-share-buttons"]').should('be.visible');
+    cy.get('[data-testid="footer-social-buttons"]').should('be.visible');
+    cy.get('[data-testid="footer-social-buttons"]')
+      .find('button')
+      .should('have.length.greaterThan', 1);
   });
 
   it('has Privacy Policy link', () => {
-    cy.get('[data-testid="footer"]')
-      .contains('Privacy Policy')
+    cy.get('[data-testid="footer-link-privacy"]')
       .should('have.attr', 'href')
       .and('include', 'semianalysis.com/privacy-policy');
   });
 
   it('has Cookie Policy link', () => {
-    cy.get('[data-testid="footer"]')
-      .contains('Cookie Policy')
+    cy.get('[data-testid="footer-link-cookies"]')
       .should('have.attr', 'href')
       .and('include', 'semianalysis.com/cookie-policy');
   });
 
-  it('has Contribute link pointing to GitHub', () => {
-    cy.get('[data-testid="footer"]')
-      .contains('Contribute')
+  it('has Contribute section with GitHub links', () => {
+    cy.get('[data-testid="footer-link-benchmarks"]')
       .should('have.attr', 'href')
       .and('include', 'github.com/SemiAnalysisAI/InferenceX');
+    cy.get('[data-testid="footer-link-frontend"]')
+      .should('have.attr', 'href')
+      .and('include', 'github.com/SemiAnalysisAI/InferenceX-app');
   });
 
   it('shows the SemiAnalysis logo', () => {
-    cy.get('[data-testid="footer"]').find('img[alt="SemiAnalysis logo"]').should('exist');
+    cy.get('[data-testid="footer-brand"]').find('img[alt="SemiAnalysis logo"]').should('exist');
   });
 
   it('all external links open in a new tab', () => {
-    cy.get('[data-testid="footer"]')
+    cy.get('[data-testid="footer-links"]')
       .find('a[target="_blank"]')
       .should('have.length.greaterThan', 0);
   });
diff --git a/packages/app/cypress/component/social-share.cy.tsx b/packages/app/cypress/component/social-share.cy.tsx
index 471eb76..4102410 100644
--- a/packages/app/cypress/component/social-share.cy.tsx
+++ b/packages/app/cypress/component/social-share.cy.tsx
@@ -1,42 +1,29 @@
-import { SocialShareButtons } from '@/components/social-share-buttons';
+import { ShareTwitterButton, ShareLinkedInButton } from '@/components/share-buttons';
 
-describe('Social Share Buttons', () => {
-  beforeEach(() => {
-    cy.mount(<SocialShareButtons />);
-  });
-
-  it('social share buttons container is visible', () => {
-    cy.get('[data-testid="social-share-buttons"]').should('be.visible');
-  });
-
-  it('Twitter share button is present and is a button element', () => {
+describe('Share Buttons', () => {
+  it('Twitter share button renders and is a button element', () => {
+    cy.mount(<ShareTwitterButton />);
     cy.get('[data-testid="share-twitter"]').should('exist');
     cy.get('[data-testid="share-twitter"]').should('have.prop', 'tagName', 'BUTTON');
   });
 
-  it('LinkedIn share button is present and is a button element', () => {
-    cy.get('[data-testid="share-linkedin"]').should('exist');
-    cy.get('[data-testid="share-linkedin"]').should('have.prop', 'tagName', 'BUTTON');
-  });
-
   it('Twitter share button has a descriptive title referencing Twitter or X', () => {
+    cy.mount(<ShareTwitterButton />);
     cy.get('[data-testid="share-twitter"]')
       .should('have.attr', 'title')
       .and('match', /Twitter|X/i);
   });
 
+  it('LinkedIn share button renders and is a button element', () => {
+    cy.mount(<ShareLinkedInButton />);
+    cy.get('[data-testid="share-linkedin"]').should('exist');
+    cy.get('[data-testid="share-linkedin"]').should('have.prop', 'tagName', 'BUTTON');
+  });
+
   it('LinkedIn share button has a descriptive title referencing LinkedIn', () => {
+    cy.mount(<ShareLinkedInButton />);
     cy.get('[data-testid="share-linkedin"]')
       .should('have.attr', 'title')
       .and('include', 'LinkedIn');
   });
 });
-
-describe('Social Share Buttons (compact)', () => {
-  it('renders in compact mode', () => {
-    cy.mount(<SocialShareButtons compact />);
-    cy.get('[data-testid="social-share-buttons"]').should('be.visible');
-    cy.get('[data-testid="share-twitter"]').should('exist');
-    cy.get('[data-testid="share-linkedin"]').should('exist');
-  });
-});
diff --git a/packages/app/public/file.svg b/packages/app/public/file.svg
deleted file mode 100644
index 004145c..0000000
--- a/packages/app/public/file.svg
+++ /dev/null
@@ -1 +0,0 @@
-<svg fill="none" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><path d="M14.5 13.5V5.41a1 1 0 0 0-.3-.7L9.8.29A1 1 0 0 0 9.08 0H1.5v13.5A2.5 2.5 0 0 0 4 16h8a2.5 2.5 0 0 0 2.5-2.5m-1.5 0v-7H8v-5H3v12a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1M9.5 5V2.12L12.38 5zM5.13 5h-.62v1.25h2.12V5zm-.62 3h7.12v1.25H4.5zm.62 3h-.62v1.25h7.12V11z" clip-rule="evenodd" fill="#666" fill-rule="evenodd"/></svg>
\ No newline at end of file
diff --git a/packages/app/public/github.svg b/packages/app/public/github.svg
deleted file mode 100644
index a058963..0000000
--- a/packages/app/public/github.svg
+++ /dev/null
@@ -1 +0,0 @@
-<svg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path d='M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12'/></svg>
\ No newline at end of file
diff --git a/packages/app/public/globe.svg b/packages/app/public/globe.svg
deleted file mode 100644
index 567f17b..0000000
--- a/packages/app/public/globe.svg
+++ /dev/null
@@ -1 +0,0 @@
-<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><g clip-path="url(#a)"><path fill-rule="evenodd" clip-rule="evenodd" d="M10.27 14.1a6.5 6.5 0 0 0 3.67-3.45q-1.24.21-2.7.34-.31 1.83-.97 3.1M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16m.48-1.52a7 7 0 0 1-.96 0H7.5a4 4 0 0 1-.84-1.32q-.38-.89-.63-2.08a40 40 0 0 0 3.92 0q-.25 1.2-.63 2.08a4 4 0 0 1-.84 1.31zm2.94-4.76q1.66-.15 2.95-.43a7 7 0 0 0 0-2.58q-1.3-.27-2.95-.43a18 18 0 0 1 0 3.44m-1.27-3.54a17 17 0 0 1 0 3.64 39 39 0 0 1-4.3 0 17 17 0 0 1 0-3.64 39 39 0 0 1 4.3 0m1.1-1.17q1.45.13 2.69.34a6.5 6.5 0 0 0-3.67-3.44q.65 1.26.98 3.1M8.48 1.5l.01.02q.41.37.84 1.31.38.89.63 2.08a40 40 0 0 0-3.92 0q.25-1.2.63-2.08a4 4 0 0 1 .85-1.32 7 7 0 0 1 .96 0m-2.75.4a6.5 6.5 0 0 0-3.67 3.44 29 29 0 0 1 2.7-.34q.31-1.83.97-3.1M4.58 6.28q-1.66.16-2.95.43a7 7 0 0 0 0 2.58q1.3.27 2.95.43a18 18 0 0 1 0-3.44m.17 4.71q-1.45-.12-2.69-.34a6.5 6.5 0 0 0 3.67 3.44q-.65-1.27-.98-3.1" fill="#666"/></g><defs><clipPath id="a"><path fill="#fff" d="M0 0h16v16H0z"/></clipPath></defs></svg>
\ No newline at end of file
diff --git a/packages/app/public/next.svg b/packages/app/public/next.svg
deleted file mode 100644
index 5174b28..0000000
--- a/packages/app/public/next.svg
+++ /dev/null
@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 394 80"><path fill="#000" d="M262 0h68.5v12.7h-27.2v66.6h-13.6V12.7H262V0ZM149 0v12.7H94v20.4h44.3v12.6H94v21h55v12.6H80.5V0h68.7zm34.3 0h-17.8l63.8 79.4h17.9l-32-39.7 32-39.6h-17.9l-23 28.6-23-28.6zm18.3 56.7-9-11-27.1 33.7h17.8l18.3-22.7z"/><path fill="#000" d="M81 79.3 17 0H0v79.3h13.6V17l50.2 62.3H81Zm252.6-.4c-1 0-1.8-.4-2.5-1s-1.1-1.6-1.1-2.6.3-1.8 1-2.5 1.6-1 2.6-1 1.8.3 2.5 1a3.4 3.4 0 0 1 .6 4.3 3.7 3.7 0 0 1-3 1.8zm23.2-33.5h6v23.3c0 2.1-.4 4-1.3 5.5a9.1 9.1 0 0 1-3.8 3.5c-1.6.8-3.5 1.3-5.7 1.3-2 0-3.7-.4-5.3-1s-2.8-1.8-3.7-3.2c-.9-1.3-1.4-3-1.4-5h6c.1.8.3 1.6.7 2.2s1 1.2 1.6 1.5c.7.4 1.5.5 2.4.5 1 0 1.8-.2 2.4-.6a4 4 0 0 0 1.6-1.8c.3-.8.5-1.8.5-3V45.5zm30.9 9.1a4.4 4.4 0 0 0-2-3.3 7.5 7.5 0 0 0-4.3-1.1c-1.3 0-2.4.2-3.3.5-.9.4-1.6 1-2 1.6a3.5 3.5 0 0 0-.3 4c.3.5.7.9 1.3 1.2l1.8 1 2 .5 3.2.8c1.3.3 2.5.7 3.7 1.2a13 13 0 0 1 3.2 1.8 8.1 8.1 0 0 1 3 6.5c0 2-.5 3.7-1.5 5.1a10 10 0 0 1-4.4 3.5c-1.8.8-4.1 1.2-6.8 1.2-2.6 0-4.9-.4-6.8-1.2-2-.8-3.4-2-4.5-3.5a10 10 0 0 1-1.7-5.6h6a5 5 0 0 0 3.5 4.6c1 .4 2.2.6 3.4.6 1.3 0 2.5-.2 3.5-.6 1-.4 1.8-1 2.4-1.7a4 4 0 0 0 .8-2.4c0-.9-.2-1.6-.7-2.2a11 11 0 0 0-2.1-1.4l-3.2-1-3.8-1c-2.8-.7-5-1.7-6.6-3.2a7.2 7.2 0 0 1-2.4-5.7 8 8 0 0 1 1.7-5 10 10 0 0 1 4.3-3.5c2-.8 4-1.2 6.4-1.2 2.3 0 4.4.4 6.2 1.2 1.8.8 3.2 2 4.3 3.4 1 1.4 1.5 3 1.5 5h-5.8z"/></svg>
\ No newline at end of file
diff --git a/packages/app/public/vercel.svg b/packages/app/public/vercel.svg
deleted file mode 100644
index 7705396..0000000
--- a/packages/app/public/vercel.svg
+++ /dev/null
@@ -1 +0,0 @@
-<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1155 1000"><path d="m577.3 0 577.4 1000H0z" fill="#fff"/></svg>
\ No newline at end of file
diff --git a/packages/app/public/window.svg b/packages/app/public/window.svg
deleted file mode 100644
index b2b2a44..0000000
--- a/packages/app/public/window.svg
+++ /dev/null
@@ -1 +0,0 @@
-<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path fill-rule="evenodd" clip-rule="evenodd" d="M1.5 2.5h13v10a1 1 0 0 1-1 1h-11a1 1 0 0 1-1-1zM0 1h16v11.5a2.5 2.5 0 0 1-2.5 2.5h-11A2.5 2.5 0 0 1 0 12.5zm3.75 4.5a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5M7 4.75a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0m1.75.75a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5" fill="#666"/></svg>
\ No newline at end of file
diff --git a/packages/app/src/app/error.tsx b/packages/app/src/app/error.tsx
index ce22e55..a03d268 100644
--- a/packages/app/src/app/error.tsx
+++ b/packages/app/src/app/error.tsx
@@ -16,7 +16,7 @@ export default function Error({
   }, [error]);
 
   return (
-    <div className="flex flex-col items-center justify-center min-h-screen text-foreground">
+    <div className="flex flex-col items-center justify-center grow text-foreground">
       <h2 className="text-4xl font-bold mb-4">Something went wrong!</h2>
       <p className="text-lg mb-4">An unexpected error has occurred.</p>
       <p className="text-md text-red-500 mb-8">{error.message}</p>
diff --git a/packages/app/src/app/layout.tsx b/packages/app/src/app/layout.tsx
index 4dbb344..ad753cf 100644
--- a/packages/app/src/app/layout.tsx
+++ b/packages/app/src/app/layout.tsx
@@ -159,7 +159,7 @@ export default function RootLayout({
         <link rel="preconnect" href={SITE_URL} />
         <link rel="dns-prefetch" href={SITE_URL} />
       </head>
-      <body className={`${dm_sans.variable} antialiased relative`}>
+      <body className={`${dm_sans.variable} antialiased relative min-h-screen flex flex-col`}>
         <PostHogProvider>
           <script
             type="application/ld+json"
@@ -174,7 +174,7 @@ export default function RootLayout({
             >
               <PostHogPageView />
               <Header />
-              {children}
+              <div className="grow flex flex-col">{children}</div>
               <Footer />
             </ThemeProvider>
           </QueryProvider>
diff --git a/packages/app/src/app/not-found.tsx b/packages/app/src/app/not-found.tsx
index 0d893fd..2a7c96a 100644
--- a/packages/app/src/app/not-found.tsx
+++ b/packages/app/src/app/not-found.tsx
@@ -2,7 +2,7 @@ import Link from 'next/link';
 
 export default function NotFound() {
   return (
-    <div className="flex flex-col items-center justify-center min-h-screen text-foreground">
+    <div className="flex flex-col items-center justify-center grow text-foreground">
       <h1 className="text-4xl font-bold mb-4">404 - Page Not Found</h1>
       <p className="text-lg mb-8">The page you are looking for does not exist.</p>
       <Link
diff --git a/packages/app/src/components/calculator/ThroughputCalculatorDisplay.tsx b/packages/app/src/components/calculator/ThroughputCalculatorDisplay.tsx
index ae5910d..8aafe0a 100644
--- a/packages/app/src/components/calculator/ThroughputCalculatorDisplay.tsx
+++ b/packages/app/src/components/calculator/ThroughputCalculatorDisplay.tsx
@@ -20,7 +20,7 @@ import { ExternalLinkIcon } from '@/components/ui/external-link-icon';
 import { Input } from '@/components/ui/input';
 import { LabelWithTooltip } from '@/components/ui/label-with-tooltip';
 import { ShareButton } from '@/components/ui/share-button';
-import { SocialShareButtons } from '@/components/social-share-buttons';
+import { ShareTwitterButton, ShareLinkedInButton } from '@/components/share-buttons';
 import { TooltipProvider } from '@/components/ui/tooltip';
 import {
   Select,
@@ -501,7 +501,10 @@ export default function ThroughputCalculatorDisplay() {
               </div>
               <div className="flex items-center gap-1.5">
                 <ShareButton />
-                <SocialShareButtons compact className="hidden sm:flex" />
+                <div className="hidden sm:flex items-center gap-1.5">
+                  <ShareTwitterButton />
+                  <ShareLinkedInButton />
+                </div>
               </div>
             </div>
 
diff --git a/packages/app/src/components/evaluation/ui/ChartDisplay.tsx b/packages/app/src/components/evaluation/ui/ChartDisplay.tsx
index 25a6fa4..3ee0fc1 100644
--- a/packages/app/src/components/evaluation/ui/ChartDisplay.tsx
+++ b/packages/app/src/components/evaluation/ui/ChartDisplay.tsx
@@ -6,7 +6,7 @@ import { useEvaluation } from '@/components/evaluation/EvaluationContext';
 import { Card } from '@/components/ui/card';
 import { ChartSection } from '@/components/ui/chart-section';
 import { ShareButton } from '@/components/ui/share-button';
-import { SocialShareButtons } from '@/components/social-share-buttons';
+import { ShareTwitterButton, ShareLinkedInButton } from '@/components/share-buttons';
 import { isModelExperimental, Model } from '@/lib/data-mappings';
 import { exportToCsv } from '@/lib/csv-export';
 import { evaluationChartToCsv } from '@/lib/csv-export-helpers';
@@ -39,7 +39,10 @@ export default function EvaluationChartDisplay() {
               </div>
               <div className="flex items-center gap-1.5">
                 <ShareButton />
-                <SocialShareButtons compact className="hidden sm:flex" />
+                <div className="hidden sm:flex items-center gap-1.5">
+                  <ShareTwitterButton />
+                  <ShareLinkedInButton />
+                </div>
               </div>
             </div>
             <EvaluationChartControls />
diff --git a/packages/app/src/components/footer/footer-star-cta.tsx b/packages/app/src/components/footer/footer-star-cta.tsx
index f0b954b..29baba3 100644
--- a/packages/app/src/components/footer/footer-star-cta.tsx
+++ b/packages/app/src/components/footer/footer-star-cta.tsx
@@ -1,38 +1,46 @@
 'use client';
 
+import { useState, useEffect } from 'react';
+
 import { Button } from '@/components/ui/button';
+import { STARRED_KEY, saveStarred } from '@/components/github-star-modal';
 import { track } from '@/lib/analytics';
 import { Star } from 'lucide-react';
-import Link from 'next/link';
 
 import { useGitHubStars } from '@/hooks/api/use-github-stars';
 
 const GITHUB_REPO_URL = 'https://github.com/SemiAnalysisAI/InferenceX';
 
-export function FooterStarButton() {
+export function StarButton() {
   const { data } = useGitHubStars();
   const stars = data?.stars ?? null;
+  const [hasStarred, setHasStarred] = useState(false);
+
+  useEffect(() => {
+    try {
+      setHasStarred(!!localStorage.getItem(STARRED_KEY));
+    } catch {}
+  }, []);
 
   return (
     <Button
       variant="outline"
       size="sm"
-      className="h-7 gap-1.5 text-xs"
-      asChild
+      className={`h-7 gap-1.5 text-xs${hasStarred ? '' : ' star-button-glow'}`}
+      title="Star on GitHub"
       data-testid="footer-star-cta"
+      onClick={() => {
+        saveStarred();
+        setHasStarred(true);
+        track('footer_star_cta_clicked', { stars: stars ?? 0 });
+        window.open(GITHUB_REPO_URL, '_blank', 'noopener,noreferrer');
+      }}
     >
-      <Link
-        href={GITHUB_REPO_URL}
-        target="_blank"
-        rel="noopener noreferrer"
-        onClick={() => track('footer_star_cta_clicked', { stars: stars ?? 0 })}
-      >
-        <Star className="h-3.5 w-3.5 text-yellow-500 fill-yellow-500" />
-        <span>Star</span>
-        {stars !== null && (
-          <span className="font-semibold text-muted-foreground">{stars.toLocaleString()}</span>
-        )}
-      </Link>
+      <Star className="h-3.5 w-3.5 text-yellow-500 fill-yellow-500" />
+      <span>Star</span>
+      {stars !== null && (
+        <span className="font-semibold text-muted-foreground">{stars.toLocaleString()}</span>
+      )}
     </Button>
   );
 }
diff --git a/packages/app/src/components/footer/footer.tsx b/packages/app/src/components/footer/footer.tsx
index d09746c..b5f4699 100644
--- a/packages/app/src/components/footer/footer.tsx
+++ b/packages/app/src/components/footer/footer.tsx
@@ -1,17 +1,18 @@
 import Image from 'next/image';
 import Link from 'next/link';
 
-import { SocialShareButtons } from '@/components/social-share-buttons';
 import { cn } from '@/lib/utils';
 
-import { FooterStarButton } from './footer-star-cta';
+import { ShareTwitterButton, ShareLinkedInButton } from '@/components/share-buttons';
+
+import { StarButton } from './footer-star-cta';
 
 export const Footer = () => {
   return (
     <footer
       data-testid="footer"
       className={cn(
-        'w-full',
+        'relative w-full overflow-visible mt-auto pt-8',
         'before:absolute',
         'before:bg-muted/50',
         'dark:before:bg-muted',
@@ -19,7 +20,7 @@ export const Footer = () => {
         'before:content-[""]',
         'before:hidden lg:before:block',
         'before:w-1/2',
-        'before:h-full',
+        'before:h-[200%]',
         'before:right-0',
         "before:mask-[url('/left-pattern-full.svg')]",
         'before:mask-no-repeat',
@@ -29,68 +30,148 @@ export const Footer = () => {
         'before:-z-10',
       )}
     >
-      <div className="container mx-auto py-8 px-4 flex flex-col items-center justify-center">
-        {/* Open Source CTA */}
-        <div className="flex flex-col items-center gap-3 mb-6 pb-6 border-b border-border/40">
-          <p className="text-sm text-muted-foreground text-center max-w-md">
-            InferenceX is open source. If this data helps your work, star us or share with your
-            network.
-          </p>
-          <div className="flex items-center gap-1.5">
-            <FooterStarButton />
-            <SocialShareButtons compact />
+      <div className="container mx-auto px-4 lg:px-8 py-12">
+        {/* Main grid */}
+        <div className="flex flex-col md:flex-row md:justify-between gap-10 md:gap-8 mb-10">
+          {/* Left — Brand */}
+          <div
+            data-testid="footer-brand"
+            className="flex flex-col gap-4 items-center md:items-start"
+          >
+            <Link
+              data-testid="footer-brand-link"
+              target="_blank"
+              href="https://semianalysis.com/"
+              className="inline-block w-35 h-14.5"
+            >
+              <Image
+                width={140}
+                height={58}
+                src="/logo.png"
+                alt="SemiAnalysis logo"
+                className="hidden dark:block"
+              />
+              <Image
+                width={140}
+                height={58}
+                src="/logo-black.png"
+                alt="SemiAnalysis logo"
+                className="dark:hidden"
+              />
+            </Link>
+            <p
+              data-testid="footer-brand-description"
+              className="text-sm text-muted-foreground max-w-xs text-center md:text-left"
+            >
+              Continuous open-source inference benchmarking. Real-world, reproducible, auditable
+              performance data you can trust.
+            </p>
           </div>
-        </div>
 
-        {/* Policy Links */}
-        <nav className="mb-4">
-          <ul className="flex flex-wrap justify-center gap-x-4 gap-y-2 text-sm text-muted-foreground">
-            <li>
+          {/* Center — Links */}
+          <div data-testid="footer-links" className="flex justify-evenly gap-6">
+            <div data-testid="footer-links-semianalysis" className="flex flex-col gap-2.5">
+              <span className="text-sm font-medium text-foreground">SemiAnalysis</span>
+              <a
+                data-testid="footer-link-main-site"
+                href="https://semianalysis.com"
+                target="_blank"
+                rel="noopener noreferrer"
+                className="text-sm text-muted-foreground hover:text-foreground transition-colors"
+              >
+                Main Site
+              </a>
               <a
+                data-testid="footer-link-newsletter"
+                href="https://newsletter.semianalysis.com"
+                target="_blank"
+                rel="noopener noreferrer"
+                className="text-sm text-muted-foreground hover:text-foreground transition-colors"
+              >
+                Newsletter
+              </a>
+              <a
+                data-testid="footer-link-about"
+                href="https://semianalysis.com/about/"
+                target="_blank"
+                rel="noopener noreferrer"
+                className="text-sm text-muted-foreground hover:text-foreground transition-colors"
+              >
+                About
+              </a>
+            </div>
+            <div data-testid="footer-links-legal" className="flex flex-col gap-2.5">
+              <span className="text-sm font-medium text-foreground">Legal</span>
+              <a
+                data-testid="footer-link-privacy"
                 href="https://semianalysis.com/privacy-policy/"
-                className="underline hover:text-foreground"
                 target="_blank"
                 rel="noopener noreferrer"
+                className="text-sm text-muted-foreground hover:text-foreground transition-colors"
               >
                 Privacy Policy
               </a>
-            </li>
-            <li>
               <a
+                data-testid="footer-link-cookies"
                 href="https://semianalysis.com/cookie-policy/"
-                className="underline hover:text-foreground"
                 target="_blank"
                 rel="noopener noreferrer"
+                className="text-sm text-muted-foreground hover:text-foreground transition-colors"
               >
                 Cookie Policy
               </a>
-            </li>
-            <li>
+            </div>
+            <div data-testid="footer-links-contribute" className="flex flex-col gap-2.5">
+              <span className="text-sm font-medium text-foreground">Contribute</span>
               <a
+                data-testid="footer-link-benchmarks"
                 href="https://github.com/SemiAnalysisAI/InferenceX"
-                className="underline hover:text-foreground"
                 target="_blank"
                 rel="noopener noreferrer"
+                className="text-sm text-muted-foreground hover:text-foreground transition-colors"
               >
-                Contribute
+                Benchmarks
               </a>
-            </li>
-          </ul>
-        </nav>
+              <a
+                data-testid="footer-link-frontend"
+                href="https://github.com/SemiAnalysisAI/InferenceX-app"
+                target="_blank"
+                rel="noopener noreferrer"
+                className="text-sm text-muted-foreground hover:text-foreground transition-colors"
+              >
+                Frontend
+              </a>
+            </div>
+          </div>
 
-        {/* Copyright Notice */}
-        <p data-testid="footer-copyright" className="text-sm text-muted-foreground text-center">
-          &copy; {new Date().getFullYear()} semianalysis.com All rights reserved.
-        </p>
+          {/* Right — CTA + Social */}
+          <div data-testid="footer-cta" className="flex flex-col gap-4 items-center md:items-end">
+            <div data-testid="footer-social-buttons" className="flex items-center gap-1.5">
+              <div className="rounded-md bg-background/80 w-fit">
+                <StarButton />
+              </div>
+              <div className="rounded-md bg-background/80 w-fit">
+                <ShareTwitterButton />
+              </div>
+              <div className="rounded-md bg-background/80 w-fit">
+                <ShareLinkedInButton />
+              </div>
+            </div>
+            <p className="text-sm text-muted-foreground text-center md:text-right max-w-xs">
+              If this data helps your work, consider starring us on GitHub or sharing with your
+              network.
+            </p>
+          </div>
+        </div>
 
-        {/* Logo Section */}
-        <div className="mt-4 flex items-center justify-center">
-          <Link target="_blank" className="hidden dark:block" href="https://semianalysis.com/">
-            <Image width={184} height={76} src="/logo.png" alt="SemiAnalysis logo" />
-          </Link>
-          <Link target="_blank" className="dark:hidden" href="https://semianalysis.com/">
-            <Image width={184} height={76} src="/logo-black.png" alt="SemiAnalysis logo" />
-          </Link>
+        {/* Bottom bar */}
+        <div
+          data-testid="footer-bottom-bar"
+          className="border-t border-border/40 pt-6 flex flex-col md:flex-row items-center justify-between gap-4"
+        >
+          <p data-testid="footer-copyright" className="text-xs text-muted-foreground">
+            &copy; {new Date().getFullYear()} semianalysis.com. All rights reserved.
+          </p>
         </div>
       </div>
     </footer>
diff --git a/packages/app/src/components/gpu-specs/gpu-specs-content.tsx b/packages/app/src/components/gpu-specs/gpu-specs-content.tsx
index 91ecf77..a2cf2cc 100644
--- a/packages/app/src/components/gpu-specs/gpu-specs-content.tsx
+++ b/packages/app/src/components/gpu-specs/gpu-specs-content.tsx
@@ -6,7 +6,7 @@ import { BarChart3, Radar, Table2 } from 'lucide-react';
 
 import { Card } from '@/components/ui/card';
 import { ShareButton } from '@/components/ui/share-button';
-import { SocialShareButtons } from '@/components/social-share-buttons';
+import { ShareTwitterButton, ShareLinkedInButton } from '@/components/share-buttons';
 import {
   formatTflops,
   getScaleUpDomainMemory,
@@ -293,7 +293,10 @@ export function GpuSpecsContent() {
             </div>
             <div className="flex items-center gap-1.5">
               <ShareButton />
-              <SocialShareButtons compact className="hidden sm:flex" />
+              <div className="hidden sm:flex items-center gap-1.5">
+                <ShareTwitterButton />
+                <ShareLinkedInButton />
+              </div>
             </div>
           </div>
         </Card>
diff --git a/packages/app/src/components/header/GithubStars.tsx b/packages/app/src/components/header/GithubStars.tsx
index 2c7ee62..2f4e61c 100644
--- a/packages/app/src/components/header/GithubStars.tsx
+++ b/packages/app/src/components/header/GithubStars.tsx
@@ -1,7 +1,9 @@
 'use client';
 
+import { useState, useEffect } from 'react';
 import Link from 'next/link';
 
+import { STARRED_KEY, saveStarred } from '@/components/github-star-modal';
 import { useGitHubStars } from '@/hooks/api/use-github-stars';
 
 interface GitHubStarsProps {
@@ -12,6 +14,13 @@ interface GitHubStarsProps {
 export function GitHubStars({ owner, repo }: GitHubStarsProps) {
   const { data } = useGitHubStars();
   const stars = data?.owner === owner && data?.repo === repo ? data.stars : null;
+  const [hasStarred, setHasStarred] = useState(false);
+
+  useEffect(() => {
+    try {
+      setHasStarred(!!localStorage.getItem(STARRED_KEY));
+    } catch {}
+  }, []);
 
   return (
     <Link
@@ -19,7 +28,11 @@ export function GitHubStars({ owner, repo }: GitHubStarsProps) {
       target="_blank"
       rel="noopener noreferrer"
       data-testid="header-star-button"
-      className="star-button-glow flex items-center gap-1.5 px-3 py-1.5 rounded-md border border-gray-300 dark:border-gray-600 hover:bg-gray-100 dark:hover:bg-gray-800 hover:border-primary/50 dark:hover:border-primary/50 transition-colors"
+      onClick={() => {
+        saveStarred();
+        setHasStarred(true);
+      }}
+      className={`${hasStarred ? '' : 'star-button-glow '}flex items-center gap-1.5 px-3 py-1.5 rounded-md border border-gray-300 dark:border-gray-600 hover:bg-gray-100 dark:hover:bg-gray-800 hover:border-primary/50 dark:hover:border-primary/50 transition-colors`}
     >
       {/* Star Icon */}
       <svg
@@ -36,18 +49,9 @@ export function GitHubStars({ owner, repo }: GitHubStarsProps) {
           d="M11.48 3.499a.562.562 0 011.04 0l2.125 5.111a.563.563 0 00.475.345l5.518.442c.499.04.701.663.321.988l-4.204 3.602a.563.563 0 00-.182.557l1.285 5.385a.562.562 0 01-.84.61l-4.725-2.885a.563.563 0 00-.586 0L6.982 20.54a.562.562 0 01-.84-.61l1.285-5.386a.562.562 0 00-.182-.557l-4.204-3.602a.563.563 0 01.321-.988l5.518-.442a.563.563 0 00.475-.345L11.48 3.5z"
         />
       </svg>
-      {/* GitHub Icon */}
-      <svg
-        xmlns="http://www.w3.org/2000/svg"
-        viewBox="0 0 16 16"
-        fill="currentColor"
-        className="w-4 h-4"
-      >
-        <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z" />
-      </svg>
       <span className="text-sm font-medium">Star</span>
       {stars !== null && (
-        <span className="text-xs font-semibold text-gray-600 dark:text-gray-400">
+        <span className="text-xs font-semibold text-gray-600 dark:text-gray-400 self-center">
           {stars.toLocaleString()}
         </span>
       )}
diff --git a/packages/app/src/components/inference/ui/ChartDisplay.tsx b/packages/app/src/components/inference/ui/ChartDisplay.tsx
index 353a38d..7f1edc4 100644
--- a/packages/app/src/components/inference/ui/ChartDisplay.tsx
+++ b/packages/app/src/components/inference/ui/ChartDisplay.tsx
@@ -22,7 +22,7 @@ import {
 } from '@/components/ui/dialog';
 import { ExternalLinkIcon } from '@/components/ui/external-link-icon';
 import { ShareButton } from '@/components/ui/share-button';
-import { SocialShareButtons } from '@/components/social-share-buttons';
+import { ShareTwitterButton, ShareLinkedInButton } from '@/components/share-buttons';
 import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover';
 import { Skeleton } from '@/components/ui/skeleton';
 import { useUnofficialRun } from '@/components/unofficial-run-provider';
@@ -666,7 +666,10 @@ export default function ChartDisplay() {
               </div>
               <div className="flex items-center gap-1.5">
                 <ShareButton />
-                <SocialShareButtons compact className="hidden sm:flex" />
+                <div className="hidden sm:flex items-center gap-1.5">
+                  <ShareTwitterButton />
+                  <ShareLinkedInButton />
+                </div>
               </div>
             </div>
             <ChartControls intermediateDates={intermediateDates} />
diff --git a/packages/app/src/components/media/media-content.tsx b/packages/app/src/components/media/media-content.tsx
index 49e973c..c4080bc 100644
--- a/packages/app/src/components/media/media-content.tsx
+++ b/packages/app/src/components/media/media-content.tsx
@@ -51,7 +51,7 @@ function MediaCard({ title, organization, url, type, date }: MediaItem) {
         >
           <h3 className="text-sm sm:text-base lg:text-lg font-medium leading-snug text-foreground group-hover:text-primary transition-colors italic group-hover:underline">
             &ldquo;{title}&rdquo;
-            <ExternalLinkIcon className="ml-1.5 inline-block h-[0.85em] w-[0.85em] opacity-50 group-hover:opacity-100 transition-opacity" />
+            <ExternalLinkIcon />
           </h3>
         </a>
       </div>
@@ -61,7 +61,7 @@ function MediaCard({ title, organization, url, type, date }: MediaItem) {
 
 export function MediaContent() {
   return (
-    <main className="relative min-h-screen">
+    <main className="relative">
       <div className="container mx-auto px-4 lg:px-8 flex flex-col gap-16 lg:gap-4">
         <section>
           <Card>
diff --git a/packages/app/src/components/page-content.tsx b/packages/app/src/components/page-content.tsx
index 5216b43..d1499fb 100644
--- a/packages/app/src/components/page-content.tsx
+++ b/packages/app/src/components/page-content.tsx
@@ -251,7 +251,7 @@ export function PageContent({ initialTab = 'inference' }: { initialTab?: string
       <StarNudge />
       <ExportNudge />
       <UnofficialRunProvider>
-        <main className="relative min-h-screen">
+        <main className="relative">
           <div className="container mx-auto px-4 lg:px-8 flex flex-col gap-6 lg:gap-4">
             <section>
               <Card data-testid="intro-section">
diff --git a/packages/app/src/components/quote-carousel.tsx b/packages/app/src/components/quote-carousel.tsx
index 131151b..7e10a23 100644
--- a/packages/app/src/components/quote-carousel.tsx
+++ b/packages/app/src/components/quote-carousel.tsx
@@ -80,10 +80,10 @@ function QuoteBlock({ quote }: { quote: CarouselQuote }) {
               href={quote.link}
               target="_blank"
               rel="noopener noreferrer"
-              className="font-semibold text-foreground hover:text-brand transition-colors group/link"
+              className="font-semibold text-foreground hover:text-brand transition-colors group"
             >
-              <span className="group-hover/link:underline">{quote.name}</span>{' '}
-              <ExternalLinkIcon className="ml-1 inline-block h-[0.85em] w-[0.85em]" />
+              <span className="group-hover:underline">{quote.name}</span>
+              <ExternalLinkIcon />
             </a>
           ) : (
             <span className="font-semibold text-foreground">{quote.name}</span>
diff --git a/packages/app/src/components/quotes/quotes-content.tsx b/packages/app/src/components/quotes/quotes-content.tsx
index da575c9..ecad8e4 100644
--- a/packages/app/src/components/quotes/quotes-content.tsx
+++ b/packages/app/src/components/quotes/quotes-content.tsx
@@ -36,10 +36,10 @@ function QuoteCard({
               href={link}
               target="_blank"
               rel="noopener noreferrer"
-              className="font-semibold text-foreground hover:text-brand transition-colors group/link"
+              className="font-semibold text-foreground hover:text-brand transition-colors group"
             >
-              <span className="group-hover/link:underline">{name}</span>{' '}
-              <ExternalLinkIcon className="ml-1 inline-block h-[0.85em] w-[0.85em]" />
+              <span className="group-hover:underline">{name}</span>
+              <ExternalLinkIcon />
             </a>
           ) : (
             <span className="font-semibold text-foreground">{name}</span>
@@ -55,7 +55,7 @@ function QuoteCard({
 
 export function QuotesContent() {
   return (
-    <main className="relative min-h-screen">
+    <main className="relative">
       <div className="container mx-auto px-4 lg:px-8 flex flex-col gap-16 lg:gap-4">
         <section>
           <Card>
diff --git a/packages/app/src/components/reliability/ui/ChartDisplay.tsx b/packages/app/src/components/reliability/ui/ChartDisplay.tsx
index d18a5dd..d734aeb 100644
--- a/packages/app/src/components/reliability/ui/ChartDisplay.tsx
+++ b/packages/app/src/components/reliability/ui/ChartDisplay.tsx
@@ -6,7 +6,7 @@ import { useReliabilityContext } from '@/components/reliability/ReliabilityConte
 import { Card } from '@/components/ui/card';
 import { ChartSection } from '@/components/ui/chart-section';
 import { ShareButton } from '@/components/ui/share-button';
-import { SocialShareButtons } from '@/components/social-share-buttons';
+import { ShareTwitterButton, ShareLinkedInButton } from '@/components/share-buttons';
 import { exportToCsv } from '@/lib/csv-export';
 import { reliabilityChartToCsv } from '@/lib/csv-export-helpers';
 
@@ -37,7 +37,10 @@ export default function ReliabilityChartDisplay() {
               </div>
               <div className="flex items-center gap-1.5">
                 <ShareButton />
-                <SocialShareButtons compact className="hidden sm:flex" />
+                <div className="hidden sm:flex items-center gap-1.5">
+                  <ShareTwitterButton />
+                  <ShareLinkedInButton />
+                </div>
               </div>
             </div>
             <ReliabilityChartControls />
diff --git a/packages/app/src/components/share-buttons.tsx b/packages/app/src/components/share-buttons.tsx
new file mode 100644
index 0000000..4e54c3d
--- /dev/null
+++ b/packages/app/src/components/share-buttons.tsx
@@ -0,0 +1,64 @@
+'use client';
+
+import { Button } from '@/components/ui/button';
+import { track } from '@/lib/analytics';
+
+const SITE_URL = 'https://inferencex.semianalysis.com';
+
+const SHARE_TEXT =
+  'Check out InferenceX — open-source ML inference benchmarks comparing GPUs across real-world workloads. Transparent, up-to-date data for the ML community.';
+
+function getShareUrl(): string {
+  if (typeof window === 'undefined') return SITE_URL;
+  return window.location.href;
+}
+
+export function ShareTwitterButton() {
+  return (
+    <Button
+      variant="outline"
+      size="icon"
+      className="h-7 w-7"
+      title="Share on X (Twitter)"
+      data-testid="share-twitter"
+      onClick={() => {
+        const url = getShareUrl();
+        window.open(
+          `https://twitter.com/intent/tweet?text=${encodeURIComponent(SHARE_TEXT)}&url=${encodeURIComponent(url)}`,
+          '_blank',
+          'noopener,noreferrer,width=600,height=400',
+        );
+        track('social_share_twitter');
+      }}
+    >
+      <svg viewBox="0 0 24 24" fill="currentColor" className="h-3.5 w-3.5">
+        <path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+      </svg>
+    </Button>
+  );
+}
+
+export function ShareLinkedInButton() {
+  return (
+    <Button
+      variant="outline"
+      size="icon"
+      className="h-7 w-7"
+      title="Share on LinkedIn"
+      data-testid="share-linkedin"
+      onClick={() => {
+        const url = getShareUrl();
+        window.open(
+          `https://www.linkedin.com/sharing/share-offsite/?url=${encodeURIComponent(url)}`,
+          '_blank',
+          'noopener,noreferrer,width=600,height=600',
+        );
+        track('social_share_linkedin');
+      }}
+    >
+      <svg viewBox="0 0 24 24" fill="currentColor" className="h-3.5 w-3.5">
+        <path d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433c-1.144 0-2.063-.926-2.063-2.065 0-1.138.92-2.063 2.063-2.063 1.14 0 2.064.925 2.064 2.063 0 1.139-.925 2.065-2.064 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z" />
+      </svg>
+    </Button>
+  );
+}
diff --git a/packages/app/src/components/social-share-buttons.test.ts b/packages/app/src/components/social-share-buttons.test.ts
deleted file mode 100644
index a3d18e4..0000000
--- a/packages/app/src/components/social-share-buttons.test.ts
+++ /dev/null
@@ -1,34 +0,0 @@
-import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest';
-
-describe('SocialShareButtons', () => {
-  let mockWindowOpen: ReturnType<typeof vi.fn>;
-
-  beforeEach(() => {
-    mockWindowOpen = vi.fn();
-    vi.stubGlobal('open', mockWindowOpen);
-  });
-
-  afterEach(() => {
-    vi.unstubAllGlobals();
-  });
-
-  it('builds correct Twitter share URL', () => {
-    const text =
-      'Check out InferenceX — open-source ML inference benchmarks comparing GPUs across real-world workloads. Transparent, up-to-date data for the AI community.';
-    const url = 'https://example.com';
-
-    const tweetUrl = `https://twitter.com/intent/tweet?text=${encodeURIComponent(text)}&url=${encodeURIComponent(url)}`;
-
-    expect(tweetUrl).toContain('twitter.com/intent/tweet');
-    expect(tweetUrl).toContain(encodeURIComponent('InferenceX'));
-    expect(tweetUrl).toContain(encodeURIComponent(url));
-  });
-
-  it('builds correct LinkedIn share URL', () => {
-    const url = 'https://example.com';
-    const linkedInUrl = `https://www.linkedin.com/sharing/share-offsite/?url=${encodeURIComponent(url)}`;
-
-    expect(linkedInUrl).toContain('linkedin.com/sharing/share-offsite');
-    expect(linkedInUrl).toContain(encodeURIComponent(url));
-  });
-});
diff --git a/packages/app/src/components/social-share-buttons.tsx b/packages/app/src/components/social-share-buttons.tsx
deleted file mode 100644
index 16d46ea..0000000
--- a/packages/app/src/components/social-share-buttons.tsx
+++ /dev/null
@@ -1,79 +0,0 @@
-'use client';
-
-import { track } from '@/lib/analytics';
-import { useCallback } from 'react';
-
-import { Button } from '@/components/ui/button';
-
-const SITE_URL = 'https://inferencex.semianalysis.com';
-
-interface SocialShareButtonsProps {
-  /** Additional CSS classes */
-  className?: string;
-  /** Compact mode: icon-only buttons */
-  compact?: boolean;
-}
-
-function getShareText(): string {
-  return 'Check out InferenceX — open-source ML inference benchmarks comparing GPUs across real-world workloads. Transparent, up-to-date data for the AI community.';
-}
-
-function getShareUrl(): string {
-  if (typeof window === 'undefined') return SITE_URL;
-  return window.location.href;
-}
-
-/**
- * Social share buttons for Twitter/X and LinkedIn.
- * Each share includes a pre-composed message promoting InferenceX.
- */
-export function SocialShareButtons({ className = '', compact = false }: SocialShareButtonsProps) {
-  const shareToTwitter = useCallback(() => {
-    const text = getShareText();
-    const url = getShareUrl();
-    const tweetUrl = `https://twitter.com/intent/tweet?text=${encodeURIComponent(text)}&url=${encodeURIComponent(url)}`;
-    window.open(tweetUrl, '_blank', 'noopener,noreferrer,width=600,height=400');
-    track('social_share_twitter');
-  }, []);
-
-  const shareToLinkedIn = useCallback(() => {
-    const url = getShareUrl();
-    const linkedInUrl = `https://www.linkedin.com/sharing/share-offsite/?url=${encodeURIComponent(url)}`;
-    window.open(linkedInUrl, '_blank', 'noopener,noreferrer,width=600,height=600');
-    track('social_share_linkedin');
-  }, []);
-
-  return (
-    <div data-testid="social-share-buttons" className={`flex items-center gap-1.5 ${className}`}>
-      {/* Twitter/X */}
-      <Button
-        variant="outline"
-        size={compact ? 'icon' : 'sm'}
-        className={compact ? 'h-7 w-7' : 'h-7 gap-1.5 text-xs'}
-        onClick={shareToTwitter}
-        title="Share on X (Twitter)"
-        data-testid="share-twitter"
-      >
-        <svg viewBox="0 0 24 24" fill="currentColor" className="h-3.5 w-3.5">
-          <path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-        </svg>
-        {!compact && <span>Tweet</span>}
-      </Button>
-
-      {/* LinkedIn */}
-      <Button
-        variant="outline"
-        size={compact ? 'icon' : 'sm'}
-        className={compact ? 'h-7 w-7' : 'h-7 gap-1.5 text-xs'}
-        onClick={shareToLinkedIn}
-        title="Share on LinkedIn"
-        data-testid="share-linkedin"
-      >
-        <svg viewBox="0 0 24 24" fill="currentColor" className="h-3.5 w-3.5">
-          <path d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433c-1.144 0-2.063-.926-2.063-2.065 0-1.138.92-2.063 2.063-2.063 1.14 0 2.064.925 2.064 2.063 0 1.139-.925 2.065-2.064 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z" />
-        </svg>
-        {!compact && <span>LinkedIn</span>}
-      </Button>
-    </div>
-  );
-}
diff --git a/packages/app/src/components/trends/HistoricalTrendsDisplay.tsx b/packages/app/src/components/trends/HistoricalTrendsDisplay.tsx
index 532c8ba..4b47fc1 100644
--- a/packages/app/src/components/trends/HistoricalTrendsDisplay.tsx
+++ b/packages/app/src/components/trends/HistoricalTrendsDisplay.tsx
@@ -19,7 +19,7 @@ import { ExternalLinkIcon } from '@/components/ui/external-link-icon';
 import { Input } from '@/components/ui/input';
 import { LabelWithTooltip } from '@/components/ui/label-with-tooltip';
 import { ShareButton } from '@/components/ui/share-button';
-import { SocialShareButtons } from '@/components/social-share-buttons';
+import { ShareTwitterButton, ShareLinkedInButton } from '@/components/share-buttons';
 import { TooltipProvider } from '@/components/ui/tooltip';
 import { Skeleton } from '@/components/ui/skeleton';
 import { getModelSortIndex, GPU_SPECS } from '@/lib/constants';
@@ -202,7 +202,10 @@ export default function HistoricalTrendsDisplay() {
             </div>
             <div className="flex items-center gap-1.5">
               <ShareButton />
-              <SocialShareButtons compact className="hidden sm:flex" />
+              <div className="hidden sm:flex items-center gap-1.5">
+                <ShareTwitterButton />
+                <ShareLinkedInButton />
+              </div>
             </div>
           </div>
           <ChartControls hideGpuComparison />
diff --git a/packages/app/src/components/ui/external-link-icon.tsx b/packages/app/src/components/ui/external-link-icon.tsx
index 516df51..8939d5e 100644
--- a/packages/app/src/components/ui/external-link-icon.tsx
+++ b/packages/app/src/components/ui/external-link-icon.tsx
@@ -7,10 +7,14 @@ interface ExternalLinkIconProps extends React.SVGProps<SVGSVGElement> {
 }
 
 const ExternalLinkIcon = React.forwardRef<SVGSVGElement, ExternalLinkIconProps>(
-  ({ className, ...props }, ref) => (
+  ({ className, style, ...props }, ref) => (
     <svg
       ref={ref}
-      className={cn('ml-1 inline-block h-[1em] w-[1em]', className)}
+      className={cn(
+        'inline h-[0.85em] w-[0.85em] ml-1 shrink-0 opacity-50 group-hover:opacity-100 transition-opacity',
+        className,
+      )}
+      style={{ verticalAlign: '-0.125em', ...style }}
       fill="none"
       stroke="currentColor"
       viewBox="0 0 24 24"
diff --git a/packages/constants/src/seo.ts b/packages/constants/src/seo.ts
index 2ee3635..775902c 100644
--- a/packages/constants/src/seo.ts
+++ b/packages/constants/src/seo.ts
@@ -6,5 +6,4 @@ export const AUTHOR_HANDLE = '@semianalysis';
 export const SITE_TITLE = `${SITE_NAME} by ${AUTHOR_NAME} — AI Inference Benchmark`;
 export const DESCRIPTION =
   'InferenceX (formerly InferenceMAX) is the open-source AI inference benchmark that matches the rapid pace of modern AI development. Powered by one of the largest open-source GPU CI/CD fleets with NVIDIA GB200, AMD MI355X & many more.';
-export const OG_IMAGE =
-  'https://semianalysis.com/wp-content/themes/semianalysis/assets/img/sharecard-default.png';
+export const OG_IMAGE = `${SITE_URL}/og-image.png`;