/* global React, Reveal, Eyebrow, StepBadge, SlashMotif */ const { useState, useEffect, useRef } = React; /* ============================================================ SEÇÃO 4 — ASSINATURAS COM LUCRO REAL ============================================================ */ function Assinaturas() { return (
Recorrência Inteligente

Assinaturas inteligentes.
Recorrência que protege a sua margem.

Sistemas comuns apenas registram "assinantes". O GÊNESIS monitora o Custo de Oportunidade de cada plano para garantir que a sua previsibilidade não vire prejuízo invisível.

{/* Pontos como cards — largura total, abaixo do texto + mockup */} {[ { num: "A", t: "Monitoramento de Capacidade", d: "O sistema te avisa se um assinante está ocupando horários de pico que seriam de clientes avulsos, permitindo ajustar o preço ou a estratégia antes de perder margem." }, { num: "B", t: "Calendário de Recebíveis", d: "Visualize exatamente quanto de dinheiro garantido entrará no seu caixa nos próximos meses. Planeje o crescimento e a folha de pagamento com base em dados reais." }, ].map((f) => (
))}
Ver Plano de Governança
); } function FeatureLine({ num, t, d }) { return (
{num}
{t}

{d}

); } function useRecebiveisInView() { const ref = React.useRef(null); const [inView, setInView] = React.useState(false); React.useEffect(() => { if (!ref.current || inView) return; const obs = new IntersectionObserver(([e]) => { if (e.isIntersecting) { setInView(true); obs.disconnect(); } }, { threshold: 0.2 }); obs.observe(ref.current); return () => obs.disconnect(); }, [inView]); return [ref, inView]; } function RecebiveisCounter({ value, duration = 1600, active }) { const [v, setV] = React.useState(0); React.useEffect(() => { if (!active) return; let raf, start = null; const step = (t) => { if (start === null) start = t; const p = Math.min(1, (t - start) / duration); const eased = 1 - Math.pow(1 - p, 3); setV(value * eased); if (p < 1) raf = requestAnimationFrame(step); }; raf = requestAnimationFrame(step); return () => cancelAnimationFrame(raf); }, [value, active, duration]); return v; } function RcbFloatingPopup() { const items = [ { ic: "↑", k: "Novo assinante", t: "Plano Pro", v: "+R$ 98 / mês", bar: 72, pos: "tl" }, { ic: "✓", k: "Recorrência garantida", t: "Dez + Jan", v: "R$ 50.600", bar: 88, pos: "br" }, { ic: "↺", k: "Churn evitado", t: "Cliente reativado", v: "+R$ 1.180", bar: 54, pos: "tr" }, { ic: "★", k: "Meta do mês", t: "Ticket médio em alta", v: "R$ 98 → 112", bar: 81, pos: "bl" }, ]; const [i, setI] = React.useState(0); const [show, setShow] = React.useState(false); React.useEffect(() => { const t0 = setTimeout(() => setShow(true), 900); const id = setInterval(() => { setShow(false); setTimeout(() => { setI(x => (x + 1) % items.length); setShow(true); }, 520); }, 3000); return () => { clearTimeout(t0); clearInterval(id); }; }, []); const it = items[i]; return ( ); } function RecebiveisMockup() { const [rootRef, inView] = useRecebiveisInView(); const months = [ { m: "DEZ", short: "Dez/24", v: 24180, n: 247, status: "garantido", delta: "+R$ 1.940" }, { m: "JAN", short: "Jan/25", v: 26420, n: 269, status: "garantido", delta: "+R$ 2.240" }, { m: "FEV", short: "Fev/25", v: 28940, n: 295, status: "projetado", delta: "+R$ 2.520" }, { m: "MAR", short: "Mar/25", v: 31210, n: 318, status: "projetado", delta: "+R$ 2.270" }, ]; const max = Math.max(...months.map(m => m.v)); const total = months.reduce((s, m) => s + m.v, 0); const totalAnim = RecebiveisCounter({ value: total, active: inView, duration: 2000 }); const fitRef = React.useRef(null); const scaleRef = React.useRef(null); React.useEffect(() => { const fit = fitRef.current, scaleEl = scaleRef.current; if (!fit || !scaleEl) return; const apply = () => { const mobile = window.matchMedia("(max-width: 880px)").matches; if (mobile) { scaleEl.style.transform = "none"; return; } const availH = fit.clientHeight, natH = scaleEl.offsetHeight; if (availH > 0 && natH > 0) scaleEl.style.transform = "scale(" + Math.min(1, availH / natH) + ")"; }; apply(); const ro = new ResizeObserver(apply); ro.observe(fit); window.addEventListener("resize", apply); return () => { ro.disconnect(); window.removeEventListener("resize", apply); }; }, []); return (
{/* tech grid background */} {/* corner brackets */} {["tl","tr","bl","br"].map(p => (
); } /* ============================================================ TELAS REAIS — showcase estático do sistema ============================================================ */ function AppScreensShowcase() { const shots = [ { src: window.__resources.heroAppScreen, k: "Agenda", t: "Agenda por cadeira" }, { src: window.__resources.appScreen2, k: "Comanda", t: "Detalhes do atendimento" }, { src: window.__resources.appScreen3, k: "Avaliações", t: "Notas por colaborador" }, ]; const [sel, setSel] = React.useState(0); return (
TELAS REAIS DO SISTEMA iOS · ANDROID · WEB
{shots[sel].t} Clique para destacar
); } /* ============================================================ SEÇÃO 5 — FECHAMENTO EXECUTIVO ============================================================ */ function Fechamento() { return (
Resumo Executivo Diário

Você não precisa abrir o sistema para saber como foi o seu dia.

Esqueça dashboards complexos e relatórios que você nunca tem tempo de ler. Ao final do expediente, a IA do GÊNESIS envia um Resumo Executivo diretamente no seu WhatsApp.

É a gestão acontecendo de forma automática e confiável.

{[ { k: "01", t: "Quanto produziu", d: "Faturamento bruto, lucro líquido real, ticket médio e variação vs ontem." }, { k: "02", t: "Ociosidade detectada", d: "Cadeiras vazias, horários mortos e perda de tempo durante o expediente." }, { k: "03", t: "Equipe e clientes", d: "Quem bateu meta, quem está abaixo, e quais clientes precisam de atenção imediata." }, ].map((b, i) => ( ))}
); } /* ============================================================ SECURITY VAULT — painel S/A (Segurança · Auditoria · Autonomia) ============================================================ */ function SecurityVaultMockup() { const log = [ ["EXPORT", "Relatório mensal exportado por você", "22:14"], ["ALERTA", "Exclusão sem senha — bloqueada", "22:11"], ["AUDIT", "184 comandas · 0 divergências", "22:03"], ]; return (
COFRE DE DADOS · S/A AES-256 · TLS 1.3
Status · criptografado
Dados
blindados
Proprietário dos dados: VOCÊ
256 bit AES · ponta a ponta
{["Criptografia", "Backup diário", "Auditoria 24/7"].map((c) => ( {c} ))}
Auditoria · streaming
{log.map(([k, t, time]) => (
{k} {t} {time}
))}
Sincronização · ativa Exportar tudo →