Point color, radius, stroke, focus, and type tokens at the Figma scale so later sections use the same values.

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

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

@@ -22,9 +22,9 @@ function CardStepsView({
         type="application/ld+json"
         dangerouslySetInnerHTML={{ __html: schemaJson }}
       />
-      <section className="bg-transparent py-[var(--spacing-scale-032)] px-[var(--spacing-scale-020)] sm:py-[var(--spacing-scale-048)] sm:px-[var(--spacing-scale-032)] lg:py-[var(--spacing-scale-064)] lg:px-[var(--spacing-scale-064)] xl:py-[var(--spacing-scale-076)] xl:px-[var(--spacing-scale-064)]">
+      <section className="bg-transparent py-[var(--space-800)] px-[var(--space-500)] sm:py-[var(--space-1200)] sm:px-[var(--space-800)] lg:py-[var(--space-1800)] lg:px-[var(--space-1800)] xl:py-[var(--space-2100)] xl:px-[var(--space-1800)]">
         <div className="max-w-[var(--spacing-measures-max-width-lg)] mx-auto">
-          <div className="grid grid-cols-1 gap-y-[var(--spacing-scale-024)] sm:gap-y-[var(--spacing-scale-032)] lg:gap-y-[var(--spacing-scale-056)]">
+          <div className="grid grid-cols-1 gap-y-[var(--space-600)] sm:gap-y-[var(--space-800)] lg:gap-y-[var(--space-1400)]">
             <div>
               <SectionHeader
                 variant="multi-line"
@@ -35,7 +35,7 @@ function CardStepsView({
               />
             </div>
 
-            <div className="grid grid-cols-1 gap-y-[var(--spacing-scale-024)] lg:grid-cols-3 lg:gap-[var(--spacing-scale-024)]">
+            <div className="grid grid-cols-1 gap-y-[var(--space-600)] lg:grid-cols-3 lg:gap-[var(--space-600)]">
               {steps.map((item, index) => (
                 <Step
                   key={index}