diff --git a/src/components/home.tsx b/src/components/home.tsx
index 9020124ecd2ac..a679114687bb1 100644
--- a/src/components/home.tsx
+++ b/src/components/home.tsx
@@ -1,30 +1,14 @@
 import Link from 'next/link';
 import {Banner} from 'sentry-docs/components/banner';
 import {extractPlatforms, getDocsRootNode} from 'sentry-docs/docTree';
-import AiInSentryHero from 'sentry-docs/imgs/AI-in-Sentry.jpeg';
-import AiSentryHero from 'sentry-docs/imgs/ai-sentry-hero.jpeg';
-import PlugImage from 'sentry-docs/imgs/api.png';
-import ChatBubble from 'sentry-docs/imgs/chat-bubble.png';
-import TerminalImage from 'sentry-docs/imgs/cli.png';
-import ConceptsImage from 'sentry-docs/imgs/concepts-reference.png';
-import ErrorMonitoringHero from 'sentry-docs/imgs/error-monitoring-hero.png';
-import GuidesImage from 'sentry-docs/imgs/guides.png';
-import AiImage from 'sentry-docs/imgs/integrate.png';
-import OrganizationImage from 'sentry-docs/imgs/organization.png';
-import CalculatorImage from 'sentry-docs/imgs/pricing.png';
-import RocketImage from 'sentry-docs/imgs/rocket.png';
-import SecurityImage from 'sentry-docs/imgs/security.png';
-import SquiggleSVG from 'sentry-docs/imgs/squiggle.svg';
-import SupportImage from 'sentry-docs/imgs/support.png';
 
 import AskAiSearchParams from './askAiSearchParams';
-import {Card} from './card';
 import {Header} from './header';
 import {HomeSearchObserver} from './homeSearchVisibility';
 import {NavLink, NavLinkProps} from './navlink';
-import {PlatformFilter} from './platformFilter';
 import {PlatformIcon} from './platformIcon';
 import {Search} from './search';
+import {Sidebar} from './sidebar';
 import {SentryWordmarkLogo} from './wordmarkLogo';
 
 export async function Home() {
@@ -43,11 +27,12 @@ export async function Home() {
     {key: 'php-laravel', title: 'Laravel', url: '/platforms/php/guides/laravel/'},
     {key: 'apple', title: 'Apple', url: '/platforms/apple/'},
     {key: 'android', title: 'Android', url: '/platforms/android/'},
-    {key: 'dart', title: 'Dart', url: '/platforms/dart/'},
-    {key: 'javascript', title: 'JavaScript', url: '/platforms/javascript/'},
-    {key: 'unity', title: 'Unity', url: '/platforms/unity/'},
-    {key: 'unreal', title: 'Unreal', url: '/platforms/unreal/'},
+    {key: 'go', title: 'Go', url: '/platforms/go/'},
+    {key: 'dotnet', title: '.NET', url: '/platforms/dotnet/'},
+    {key: 'java', title: 'Java', url: '/platforms/java/'},
+    {key: 'ruby', title: 'Ruby', url: '/platforms/ruby/'},
   ];
+
   return (
     <div className="tw-app">
       <Header
@@ -56,449 +41,153 @@ export async function Home() {
         useStoredSearchPlatforms={false}
         platforms={platforms}
       />
-      <main id="main">
+      <section className="px-0 flex relative">
+        <Sidebar path={['product']} />
+        <main id="main" className="main-content flex-1 min-w-0">
         <div className="mt-[var(--header-height)]">
           <Banner />
         </div>
-        {/* Hero Banner with Two-Column Layout */}
-        <div className="w-full relative hero-gradient">
-          {/* Single decorative squiggle at top right */}
-          <img
-            src={SquiggleSVG.src}
-            alt=""
-            className="pointer-events-none absolute overflow-hidden"
-            style={{
-              right: 0,
-              top: '-80px',
-              width: '30%',
-              opacity: 0.1,
-              zIndex: 0,
-            }}
-          />
-
-          {/* Content Container */}
-          <div className="max-w-screen-xl mx-auto px-4 sm:px-8 lg:px-[50px] pt-10 pb-6 relative z-10">
-            <div className="flex flex-col lg:flex-row items-start gap-8">
-              {/* Left Column: Welcome Text + Search */}
-              <div className="flex-1 flex flex-col items-center lg:items-start justify-center lg:w-[50%]">
-                <h1
-                  className="font-bold mb-3 text-center lg:text-left text-[var(--gray-12)] dark:text-white"
-                  style={{
-                    fontWeight: 700,
-                    fontSize: '32px',
-                    lineHeight: 1.2,
-                  }}
-                >
-                  Welcome To Sentry Docs
-                </h1>
-                <p
-                  className="mb-5 text-center lg:text-left text-[var(--gray-11)] dark:text-white"
-                  style={{
-                    lineHeight: '1.5',
-                    fontWeight: 400,
-                    fontSize: '15px',
-                  }}
-                >
-                  Sentry provides end-to-end distributed tracing, enabling developers to
-                  identify and debug performance issues and errors across their systems
-                  and services.
-                </p>
-                <HomeSearchObserver>
-                  <div className="home-search-bar relative z-50 self-stretch">
-                    <Search
-                      path="/"
-                      searchPlatforms={[]}
-                      useStoredSearchPlatforms={false}
-                    />
-                  </div>
-                </HomeSearchObserver>
-              </div>
 
-              {/* Right Column: SDK Section */}
-              <div className="flex-shrink-0 w-full lg:w-[50%] lg:pt-[20px] flex flex-col items-center lg:items-end">
-                <div>
-                  <div className="grid grid-cols-4 lg:grid-cols-6 gap-2 mb-4">
-                    {mostViewedSDKs.map(platform => (
-                      <Link
-                        key={platform.key}
-                        href={platform.url}
-                        className="sdk-tile flex flex-col items-center justify-center gap-1.5 bg-white dark:bg-[var(--gray-2)]"
-                        style={{
-                          textDecoration: 'none',
-                          padding: '6px',
-                          borderRadius: '6px',
-                          width: '70px',
-                          height: '76px',
-                        }}
-                      >
-                        <PlatformIcon
-                          platform={platform.key}
-                          size={36}
-                          format="lg"
-                          style={{margin: 0, display: 'block'}}
-                        />
-                        <span
-                          className="text-[var(--gray-12)] whitespace-nowrap"
-                          style={{
-                            fontSize: '0.6rem',
-                            fontWeight: 500,
-                            textAlign: 'center',
-                            lineHeight: 1.1,
-                          }}
-                        >
-                          {platform.title}
-                        </span>
-                      </Link>
-                    ))}
-                  </div>
-                  <a
-                    href="#all-sdks"
-                    className="hover:underline font-bold text-center lg:text-left block uppercase tracking-wider mt-2"
-                    style={{
-                      color: '#8b5cf6',
-                      fontSize: '0.875rem',
-                      letterSpacing: '0.05em',
-                    }}
-                  >
-                    GO TO ALL SDKS
-                  </a>
-                </div>
+        {/* Hero */}
+        <section className="w-full relative hero-gradient">
+          <div className="max-w-screen-lg mx-auto px-4 sm:px-8 pt-16 pb-10 text-center relative z-10">
+            <h1
+              className="font-bold text-[var(--gray-12)] dark:text-white mb-4"
+              style={{fontSize: '40px', lineHeight: 1.15, letterSpacing: '-0.02em'}}
+            >
+              Get started with Sentry
+            </h1>
+            <p
+              className="text-[var(--gray-11)] dark:text-[var(--gray-11)] max-w-xl mx-auto mb-8"
+              style={{fontSize: '17px', lineHeight: 1.5}}
+            >
+              Sentry provides end-to-end distributed tracing, enabling developers to
+              identify and debug performance issues and errors across their systems and
+              services.
+            </p>
+            <HomeSearchObserver>
+              <div className="home-search-bar relative z-50 max-w-xl mx-auto">
+                <Search path="/" searchPlatforms={[]} useStoredSearchPlatforms={false} />
               </div>
-            </div>
+            </HomeSearchObserver>
           </div>
-        </div>
-        <div className="hero max-w-screen-xl mx-auto px-4 sm:px-8 lg:px-[50px] py-2">
-          {/* Sentry Features Header */}
-          <h2 className="text-2xl mt-0 mb-6 font-medium">Sentry Features</h2>
-          <div className="grid grid-cols-1 md:grid-cols-3 gap-6">
-            {/* Debugging in Sentry */}
-            <div
-              className="bg-white dark:bg-[var(--gray-2)] rounded-xl p-6 flex items-start gap-4"
-              style={{
-                boxShadow:
-                  '0 4px 20px 0 rgba(0, 0, 0, 0.08), 0 1px 3px 0 rgba(0, 0, 0, 0.05)',
-              }}
-            >
-              <Link
-                href="/product/"
-                className="card-image-link flex-shrink-0 w-16 h-16 rounded-lg overflow-hidden"
-                style={{
-                  display: 'flex',
-                  alignItems: 'center',
-                  justifyContent: 'center',
-                }}
-              >
-                <img
-                  src={ErrorMonitoringHero.src}
-                  alt="Debugging in Sentry"
-                  style={{
-                    width: '100%',
-                    height: '100%',
-                    objectFit: 'cover',
-                    objectPosition: 'center',
-                  }}
-                />
-              </Link>
-              <div className="flex-1">
-                <h3 className="text-lg font-semibold mb-2 text-[var(--gray-12)]">
-                  <Link
-                    href="/product/"
-                    className="text-[var(--gray-12)] hover:underline"
-                  >
-                    Debugging in Sentry
-                  </Link>
-                </h3>
-                <p className="text-sm text-[var(--gray-11)] dark:text-white leading-relaxed">
-                  Monitor, identify, and resolve errors and performance issues across your
-                  applications using{' '}
-                  <Link
-                    href="/product/error-monitoring/"
-                    className="text-[#8b5cf6] underline"
-                  >
-                    Error Monitoring
-                  </Link>
-                  ,{' '}
-                  <Link
-                    href="/product/explore/trace-explorer/"
-                    className="text-[#8b5cf6] underline"
-                  >
-                    Tracing
-                  </Link>
-                  ,{' '}
-                  <Link
-                    href="/product/session-replay/"
-                    className="text-[#8b5cf6] underline"
-                  >
-                    Session Replay
-                  </Link>
-                  ,{' '}
-                  <Link href="/product/drains/" className="text-[#8b5cf6] underline">
-                    Logs
-                  </Link>
-                  , and{' '}
-                  <Link href="/product/" className="text-[#8b5cf6] underline">
-                    more
-                  </Link>
-                  .
-                </p>
+        </section>
+
+        {/* Bifurcated setup paths */}
+        <section className="max-w-screen-lg mx-auto px-4 sm:px-8 -mt-2 pb-4">
+          <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
+            {/* AI setup */}
+            <Link href="/ai/" className="setup-card group no-underline">
+              <div className="setup-icon">
+                <svg width="26" height="26" viewBox="0 0 24 24" fill="currentColor">
+                  <path d="M12 2l1.9 4.6L18.5 8.5 13.9 10.4 12 15l-1.9-4.6L5.5 8.5l4.6-1.9L12 2z" />
+                  <path d="M18.5 13.5l.95 2.3 2.3.95-2.3.95-.95 2.3-.95-2.3-2.3-.95 2.3-.95.95-2.3z" />
+                </svg>
               </div>
-            </div>
+              <h2 className="setup-title">Set up with AI</h2>
+              <p className="setup-desc">
+                Let your AI coding assistant install and configure Sentry for you, using
+                Sentry&apos;s agent skills, editor rules, and MCP server.
+              </p>
+              <span className="setup-cta">
+                Start AI setup
+                <Arrow />
+              </span>
+            </Link>
 
-            {/* Fix Faster with Seer */}
-            <div
-              className="bg-white dark:bg-[var(--gray-2)] rounded-xl p-6 flex items-start gap-4"
-              style={{
-                boxShadow:
-                  '0 4px 20px 0 rgba(0, 0, 0, 0.08), 0 1px 3px 0 rgba(0, 0, 0, 0.05)',
-              }}
-            >
-              <Link
-                href="/product/ai-in-sentry/seer/"
-                className="card-image-link flex-shrink-0 w-16 h-16 rounded-lg overflow-hidden"
-                style={{
-                  display: 'flex',
-                  alignItems: 'center',
-                  justifyContent: 'center',
-                }}
-              >
-                <img
-                  src={AiSentryHero.src}
-                  alt="Fix Faster with Seer"
-                  style={{
-                    width: '100%',
-                    height: '100%',
-                    objectFit: 'cover',
-                    objectPosition: 'center',
-                  }}
-                />
-              </Link>
-              <div className="flex-1">
-                <h3 className="text-lg font-semibold mb-2 text-[var(--gray-12)]">
-                  <Link
-                    href="/product/ai-in-sentry/seer/"
-                    className="text-[var(--gray-12)] hover:underline"
-                  >
-                    Fix Faster with Seer
-                  </Link>
-                </h3>
-                <p className="text-sm text-[var(--gray-11)] dark:text-white leading-relaxed">
-                  Debug applications with{' '}
-                  <Link
-                    href="/product/ai-in-sentry/seer/"
-                    className="text-[#8b5cf6] underline"
-                  >
-                    Seer
-                  </Link>
-                  . Get{' '}
-                  <Link
-                    href="/product/ai-in-sentry/seer/#seer-agent"
-                    className="text-[#8b5cf6] underline"
-                  >
-                    AI-powered answers
-                  </Link>{' '}
-                  to questions using your application data in Sentry. Have{' '}
-                  <Link
-                    href="/product/ai-in-sentry/seer/autofix/"
-                    className="text-[#8b5cf6] underline"
-                  >
-                    Autofix
-                  </Link>{' '}
-                  generate fixes, and{' '}
-                  <Link
-                    href="/product/ai-in-sentry/seer/code-review/"
-                    className="text-[#8b5cf6] underline"
-                  >
-                    review code changes
-                  </Link>{' '}
-                  before merging PRs.
-                </p>
+            {/* Manual setup */}
+            <Link href="#platforms" className="setup-card group no-underline">
+              <div className="setup-icon">
+                <svg
+                  width="26"
+                  height="26"
+                  viewBox="0 0 24 24"
+                  fill="none"
+                  stroke="currentColor"
+                  strokeWidth="2"
+                  strokeLinecap="round"
+                  strokeLinejoin="round"
+                >
+                  <rect x="2.5" y="4" width="19" height="16" rx="2.5" />
+                  <path d="M6.5 9l3 3-3 3" />
+                  <path d="M12.5 15h5" />
+                </svg>
               </div>
-            </div>
+              <h2 className="setup-title">Set up manually</h2>
+              <p className="setup-desc">
+                Choose your platform and follow a step-by-step guide to install the SDK
+                and send your first event.
+              </p>
+              <span className="setup-cta">
+                Choose your platform
+                <Arrow />
+              </span>
+            </Link>
+          </div>
+        </section>
 
-            {/* AI in Sentry */}
-            <div
-              className="bg-white dark:bg-[var(--gray-2)] rounded-xl p-6 flex items-start gap-4"
-              style={{
-                boxShadow:
-                  '0 4px 20px 0 rgba(0, 0, 0, 0.08), 0 1px 3px 0 rgba(0, 0, 0, 0.05)',
-              }}
-            >
+        {/* Popular SDKs */}
+        <section
+          id="platforms"
+          className="max-w-screen-lg mx-auto px-4 sm:px-8 pt-10 pb-6 scroll-mt-[var(--header-height)]"
+        >
+          <div className="flex items-baseline justify-between mb-4">
+            <h3 className="text-lg font-semibold text-[var(--gray-12)]">Popular SDKs</h3>
+            <Link href="/platforms/" className="text-sm font-medium accent-link">
+              View all SDKs
+            </Link>
+          </div>
+          <div className="grid grid-cols-3 sm:grid-cols-4 lg:grid-cols-6 gap-3">
+            {mostViewedSDKs.map(platform => (
               <Link
-                href="/ai/"
-                className="card-image-link flex-shrink-0 w-16 h-16 rounded-lg overflow-hidden"
-                style={{
-                  display: 'flex',
-                  alignItems: 'center',
-                  justifyContent: 'center',
-                }}
+                key={platform.key}
+                href={platform.url}
+                className="sdk-tile flex flex-col items-center justify-center gap-2 bg-white dark:bg-[var(--gray-2)] no-underline py-4 rounded-lg"
               >
-                <img
-                  src={AiInSentryHero.src}
-                  alt="AI in Sentry"
-                  style={{
-                    width: '100%',
-                    height: '100%',
-                    objectFit: 'cover',
-                    objectPosition: 'center',
-                  }}
+                <PlatformIcon
+                  platform={platform.key}
+                  size={38}
+                  format="lg"
+                  style={{margin: 0, display: 'block'}}
                 />
+                <span
+                  className="text-[var(--gray-12)] whitespace-nowrap"
+                  style={{fontSize: '0.72rem', fontWeight: 500}}
+                >
+                  {platform.title}
+                </span>
               </Link>
-              <div className="flex-1">
-                <h3 className="text-lg font-semibold mb-2 text-[var(--gray-12)]">
-                  <Link href="/ai/" className="text-[var(--gray-12)] hover:underline">
-                    AI in Sentry
-                  </Link>
-                </h3>
-                <p className="text-sm text-[var(--gray-11)] dark:text-white leading-relaxed">
-                  Integrate Sentry into your AI coding assistants using Sentry's{' '}
-                  <Link href="/ai/agent-skills/" className="text-[#8b5cf6] underline">
-                    Skills
-                  </Link>{' '}
-                  and{' '}
-                  <a
-                    href="https://mcp.sentry.dev"
-                    target="_blank"
-                    rel="noopener noreferrer"
-                    className="text-[#8b5cf6] underline"
-                  >
-                    MCP server
-                  </a>{' '}
-                  with your agents. Debug agents and MCP servers by{' '}
-                  <Link href="/ai/monitoring/" className="text-[#8b5cf6] underline">
-                    monitoring your AI features
-                  </Link>
-                  .
-                </p>
-              </div>
-            </div>
-          </div>
-          <div id="all-sdks">
-            <PlatformFilter />
+            ))}
           </div>
-          <h2 className="text-2xl mt-16 mb-6 font-medium">Get to know us</h2>
-          <div className="flex flex-wrap gap-6">
-            {/* Row 1: What is Sentry and Sentry for AI */}
-            <Card
-              className="w-full md:w-[calc(50%-12px)]"
+        </section>
+
+        {/* Secondary quick links */}
+        <section className="max-w-screen-lg mx-auto px-4 sm:px-8 pt-6 pb-16">
+          <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4">
+            <QuickLink
               href="/product/"
-              image={RocketImage}
-              imageAlt="Rocket image"
               title="What is Sentry?"
-              description={
-                'Application monitoring and debugging software considered "not bad" by 4 million developers.'
-              }
+              desc="Error monitoring, tracing, and more."
             />
-
-            <Card
-              className="w-full md:w-[calc(50%-12px)]"
-              href="/ai/"
-              image={AiImage}
-              imageAlt="AI integration image"
-              title="Sentry for AI"
-              description="Connect Sentry to your AI coding assistants with agent skills and MCP."
+            <QuickLink
+              href="/product/ai-in-sentry/seer/"
+              title="Fix faster with Seer"
+              desc="AI debugging, root cause, and autofix."
             />
-
-            {/* Row 2: Guides and Pricing & Billing */}
-            <Card
-              className="w-full md:w-[calc(50%-12px)]"
-              href="/guides/"
-              image={GuidesImage}
-              imageAlt="Guides image"
-              title="Guides"
-              description="You've set up Sentry. Now what? Practical guidance on what to instrument, query, and alert on."
-            />
-
-            <Card
-              className="w-full md:w-[calc(50%-12px)]"
-              href="/pricing"
-              image={CalculatorImage}
-              imageAlt="Calculator image"
+            <QuickLink
+              href="/pricing/"
               title="Pricing & Billing"
-              description="All about our pricing and billing structure."
-            />
-
-            {/* Row 3: Organization Settings and Integrations */}
-            <Card
-              className="w-full md:w-[calc(50%-12px)]"
-              href="/organization"
-              image={OrganizationImage}
-              imageAlt="Organization image"
-              title="Organization Settings"
-              description="Information for setting up your organization's Sentry account."
-            />
-
-            <Card
-              className="w-full md:w-[calc(50%-12px)]"
-              href="/integrations"
-              image={AiImage}
-              imageAlt="Integrations image"
-              title="Integrations"
-              description="Connect Sentry to your favorite tools for source control, issue tracking, notifications, and more."
+              desc="How our pricing and quotas work."
             />
-
-            {/* Row 4: API and CLI */}
-            <Card
-              className="w-full md:w-[calc(50%-12px)]"
-              href="/api"
-              image={PlugImage}
-              imageAlt="Plug image"
-              title="API"
-              description="APIs for accessing Sentry programmatically."
-            />
-
-            <Card
-              className="w-full md:w-[calc(50%-12px)]"
-              href="/cli"
-              image={TerminalImage}
-              imageAlt="Terminal image"
-              title="CLI"
-              description="How to use 'sentry-cli' on the command line."
-            />
-
-            {/* Row 5: Security, Legal & PII and Concepts & References */}
-            <Card
-              className="w-full md:w-[calc(50%-12px)]"
-              href="/security-legal-pii"
-              image={SecurityImage}
-              imageAlt="Stamped paper image"
-              title="Security, Legal & PII"
-              description="Security, compliance, and data-scrubbing processes."
-            />
-
-            <Card
-              className="w-full md:w-[calc(50%-12px)]"
-              href="/concepts"
-              image={ConceptsImage}
-              imageAlt="Concept and references image"
-              title="Concepts & Reference"
-              description="Core concepts that make Sentry, Sentry."
-            />
-          </div>
-          <h2 className="text-2xl mt-10 mb-6 font-medium">Talk to us</h2>
-          <div className="flex flex-col md:flex-row gap-6">
-            <Card
-              className="w-full"
-              href="https://discord.com/invite/sentry"
-              image={ChatBubble}
-              imageAlt="Chat bubble image"
-              title="Sentry Discord"
-              description="Real talk in real time. Get in it."
-            />
-
-            <Card
-              className="w-full"
-              href="https://www.sentry.help/en/"
-              image={SupportImage}
-              imageAlt="Support image"
-              title="Support"
-              description="See how we can help."
+            <QuickLink
+              href="/api/"
+              title="API & CLI"
+              desc="Automate and script against Sentry."
             />
           </div>
-        </div>
-      </main>
+        </section>
       <footer className="mt-12 pb-10 w-full z-50 max-w-7xl mx-auto md:px-6 space-y-4 px-6 lg:px-8">
         <div className="px-3 pt-10 border-t border-gray">
-          {/* First row */}
           <div className="flex flex-col items-start md:flex-row md:flex-wrap md:gap-x-6 gap-y-2 mb-2">
             <FooterLink href="/security-legal-pii/">Security, Legal & PII</FooterLink>
             <FooterLink href="/contributing">Contribute</FooterLink>
@@ -509,7 +198,6 @@ export async function Home() {
               Changelog
             </FooterLink>
           </div>
-          {/* Second row */}
           <div className="flex flex-col items-start md:flex-row md:flex-wrap md:gap-x-6 gap-y-2">
             <FooterLink href="https://sandbox.sentry.io/" external>
               Sandbox
@@ -520,18 +208,6 @@ export async function Home() {
             <FooterLink href="https://develop.sentry.dev/" external>
               Developer docs
             </FooterLink>
-            <FooterLink href="https://discord.com/invite/sentry">
-              Sentry Discord
-              <svg
-                xmlns="http://www.w3.org/2000/svg"
-                width="18"
-                viewBox="0 0 16 13"
-                fill="none"
-                className="inline-block ml-1 fill-[var(--foreground)]"
-              >
-                <path d="M13.5535 1.01557C12.5023 0.5343 11.3926 0.192868 10.2526 0C10.0966 0.278859 9.95549 0.565767 9.82978 0.859525C8.61551 0.676548 7.38069 0.676548 6.16642 0.859525C6.04065 0.565798 5.8995 0.278893 5.74358 0C4.6029 0.194497 3.49241 0.536739 2.44013 1.01809C0.351097 4.10886 -0.215208 7.12286 0.0679445 10.0941C1.29134 10.998 2.66066 11.6854 4.11639 12.1265C4.44418 11.6856 4.73423 11.2179 4.98347 10.7283C4.51008 10.5515 4.05318 10.3334 3.61805 10.0765C3.73257 9.99339 3.84457 9.90782 3.9528 9.82476C5.21892 10.4202 6.60084 10.7289 7.99999 10.7289C9.39914 10.7289 10.7811 10.4202 12.0472 9.82476C12.1567 9.91411 12.2687 9.99969 12.3819 10.0765C11.946 10.3338 11.4882 10.5524 11.014 10.7296C11.2629 11.2189 11.553 11.6863 11.8811 12.1265C13.338 11.6872 14.7084 11.0001 15.932 10.0953C16.2643 6.64968 15.3645 3.66336 13.5535 1.01557ZM5.34213 8.26679C4.55308 8.26679 3.9012 7.55073 3.9012 6.66981C3.9012 5.78889 4.53043 5.06654 5.33961 5.06654C6.1488 5.06654 6.79565 5.78889 6.7818 6.66981C6.76796 7.55073 6.14628 8.26679 5.34213 8.26679ZM10.6578 8.26679C9.86754 8.26679 9.21817 7.55073 9.21817 6.66981C9.21817 5.78889 9.8474 5.06654 10.6578 5.06654C11.4683 5.06654 12.1101 5.78889 12.0963 6.66981C12.0824 7.55073 11.462 8.26679 10.6578 8.26679Z" />
-              </svg>
-            </FooterLink>
           </div>
         </div>
         <p className="px-3 text-sm">
@@ -542,74 +218,116 @@ export async function Home() {
           <SentryWordmarkLogo height={50} fill="#ffffff" />
         </div>
       </footer>
+        </main>
+      </section>
       <AskAiSearchParams />
       <style>{`
-        .card-large-icon img {
-          width: 40px !important;
-          height: 40px !important;
-        }
-        .card-align-center > div,
-        .card-align-center .flex {
-          align-items: center !important;
-        }
-        /* Hero gradient - light mode */
         .hero-gradient {
           background: linear-gradient(to bottom, rgba(168, 139, 250, 0.15) 0%, rgba(255, 255, 255, 0) 100%), #ffffff;
         }
-        /* Hero gradient - dark mode */
         .dark .hero-gradient {
           background: linear-gradient(to bottom, rgba(168, 139, 250, 0.15) 0%, rgba(0, 0, 0, 0) 100%), var(--gray-1);
         }
-        /* SDK tiles - light mode */
+        .accent-link { color: #6c5fc7; }
+        .accent-link:hover { text-decoration: underline; }
+        /* Setup path cards */
+        .setup-card {
+          display: flex;
+          flex-direction: column;
+          background: #fff;
+          border: 1px solid var(--gray-4);
+          border-radius: 16px;
+          padding: 28px;
+          transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
+          box-shadow: 0 1px 3px rgba(0,0,0,0.05);
+        }
+        .dark .setup-card { background: var(--gray-2); border-color: var(--gray-4); }
+        .setup-card:hover {
+          transform: translateY(-3px);
+          border-color: #a78bfa;
+          box-shadow: 0 10px 30px rgba(108, 95, 199, 0.15);
+        }
+        .setup-icon {
+          width: 48px; height: 48px;
+          display: grid; place-items: center;
+          border-radius: 12px;
+          color: #6c5fc7;
+          background: rgba(108, 95, 199, 0.12);
+          margin-bottom: 16px;
+        }
+        .setup-title {
+          font-size: 20px; font-weight: 600; margin: 0 0 8px;
+          color: var(--gray-12);
+        }
+        .setup-desc {
+          font-size: 14.5px; line-height: 1.55; margin: 0 0 20px;
+          color: var(--gray-11); flex: 1;
+        }
+        .setup-cta {
+          display: inline-flex; align-items: center; gap: 6px;
+          font-weight: 600; font-size: 14.5px; color: #6c5fc7;
+        }
+        .setup-card:hover .setup-cta svg { transform: translateX(3px); }
+        .setup-cta svg { transition: transform 0.15s ease; }
         .sdk-tile {
-          box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
+          box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.08);
+          transition: transform 0.15s ease, box-shadow 0.15s ease;
         }
-        /* SDK tiles - dark mode */
-        .dark .sdk-tile {
-          box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.3), 0 1px 2px 0 rgba(0, 0, 0, 0.2);
-          border: 1px solid var(--gray-4);
+        .sdk-tile:hover { transform: translateY(-2px); box-shadow: 0 6px 18px rgba(0,0,0,0.10); }
+        .dark .sdk-tile { border: 1px solid var(--gray-4); }
+        .quick-link {
+          display: block; padding: 18px 20px; border-radius: 12px;
+          border: 1px solid var(--gray-4); background: #fff;
+          transition: border-color 0.15s ease, transform 0.15s ease;
         }
+        .dark .quick-link { background: var(--gray-2); }
+        .quick-link:hover { border-color: #a78bfa; transform: translateY(-2px); }
         .home-search-bar input[type="text"], .home-search-bar input {
-          height: 44px !important;
-          min-height: 44px !important;
-          font-size: 0.95rem !important;
-          max-width: 100% !important;
+          height: 48px !important;
+          font-size: 1rem !important;
           width: 100% !important;
-          background: linear-gradient(90deg, #fff 80%, #f3e8ff 100%);
+          background: #fff;
           border: 1.5px solid #a78bfa !important;
-          box-shadow: 0 2px 12px 0 rgba(168,139,250,0.10), 0 1px 4px 0 rgba(168,139,250,0.08);
+          box-shadow: 0 2px 12px 0 rgba(168,139,250,0.10);
           border-radius: 12px !important;
           color: #1a1a1a;
-          transition: box-shadow 0.2s, border-color 0.2s;
-        }
-        .home-search-bar input[type="text"]:focus, .home-search-bar input:focus {
-          border-color: #7c3aed !important;
-          box-shadow: 0 6px 32px 0 rgba(124,58,237,0.18), 0 2px 12px 0 rgba(124,58,237,0.12);
-          outline: none !important;
         }
         .dark .home-search-bar input[type="text"], .dark .home-search-bar input {
-          background: linear-gradient(90deg, #18181b 80%, #312e38 100%) !important;
-          border: 2px solid #a78bfa !important;
+          background: var(--gray-2) !important;
           color: #f3f3f3 !important;
-          box-shadow: 0 4px 24px 0 rgba(124,58,237,0.10), 0 1.5px 8px 0 rgba(124,58,237,0.08);
-        }
-        .dark .home-search-bar input[type="text"]:focus, .dark .home-search-bar input:focus {
-          border-color: #c4b5fd !important;
-          box-shadow: 0 6px 32px 0 rgba(124,58,237,0.18), 0 2px 12px 0 rgba(124,58,237,0.12);
-        }
-        /* Linked card images */
-        .card-image-link {
-          transition: opacity 0.2s ease, transform 0.2s ease;
-        }
-        .card-image-link:hover {
-          opacity: 0.8;
-          transform: scale(1.05);
         }
       `}</style>
     </div>
   );
 }
 
+function Arrow() {
+  return (
+    <svg
+      width="16"
+      height="16"
+      viewBox="0 0 24 24"
+      fill="none"
+      stroke="currentColor"
+      strokeWidth="2.2"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+    >
+      <path d="M5 12h14" />
+      <path d="M13 6l6 6-6 6" />
+    </svg>
+  );
+}
+
+function QuickLink({href, title, desc}: {desc: string; href: string; title: string}) {
+  return (
+    <Link href={href} className="quick-link no-underline">
+      <div className="font-semibold text-[var(--gray-12)] mb-1">{title}</div>
+      <div className="text-sm text-[var(--gray-11)] leading-snug">{desc}</div>
+    </Link>
+  );
+}
+
 function FooterLink({
   children,
   external,