Files
c2907fa7-1fe9-4c8d-a82d-ed3…/src/app/page.tsx
2026-03-09 19:56:07 +00:00

285 lines
14 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import HeroBillboardDashboard from '@/components/sections/hero/HeroBillboardDashboard';
import MediaAbout from '@/components/sections/about/MediaAbout';
import FeatureCardTwentyThree from '@/components/sections/feature/FeatureCardTwentyThree';
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
import ContactFaq from '@/components/sections/contact/ContactFaq';
import FooterMedia from '@/components/sections/footer/FooterMedia';
import { Star, Shield, Heart, Activity, Microscope, CheckCircle, Clock, Users, Award, Zap, Building2, Stethoscope, MessageCircle } from 'lucide-react';
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="icon-arrow"
defaultTextAnimation="background-highlight"
borderRadius="rounded"
contentWidth="small"
sizing="mediumLarge"
background="blurBottom"
cardStyle="glass-elevated"
primaryButtonStyle="flat"
secondaryButtonStyle="solid"
headingFontWeight="semibold"
>
<div id="nav" data-section="nav">
<NavbarStyleFullscreen
navItems={[
{ name: "Inicio", id: "hero" },
{ name: "Sobre Nosotros", id: "about" },
{ name: "Servicios", id: "services" },
{ name: "Contacto", id: "contact" },
{ name: "Preguntas Frecuentes", id: "faq" }
]}
brandName="Diagnomed"
bottomLeftText="Las Heras 16, Ramos Mejía"
bottomRightText="📲 11 4914-9441"
/>
</div>
<div id="hero" data-section="hero">
<HeroBillboardDashboard
title="Centro Médico y Diagnóstico por Imágenes en Ramos Mejía"
description="Más de 20 años de trayectoria brindando atención médica con trato humano y turnos ágiles. Especialistas en cardiología, traumatología, ecografías y más."
tag="⭐ ATENCIÓN IOMA 100%"
tagIcon={Star}
tagAnimation="slide-up"
buttons={[
{ text: "📲 Pedir turno por WhatsApp", href: "https://wa.me/541149149441" },
{ text: "📞 Llamar ahora", href: "tel:4654-2801" }
]}
buttonAnimation="slide-up"
background={{ variant: "radial-gradient" }}
dashboard={{
title: "Cobertura Médica", logoIcon: Shield,
imageSrc: "http://img.b2bpic.net/free-photo/unfocused-cinema-entrance_1203-816.jpg", buttons: [
{ text: "IOMA", href: "#" },
{ text: "OSPIT", href: "#" }
],
sidebarItems: [
{ icon: Heart },
{ icon: Activity },
{ icon: Microscope }
],
stats: [
{
title: "Años de Experiencia", values: [20, 20, 20],
description: "Brindando atención confiable"
},
{
title: "Especialidades", values: [10, 10, 10],
description: "Profesionales especializados"
},
{
title: "Turnos Ágiles", values: [95, 98, 97],
description: "Disponibles en pocos días"
}
],
chartTitle: "Pacientes Satisfechos", chartData: [
{ value: 95 },
{ value: 98 },
{ value: 97 },
{ value: 99 },
{ value: 96 }
],
listTitle: "Coberturas", listItems: [
{ icon: CheckCircle, title: "IOMA", status: "Atención 100%" },
{ icon: CheckCircle, title: "OSPIT", status: "Atención completa" },
{ icon: CheckCircle, title: "PAMI", status: "Cobertura vigente" }
],
searchPlaceholder: "Buscar especialidad"
}}
/>
</div>
<div id="about" data-section="about">
<MediaAbout
title="Diagnomed S.A. - Centro Médico de Confianza"
description="Centro médico y diagnóstico por imágenes ubicado en Ramos Mejía, Zona Oeste. Con más de 20 años de experiencia, brindamos estudios médicos y consultas con profesionales especializados, con atención rápida y trato humano.\n\n📍 Las Heras 16, Ramos Mejía Provincia de Buenos Aires\n🕘 Abre a las 9:00 AM"
tag="Sobre Nosotros"
tagIcon={Building2}
tagAnimation="slide-up"
buttons={[
{ text: "📍 Cómo llegar", href: "#" }
]}
imageSrc="http://img.b2bpic.net/free-photo/doctor-performing-medical-research-lab_23-2149335689.jpg"
imageAlt="Equipo profesional de Diagnomed"
useInvertedBackground={false}
/>
</div>
<div id="services" data-section="services">
<FeatureCardTwentyThree
title="Nuestros Servicios y Especialidades"
description="Especialidades médicas y estudios de diagnóstico con profesionales de experiencia y turnos ágiles"
tag="Servicios Médicos"
tagIcon={Stethoscope}
tagAnimation="slide-up"
textboxLayout="default"
animationType="slide-up"
useInvertedBackground={false}
features={[
{
id: "1", title: "Ecografías Especializadas", tags: ["Ginecológica", "Mamaria", "Abdominal"],
imageSrc: "http://img.b2bpic.net/free-photo/indian-medic-consulting-her-patient-medical-facility-copy-space_482257-118298.jpg?_wi=1", imageAlt: "Ecografías especializadas"
},
{
id: "2", title: "Servicios Cardiológicos", tags: ["Doppler Cardíaco", "Holter", "MAPA"],
imageSrc: "http://img.b2bpic.net/free-photo/empty-medical-office-equipped-with-diagnostic-tools-blood-pressure-monitor_482257-117002.jpg", imageAlt: "Servicios cardiológicos"
},
{
id: "3", title: "Diagnóstico por Imagen", tags: ["Radiografías", "Tecnología Moderna", "Rápidos"],
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-doctor-giving-ct-scan-patient_23-2149341505.jpg", imageAlt: "Diagnóstico por imagen"
},
{
id: "4", title: "Especialidades Médicas", tags: ["Clínica Médica", "Traumatología", "Pediatría"],
imageSrc: "http://img.b2bpic.net/free-photo/indian-medic-consulting-her-patient-medical-facility-copy-space_482257-118298.jpg?_wi=2", imageAlt: "Especialidades médicas"
}
]}
/>
</div>
<div id="why-us" data-section="why-us">
<MetricCardOne
title="Por Qué Elegir Diagnomed"
description="Razones por las que somos la opción de confianza para tu salud"
tag="Diferenciales"
tagIcon={Award}
tagAnimation="slide-up"
textboxLayout="default"
gridVariant="uniform-all-items-equal"
animationType="slide-up"
useInvertedBackground={false}
metrics={[
{
id: "1", value: "20", title: "Años", description: "De trayectoria comprobada", icon: Clock
},
{
id: "2", value: "10", title: "Especialidades", description: "Profesionales con experiencia", icon: Users
},
{
id: "3", value: "100", title: "IOMA", description: "Atención certificada", icon: CheckCircle
},
{
id: "4", value: "95", title: "Turnos", description: "Disponibles en pocos días", icon: Zap
}
]}
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardSixteen
title="Opiniones de Nuestros Pacientes"
description="Lo que dicen nuestros pacientes sobre la atención recibida"
tag="Testimonios"
tagIcon={Star}
tagAnimation="slide-up"
textboxLayout="default"
animationType="slide-up"
useInvertedBackground={false}
testimonials={[
{
id: "1", name: "María González", role: "Paciente", company: "IOMA", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/front-view-smiley-woman-work_23-2149622870.jpg"
},
{
id: "2", name: "Carlos Rodríguez", role: "Paciente", company: "OSPIT", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/smiling-businessman-face-portrait-wearing-suit_53876-148135.jpg"
},
{
id: "3", name: "Ana Martínez", role: "Paciente", company: "Particular", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-businesswoman-office_329181-19228.jpg"
},
{
id: "4", name: "Roberto López", role: "Paciente", company: "PAMI", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/happy-black-doctor-using-touchpad-nursing-home-looking-camera_637285-11401.jpg"
}
]}
kpiItems={[
{ value: "1000+", label: "Pacientes satisfechos" },
{ value: "98%", label: "Tasa de satisfacción" },
{ value: "20+", label: "Años de experiencia" }
]}
/>
</div>
<div id="faq" data-section="faq">
<ContactFaq
ctaTitle="Solicita Tu Turno Hoy"
ctaDescription="Conecta con nuestro equipo y reserva tu cita de forma rápida y segura"
ctaButton={{ text: "📲 Pedir Turno por WhatsApp", href: "https://wa.me/541149149441" }}
ctaIcon={MessageCircle}
useInvertedBackground={false}
animationType="slide-up"
faqs={[
{
id: "1", title: "¿Atienden con IOMA?", content: "Sí, contamos con <strong>ATENCIÓN IOMA 100%</strong>. Somos un centro acreditado para brindar servicios a pacientes con cobertura IOMA."
},
{
id: "2", title: "¿Atienden PAMI, OSPIT y otros?", content: "Sí, atendemos <strong>PAMI</strong>, <strong>OSPIT</strong> y pacientes particulares. Contamos con múltiples coberturas para tu tranquilidad."
},
{
id: "3", title: "¿Cómo pido turno?", content: "Podés pedir turno de las siguientes formas:\n<ul style=\"margin-top: 8px; margin-left: 16px;\">\n<li>📞 Llamando al <strong>4654-2801</strong></li>\n<li>📲 Por WhatsApp al <strong>11 4914-9441</strong></li>\n<li>📝 Completando nuestro formulario de contacto</li>\n</ul>"
},
{
id: "4", title: "¿Dónde están ubicados?", content: "<strong>Las Heras 16</strong>\nRamos Mejía Provincia de Buenos Aires\n\nEstamos ubicados en la Zona Oeste, de fácil acceso desde toda la región."
},
{
id: "5", title: "¿La atención es con turno?", content: "Sí, la atención es con <strong>turno previo</strong>. Esto nos permite garantizar que recibas la mejor calidad de atención personalizada."
}
]}
/>
</div>
<div id="cta-final" data-section="cta-final">
<MediaAbout
title="Tu Salud en Manos de Profesionales con Experiencia"
description="Solicitá tu turno hoy mismo y comienza tu camino hacia una mejor salud. En Diagnomed, tu bienestar es nuestra prioridad."
buttons={[
{ text: "📲 Contactar por WhatsApp", href: "https://wa.me/541149149441" },
{ text: "📞 Llamar Ahora", href: "tel:4654-2801" }
]}
imageSrc="http://img.b2bpic.net/free-photo/front-view-nurse-talking-patient_23-2149741269.jpg"
imageAlt="Equipo médico profesional"
useInvertedBackground={false}
/>
</div>
<div id="footer" data-section="footer">
<FooterMedia
imageSrc="http://img.b2bpic.net/free-photo/set-stationery-pins-thread_23-2148510437.jpg"
imageAlt="Mapa de ubicación Diagnomed"
logoText="Diagnomed S.A."
copyrightText="© 2025 Diagnomed S.A. | Todos los derechos reservados"
columns={[
{
title: "Centro Médico", items: [
{ label: "Contacto Rápido", href: "tel:4654-2801" },
{ label: "WhatsApp", href: "https://wa.me/541149149441" },
{ label: "Ubicación", href: "#about" }
]
},
{
title: "Servicios", items: [
{ label: "Especialidades", href: "#services" },
{ label: "Ecografías", href: "#services" },
{ label: "Cardiología", href: "#services" }
]
},
{
title: "Legal", items: [
{ label: "Política de Privacidad", href: "#" },
{ label: "Términos de Servicio", href: "#" },
{ label: "Preguntas Frecuentes", href: "#faq" }
]
}
]}
/>
</div>
</ThemeProvider>
);
}