From 9354f1c56a2d20f99cb7bbc1b3aecccf9815f55d Mon Sep 17 00:00:00 2001
From: Eric Lammertsma <e.lammertsma@gmail.com>
Date: Mon, 9 Feb 2026 16:09:57 -0500
Subject: [PATCH] Updated hero section with superpowers A/B and description

---
 .../components/homepage/hero-section.tsx      | 37 +++++++++----------
 1 file changed, 18 insertions(+), 19 deletions(-)

diff --git a/surfsense_web/components/homepage/hero-section.tsx b/surfsense_web/components/homepage/hero-section.tsx
index f30e7b9d7..e5b17d9e4 100644
--- a/surfsense_web/components/homepage/hero-section.tsx
+++ b/surfsense_web/components/homepage/hero-section.tsx
@@ -34,8 +34,8 @@ const GoogleLogo = ({ className }: { className?: string }) => (
 export function HeroSection() {
 	const containerRef = useRef<HTMLDivElement>(null);
 	const parentRef = useRef<HTMLDivElement>(null);
-	const heroVariant = useFeatureFlagVariantKey("notebooklm_flag");
-	const isNotebookLMVariant = heroVariant === "notebooklm";
+	const heroVariant = useFeatureFlagVariantKey("notebooklm_superpowers_flag");
+	const isNotebookLMVariant = heroVariant === "superpowers";
 
 	return (
 		<div
@@ -86,28 +86,27 @@ export function HeroSection() {
 
 			<h2 className="relative z-50 mx-auto mb-4 mt-4 max-w-4xl text-balance text-center text-3xl font-semibold tracking-tight text-gray-700 md:text-7xl dark:text-neutral-300">
 				<Balancer>
-					{isNotebookLMVariant ? (
-						<div className="relative mx-auto inline-block w-max filter-[drop-shadow(0px_1px_3px_rgba(27,37,80,0.14))]">
-							<div className="text-black [text-shadow:0_0_rgba(0,0,0,0.1)] dark:text-white">
-								<span className="">NotebookLM for Teams</span>
-							</div>
+				{isNotebookLMVariant ? (
+					<div className="relative mx-auto inline-block w-max filter-[drop-shadow(0px_1px_3px_rgba(27,37,80,0.14))]">
+						<div className="text-black [text-shadow:0_0_rgba(0,0,0,0.1)] dark:text-white">
+							<span className="">NotebookLM with Superpowers</span>
 						</div>
-					) : (
-						<>
-							The AI Workspace{" "}
-							<div className="relative mx-auto inline-block w-max filter-[drop-shadow(0px_1px_3px_rgba(27,37,80,0.14))]">
-								<div className="text-black [text-shadow:0_0_rgba(0,0,0,0.1)] dark:text-white">
-									<span className="">Built for Teams</span>
-								</div>
-							</div>
-						</>
-					)}
+					</div>
+				) : (
+					<div className="relative mx-auto inline-block w-max filter-[drop-shadow(0px_1px_3px_rgba(27,37,80,0.14))]">
+						<div className="text-black [text-shadow:0_0_rgba(0,0,0,0.1)] dark:text-white">
+							<span className="">NotebookLM for Teams</span>
+						</div>
+					</div>
+				)}
 				</Balancer>
 			</h2>
 			{/* // TODO:aCTUAL DESCRITION */}
 			<p className="relative z-50 mx-auto mt-4 max-w-lg px-4 text-center text-base/6 text-gray-600 dark:text-gray-200">
-				Connect any LLM to your internal knowledge sources and chat with it in real time alongside
-				your team.
+				Connect any AI to your documents and knowledge sources.
+			<p className="relative z-50 mx-auto mt-0 max-w-lg px-4 text-center text-base/6 text-gray-600 dark:text-gray-200">
+			</p>
+				Then chat with it in real-time, even alongside your team.
 			</p>
 			<div className="mb-10 mt-8 flex w-full flex-col items-center justify-center gap-4 px-8 sm:flex-row md:mb-20">
 				<GetStartedButton />