diff --git a/apps/web/components/pages/HomePage/Features.tsx b/apps/web/components/pages/HomePage/Features.tsx
index 034a97a55..d8eaf0428 100644
--- a/apps/web/components/pages/HomePage/Features.tsx
+++ b/apps/web/components/pages/HomePage/Features.tsx
@@ -149,8 +149,8 @@ const features: Feature[] = homepageCopy.features.features.map(
 const Features = () => {
 	return (
 		<div className="text-center max-w-[1440px] mx-auto px-5">
-			<h2 className="mb-3">{homepageCopy.features.title}</h2>
-			<p className="text-lg leading-[1.75rem] w-full max-w-[600px] mx-auto">
+			<h1 className="mb-3">{homepageCopy.features.title}</h1>
+			<p className="text-lg text-gray-10 leading-[1.75rem] w-full max-w-[600px] mx-auto">
 				{homepageCopy.features.subtitle}
 			</p>
 			<div className="flex flex-col gap-4 mt-[52px]">
diff --git a/apps/web/components/pages/HomePage/Pricing/CommercialCard.tsx b/apps/web/components/pages/HomePage/Pricing/CommercialCard.tsx
index 56919057c..f81283e12 100644
--- a/apps/web/components/pages/HomePage/Pricing/CommercialCard.tsx
+++ b/apps/web/components/pages/HomePage/Pricing/CommercialCard.tsx
@@ -77,13 +77,13 @@ export const CommercialCard = () => {
 					<h3 className="mb-2 text-xl font-semibold text-center text-gray-12">
 						{homepageCopy.pricing.commercial.title}
 					</h3>
-					<p className="mb-3 text-sm text-center text-gray-11 w-full max-w-[285px] mx-auto font-medium">
+					<p className="mb-3 text-base text-center text-gray-11 w-full max-w-[285px] mx-auto">
 						{homepageCopy.pricing.commercial.description}
 					</p>
 					<div className="mb-6 text-center">
 						<a
 							href="/docs/commercial-license"
-							className="text-xs underline text-gray-10 hover:text-gray-12"
+							className="text-sm underline text-gray-10 hover:text-gray-12"
 						>
 							Learn more about the commercial license here
 						</a>
@@ -99,7 +99,7 @@ export const CommercialCard = () => {
 						/ {billingCycleText}
 					</span>
 					{isYearly ? (
-						<p className="text-sm tabular-nums text-gray-10">
+						<p className="text-base tabular-nums text-gray-10">
 							or, $
 							<NumberFlow
 								value={licenses * COMMERCIAL_LICENSE_LIFETIME_PRICE}
@@ -107,7 +107,7 @@ export const CommercialCard = () => {
 							one-time payment
 						</p>
 					) : (
-						<p className="text-sm tabular-nums text-gray-10">
+						<p className="text-base tabular-nums text-gray-10">
 							or, $
 							<NumberFlow value={licenses * COMMERCIAL_LICENSE_YEARLY_PRICE} />{" "}
 							/ year
diff --git a/apps/web/components/pages/HomePage/Pricing/EnterpriseCard.tsx b/apps/web/components/pages/HomePage/Pricing/EnterpriseCard.tsx
index 0d0162660..09fa01f17 100644
--- a/apps/web/components/pages/HomePage/Pricing/EnterpriseCard.tsx
+++ b/apps/web/components/pages/HomePage/Pricing/EnterpriseCard.tsx
@@ -62,7 +62,7 @@ export const EnterpriseCard = () => {
 							<h3 className="mb-2 text-xl font-semibold text-center text-gray-12">
 								Cap for Enterprise
 							</h3>
-							<p className="mb-4 text-sm font-medium text-center text-gray-11">
+							<p className="mb-4 text-base text-center text-gray-11">
 								Deploy Cap across your organization with enterprise-grade
 								features, dedicated support, and custom integrations.
 							</p>
diff --git a/apps/web/components/pages/HomePage/Pricing/ProCard.tsx b/apps/web/components/pages/HomePage/Pricing/ProCard.tsx
index a014eaab3..eba02bf79 100644
--- a/apps/web/components/pages/HomePage/Pricing/ProCard.tsx
+++ b/apps/web/components/pages/HomePage/Pricing/ProCard.tsx
@@ -120,7 +120,7 @@ export const ProCard = () => {
 					<h3 className="mb-2 text-xl font-semibold text-center">
 						{homepageCopy.pricing.pro.title}
 					</h3>
-					<p className="mb-4 text-sm font-medium text-center text-gray-6">
+					<p className="mb-4 text-base text-center text-gray-6">
 						{homepageCopy.pricing.pro.description}
 					</p>
 				</div>
@@ -134,11 +134,11 @@ export const ProCard = () => {
 						{billingCycleTextPro}
 					</span>
 					{isAnnually ? (
-						<p className="text-sm text-gray-8">
+						<p className="text-base text-gray-8">
 							or,{" "}
 							<NumberFlow
 								value={CAP_PRO_MONTHLY_PRICE_PER_USER * users}
-								className="text-sm tabular-nums"
+								className="text-base tabular-nums"
 								format={{
 									notation: "compact",
 									style: "currency",
@@ -151,18 +151,21 @@ export const ProCard = () => {
 							) : (
 								<>
 									for{" "}
-									<NumberFlow value={users} className="text-sm tabular-nums" />{" "}
+									<NumberFlow
+										value={users}
+										className="text-base tabular-nums"
+									/>{" "}
 									users,{" "}
 								</>
 							)}
 							billed monthly
 						</p>
 					) : (
-						<p className="text-sm text-gray-8">
+						<p className="text-base text-gray-8">
 							or,{" "}
 							<NumberFlow
 								value={CAP_PRO_ANNUAL_PRICE_PER_USER * users}
-								className="text-sm tabular-nums"
+								className="text-base tabular-nums"
 								format={{
 									notation: "compact",
 									style: "currency",
@@ -175,7 +178,10 @@ export const ProCard = () => {
 							) : (
 								<>
 									for{" "}
-									<NumberFlow value={users} className="text-sm tabular-nums" />{" "}
+									<NumberFlow
+										value={users}
+										className="text-base tabular-nums"
+									/>{" "}
 									users,{" "}
 								</>
 							)}
diff --git a/apps/web/components/pages/HomePage/Pricing/index.tsx b/apps/web/components/pages/HomePage/Pricing/index.tsx
index 4b60461dd..e2f4804d5 100644
--- a/apps/web/components/pages/HomePage/Pricing/index.tsx
+++ b/apps/web/components/pages/HomePage/Pricing/index.tsx
@@ -11,8 +11,8 @@ const Pricing = () => {
 	return (
 		<div className="w-full max-w-[1100px] mx-auto px-5">
 			<div className="px-5 mb-16 text-center">
-				<h2 className="mb-3 w-full">{homepageCopy.pricing.title}</h2>
-				<p className="text-lg max-w-[800px] mx-auto leading-[1.75rem] w-full">
+				<h1 className="mb-3 w-full">{homepageCopy.pricing.title}</h1>
+				<p className="text-lg text-gray-10 max-w-[800px] mx-auto leading-[1.75rem] w-full">
 					{homepageCopy.pricing.subtitle}
 				</p>
 				<div className="flex justify-center items-center px-5 py-2.5 gap-2 mx-auto mt-6 rounded-full border bg-gray-1 border-gray-5 w-fit">
diff --git a/apps/web/components/pages/HomePage/RecordingModes.tsx b/apps/web/components/pages/HomePage/RecordingModes.tsx
index 4a2b9acab..199630c79 100644
--- a/apps/web/components/pages/HomePage/RecordingModes.tsx
+++ b/apps/web/components/pages/HomePage/RecordingModes.tsx
@@ -143,7 +143,7 @@ const RecordingModes = () => {
 				</div>
 				{/*Video Description*/}
 				<div className="p-4 border-t border-b bg-gray-2 border-gray-5">
-					<p className="mx-auto w-full text-sm text-center md:text-xl text-gray-12">
+					<p className="mx-auto w-full text-lg text-center text-gray-12">
 						{activeMode?.description}
 					</p>
 				</div>
diff --git a/apps/web/components/pages/HomePage/Testimonials.tsx b/apps/web/components/pages/HomePage/Testimonials.tsx
index 07570f87c..f9ab47457 100644
--- a/apps/web/components/pages/HomePage/Testimonials.tsx
+++ b/apps/web/components/pages/HomePage/Testimonials.tsx
@@ -120,11 +120,11 @@ const testimonialItems: TestimonialItem[] = [
 const Testimonials = () => {
 	return (
 		<div className="w-full max-w-[1200px] mx-auto md:px-5">
-			<div className="px-5 mb-16 text-center md:text-left">
-				<h2 className="mb-3 w-full max-w-[440px]">
+			<div className="px-5 mb-16 text-center">
+				<h1 className="mb-3 w-full max-w-[500px] mx-auto text-balance">
 					{homepageCopy.testimonials.title}
-				</h2>
-				<p className="text-lg leading-[1.75rem] w-full max-w-[500px]">
+				</h1>
+				<p className="text-lg text-gray-10 text-balance mx-auto leading-[1.75rem] w-full max-w-[500px]">
 					{homepageCopy.testimonials.subtitle}
 				</p>
 			</div>
diff --git a/apps/web/components/pages/seo/AgenciesPage.tsx b/apps/web/components/pages/seo/AgenciesPage.tsx
index 29da81ee6..a46d59fc7 100644
--- a/apps/web/components/pages/seo/AgenciesPage.tsx
+++ b/apps/web/components/pages/seo/AgenciesPage.tsx
@@ -34,9 +34,9 @@ const FAQItem = ({
 	return (
 		<div
 			className={clsx(
-				"rounded-xl overflow-hidden border border-gray-5",
+				"overflow-hidden rounded-xl border border-gray-5",
 				isOpen
-					? "bg-blue-500 text-white"
+					? "text-white bg-blue-500"
 					: "bg-gray-1 hover:bg-gray-3 text-gray-12",
 				"transition-colors duration-200",
 			)}
@@ -96,8 +96,8 @@ const AnimatedDomainBanner = () => {
 	}, []);
 
 	return (
-		<div className="mx-auto max-w-2xl mb-12 text-center">
-			<div className="relative rounded-xl bg-white border border-gray-200 p-8 shadow-sm">
+		<div className="mx-auto mb-12 max-w-2xl text-center">
+			<div className="relative p-8 bg-white rounded-xl border border-gray-200 shadow-sm">
 				<div className="flex flex-col items-center space-y-4">
 					{/* Art */}
 					<div className="flex-shrink-0">
@@ -110,7 +110,7 @@ const AnimatedDomainBanner = () => {
 					</h3>
 
 					{/* Description */}
-					<p className="text-sm text-gray-600 max-w-md">
+					<p className="max-w-md text-sm text-gray-600">
 						Send from your own domain for higher client trust and professional
 						branding. Your share links reflect your agency's identity.
 					</p>
@@ -399,14 +399,14 @@ export const AgenciesPage = () => {
 				</div>
 			</div>
 
-			<div className="relative z-10 space-y-24 md:space-y-32 mt-24 mb-24 wrapper">
+			<div className="relative z-10 mt-24 mb-24 space-y-24 md:space-y-32 wrapper">
 				{/* Features Section */}
 				<div>
 					<div className="text-center max-w-[800px] mx-auto mb-16">
 						<h2 className="inline-block relative mb-2 text-3xl font-medium md:text-4xl text-gray-12">
 							{agenciesContent.featuresTitle}
 						</h2>
-						<p className="text-xl leading-relaxed text-gray-600">
+						<p className="text-xl leading-relaxed text-gray-10">
 							{agenciesContent.featuresDescription}
 						</p>
 					</div>
diff --git a/apps/web/components/seo/SeoPageTemplate.tsx b/apps/web/components/seo/SeoPageTemplate.tsx
index e9b968c6f..10b00ecad 100644
--- a/apps/web/components/seo/SeoPageTemplate.tsx
+++ b/apps/web/components/seo/SeoPageTemplate.tsx
@@ -223,7 +223,7 @@ export const SeoPageTemplate = ({
 						<h2 className="inline-block relative mb-2 text-3xl font-medium md:text-4xl text-gray-12">
 							{content.featuresTitle}
 						</h2>
-						<p className="text-xl leading-relaxed text-gray-600">
+						<p className="text-xl leading-relaxed text-gray-10">
 							{renderHTML(content.featuresDescription)}
 						</p>
 					</div>
@@ -241,7 +241,7 @@ export const SeoPageTemplate = ({
 								<h3 className="mb-4 text-xl font-semibold text-gray-12">
 									{feature.title}
 								</h3>
-								<p className="leading-relaxed text-gray-600">
+								<p className="leading-relaxed text-gray-10">
 									{renderHTML(feature.description)}
 								</p>
 							</div>