// sections-hero.jsx — Nav + Hero with dashboard preview
const { useState, useEffect } = React;
function Nav() {
const [scrolled, setScrolled] = useState(false);
useEffect(() => {
const onScroll = () => setScrolled(window.scrollY > 30);
window.addEventListener("scroll", onScroll, { passive: true });
return () => window.removeEventListener("scroll", onScroll);
}, []);
const scrollTo = (id) => (e) => {
e.preventDefault();
document.getElementById(id)?.scrollIntoView({ behavior: "smooth", block: "start" });
};
return (
);
}
const HEADLINES = {
inventario: {
eyebrow: "Sistema de gestão · Harmonização orofacial e corporal",
h1: (
<>
Inventário, procedimentos e
investimentos da sua clínica HOF — sob a mesma curva.
),
sub: "Curva Mestra é o sistema de gestão operacional que conecta o especialista em harmonização e o consultor Rennova em uma única superfície — com visibilidade real de estoque, procedimentos registradas por produto e retorno por linha. Zero dado de paciente, por desenho."
},
curva: {
eyebrow: "Exclusivo · Rede de especialistas Rennova",
h1: (
<>
A curva mestra entre o
especialista e o consultor.
),
sub: "Um sistema desenhado para a rotina da clínica de harmonização orofacial e corporal — inventário rastreável, procedimentos registrados, investimentos auditáveis. Para o consultor Rennova: a visão pareada da operação do cliente, em tempo real."
},
precisao: {
eyebrow: "Sistema de gestão · Curva Mestra",
h1: (
<>
Precisão clínica. Visão gerencial. Mesmo sistema.
),
sub: "Da entrada do produto na clínica até a baixa por procedimento, Curva Mestra traz inventário, custos e relacionamento com o consultor Rennova para o mesmo painel — pensado para a complexidade da harmonização orofacial e corporal, sem nunca tocar em dado de paciente."
}
};
function Hero({ headlineVariant }) {
const isMobile = useBreakpoint();
const data = HEADLINES[headlineVariant] || HEADLINES.inventario;
return (
Vi que dois lotes vencem em 30 dias. Posso te apoiar com um cronograma de uso até lá?
{/* @keyframes float definido no CSS global do HTML */}
);
}
function Chip({ children, icon }) {
return (
{icon && }
{children}
);
}
function Marquee() {
const items = [
"Inventário rastreável por lote e validade",
"Procedimentos registrados por produto e lote",
"Investimentos auditáveis em tempo real",
"Comunicação direta com o consultor Rennova",
"LGPD por desenho · zero dado de paciente",
"Visão pareada especialista ↔ consultor"
];
const loop = [...items, ...items];
return (