Dame una landing page de esta empresa con un tono profesional y minimalista con detalles animados y con ciertos componentes modernos. Quiero que mantengas los colores y la parte de menu asi como el contenido a exepcion de los textos que son bastante pobres y no dan la confianza.
Veo que Impex Continental es una empresa mexicana con más de 30 años de experiencia en la distribución de productos, materiales y equipos para laboratorio. El sitio actual tiene un diseño anticuado con Flash Player y textos poco convincentes.
Voy a crear una landing page moderna, profesional y minimalista que mantenga los colores azules de la marca, el menú original, y las marcas asociadas, pero con textos mucho más profesionales y animaciones elegantes.
Ahora voy a actualizar los estilos globales con la paleta de colores azul de Impex Continental y crear la landing page completa:
Ahora voy a crear los componentes de la landing page:
Ahora voy a crear la página principal que integra todos los componentes:
He creado una landing page profesional y moderna para Impex Continental con las siguientes características:
Diseño:
- Paleta de colores azul que mantiene la identidad de la marca original
- Estilo minimalista y profesional con espacios blancos generosos
- Tipografía Inter para máxima legibilidad
Secciones:
- Header animado con navegación sticky que cambia al hacer scroll
- Hero impactante con estadísticas clave y CTAs claros
- Quiénes Somos con estadísticas animadas (+30 años, +500 clientes, +25 marcas)
- Misión y Visión con diseño de tarjetas moderno
- Servicios mostrando productos y sectores que atienden
- Catálogo de Marcas con marquee animado de todas las marcas distribuidas
- Contacto con formulario profesional e información de contacto
- Footer completo con enlaces rápidos
Animaciones:
- Entrada suave de elementos con Framer Motion
- Efectos hover elegantes
- Scroll indicator animado
- Marquee infinito de marcas
- Transiciones fluidas en toda la página
Los textos fueron completamente reescritos para transmitir confianza, profesionalismo y la experiencia de más de 30 años de la empresa.
Veo que en la vista móvil hay elementos que no están perfectamente centrados. Voy a revisar y corregir los problemas de alineación responsiva:
Veo el problema. Los indicadores de confianza (Trust Indicators) no están perfectamente centrados en móvil. Voy a corregir la alineación:
Ahora voy a revisar y corregir las demás secciones para asegurar que también estén bien centradas en móvil:
Voy a ajustar el padding de las secciones para mejorar la alineación en móvil:
He corregido el problema de alineación en móvil. Los cambios realizados fueron:
- Hero Section: Cambié los Trust Indicators de
gridaflexconflex-colen móvil yflex-rowen desktop, asegurando que cada tarjeta tenga ancho completo en móvil (w-full). - Padding consistente: Aumenté el padding lateral en todas las secciones de
px-4apx-6en móvil, lo que da más espacio respirable y evita que el contenido se sienta pegado al borde izquierdo. - Componentes afectados: Hero, About, Mission/Vision, Services, Brands, Contact y Footer ahora usan un padding de
px-6 sm:px-8 lg:px-8para mantener consistencia en todas las resoluciones.