/* SMILE ROOM — Web UI kit · page sections */ const { KBtn, Eyebrow, Rule, Wordmark, SectionHeading, Reveal, useParallax, useViewport } = window; const NAV = ['Inicio', 'Tienda', 'Servicios', 'Filosofía', 'Contacto']; const goShop = () => { const el = document.getElementById('tienda'); if (el) el.scrollIntoView({ behavior: 'smooth' }); }; const Nav = ({ active, onNav, onBook, cart }) => { const { isMobile } = useViewport(); const [open, setOpen] = React.useState(false); React.useEffect(() => { if (!isMobile) setOpen(false); }, [isMobile]); const onNavClick = (n) => { onNav(n); if (n === 'Tienda') goShop(); }; return (
{!isMobile && ( )} {!isMobile && Agendar} {!isMobile && cart && } {isMobile && (
{cart && }
)}
{isMobile && open && ( )}
); }; const Hero = ({ onBook }) => { const videoRef = useParallax(0.16); const { isMobile } = useViewport(); return (
{/* light top scrim for nav legibility */}
{/* bottom scrim only — keeps most of the video clear */}
Protección · Precisión · Evolución

Transformamos sonrisas
con excelencia
Comprar blanqueamiento Agendar cita
); }; const ServiceTile = ({ number, icon, title, desc, featured }) => (
{ e.currentTarget.style.boxShadow = 'var(--shadow-lg), var(--ring-hairline)'; e.currentTarget.style.transform = 'translateY(-3px)'; }} onMouseLeave={e => { e.currentTarget.style.boxShadow = 'var(--shadow-sm), var(--ring-hairline)'; e.currentTarget.style.transform = 'none'; }}> {number &&
{number}
}
{title}

{desc}

Conocer más
); const Services = () => { const { isMobile, isTablet } = useViewport(); return (
{[ ['ph-thin ph-star', 'Estética', 'Diseño de sonrisa y armonía facial.'], ['ph-thin ph-syringe', 'Endodoncia', 'Tratamientos de conducto de precisión.'], ['ph-thin ph-tooth', 'Rehabilitación', 'Devolvemos forma, función y belleza.'], ['ph-thin ph-scan', 'Digital', 'Diagnóstico y escaneo intraoral 3D.'], ].map(([i, t, d], k) => ( ))}
); }; const Pillars = () => { const { isMobile, isTablet } = useViewport(); const data = [ { n: '01', i: 'ph-thin ph-target', t: 'Precisión', m: 'Cada detalle importa.' }, { n: '02', i: 'ph-thin ph-shield-check', t: 'Protección', m: 'Cuidar antes que intervenir.' }, { n: '03', i: 'ph-thin ph-arrows-clockwise', t: 'Evolución', m: 'La formación nunca termina.' }, { n: '04', i: 'ph-thin ph-sparkle', t: 'Estética', m: 'La belleza nace de la armonía.' }, { n: '05', i: 'ph-thin ph-books', t: 'Conocimiento', m: 'Estudiar cada detalle.' }, { n: '06', i: 'ph-thin ph-arrows-counter-clockwise', t: 'Transformación', m: 'Cambiamos seguridad.' }, ]; return (
{data.map((p, k) => (
{p.n}
{p.t}

“{p.m}”

 ))}
); }; const Doctor = () => { const imgRef = useParallax(0.07); const { isMobile } = useViewport(); return (
Dra. Alejandra R. Rodríguez

En Smile Room estudiamos cada detalle para ofrecer odontología de excelencia. Integramos precisión, conocimiento y tecnología para transformar sonrisas con ética, arte y ciencia.

{[['+12', 'años de experiencia'], ['4.9★', 'satisfacción'], ['100%', 'odontología digital']].map(([a, b]) => (
{a}
{b}
))}
); }; const Footer = () => { const { isMobile } = useViewport(); return (

Estudiamos cada detalle para transformar sonrisas con excelencia.

{[['Tienda', ['Blanqueamiento POLUS', 'Packs', 'Gel de mantenimiento', 'Cepillo Smile Room']], ['Contacto', ['smileroom.mx', '55 0000 0000', 'Lun–Sáb · 9–19h', 'Ciudad de México']]].map(([h, items]) => (
{h}
{items.map(it => {it})}
))}
© 2026 SMILE ROOM · ODONTOLOGÍA DIGITAL AVANZADA
); }; Object.assign(window, { Nav, Hero, Services, Pillars, Doctor, Footer, ServiceTile });