// landing.jsx — Salud de Diva landing const { useState, useEffect, useRef } = React; // ───────────────────────────────────────────────────────────────────────────── // Data // ───────────────────────────────────────────────────────────────────────────── const SERVICES = [ { id: 'laser', name: 'Láser', desc: 'Depilación definitiva y rejuvenecimiento con láser de diodo de última generación.', body: 'Tecnología de láser de diodo de última generación, segura para todo tipo de pieles y fototipos. Sesiones rápidas, sin dolor, con resultados visibles desde la primera visita. Indicado para depilación definitiva y para tratamientos faciales de rejuvenecimiento y manchas.', tags: ['Diodo', 'Depilación', 'Rejuvenecimiento', 'Manchas'], }, { id: 'corporal', name: 'Pérdida de grasa', desc: 'Remodelación corporal combinando HIFU focal, Indiba y Leeging.', body: 'Programas personalizados que combinan ultrasonido focalizado (HIFU focal pro), radiofrecuencia Indiba y presoterapia Leeging para reducir grasa localizada, drenar y reafirmar. Resultados medibles, sin quirófano, con un plan que se ajusta a tu cuerpo y a tu ritmo.', tags: ['HIFU focal pro', 'Indiba', 'Leeging', 'Remodelación'], }, { id: 'facial', name: 'Cuidado facial avanzado', desc: 'Protocolos faciales a medida con activos profesionales y aparatología.', body: 'Diagnóstico individual de tu piel y un protocolo facial diseñado a tu medida: limpiezas profundas, hidratación intensiva, peelings y activos profesionales aplicados con técnica y mimo. Tu piel sale luminosa, descansada y mucho mejor cuidada.', tags: ['Higiene profunda', 'Hidratación', 'Peelings', 'Activos profesionales'], }, { id: 'antiedad', name: 'Antiedad y rejuvenecimiento', desc: 'HIFU, plasmafibroblasto y tratamientos firmantes con resultado real.', body: 'Tratamientos no invasivos para tensar, redensificar y devolver la firmeza al rostro y al cuello: HIFU (ultrasonido focalizado), plasmafibroblasto y protocolos firmantes. Pensados para verte mejor, no diferente, con un resultado natural que evoluciona contigo.', tags: ['HIFU', 'Plasmafibroblasto', 'Lifting sin cirugía'], }, { id: 'micro', name: 'Micropigmentación', desc: 'Cejas y labios con técnica fina, simétrica y natural.', body: 'Micropigmentación realizada con técnica fina, pigmentos de alta calidad y un estudio previo del rostro para que el resultado sea simétrico, natural y favorecedor. Cejas que se ven y labios que se sienten, sin maquillarte cada mañana.', tags: ['Cejas', 'Labios', 'Técnica fina'], }, ]; const TECH = [ { name: 'HIFU', label: 'Ultrasonido', desc: 'Lifting facial y corporal sin cirugía. Tensa y redensifica la piel desde dentro.' }, { name: 'HIFU Focal Pro', label: 'Corporal', desc: 'Ultrasonido focalizado para reducir grasa localizada con precisión milimétrica.' }, { name: 'Indiba', label: 'Radiofrecuencia', desc: 'Reactiva la circulación, drena, reafirma. La aliada en cualquier protocolo corporal.' }, { name: 'Diodo', label: 'Láser', desc: 'Depilación definitiva en pocas sesiones, segura en todos los fototipos.' }, { name: 'Leeging', label: 'Presoterapia', desc: 'Drenaje linfático mecánico para descongestionar y reducir retención.' }, { name: 'Plasmafibroblasto', label: 'Regeneración', desc: 'Estimula la producción natural de colágeno para un efecto lifting progresivo.' }, ]; const PILLARS = [ { roman: 'I.', title: 'Formación permanente', body: 'En estética, lo de ayer no basta para hoy. Reme se forma de manera continua para incorporar lo último en técnica, aparatología y conocimiento dermatológico.' }, { roman: 'II.', title: 'Trabajo bien hecho', body: 'Más de veinte años cuidando piel y cuerpos enseñan algo importante: no hay atajos. Cada protocolo se trabaja con la dedicación y el tiempo que requiere.' }, { roman: 'III.', title: 'Atención al detalle', body: 'Lo que distingue un buen tratamiento de uno excelente está en lo pequeño. Una temperatura, una presión, una pausa. Aquí cada detalle importa.' }, ]; const WHATSAPP_URL = 'https://wa.me/34696844884?text=Hola%20Reme,%20me%20gustar%C3%ADa%20pedir%20cita%20en%20Salud%20de%20Diva.'; // ───────────────────────────────────────────────────────────────────────────── // Hooks // ───────────────────────────────────────────────────────────────────────────── function useScrolled(threshold = 30) { const [scrolled, setScrolled] = useState(false); useEffect(() => { const onScroll = () => setScrolled(window.scrollY > threshold); onScroll(); window.addEventListener('scroll', onScroll, { passive: true }); return () => window.removeEventListener('scroll', onScroll); }, [threshold]); return scrolled; } function useReveal(animations) { useEffect(() => { const els = Array.from(document.querySelectorAll('.reveal')); if (animations === 'off') { // skip the hide+animate cycle entirely els.forEach((el) => el.classList.remove('reveal-init')); return; } // Mark all reveals as hidden-pending (fail-open if this never runs) els.forEach((el) => el.classList.add('reveal-init')); // Anything already in viewport at mount: reveal immediately (no scroll needed) const reveal = (el) => requestAnimationFrame(() => el.classList.add('in')); const isInView = (el) => { const r = el.getBoundingClientRect(); return r.top < window.innerHeight && r.bottom > 0; }; els.forEach((el) => { if (isInView(el)) reveal(el); }); // Observer for the rest let io; try { io = new IntersectionObserver( (entries) => { entries.forEach((e) => { if (e.isIntersecting) { reveal(e.target); io.unobserve(e.target); } }); }, { threshold: 0.08, rootMargin: '0px 0px -40px 0px' } ); els.forEach((el) => { if (!el.classList.contains('in')) io.observe(el); }); } catch (e) { // No IO support: just reveal everything els.forEach((el) => reveal(el)); } // Safety net: anything still hidden after 4s gets revealed anyway const safety = setTimeout(() => { els.forEach((el) => el.classList.add('in')); }, 4000); return () => { if (io) io.disconnect(); clearTimeout(safety); }; }, [animations]); } // ───────────────────────────────────────────────────────────────────────────── // Sections // ───────────────────────────────────────────────────────────────────────────── function Nav() { const scrolled = useScrolled(); const [menuOpen, setMenuOpen] = useState(false); // lock body scroll when drawer open useEffect(() => { document.body.style.overflow = menuOpen ? 'hidden' : ''; return () => { document.body.style.overflow = ''; }; }, [menuOpen]); const go = (id) => (e) => { e.preventDefault(); setMenuOpen(false); // small delay so drawer can close before scroll starts setTimeout(() => { const el = document.getElementById(id); if (el) window.scrollTo({ top: el.offsetTop - 60, behavior: 'smooth' }); }, 60); }; return (
Sobre Reme Tratamientos Tecnología Contacto Pedir cita
); } function Hero({ headline, layout }) { const parts = splitHeadline(headline); return (
Estética Avanzada · Bullas, Murcia

{parts.map((p, i) => p.italic ? {p.text} : {p.text} )}

Más de veinte años de oficio, formación constante y la última tecnología en estética avanzada, al servicio de tu piel, tu cuerpo y tu manera de sentirte.

Pedir cita por WhatsApp { e.preventDefault(); document.getElementById('services').scrollIntoView({ behavior: 'smooth' }); }}> Ver tratamientos
{layout === 'split' && (
Est. 2003
Cabina privada
)}
); } function splitHeadline(text) { // italicize the last word for accent const words = text.split(' '); if (words.length < 2) return [{ text, italic: false }]; const last = words.pop(); return [ { text: words.join(' ') + ' ', italic: false }, { text: last, italic: true }, ]; } function Strip() { const items = ['Más de 20 años de experiencia', 'Cita previa', 'Bullas · Murcia', 'Formación permanente', 'Tecnología de vanguardia', 'Trato cercano']; const sequence = ( {items.map((it, i) => ( {it}✦ ))} ); return (
{sequence}{sequence}
); } function About({ showSignature }) { return (
{showSignature && (
Reme
Fundadora
Estética avanzada
)}
Sobre nosotras

Más de veinte años aprendiendo a cuidarte mejor.

Salud de Diva nace de una convicción que Reme lleva más de dos décadas defendiendo: en estética, no vale quedarse anticuada. La piel cambia, la ciencia avanza, las técnicas evolucionan, y quien te cuida tiene que evolucionar con ellas.

«Cada tratamiento es para una persona concreta. Mi trabajo es escucharla, leerla y darle lo que necesita; no lo que está de moda.»

Por eso este centro vive en formación permanente, invierte en la mejor aparatología disponible y dedica el tiempo que cada cuerpo requiere. Nada se hace con prisa. Todo se hace con criterio.

20+
Años de oficio
6
Tecnologías punteras
∞
Detalles cuidados
); } function Services() { const [open, setOpen] = useState('laser'); return (
Tratamientos

Una carta corta, trabajada con criterio.

Cinco áreas, sin atajos. Cada protocolo se diseña a partir de un diagnóstico individual y se ajusta sesión a sesión.

{SERVICES.map((s, i) => (
setOpen(open === s.id ? null : s.id)}>
0{i + 1}
{s.name}
{s.desc}

{s.body}

{s.tags.map((t) => {t})}
))}
); } function Tech() { return (
Tecnología

La mejor herramienta no sustituye a la mejor mano. La complementa.

La aparatología es solo una parte de la ecuación, pero importa, y mucho. En Salud de Diva trabajamos con los equipos más avanzados del sector porque el resultado lo merece.

{TECH.map((t, i) => (
{t.name[0]}

{t.name}

{t.desc}

{t.label}
))}
); } function Philosophy() { return (
Nuestra filosofía

Tres principios que llevan veinte años sin moverse del sitio.

{PILLARS.map((p, i) => (
{p.roman}

{p.title}

{p.body}

))}
); } function Contact() { return (
Reservar cita

¿Empezamos a cuidarte?

Atendemos siempre bajo cita previa, para dedicarte el tiempo que mereces. Escríbenos por WhatsApp y te respondemos personalmente, sin formularios largos ni esperas.

«La cita es un momento para ti. Reservarlo, también.»
@
Dirección
Calle Pino de la Murta, 16
30180 · Bullas, Murcia
☏
Teléfono
✦
Horario
Bajo cita previa
Escribir por WhatsApp
); } function Footer() { return ( ); } function WhaFab() { return ( ); } function WhaIcon({ size = 24 }) { return ( ); } // ───────────────────────────────────────────────────────────────────────────── // App // ───────────────────────────────────────────────────────────────────────────── function App() { const [t, setTweak] = useTweaks(window.TWEAK_DEFAULTS); useReveal(t.animations); // Apply palette + font as CSS vars useEffect(() => { const root = document.documentElement; const [nude, taupe, coral, paper] = t.palette; root.style.setProperty('--nude', nude); root.style.setProperty('--taupe', taupe); root.style.setProperty('--coral', coral); // derived const lighten = (hex, amt) => { const h = hex.replace('#',''); const r = parseInt(h.slice(0,2),16), g = parseInt(h.slice(2,4),16), b = parseInt(h.slice(4,6),16); const mix = (c) => Math.round(c + (255 - c) * amt); return `rgb(${mix(r)},${mix(g)},${mix(b)})`; }; const darken = (hex, amt) => { const h = hex.replace('#',''); const r = parseInt(h.slice(0,2),16), g = parseInt(h.slice(2,4),16), b = parseInt(h.slice(4,6),16); const mix = (c) => Math.round(c * (1 - amt)); return `rgb(${mix(r)},${mix(g)},${mix(b)})`; }; root.style.setProperty('--paper', paper); root.style.setProperty('--cream', lighten(nude, 0.35)); root.style.setProperty('--taupe-2', lighten(taupe, 0.18)); root.style.setProperty('--taupe-3', lighten(taupe, 0.45)); root.style.setProperty('--coral-deep', darken(coral, 0.18)); }, [t.palette]); useEffect(() => { document.documentElement.style.setProperty('--serif', `'${t.headingFont}', 'Playfair Display', Georgia, serif`); }, [t.headingFont]); return (