SEO

greenlns-landing/components/SeoCategoryPage.tsx

@@ -10,6 +10,63 @@ interface SeoCategoryPageProps {
 }
 
 export default function SeoCategoryPage({ profile }: SeoCategoryPageProps) {
+  const labels = {
+    en: {
+      heroTag: 'GreenLens',
+      primaryCta: 'Try GreenLens',
+      secondaryCta: 'See full comparison',
+      definition: 'Definition',
+      updated: 'Last updated:',
+      tableTag: 'At a glance',
+      bestFit: 'Best fit',
+      chooseIf: 'Choose GreenLens if:',
+      notBestFit: 'Not the best fit',
+      notRightIf: 'GreenLens is not the right tool if:',
+      faqTag: 'FAQ',
+      faqTitle: 'Common questions answered directly.',
+      related: 'Related',
+      supportTag: 'Need help?',
+      supportTitle: 'Talk to GreenLens support',
+      supportCopy: 'Questions about scans, care plans, billing, or features? Use the support page.',
+    },
+    de: {
+      heroTag: 'GreenLens',
+      primaryCta: 'GreenLens testen',
+      secondaryCta: 'Vergleich ansehen',
+      definition: 'Definition',
+      updated: 'Aktualisiert:',
+      tableTag: 'Überblick',
+      bestFit: 'Passt gut',
+      chooseIf: 'Wähle GreenLens, wenn:',
+      notBestFit: 'Nicht ideal',
+      notRightIf: 'GreenLens ist nicht die richtige Wahl, wenn:',
+      faqTag: 'FAQ',
+      faqTitle: 'Häufige Fragen direkt beantwortet.',
+      related: 'Verwandt',
+      supportTag: 'Brauchst du Hilfe?',
+      supportTitle: 'GreenLens Support kontaktieren',
+      supportCopy: 'Fragen zu Scans, Pflegeplänen, Abrechnung oder Funktionen? Nutze die Support-Seite.',
+    },
+    es: {
+      heroTag: 'GreenLens',
+      primaryCta: 'Probar GreenLens',
+      secondaryCta: 'Ver comparación',
+      definition: 'Definición',
+      updated: 'Actualizado:',
+      tableTag: 'Resumen',
+      bestFit: 'Mejor opción',
+      chooseIf: 'Elige GreenLens si:',
+      notBestFit: 'No es ideal',
+      notRightIf: 'GreenLens no es la herramienta adecuada si:',
+      faqTag: 'FAQ',
+      faqTitle: 'Preguntas frecuentes respondidas directamente.',
+      related: 'Relacionado',
+      supportTag: '¿Necesitas ayuda?',
+      supportTitle: 'Contacta con soporte de GreenLens',
+      supportCopy: '¿Preguntas sobre escaneos, planes de cuidado, facturación o funciones? Usa la página de soporte.',
+    },
+  }[profile.locale ?? 'en']
+
   const faqSchema = {
     '@context': 'https://schema.org',
     '@type': 'FAQPage',
@@ -81,20 +138,20 @@ export default function SeoCategoryPage({ profile }: SeoCategoryPageProps) {
         <section className="comparison-hero">
           <div className="container comparison-hero-grid">
             <div className="comparison-hero-copy">
-              <p className="tag">GreenLens</p>
+              <p className="tag">{labels.heroTag}</p>
               <h1>{profile.h1}</h1>
               <p className="comparison-lead">{profile.tagline}</p>
               <p>{profile.directAnswer}</p>
               <div className="comparison-actions">
-                <a href="#cta" className="btn-primary">Try GreenLens</a>
-                <a href="#feature-table" className="btn-outline">See full comparison</a>
+                <a href="#cta" className="btn-primary">{labels.primaryCta}</a>
+                <a href="#feature-table" className="btn-outline">{labels.secondaryCta}</a>
               </div>
             </div>
 
             <aside className="comparison-hero-card">
-              <p className="comparison-card-label">Definition</p>
+              <p className="comparison-card-label">{labels.definition}</p>
               <p>{profile.definitionBlock}</p>
-              <p className="comparison-verified">Last updated: {profile.lastUpdated}</p>
+              <p className="comparison-verified">{labels.updated} {profile.lastUpdated}</p>
             </aside>
           </div>
         </section>
@@ -103,7 +160,7 @@ export default function SeoCategoryPage({ profile }: SeoCategoryPageProps) {
         <section className="comparison-table-section" id="feature-table">
           <div className="container">
             <div className="comparison-section-head">
-              <p className="tag">At a glance</p>
+              <p className="tag">{labels.tableTag}</p>
               <h2>{profile.featureTable.title}</h2>
             </div>
 
@@ -129,8 +186,8 @@ export default function SeoCategoryPage({ profile }: SeoCategoryPageProps) {
         <section className="comparison-fit">
           <div className="container comparison-fit-grid">
             <article className="comparison-fit-card comparison-fit-card--greenlens">
-              <p className="tag">Best fit</p>
-              <h2>Choose GreenLens if:</h2>
+              <p className="tag">{labels.bestFit}</p>
+              <h2>{labels.chooseIf}</h2>
               <ul className="comparison-bullet-list comparison-bullet-list--dark">
                 {profile.greenLensIf.map((item) => (
                   <li key={item}>{item}</li>
@@ -139,8 +196,8 @@ export default function SeoCategoryPage({ profile }: SeoCategoryPageProps) {
             </article>
 
             <article className="comparison-fit-card">
-              <p className="tag">Not the best fit</p>
-              <h2>GreenLens is not the right tool if:</h2>
+              <p className="tag">{labels.notBestFit}</p>
+              <h2>{labels.notRightIf}</h2>
               <ul className="comparison-bullet-list comparison-bullet-list--dark">
                 {profile.notBestIf.map((item) => (
                   <li key={item}>{item}</li>
@@ -154,8 +211,8 @@ export default function SeoCategoryPage({ profile }: SeoCategoryPageProps) {
         <section className="comparison-faq">
           <div className="container">
             <div className="comparison-section-head">
-              <p className="tag">FAQ</p>
-              <h2>Common questions answered directly.</h2>
+              <p className="tag">{labels.faqTag}</p>
+              <h2>{labels.faqTitle}</h2>
             </div>
 
             <div className="comparison-faq-grid">
@@ -175,18 +232,16 @@ export default function SeoCategoryPage({ profile }: SeoCategoryPageProps) {
             <div className="container comparison-links-grid">
               {profile.relatedLinks.map((link) => (
                 <Link key={link.href} href={link.href} className="comparison-link-card">
-                  <p className="comparison-mini-label">Related</p>
+                  <p className="comparison-mini-label">{labels.related}</p>
                   <h3>{link.label}</h3>
                   <p>{link.description}</p>
                 </Link>
               ))}
 
               <Link href="/support" className="comparison-link-card comparison-link-card--support">
-                <p className="comparison-mini-label">Need help?</p>
-                <h3>Talk to GreenLens support</h3>
-                <p>
-                  Questions about scans, care plans, billing, or features? Use the support page.
-                </p>
+                <p className="comparison-mini-label">{labels.supportTag}</p>
+                <h3>{labels.supportTitle}</h3>
+                <p>{labels.supportCopy}</p>
               </Link>
             </div>
           </section>