Give every public route its own description, and keep canonicals and structured data on the host that serves the page.

Decorative images on the marketing pages stay quiet, and every dialog close button is named Close.

Co-authored-by: Cursor <cursoragent@cursor.com>

app/components/sections/CardSteps/CardSteps.view.tsx

@@ -35,17 +35,18 @@ function CardStepsView({
               />
             </div>
 
-            <div className="grid grid-cols-1 gap-y-[var(--space-600)] lg:grid-cols-3 lg:gap-[var(--space-600)]">
+            <ol className="m-0 grid list-none grid-cols-1 gap-y-[var(--space-600)] p-0 lg:grid-cols-3 lg:gap-[var(--space-600)]">
               {steps.map((item, index) => (
-                <Step
-                  key={index}
-                  number={index + 1}
-                  text={item.text}
-                  iconShape={item.iconShape}
-                  iconColor={item.iconColor}
-                />
+                <li key={item.text} className="min-w-0">
+                  <Step
+                    number={index + 1}
+                    text={item.text}
+                    iconShape={item.iconShape}
+                    iconColor={item.iconColor}
+                  />
+                </li>
               ))}
-            </div>
+            </ol>
 
             <div className="text-center">
               <Button

app/components/sections/QuoteBlock/QuoteBlock.view.tsx

@@ -2,7 +2,6 @@
 
 import { memo } from "react";
 import Image from "next/image";
-import { useTranslation } from "../../../contexts/MessagesContext";
 import QuoteDecor from "./QuoteDecor";
 import QuoteStatementDecor from "./QuoteStatementDecor";
 import type { QuoteBlockViewProps } from "./QuoteBlock.types";
@@ -21,9 +20,6 @@ function QuoteBlockView({
   currentAvatarSrc,
   onImageError,
 }: QuoteBlockViewProps) {
-  const t = useTranslation("quoteBlock");
-  const avatarAlt = t("avatarAlt").replace("{author}", author);
-
   if (config.citationLayout) {
     return (
       <section
@@ -147,7 +143,7 @@ function QuoteBlockView({
               {!imageError ? (
                 <Image
                   src={currentAvatarSrc}
-                  alt={avatarAlt}
+                  alt=""
                   width={64}
                   height={64}
                   className={`filter sepia ${config.avatar}`}

app/components/sections/SectionNumber.tsx

@@ -18,11 +18,11 @@ const SectionNumber = memo<SectionNumberProps>(({ number }) => {
   };
 
   return (
-    <div className="relative size-[40px] overflow-visible">
+    <div className="relative size-[40px] overflow-visible" aria-hidden>
       {/* eslint-disable-next-line @next/next/no-img-element -- dynamic src from getImageSrc */}
       <img
         src={getImageSrc(number)}
-        alt={`Section ${number}`}
+        alt=""
         className="absolute left-1/2 top-1/2 size-[47.37px] max-w-none -translate-x-1/2 -translate-y-1/2 rotate-15"
       />
       <div className="absolute inset-0 flex items-center justify-center">