Configuracion arquitectura y estilos
This commit is contained in:
@@ -135,11 +135,10 @@ export default function ContactForm() {
|
||||
>
|
||||
Hablemos de
|
||||
<br />
|
||||
tu negocio
|
||||
tu reforma
|
||||
</h2>
|
||||
<p className="text-lg text-gray-600 leading-relaxed">
|
||||
Cuéntanos qué necesitas. Nuestro equipo responderá en menos de 24 horas
|
||||
con una propuesta personalizada.
|
||||
Cuéntanos qué tienes en mente. Un asesor de tu provincia te responderá en menos de 24 horas con una propuesta a medida.
|
||||
</p>
|
||||
|
||||
{/* Contact details */}
|
||||
@@ -157,7 +156,7 @@ export default function ContactForm() {
|
||||
</div>
|
||||
<div>
|
||||
<div className="text-xs font-semibold uppercase tracking-widest text-gray-400">Email</div>
|
||||
<div className="text-base font-semibold text-black">hola@flowsync.io</div>
|
||||
<div className="text-base font-semibold text-black">hola@reformix.es</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -173,7 +172,7 @@ export default function ContactForm() {
|
||||
</div>
|
||||
<div>
|
||||
<div className="text-xs font-semibold uppercase tracking-widest text-gray-400">Teléfono</div>
|
||||
<div className="text-base font-semibold text-black">+1 (800) 123-4567</div>
|
||||
<div className="text-base font-semibold text-black">+34 900 123 456</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -194,16 +193,15 @@ export default function ContactForm() {
|
||||
{/* Testimonial */}
|
||||
<blockquote className="bg-black text-white rounded-xl p-6 flex flex-col gap-4">
|
||||
<p className="text-base leading-relaxed text-white/85 italic">
|
||||
“FlowSync transformó la forma en que colaboramos. Lo que antes
|
||||
tomaba días, ahora lo hacemos en horas.”
|
||||
“Reformix me dio un presupuesto en 5 minutos. A la semana ya tenía a los operarios en casa. Mejor reforma que la que pedí.”
|
||||
</p>
|
||||
<footer className="flex items-center gap-3">
|
||||
<div className="w-10 h-10 bg-white/15 rounded-full flex items-center justify-center text-xs font-bold tracking-wider shrink-0">
|
||||
MR
|
||||
LM
|
||||
</div>
|
||||
<div>
|
||||
<div className="text-sm font-bold">María Rodríguez</div>
|
||||
<div className="text-xs text-white/50">CTO en TechLatam</div>
|
||||
<div className="text-sm font-bold">Laura Martínez</div>
|
||||
<div className="text-xs text-white/50">Reforma de cocina en Madrid</div>
|
||||
</div>
|
||||
</footer>
|
||||
</blockquote>
|
||||
@@ -389,7 +387,7 @@ export default function ContactForm() {
|
||||
? 'border-error shadow-[0_0_0_3px_rgba(255,59,59,0.08)]'
|
||||
: 'border-gray-200'
|
||||
}`}
|
||||
placeholder="Cuéntanos sobre tu proyecto, equipo y qué quieres lograr con FlowSync..."
|
||||
placeholder="Cuéntanos sobre tu reforma: qué espacio quieres reformar, cuál es tu presupuesto aproximado y en qué ciudad vives..."
|
||||
rows={5}
|
||||
value={formData.message}
|
||||
onChange={handleChange}
|
||||
|
||||
@@ -84,18 +84,18 @@ export default function Features() {
|
||||
<div className="container">
|
||||
{/* Header */}
|
||||
<div className="reveal opacity-0 translate-y-6 transition-all duration-700 ease-out text-center max-w-[600px] mx-auto mb-16 flex flex-col items-center gap-4">
|
||||
<span className="badge badge-accent">Características</span>
|
||||
<span className="badge badge-accent">Cómo funciona</span>
|
||||
<h2
|
||||
id="features-heading"
|
||||
className="text-[clamp(1.875rem,5vw,3rem)] font-black tracking-[-0.04em] leading-[1.1] text-black"
|
||||
>
|
||||
Todo lo que necesitas,
|
||||
Tu presupuesto en 5 minutos,
|
||||
<br />
|
||||
<span className="text-gray-600">nada que no necesitas</span>
|
||||
<span className="text-gray-600">sin salir de casa</span>
|
||||
</h2>
|
||||
<p className="text-lg text-gray-600 leading-relaxed">
|
||||
Diseñado para equipos que quieren mover rápido sin romper cosas.
|
||||
Potente cuando lo necesitas, simple cuando no.
|
||||
Sin visitas, sin esperas, sin sorpresas. Solo deja tu número, sube una foto
|
||||
y te llamamos desde tu provincia con presupuesto en mano.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -1,10 +1,10 @@
|
||||
'use client';
|
||||
|
||||
const footerLinks = {
|
||||
Producto: ['Características', 'Precios', 'Integraciones', 'Changelog', 'Roadmap'],
|
||||
Empresa: ['Sobre nosotros', 'Blog', 'Carreras', 'Prensa', 'Partners'],
|
||||
Recursos: ['Documentación', 'API', 'Comunidad', 'Webinars', 'Templates'],
|
||||
Legal: ['Privacidad', 'Términos', 'Cookies', 'Seguridad', 'GDPR'],
|
||||
Servicios: ['Reformas integrales', 'Reformas de cocinas', 'Reformas de baños', 'Diseño de interiores', 'Comunidades de vecinos'],
|
||||
Empresa: ['Sobre nosotros', 'Blog de reformas', 'Trabaja con nosotros', 'Prensa', 'Zona de trabajo'],
|
||||
Ayuda: ['Cómo funciona', 'Preguntas frecuentes', 'Galeria de proyectos', 'Financiación', 'Calculadora de obra'],
|
||||
Legal: ['Privacidad', 'Términos', 'Cookies', 'RGPD', 'Aviso legal'],
|
||||
};
|
||||
|
||||
const socials = [
|
||||
@@ -48,14 +48,14 @@ export default function Footer() {
|
||||
<div className="flex flex-col gap-4">
|
||||
<div className="flex items-center gap-2">
|
||||
<span className="w-9 h-9 bg-white text-black rounded-md flex items-center justify-center text-xs font-extrabold tracking-[-0.02em]">
|
||||
FS
|
||||
Rx
|
||||
</span>
|
||||
<span className="text-lg font-extrabold tracking-[-0.04em] text-white">
|
||||
FlowSync
|
||||
Reformix
|
||||
</span>
|
||||
</div>
|
||||
<p className="text-sm text-white/45 leading-relaxed">
|
||||
La plataforma todo-en-uno para equipos que quieren moverse rápido sin perder el control.
|
||||
Reformas de cocinas y baños con presupuesto en 5 minutos y render por WhatsApp. Tu reforma, gestionada de principio a fin.
|
||||
</p>
|
||||
<div className="flex gap-2">
|
||||
{socials.map((s) => (
|
||||
@@ -99,11 +99,11 @@ export default function Footer() {
|
||||
{/* Bottom bar */}
|
||||
<div className="flex items-center justify-between pt-8 border-t border-white/10 flex-wrap gap-4">
|
||||
<p className="text-sm text-white/35">
|
||||
© {new Date().getFullYear()} FlowSync, Inc. Todos los derechos reservados.
|
||||
© {new Date().getFullYear()} Reformix, S.L. Todos los derechos reservados.
|
||||
</p>
|
||||
<div className="flex items-center gap-2 text-xs font-medium text-white/45">
|
||||
<span className="w-2 h-2 bg-green-500 rounded-full animate-pulse" />
|
||||
Todos los sistemas operativos
|
||||
Reformas en curso ahora mismo
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -4,58 +4,58 @@ import { useEffect, useRef, useState } from 'react';
|
||||
|
||||
const plans = [
|
||||
{
|
||||
id: 'starter',
|
||||
name: 'Starter',
|
||||
id: 'esencial',
|
||||
name: 'Presupuesto',
|
||||
price: { monthly: 0, annual: 0 },
|
||||
description: 'Para equipos pequeños que están comenzando.',
|
||||
cta: 'Empieza gratis',
|
||||
description: 'Para quien quiere saber cuánto cuesta antes de comprometerse.',
|
||||
cta: 'Solicitar presupuesto',
|
||||
highlight: false,
|
||||
features: [
|
||||
'Hasta 5 usuarios',
|
||||
'3 proyectos activos',
|
||||
'1 GB de almacenamiento',
|
||||
'Integraciones básicas (5)',
|
||||
'Soporte por email',
|
||||
'Analíticas básicas',
|
||||
'Llamada en menos de 2 minutos',
|
||||
'Presupuesto desglosado por partidas',
|
||||
'Render visual de tu espacio por WhatsApp',
|
||||
'Sin compromiso de contratación',
|
||||
'Asesor desde tu provincia',
|
||||
'Válido para cocinas y baños',
|
||||
],
|
||||
},
|
||||
{
|
||||
id: 'pro',
|
||||
name: 'Pro',
|
||||
price: { monthly: 29, annual: 23 },
|
||||
description: 'Para equipos en crecimiento que necesitan más poder.',
|
||||
cta: 'Empieza prueba gratis',
|
||||
id: 'reforma',
|
||||
name: 'Reforma',
|
||||
price: { monthly: 199, annual: 159 },
|
||||
description: 'Para quien ya tiene claro que quiere reformar y necesita un equipo de confianza.',
|
||||
cta: 'Empezar mi reforma',
|
||||
highlight: true,
|
||||
badge: 'Más popular',
|
||||
badge: 'Más contratado',
|
||||
features: [
|
||||
'Hasta 25 usuarios',
|
||||
'Proyectos ilimitados',
|
||||
'50 GB de almacenamiento',
|
||||
'Integraciones avanzadas (50+)',
|
||||
'Soporte prioritario 24/7',
|
||||
'Analíticas avanzadas',
|
||||
'Automatización de flujos',
|
||||
'Roles y permisos',
|
||||
'Todo lo del plan Presupuesto',
|
||||
'Proyecto de reforma completo',
|
||||
'Gestión de materiales y proveedores',
|
||||
'Coordinador de obra dedicado',
|
||||
'Seguimiento fotográfico semanal',
|
||||
'Garantía de 2 años en mano de obra',
|
||||
'Plazos de entrega garantizados',
|
||||
'Atención post-obra incluida',
|
||||
],
|
||||
},
|
||||
{
|
||||
id: 'enterprise',
|
||||
name: 'Enterprise',
|
||||
price: { monthly: 99, annual: 79 },
|
||||
description: 'Para organizaciones que necesitan control total.',
|
||||
cta: 'Contactar ventas',
|
||||
id: 'integral',
|
||||
name: 'Integral',
|
||||
price: { monthly: 499, annual: 399 },
|
||||
description: 'Para reformas completas de viviendas o comunidades con gestión total.',
|
||||
cta: 'Hablar con un asesor',
|
||||
highlight: false,
|
||||
features: [
|
||||
'Usuarios ilimitados',
|
||||
'Proyectos ilimitados',
|
||||
'1 TB de almacenamiento',
|
||||
'Todas las integraciones',
|
||||
'Soporte dedicado + SLA',
|
||||
'Analíticas enterprise',
|
||||
'IA avanzada',
|
||||
'SSO & SAML',
|
||||
'Auditoría y compliance',
|
||||
'Infraestructura dedicada',
|
||||
'Todo lo del plan Reforma',
|
||||
'Reforma integral de vivienda completa',
|
||||
'Diseño de interiores incluido',
|
||||
'Renders 3D de todos los espacios',
|
||||
'Gestión de licencias y permisos',
|
||||
'Financiación flexible disponible',
|
||||
'Acceso a catálogo premium de materiales',
|
||||
'Garantía extendida de 5 años',
|
||||
'Servicio de mudanza coordinado',
|
||||
'Revisión técnica anual',
|
||||
],
|
||||
},
|
||||
];
|
||||
@@ -90,17 +90,17 @@ export default function Pricing() {
|
||||
<div className="container">
|
||||
{/* Header */}
|
||||
<div className="reveal opacity-0 translate-y-6 transition-all duration-700 ease-out flex flex-col items-center text-center gap-4 mb-16">
|
||||
<span className="badge badge-dark">Precios</span>
|
||||
<span className="badge badge-dark">Servicios</span>
|
||||
<h2
|
||||
id="pricing-heading"
|
||||
className="text-[clamp(1.875rem,5vw,3rem)] font-black tracking-[-0.04em] leading-[1.1] text-black"
|
||||
>
|
||||
Transparente. Simple.
|
||||
Reformas con precio claro
|
||||
<br />
|
||||
Sin sorpresas.
|
||||
desde el primer minuto.
|
||||
</h2>
|
||||
<p className="text-lg text-gray-600">
|
||||
Comienza gratis. Escala cuando estés listo. Sin contratos a largo plazo.
|
||||
Sin letras pequeñas, sin presupuestos que se disparan. Sabes lo que pagas antes de que empiece la obra.
|
||||
</p>
|
||||
|
||||
{/* Toggle */}
|
||||
@@ -257,13 +257,13 @@ export default function Pricing() {
|
||||
{/* Enterprise note */}
|
||||
<div className="reveal opacity-0 translate-y-6 transition-all duration-700 ease-out text-center mt-12 text-base text-gray-600">
|
||||
<p>
|
||||
¿Necesitas algo personalizado?
|
||||
¿Tienes un proyecto especial o una comunidad de vecinos?
|
||||
<button
|
||||
className="bg-transparent border-none cursor-pointer font-sans text-base font-semibold text-black underline underline-offset-4 transition-opacity duration-150 ease-out hover:opacity-60"
|
||||
onClick={handleContactScroll}
|
||||
id="pricing-enterprise-contact-btn"
|
||||
>
|
||||
Habla con nuestro equipo →
|
||||
Cuéntanos tu caso →
|
||||
</button>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
@@ -11,7 +11,7 @@ const slides = [
|
||||
{
|
||||
label: 'Baño',
|
||||
before: 'https://images.unsplash.com/photo-1552321554-5fefe8c9ef14?w=900',
|
||||
after: 'https://images.unsplash.com/photo-1620626011761-996317702519?w=900',
|
||||
after: 'https://images.unsplash.com/photo-1584622650111-993a426fbf0a?w=900',
|
||||
},
|
||||
{
|
||||
label: 'Salón',
|
||||
|
||||
Reference in New Issue
Block a user