Merge version_2_1781655591788 into main

Merge version_2_1781655591788 into main

src/index.css

@@ -5,15 +5,15 @@
 
 :root {
   /* @colorThemes/lightTheme/grayNavyBlue */
-  --background: #f5faff;
+  --background: #f5f8f6;
   --card: #ffffff;
-  --foreground: #001122;
-  --primary-cta: #15479c;
-  --primary-cta-text: #f5faff;
-  --secondary-cta: #ffffff;
-  --secondary-cta-text: #001122;
-  --accent: #a8cce8;
-  --background-accent: #7ba3cf;
+  --foreground: #1c1c1c;
+  --primary-cta: #0a97ff;
+  --primary-cta-text: #ffffff;
+  --secondary-cta: #2d8c4e;
+  --secondary-cta-text: #ffffff;
+  --accent: #b6dfc9;
+  --background-accent: #edf7f2;
 
   /* @layout/border-radius/rounded */
   --radius: 0.5rem;

src/pages/HomePage.tsx

@@ -1,141 +1,39 @@
-import ContactCta from '@/components/sections/contact/ContactCta';
-import FaqTwoColumn from '@/components/sections/faq/FaqTwoColumn';
-import FeaturesBento from '@/components/sections/features/FeaturesBento';
-import FeaturesImageBento from '@/components/sections/features/FeaturesImageBento';
-import HeroBrand from '@/components/sections/hero/HeroBrand';
-import MetricsMediaCards from '@/components/sections/metrics/MetricsMediaCards';
-import SocialProofMarquee from '@/components/sections/social-proof/SocialProofMarquee';
-import TeamOverlayCards from '@/components/sections/team/TeamOverlayCards';
-import { Calculator, MapPin, Facebook, Instagram } from "lucide-react";
-import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
-import FooterMinimal from '@/components/sections/footer/FooterMinimal';
+// AUTO-GENERATED shell by per-section-migrate.
+// Section bodies live in ./<PageBase>/sections/<X>.tsx. Edit the section
+// files directly. Non-block content (wrappers, non-inlinable sections) is
+// preserved inline; extracted section blocks become <XSection/> refs.
 
-export default function HomePage() {
+import React from 'react';
+import HeroSection from './HomePage/sections/Hero';
+import StatsSection from './HomePage/sections/Stats';
+import CreditsSection from './HomePage/sections/Credits';
+import ResourcesSection from './HomePage/sections/Resources';
+import PartnersSection from './HomePage/sections/Partners';
+import FaqSection from './HomePage/sections/Faq';
+import TeamSection from './HomePage/sections/Team';
+import ContactSection from './HomePage/sections/Contact';
+import FooterSection from './HomePage/sections/Footer';
+
+export default function HomePage(): React.JSX.Element {
   return (
-    <>
-      <div id="hero" data-section="hero">
-        <SectionErrorBoundary name="hero">
-          <HeroBrand
-            brand="Antes de comprar una casa, piensa en SOC"
-            description="Tu red de asesores financieros certificados. Comparamos 15 bancos y 18 instituciones para darte la mejor opción. Sin costo para ti."
-            primaryButton={{ text: "VER CRÉDITOS", href: "#credits" }}
-            secondaryButton={{ text: "SIMULAR", href: "#sim" }}
-            imageSrc="http://img.b2bpic.net/free-photo/family-moving-using-boxes_1157-35356.jpg"
-          />
-        </SectionErrorBoundary>
-      </div>
+<>
+      <HeroSection />
 
-      <div id="stats" data-section="stats">
-        <SectionErrorBoundary name="stats">
-          <MetricsMediaCards
-            tag="Nuestra trayectoria"
-            title="Soluciones reales, expertos respaldados"
-            description="Más de 25 años cambiando vidas mediante asesoría personalizada y transparente."
-            metrics={[
-              { value: "15", title: "Bancos aliados", description: "Acceso a la oferta más amplia del mercado mexicano.", imageSrc: "https://storage.googleapis.com/webild/default/no-image.jpg?id=j6xfzc" },
-              { value: "18", title: "Financieras", description: "Diversidad de productos para cada necesidad financiera.", imageSrc: "http://img.b2bpic.net/free-vector/flat-business-finance-colorful-concept-with-bank-building-financial-banking-icons-illustration_1284-52475.jpg" },
-              { value: "+25", title: "Años", description: "Celebrando un cuarto de siglo de confianza.", imageSrc: "http://img.b2bpic.net/free-vector/flat-design-bank-holiday-labels_23-2149360399.jpg" },
-              { value: "$0", title: "Tu costo", description: "Servicio sin honorarios para nuestros clientes.", imageSrc: "http://img.b2bpic.net/free-vector/illustration-money-savings-protection-plan_53876-37250.jpg" }
-            ]}
-          />
-        </SectionErrorBoundary>
-      </div>
+      <StatsSection />
 
-      <div id="credits" data-section="credits">
-        <SectionErrorBoundary name="credits">
-          <FeaturesImageBento
-            tag="Productos"
-            title="Créditos especializados"
-            description="Encuentra la solución hipotecaria o empresarial ideal para ti."
-            items={[
-              { title: "Compra de Casa", description: "Tu casa nueva o usada.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-pretty-woman-excited-about-christmas-present_114579-58620.jpg" },
-              { title: "Construcción", description: "Financia tu obra propia.", imageSrc: "http://img.b2bpic.net/free-photo/young-couple-smiling-happy-playing-using-cardboard-box-as-car-new-home_839833-20620.jpg" },
-              { title: "Cambio de Hipoteca", description: "Mejora tu tasa actual.", imageSrc: "http://img.b2bpic.net/free-photo/cute-girl-coming-out-cardboard-box_259150-57053.jpg" },
-              { title: "Terreno", description: "Tu primer paso al patrimonio.", imageSrc: "http://img.b2bpic.net/free-photo/minimal-amazing-interior-design_23-2150534548.jpg" },
-              { title: "Preventa", description: "Inversión inteligente.", imageSrc: "http://img.b2bpic.net/free-photo/happy-family-with-dog-moving-new-home_23-2149749152.jpg" },
-              { title: "Liquidez", description: "Capital sobre tu propiedad.", imageSrc: "http://img.b2bpic.net/free-photo/view-nordic-minimalism-japanese-wabi-sabi-interior-design-blend_23-2151160171.jpg" },
-              { title: "Remodelación", description: "Amplía y mejora tu hogar.", imageSrc: "http://img.b2bpic.net/free-photo/happy-family-with-kids-moving-their-new-home_23-2149749199.jpg" }
-            ]}
-          />
-        </SectionErrorBoundary>
-      </div>
+      <CreditsSection />
 
-      <div id="resources" data-section="resources">
-        <SectionErrorBoundary name="resources">
-          <FeaturesBento
-            tag="Herramientas"
-            title="Simuladores y guías"
-            description="Calcula tu crédito antes de decidir."
-            features={[
-              { title: "Calculadora", description: "Simula mensualidades y tasas estimadas.", bentoComponent: "info-card-marquee", infoCards: [{ icon: Calculator, label: "Crédito Hipotecario", value: "10.5%" }] },
-              { title: "Mapa de Oficinas", description: "Encuentra a tu asesor local.", bentoComponent: "icon-text-marquee", centerIcon: MapPin, marqueeTexts: ["+500 asesores", "32 estados"] },
-              { title: "Guías SOC", description: "Aprende el proceso completo.", bentoComponent: "checklist-timeline", heading: "Guía básica", subheading: "Pasos simples", checklistItems: [{ label: "Simulación", detail: "Define tu presupuesto" }, { label: "Documentación", detail: "Prepara tus requisitos" }, { label: "Firma", detail: "Disfruta tu patrimonio" }], completedLabel: "Listo" }
-            ]}
-          />
-        </SectionErrorBoundary>
-      </div>
+      <ResourcesSection />
 
-      <div id="partners" data-section="partners">
-        <SectionErrorBoundary name="partners">
-          <SocialProofMarquee
-            tag="Aliados"
-            title="Las instituciones más sólidas"
-            description="Comparamos simultáneamente para garantizarte la mejor opción."
-            names={["Santander", "Scotiabank", "Banorte", "Banamex", "HSBC", "BanRegio", "Afirme"]}
-          />
-        </SectionErrorBoundary>
-      </div>
+      <PartnersSection />
 
-      <div id="faq" data-section="faq">
-        <SectionErrorBoundary name="faq">
-          <FaqTwoColumn
-            tag="Preguntas frecuentes"
-            title="¿Tienes dudas sobre SOC?"
-            description="Resuelve tus inquietudes aquí."
-            items={[
-              { question: "¿Cuánto cuesta su asesoría?", answer: "Es 100% gratuita para ti. Los bancos nos pagan por la gestión." },
-              { question: "¿Qué tipos de créditos manejan?", answer: "Desde hipotecarios hasta empresariales, autos y seguros." },
-              { question: "¿Por qué elegir a SOC?", answer: "Más de 25 años de experiencia y la red de asesores más grande de México." }
-            ]}
-          />
-        </SectionErrorBoundary>
-      </div>
+      <FaqSection />
 
-      <div id="team" data-section="team">
-        <SectionErrorBoundary name="team">
-          <TeamOverlayCards
-            tag="Equipo"
-            title="Nuestros asesores certificados"
-            description="Expertos listos para acompañarte en tus decisiones financieras."
-            members={[
-              { name: "Asesor SOC", role: "Especialista Hipotecario", imageSrc: "http://img.b2bpic.net/free-photo/3d-contemporary-living-room-interior-modern-furniture_1048-10486.jpg" },
-              { name: "Asesor SOC", role: "Especialista Empresarial", imageSrc: "http://img.b2bpic.net/free-photo/couple-together-holding-christmas-presents_1303-30111.jpg" },
-              { name: "Asesor SOC", role: "Gerente de Oficina", imageSrc: "http://img.b2bpic.net/free-photo/minimal-amazing-interior-design_23-2150534500.jpg" }
-            ]}
-          />
-        </SectionErrorBoundary>
-      </div>
+      <TeamSection />
 
-      <div id="contact" data-section="contact">
-        <SectionErrorBoundary name="contact">
-          <ContactCta
-            tag="Contáctanos"
-            text="Da el primer paso hoy. Asesoría financiera sin costo."
-            primaryButton={{ text: "SOLICITAR ASESORÍA", href: "#" }}
-            secondaryButton={{ text: "WhatsApp", href: "#" }}
-          />
-        </SectionErrorBoundary>
-      </div>
+      <ContactSection />
 
-      <div id="footer" data-section="footer">
-        <SectionErrorBoundary name="footer">
-          <FooterMinimal
-            brand="SOC Asesores · Juntos, lo hacemos real."
-            copyright="© 2026 SOC Asesores. Aviso de Privacidad."
-            socialLinks={[{ icon: Facebook, href: "#" }, { icon: Instagram, href: "#" }]}
-          />
-        </SectionErrorBoundary>
-      </div>
+      <FooterSection />
     </>
   );
-}
+}

src/pages/HomePage/sections/Contact.tsx

@@ -0,0 +1,21 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "contact" section.
+
+import React from 'react';
+import ContactCta from '@/components/sections/contact/ContactCta';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function ContactSection(): React.JSX.Element {
+  return (
+    <div id="contact" data-section="contact">
+            <SectionErrorBoundary name="contact">
+              <ContactCta
+                tag="Contáctanos"
+                text="Da el primer paso hoy. Asesoría financiera sin costo."
+                primaryButton={{ text: "SOLICITAR ASESORÍA", href: "#" }}
+                secondaryButton={{ text: "WhatsApp", href: "#" }}
+              />
+            </SectionErrorBoundary>
+          </div>
+  );
+}

src/pages/HomePage/sections/Credits.tsx

@@ -0,0 +1,29 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "credits" section.
+
+import React from 'react';
+import FeaturesImageBento from '@/components/sections/features/FeaturesImageBento';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function CreditsSection(): React.JSX.Element {
+  return (
+    <div id="credits" data-section="credits">
+            <SectionErrorBoundary name="credits">
+              <FeaturesImageBento
+                tag="Productos"
+                title="Créditos especializados"
+                description="Encuentra la solución hipotecaria o empresarial ideal para ti."
+                items={[
+                  { title: "Compra de Casa", description: "Tu casa nueva o usada.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-pretty-woman-excited-about-christmas-present_114579-58620.jpg" },
+                  { title: "Construcción", description: "Financia tu obra propia.", imageSrc: "http://img.b2bpic.net/free-photo/young-couple-smiling-happy-playing-using-cardboard-box-as-car-new-home_839833-20620.jpg" },
+                  { title: "Cambio de Hipoteca", description: "Mejora tu tasa actual.", imageSrc: "http://img.b2bpic.net/free-photo/cute-girl-coming-out-cardboard-box_259150-57053.jpg" },
+                  { title: "Terreno", description: "Tu primer paso al patrimonio.", imageSrc: "http://img.b2bpic.net/free-photo/minimal-amazing-interior-design_23-2150534548.jpg" },
+                  { title: "Preventa", description: "Inversión inteligente.", imageSrc: "http://img.b2bpic.net/free-photo/happy-family-with-dog-moving-new-home_23-2149749152.jpg" },
+                  { title: "Liquidez", description: "Capital sobre tu propiedad.", imageSrc: "http://img.b2bpic.net/free-photo/view-nordic-minimalism-japanese-wabi-sabi-interior-design-blend_23-2151160171.jpg" },
+                  { title: "Remodelación", description: "Amplía y mejora tu hogar.", imageSrc: "http://img.b2bpic.net/free-photo/happy-family-with-kids-moving-their-new-home_23-2149749199.jpg" }
+                ]}
+              />
+            </SectionErrorBoundary>
+          </div>
+  );
+}

src/pages/HomePage/sections/Faq.tsx

@@ -0,0 +1,25 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "faq" section.
+
+import React from 'react';
+import FaqTwoColumn from '@/components/sections/faq/FaqTwoColumn';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function FaqSection(): React.JSX.Element {
+  return (
+    <div id="faq" data-section="faq">
+            <SectionErrorBoundary name="faq">
+              <FaqTwoColumn
+                tag="Preguntas frecuentes"
+                title="¿Tienes dudas sobre SOC?"
+                description="Resuelve tus inquietudes aquí."
+                items={[
+                  { question: "¿Cuánto cuesta su asesoría?", answer: "Es 100% gratuita para ti. Los bancos nos pagan por la gestión." },
+                  { question: "¿Qué tipos de créditos manejan?", answer: "Desde hipotecarios hasta empresariales, autos y seguros." },
+                  { question: "¿Por qué elegir a SOC?", answer: "Más de 25 años de experiencia y la red de asesores más grande de México." }
+                ]}
+              />
+            </SectionErrorBoundary>
+          </div>
+  );
+}

src/pages/HomePage/sections/Footer.tsx

@@ -0,0 +1,21 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "footer" section.
+
+import React from 'react';
+import { Calculator, MapPin, Facebook, Instagram } from "lucide-react";
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+import FooterMinimal from '@/components/sections/footer/FooterMinimal';
+
+export default function FooterSection(): React.JSX.Element {
+  return (
+    <div id="footer" data-section="footer">
+            <SectionErrorBoundary name="footer">
+              <FooterMinimal
+                brand="SOC Asesores · Juntos, lo hacemos real."
+                copyright="© 2026 SOC Asesores. Aviso de Privacidad."
+                socialLinks={[{ icon: Facebook, href: "#" }, { icon: Instagram, href: "#" }]}
+              />
+            </SectionErrorBoundary>
+          </div>
+  );
+}

src/pages/HomePage/sections/Hero.tsx

@@ -0,0 +1,22 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "hero" section.
+
+import React from 'react';
+import HeroBrand from '@/components/sections/hero/HeroBrand';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function HeroSection(): React.JSX.Element {
+  return (
+    <div id="hero" data-section="hero">
+            <SectionErrorBoundary name="hero">
+              <HeroBrand
+                brand="Antes de comprar una casa, piensa en SOC"
+                description="Tu red de asesores financieros certificados. Comparamos 15 bancos y 18 instituciones para darte la mejor opción. Sin costo para ti."
+                primaryButton={{ text: "VER CRÉDITOS", href: "#credits" }}
+                secondaryButton={{ text: "SIMULAR", href: "#sim" }}
+                imageSrc="http://img.b2bpic.net/free-photo/family-moving-using-boxes_1157-35356.jpg"
+              />
+            </SectionErrorBoundary>
+          </div>
+  );
+}

src/pages/HomePage/sections/Partners.tsx

@@ -0,0 +1,21 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "partners" section.
+
+import React from 'react';
+import SocialProofMarquee from '@/components/sections/social-proof/SocialProofMarquee';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function PartnersSection(): React.JSX.Element {
+  return (
+    <div id="partners" data-section="partners">
+            <SectionErrorBoundary name="partners">
+              <SocialProofMarquee
+                tag="Aliados"
+                title="Las instituciones más sólidas"
+                description="Comparamos simultáneamente para garantizarte la mejor opción."
+                names={["Santander", "Scotiabank", "Banorte", "Banamex", "HSBC", "BanRegio", "Afirme"]}
+              />
+            </SectionErrorBoundary>
+          </div>
+  );
+}

src/pages/HomePage/sections/Resources.tsx

@@ -0,0 +1,26 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "resources" section.
+
+import React from 'react';
+import FeaturesBento from '@/components/sections/features/FeaturesBento';
+import { Calculator, MapPin, Facebook, Instagram } from "lucide-react";
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function ResourcesSection(): React.JSX.Element {
+  return (
+    <div id="resources" data-section="resources">
+            <SectionErrorBoundary name="resources">
+              <FeaturesBento
+                tag="Herramientas"
+                title="Simuladores y guías"
+                description="Calcula tu crédito antes de decidir."
+                features={[
+                  { title: "Calculadora", description: "Simula mensualidades y tasas estimadas.", bentoComponent: "info-card-marquee", infoCards: [{ icon: Calculator, label: "Crédito Hipotecario", value: "10.5%" }] },
+                  { title: "Mapa de Oficinas", description: "Encuentra a tu asesor local.", bentoComponent: "icon-text-marquee", centerIcon: MapPin, marqueeTexts: ["+500 asesores", "32 estados"] },
+                  { title: "Guías SOC", description: "Aprende el proceso completo.", bentoComponent: "checklist-timeline", heading: "Guía básica", subheading: "Pasos simples", checklistItems: [{ label: "Simulación", detail: "Define tu presupuesto" }, { label: "Documentación", detail: "Prepara tus requisitos" }, { label: "Firma", detail: "Disfruta tu patrimonio" }], completedLabel: "Listo" }
+                ]}
+              />
+            </SectionErrorBoundary>
+          </div>
+  );
+}

src/pages/HomePage/sections/Stats.tsx

@@ -0,0 +1,26 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "stats" section.
+
+import React from 'react';
+import MetricsMediaCards from '@/components/sections/metrics/MetricsMediaCards';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function StatsSection(): React.JSX.Element {
+  return (
+    <div id="stats" data-section="stats">
+            <SectionErrorBoundary name="stats">
+              <MetricsMediaCards
+                tag="Nuestra trayectoria"
+                title="Soluciones reales, expertos respaldados"
+                description="Más de 25 años cambiando vidas mediante asesoría personalizada y transparente."
+                metrics={[
+                  { value: "15", title: "Bancos aliados", description: "Acceso a la oferta más amplia del mercado mexicano.", imageSrc: "https://storage.googleapis.com/webild/default/no-image.jpg?id=j6xfzc" },
+                  { value: "18", title: "Financieras", description: "Diversidad de productos para cada necesidad financiera.", imageSrc: "http://img.b2bpic.net/free-vector/flat-business-finance-colorful-concept-with-bank-building-financial-banking-icons-illustration_1284-52475.jpg" },
+                  { value: "+25", title: "Años", description: "Celebrando un cuarto de siglo de confianza.", imageSrc: "http://img.b2bpic.net/free-vector/flat-design-bank-holiday-labels_23-2149360399.jpg" },
+                  { value: "$0", title: "Tu costo", description: "Servicio sin honorarios para nuestros clientes.", imageSrc: "http://img.b2bpic.net/free-vector/illustration-money-savings-protection-plan_53876-37250.jpg" }
+                ]}
+              />
+            </SectionErrorBoundary>
+          </div>
+  );
+}

src/pages/HomePage/sections/Team.tsx

@@ -0,0 +1,25 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "team" section.
+
+import React from 'react';
+import TeamOverlayCards from '@/components/sections/team/TeamOverlayCards';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function TeamSection(): React.JSX.Element {
+  return (
+    <div id="team" data-section="team">
+            <SectionErrorBoundary name="team">
+              <TeamOverlayCards
+                tag="Equipo"
+                title="Nuestros asesores certificados"
+                description="Expertos listos para acompañarte en tus decisiones financieras."
+                members={[
+                  { name: "Asesor SOC", role: "Especialista Hipotecario", imageSrc: "http://img.b2bpic.net/free-photo/3d-contemporary-living-room-interior-modern-furniture_1048-10486.jpg" },
+                  { name: "Asesor SOC", role: "Especialista Empresarial", imageSrc: "http://img.b2bpic.net/free-photo/couple-together-holding-christmas-presents_1303-30111.jpg" },
+                  { name: "Asesor SOC", role: "Gerente de Oficina", imageSrc: "http://img.b2bpic.net/free-photo/minimal-amazing-interior-design_23-2150534500.jpg" }
+                ]}
+              />
+            </SectionErrorBoundary>
+          </div>
+  );
+}