Update src/app/page.tsx

Merge version_3 into main

src/app/page.tsx

@@ -3,14 +3,15 @@
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
 import AboutMetric from '@/components/sections/about/AboutMetric';
-import FaqDouble from '@/components/sections/faq/FaqDouble';
+import SplitAbout from '@/components/sections/about/SplitAbout';
+import FaqSplitText from '@/components/sections/faq/FaqSplitText';
 import FeatureCardTwentyThree from '@/components/sections/feature/FeatureCardTwentyThree';
 import FooterMedia from '@/components/sections/footer/FooterMedia';
 import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
 import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
 import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
 import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
-import { Briefcase, Building, Clock, DollarSign, User, Users } from "lucide-react";
+import { Briefcase, Building, Clock, DollarSign, User, Users, Lock, ShieldCheck, Cloud } from "lucide-react";
 import { useEffect } from "react";
 
 export default function LandingPage() {
@@ -216,27 +217,75 @@ export default function LandingPage() {
   </div>
 
   <div id="faq" data-section="faq">
-      <FaqDouble
+      <FaqSplitText
-      textboxLayout="default"
       useInvertedBackground={true}
       faqs={[
-        {
+        { id: "q1", title: "¿Necesito la clave fiscal?", content: "No necesitas compartir tu clave fiscal con Declara. La plataforma trabaja con la información que vos cargas o que autorizás a través de la API de AFIP (cuando esté disponible)." },
-          id: "q1",          title: "¿Cómo funciona la prueba gratuita?",          content: "Ofrecemos una prueba gratuita de 7 días para que explores todas las funcionalidades de nuestro plan Profesional sin compromiso."},
+        { id: "q2", title: "¿Genera archivos listos para AFIP?", content: "Sí, Declara genera automáticamente los archivos y reportes necesarios para tus declaraciones juradas ante AFIP, listos para ser presentados." },
-        {
+        { id: "q3", title: "¿Se actualiza automáticamente?", content: "Nuestra plataforma se actualiza constantemente para reflejar los últimos cambios en la normativa fiscal argentina, asegurando que siempre estés al día." },
-          id: "q2",          title: "¿Necesito conocimientos contables para usar la app?",          content: "Nuestra interfaz es intuitiva y está diseñada para ser usada tanto por contadores como por contribuyentes sin experiencia previa. Sin embargo, para decisiones complejas, siempre recomendamos consultar con un profesional."},
+        { id: "q4", title: "¿Convenio Multilateral?", content: "Declara te ayuda con el cálculo y la presentación de tus declaraciones de Convenio Multilateral, simplificando esta compleja área." },
-        {
+        { id: "q5", title: "¿Qué pasa con mis datos?", content: "Tus datos fiscales y personales son tratados con la máxima confidencialidad, utilizando encriptación avanzada y servidores seguros en Argentina." },
-          id: "q3",          title: "¿Qué seguridad tienen mis datos fiscales?",          content: "Utilizamos encriptación de grado bancario y seguimos los más altos estándares de seguridad para proteger toda tu información fiscal y personal."},
+        { id: "q6", title: "¿Cumple Ley 25.326?", content: "Sí, Declara cumple estrictamente con la Ley de Protección de Datos Personales (Ley 25.326) y el Reglamento General de Protección de Datos (RGPD) europeo." }
-        {
-          id: "q4",          title: "¿Puedo cambiar de plan en cualquier momento?",          content: "Sí, puedes ascender o descender de plan en cualquier momento. El cambio se aplicará de forma proporcional en tu próxima facturación."},
-        {
-          id: "q5",          title: "¿Se integra con otros sistemas?",          content: "Actualmente estamos trabajando en integraciones con plataformas de facturación electrónica y bancos. Consulta nuestra hoja de ruta para más detalles."},
       ]}
-      title="¿Preguntas frecuentes?"
+      sideTitle="Preguntas Frecuentes"
-      description="Resolvemos tus dudas más comunes sobre nuestra plataforma y servicios."
+      sideDescription="Resolvemos tus dudas más comunes sobre nuestra plataforma y servicios."
       faqsAnimation="slide-up"
     />
   </div>
 
+  <div id="security" data-section="security">
+      <SplitAbout
+        title="Tus datos fiscales, protegidos."
+        description="En Declara, la seguridad de tu información es nuestra máxima prioridad. Implementamos medidas robustas para garantizar la confidencialidad e integridad de tus datos fiscales y personales."
+        bulletPoints={[
+            {
+                icon: Lock,
+                title: "Encriptación Avanzada",                description: "Toda tu información es encriptada con los estándares más altos, similar a la seguridad bancaria."
+            },
+            {
+                icon: ShieldCheck,
+                title: "Cumplimiento Ley 25.326",                description: "Adherimos estrictamente a la Ley de Protección de Datos Personales de Argentina, garantizando tus derechos."
+            },
+            {
+                icon: Cloud,
+                title: "Servidores Seguros en Argentina",                description: "Tus datos residen en infraestructura de alta seguridad ubicada en territorio argentino."
+            }
+        ]}
+        imagePosition="right"
+        mediaAnimation="blur-reveal"
+        useInvertedBackground={false}
+        textboxLayout="default"
+      />
+  </div>
+
+  <div id="how-it-works" data-section="how-it-works">
+      <FeatureCardTwentyThree
+          animationType="slide-up"
+          textboxLayout="default"
+          useInvertedBackground={true}
+          title="Cómo funciona Declara"
+          description="Simplificar tu gestión fiscal es más fácil de lo que imaginas. Sigue estos 4 pasos y toma el control de tus finanzas."
+          features={[
+              {
+                  id: "step1",                  title: "1. Regístrate y Conecta",                  tags: ["Inicio"],
+                  imageSrc: "http://img.b2bpic.net/free-photo/accountant-checking-financial-report-on-computer_23-2150375936.jpg",                  imageAlt: "User registering and connecting accounts"
+              },
+              {
+                  id: "step2",                  title: "2. Carga tus Comprobantes",                  tags: ["Datos"],
+                  imageSrc: "http://img.b2bpic.net/free-photo/side-view-man-using-laptop-with-graphic-report_23-2148419688.jpg",                  imageAlt: "Uploading invoices and receipts"
+              },
+              {
+                  id: "step3",                  title: "3. Automatiza Cálculos",                  tags: ["Cálculos"],
+                  imageSrc: "http://img.b2bpic.net/free-photo/business-woman-accountant-looking-invoice-analyzing-financial-statistics-report_1098-17551.jpg",                  imageAlt: "Automatic tax calculations"
+              },
+              {
+                  id: "step4",                  title: "4. Genera Reportes y Presenta",                  tags: ["Reportes"],
+                  imageSrc: "http://img.b2bpic.net/free-photo/close-up-of-hands-typing-on-a-laptop_23-2148119045.jpg",                  imageAlt: "Generating reports for AFIP submission"
+              }
+          ]}
+      />
+  </div>
+
   <div id="social-proof" data-section="social-proof">
       <SocialProofOne
       textboxLayout="default"
@@ -254,48 +303,38 @@ export default function LandingPage() {
       imageAlt="Abstract tech background"
       logoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=6h5de9"
       logoAlt="[NOMBRE DE TU MARCA] Logo"
-      logoText="[NOMBRE DE TU MARCA]"
+      logoText="Declara"
       columns={[
         {
           title: "Empresa",          items: [
-            {
+            { label: "Sobre Nosotros", href: "#" },
-              label: "Sobre Nosotros",              href: "#"},
+            { label: "Contacto", href: "/contact" },
-            {
+            { label: "Carreras", href: "#" }
-              label: "Contacto",              href: "#"},
+          ]
-            {
-              label: "Carreras",              href: "#"},
-          ],
         },
         {
           title: "Soluciones",          items: [
-            {
+            { label: "Monotributo", href: "/app/monotributo" },
-              label: "Monotributo",              href: "/app/monotributo"},
+            { label: "IVA", href: "/app/iva" },
-            {
+            { label: "Ganancias", href: "/app/ganancias" }
-              label: "IVA",              href: "/app/iva"},
+          ]
-            {
-              label: "Ganancias",              href: "/app/ganancias"},
-          ],
         },
         {
           title: "Soporte",          items: [
-            {
+            { label: "FAQ", href: "/#faq" },
-              label: "FAQ",              href: "/#faq"},
+            { label: "Ayuda", href: "#" },
-            {
+            { label: "Blog", href: "#" }
-              label: "Ayuda",              href: "#"},
+          ]
-            {
-              label: "Blog",              href: "#"},
-          ],
         },
         {
           title: "Legal",          items: [
-            {
+            { label: "Términos y Condiciones", href: "/terminos-y-condiciones" },
-              label: "Términos de Servicio",              href: "#"},
+            { label: "Política de Privacidad", href: "/politica-privacidad" },
-            {
+            { label: "Cumplimiento Ley 25.326", href: "/cumplimiento-ley-25326" }
-              label: "Política de Privacidad",              href: "#"},
+          ]
-          ],
+        }
-        },
       ]}
-      copyrightText="© 2024 [NOMBRE DE TU MARCA]. Todos los derechos reservados."
+      copyrightText="© 2025 Declara. Todos los derechos reservados."
     />
   </div>
       </ReactLenis>

src/app/styles/variables.css

@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #010912;
+  --background: #050012;
-  --card: #152840;
+  --card: #040121;
-  --foreground: #e6f0ff;
+  --foreground: #f0e6ff;
-  --primary-cta: #cee7ff;
+  --primary-cta: #c89bff;
-  --primary-cta-text: #010912;
+  --primary-cta-text: #050012;
-  --secondary-cta: #0e1a29;
+  --secondary-cta: #1d123b;
-  --secondary-cta-text: #e6f0ff;
+  --secondary-cta-text: #f0e6ff;
-  --accent: #3f5c79;
+  --accent: #684f7b;
-  --background-accent: #004a93;
+  --background-accent: #65417c;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);