refactor: rename landing components

packages/web/app/globals.css

@@ -54,7 +54,7 @@
 	color: #0a0a0a;
 }
 
-@keyframes cursor-fade-up {
+@keyframes landing-fade-up {
 	from {
 		opacity: 0;
 		transform: translate3d(0, 14px, 0);
@@ -67,16 +67,16 @@
 	}
 }
 
-.cursor-landing {
-	--cursor-accent: #ff8a3d;
-	--cursor-accent-soft: rgba(255, 138, 61, 0.14);
+.landing {
+	--landing-accent: #ff8a3d;
+	--landing-accent-soft: rgba(255, 138, 61, 0.14);
 }
 
-.cursor-fade-up {
-	animation: cursor-fade-up 700ms cubic-bezier(0.22, 1, 0.36, 1) both;
+.landing-fade-up {
+	animation: landing-fade-up 700ms cubic-bezier(0.22, 1, 0.36, 1) both;
 }
 
-@keyframes cursor-shimmer {
+@keyframes landing-shimmer {
 	0% {
 		background-position: 0% 50%;
 	}
@@ -86,11 +86,11 @@
 }
 
 .animate-shimmer {
-	animation: cursor-shimmer 1400ms linear infinite;
+	animation: landing-shimmer 1400ms linear infinite;
 }
 
 @media (prefers-reduced-motion: reduce) {
-	.cursor-fade-up,
+	.landing-fade-up,
 	.animate-shimmer {
 		animation: none;
 	}
@@ -126,12 +126,12 @@
 	height: 0;
 }
 
-.cursor-terminal-scroll {
+.landing-terminal-scroll {
 	scrollbar-width: none;
 	-ms-overflow-style: none;
 }
 
-.cursor-terminal-scroll::-webkit-scrollbar {
+.landing-terminal-scroll::-webkit-scrollbar {
 	display: none;
 	width: 0;
 	height: 0;

packages/web/app/page.tsx

@@ -1,21 +1,21 @@
-import { CursorFrontier } from "../components/landing/cursor-bento"
-import { CursorFeatures } from "../components/landing/cursor-features"
-import { CursorFooter } from "../components/landing/cursor-footer"
-import { CursorHero } from "../components/landing/cursor-hero"
-import { CursorNav } from "../components/landing/cursor-nav"
+import { LandingFrontier } from "../components/landing/landing-bento"
+import { LandingFeatures } from "../components/landing/landing-features"
+import { LandingFooter } from "../components/landing/landing-footer"
+import { LandingHero } from "../components/landing/landing-hero"
+import { LandingNav } from "../components/landing/landing-nav"
 
 export default function Page() {
 	return (
-		<main className="cursor-landing relative isolate min-h-screen bg-[#100E0E] text-white selection:bg-white/20 selection:text-white">
+		<main className="landing relative isolate min-h-screen bg-[#100E0E] text-white selection:bg-white/20 selection:text-white">
 			<div className="pointer-events-none absolute inset-y-0 left-0 right-0 hidden md:block">
 				<div className="mx-auto h-full max-w-[1320px] border-x border-x-white/14" />
 			</div>
 			<div className="relative z-10">
-				<CursorNav />
-				<CursorHero />
-				<CursorFeatures />
-				<CursorFrontier />
-				<CursorFooter />
+				<LandingNav />
+				<LandingHero />
+				<LandingFeatures />
+				<LandingFrontier />
+				<LandingFooter />
 			</div>
 		</main>
 	)

packages/web/app/story/page.tsx

@@ -1,5 +1,5 @@
 import type { Metadata } from "next"
-import { CursorNav } from "../../components/landing/cursor-nav"
+import { LandingNav } from "../../components/landing/landing-nav"
 
 const intro = [
 	"3am. Phone buzzes. Production alert. Something is wrong, but not with our code - our code is perfect. Passed every test, every lint check, every code review. The problem? The AI provider started rate limiting us and our retry logic had a subtle bug that nobody ever caught. Because in development, the API never fails.",
@@ -77,13 +77,13 @@ export const metadata: Metadata = {
 
 export default function Page() {
 	return (
-		<main className="cursor-landing relative isolate min-h-screen bg-[#100E0E] text-white selection:bg-white/20 selection:text-white">
+		<main className="landing relative isolate min-h-screen bg-[#100E0E] text-white selection:bg-white/20 selection:text-white">
 			<div className="pointer-events-none absolute inset-y-0 left-0 right-0 hidden md:block">
 				<div className="mx-auto h-full max-w-[1320px] border-x border-x-white/14" />
 			</div>
 
 			<div className="relative z-10">
-				<CursorNav />
+				<LandingNav />
 
 				<section className="pt-28 pb-20 md:pt-36 md:pb-28">
 					<div className="mx-auto max-w-[1320px] px-6">

packages/web/components/landing/cursor-bento.tsx → packages/web/components/landing/landing-bento.tsx

@@ -86,7 +86,7 @@ function mark(index: number) {
 	)
 }
 
-export function CursorFrontier() {
+export function LandingFrontier() {
 	return (
 		<section>
 			<div className="mx-auto max-w-[1320px] border-t border-white/5 px-6 py-20 md:py-28">
@@ -134,7 +134,7 @@ export function CursorFrontier() {
 							<div className="mt-6">
 								<Link
 									href={item.href}
-									className="inline-flex items-center gap-1.5 text-sm font-medium text-(--cursor-accent) hover:opacity-80 transition-opacity"
+									className="inline-flex items-center gap-1.5 text-sm font-medium text-(--landing-accent) hover:opacity-80 transition-opacity"
 								>
 									{item.label} <span aria-hidden="true">→</span>
 								</Link>

packages/web/components/landing/cursor-features.tsx → packages/web/components/landing/landing-features.tsx

@@ -2,8 +2,8 @@
 
 import Link from "next/link"
 import type { ReactNode } from "react"
-import { CursorMacWindow } from "./cursor-mac-window"
-import { CursorStage } from "./cursor-stage"
+import { LandingWindow } from "./landing-window"
+import { LandingStage } from "./landing-stage"
 
 type row = {
 	readonly tone: "cmd" | "code" | "dim"
@@ -51,7 +51,7 @@ function LearnMore({ href, label }: { readonly href: string; readonly label: str
 	return (
 		<Link
 			href={href}
-			className="inline-flex items-center gap-1.5 text-sm font-medium text-(--cursor-accent) hover:opacity-80 transition-opacity"
+			className="inline-flex items-center gap-1.5 text-sm font-medium text-(--landing-accent) hover:opacity-80 transition-opacity"
 		>
 			{label} <span aria-hidden="true">→</span>
 		</Link>
@@ -121,19 +121,19 @@ function Spotlight({
 			</div>
 
 			<div className={flip ? "order-1 md:order-1" : "order-1 md:order-2"}>
-				<CursorStage tone={tone} square>
+				<LandingStage tone={tone} square>
 					<div className="mx-auto w-full max-w-[1160px]">
-						<CursorMacWindow title="" bar={false}>
+						<LandingWindow title="" bar={false}>
 							{window}
-						</CursorMacWindow>
+						</LandingWindow>
 					</div>
-				</CursorStage>
+				</LandingStage>
 			</div>
 		</div>
 	)
 }
 
-export function CursorFeatures() {
+export function LandingFeatures() {
 	return (
 		<section>
 			<div className="mx-auto max-w-[1320px] px-6 pt-20 pb-20 md:pt-28 md:pb-28">

packages/web/components/landing/cursor-footer.tsx → packages/web/components/landing/landing-footer.tsx

@@ -1,6 +1,6 @@
 import Link from "next/link"
 
-export function CursorFooter() {
+export function LandingFooter() {
 	return (
 		<footer>
 			<div className="mx-auto max-w-[1320px] border-t border-white/8 px-6 py-14 md:py-18">

packages/web/components/landing/cursor-hero.tsx → packages/web/components/landing/landing-hero.tsx

@@ -1,30 +1,30 @@
 "use client"
 
 import Link from "next/link"
-import { CursorMacWindow } from "./cursor-mac-window"
-import { CursorStage } from "./cursor-stage"
-import { CursorTerminal } from "./cursor-terminal"
+import { LandingWindow } from "./landing-window"
+import { LandingStage } from "./landing-stage"
+import { LandingTerminal } from "./landing-terminal"
 
-export function CursorHero() {
+export function LandingHero() {
 	return (
 		<section className="relative overflow-hidden pt-32 pb-0 md:pt-44 md:pb-0">
 			<div className="mx-auto max-w-[1320px] px-6">
 				<div className="max-w-184">
 					<h1
-						className="cursor-fade-up text-5xl font-semibold tracking-tighter text-white sm:text-6xl md:text-7xl leading-[1.03]"
+						className="landing-fade-up text-5xl font-semibold tracking-tighter text-white sm:text-6xl md:text-7xl leading-[1.03]"
 						style={{ animationDelay: "30ms" }}
 					>
 						Ship resilient AI and APIs.
 					</h1>
 					<p
-						className="cursor-fade-up mt-6 text-lg text-[#A1A1A1] leading-relaxed"
+						className="landing-fade-up mt-6 text-lg text-[#A1A1A1] leading-relaxed"
 						style={{ animationDelay: "90ms" }}
 					>
 						Inject realistic failures into AI SDK flows and core async APIs before launch.
 					</p>
 				</div>
 
-				<div className="cursor-fade-up mt-8 flex items-center" style={{ animationDelay: "150ms" }}>
+				<div className="landing-fade-up mt-8 flex items-center" style={{ animationDelay: "150ms" }}>
 					<Link
 						href="/docs"
 						className="group inline-flex h-14 items-center gap-3 rounded-none border border-white/14 bg-[#151313] px-8 text-base font-medium text-white transition-colors hover:bg-[#1A1818]"
@@ -46,14 +46,14 @@ export function CursorHero() {
 			</div>
 
 			<div className="mx-auto mt-16 max-w-[1320px] px-6 md:mt-20 md:px-0">
-				<div className="cursor-fade-up" style={{ animationDelay: "240ms" }}>
-					<CursorStage tone="dune" square>
+				<div className="landing-fade-up" style={{ animationDelay: "240ms" }}>
+					<LandingStage tone="dune" square>
 						<div className="mx-auto w-full max-w-[1160px]">
-							<CursorMacWindow title="terminal" bar={false}>
-								<CursorTerminal />
-							</CursorMacWindow>
+							<LandingWindow title="terminal" bar={false}>
+								<LandingTerminal />
+							</LandingWindow>
 						</div>
-					</CursorStage>
+					</LandingStage>
 				</div>
 			</div>
 		</section>

packages/web/components/landing/cursor-nav.tsx → packages/web/components/landing/landing-nav.tsx

@@ -4,7 +4,7 @@ import { Github } from "lucide-react"
 import Link from "next/link"
 import { useEffect, useState } from "react"
 
-export function CursorNav() {
+export function LandingNav() {
 	const [scrolled, setScrolled] = useState(false)
 
 	useEffect(() => {

packages/web/components/landing/cursor-stage.tsx → packages/web/components/landing/landing-stage.tsx

@@ -1,9 +1,9 @@
 import type { ReactNode } from "react"
 
-type CursorStageTone = "dune" | "mist" | "sage"
+type LandingStageTone = "dune" | "mist" | "sage"
 
 const toneStyles: Record<
-	CursorStageTone,
+	LandingStageTone,
 	{ backgroundColor: string; backgroundImage: string; shadow: string }
 > = {
 	dune: {
@@ -29,12 +29,12 @@ const toneStyles: Record<
 	},
 }
 
-export function CursorStage({
+export function LandingStage({
 	tone = "dune",
 	square = false,
 	children,
 }: {
-	readonly tone?: CursorStageTone
+	readonly tone?: LandingStageTone
 	readonly square?: boolean
 	readonly children: ReactNode
 }) {

packages/web/components/landing/cursor-terminal.tsx → packages/web/components/landing/landing-terminal.tsx

@@ -81,7 +81,7 @@ function style(tone: tone): string {
 	}
 }
 
-export function CursorTerminal() {
+export function LandingTerminal() {
 	const [slot, setslot] = useState(1)
 	const active = scenes[slot]
 	const rows = useMemo(() => active.data, [active])
@@ -103,7 +103,7 @@ export function CursorTerminal() {
 				</div>
 			</div>
 
-			<div className="cursor-terminal-scroll flex-1 overflow-y-auto bg-[#050505] px-4 py-3 font-mono text-[12px] leading-[1.62] tabular-nums">
+			<div className="landing-terminal-scroll flex-1 overflow-y-auto bg-[#050505] px-4 py-3 font-mono text-[12px] leading-[1.62] tabular-nums">
 				{rows.map((row, index) => (
 					<div
 						key={`${active.name}-${index}`}
@@ -115,7 +115,7 @@ export function CursorTerminal() {
 			</div>
 
 			<div className="border-t border-white/8 bg-black/15 px-2 py-1.5">
-				<div className="cursor-terminal-scroll flex items-center gap-1 overflow-x-auto font-mono text-[11px] text-white/45">
+				<div className="landing-terminal-scroll flex items-center gap-1 overflow-x-auto font-mono text-[11px] text-white/45">
 					{scenes.map((scene, index) => {
 						const current = index === slot
 						return (

packages/web/components/landing/cursor-mac-window.tsx → packages/web/components/landing/landing-window.tsx

@@ -1,6 +1,6 @@
 import type { ReactNode } from "react"
 
-export function CursorMacWindow({
+export function LandingWindow({
 	title,
 	bar = true,
 	children,