; } /* ── Scroll reveal hook ─────────────────────────── */ function useReveal() { useEffect(() => { const els = document.querySelectorAll('.reveal'); const obs = new IntersectionObserver( entries => entries.forEach(e => { if (e.isIntersecting) e.target.classList.add('visible'); }), { threshold: 0.1 } ); els.forEach(el => obs.observe(el)); return () => obs.disconnect(); }); } /* ── Nav ───────────────────────────────────────── */ function Nav({ page, setPage }) { const [scrolled, setScrolled] = useState(false); const [mobileOpen, setMobileOpen] = useState(false); useEffect(() => { const el = document.getElementById('scroll-root'); if (!el) return; const h = () => setScrolled(el.scrollTop > 20); el.addEventListener('scroll', h); return () => el.removeEventListener('scroll', h); }, []); const links = [ { label:'Problemas', id:'problemas' }, { label:'Ofertas', id:'ofertas' }, { label:'Como funciona', id:'metodo' }, { label:'Demos', id:'demos' }, ]; const scrollTo = (id) => { setPage('home'); setMobileOpen(false); setTimeout(() => { const el = document.getElementById(id); if (el) { const root = document.getElementById('scroll-root'); root.scrollTop = el.offsetTop - 70; } }, 50); }; return (

{links.map(l => ( ))} setPage('contato')}>Conversa inicial →

); } /* ── Ticker ─────────────────────────────────────── */ function Ticker() { const items = ['Diagnóstico de operação','Visibilidade de dados','Dashboard executivo','Automação de backoffice','IA aplicada a PMEs','Escopo fechado','Entrada leve','Relatório automático','Site Institucional','Clareza operacional']; const all = [...items,...items]; return (

{all.map((item,i) => ( {item} ))}

); } /* ── Footer ─────────────────────────────────────── */ function Footer({ setPage }) { const cols = [ { title:'Ofertas', links:[ { l:'Diagnóstico', fn:() => setPage('home') }, { l:'Dashboard executivo', fn:() => setPage('home') }, { l:'Relatório automático', fn:() => setPage('home') }, { l:'Site Institucional', fn:() => setPage('home') }, { l:'Site Express', fn:() => setPage('home') }, ]}, { title:'Como funciona', links:[ { l:'Conversa inicial gratuita', fn:() => setPage('contato') }, { l:'Método de entrega', fn:() => setPage('home') }, { l:'Demos e samples', fn:() => setPage('home') }, ]}, { title:'Contato', links:[ { l:'contato@maximiza.ai', fn:() => {} }, { l:'Conversa inicial', fn:() => setPage('contato') }, ]}, ]; return ( ); } /* ── Spotlight Wordmark (Resend-style mouse-tracked reveal) ── */ function SpotlightWordmark() { const ref = useRef(null); const [hover, setHover] = useState(false); const onMove = (e) => { const el = ref.current; if (!el) return; const r = el.getBoundingClientRect(); el.style.setProperty('--mx', `${e.clientX - r.left - 200}px`); el.style.setProperty('--my', `${e.clientY - r.top - 200}px`); }; return (

setHover(true)} onMouseLeave={() => setHover(false)} style={{ position:'relative', margin:'0 auto', width:'100%', maxWidth:1100, overflow:'hidden', borderRadius:20, padding:'clamp(24px,6vw,72px) 0', cursor:'default', userSelect:'none', }} > {/* Dim base wordmark */}

MAXIMIZA

{/* Highlighted wordmark, masked to pointer spotlight */}

MAXIMIZA

{/* Soft radial glow that follows cursor (even stronger under spotlight) */}

); } Object.assign(window, { C, FONT_DISPLAY, FONT_SANS, FONT_LABEL, FONT_MONO, TONE, tone, LogoMark, LogoMarkAnimated, Icon, Btn, Pill, SectionLabel, Divider, Ticker, Nav, Footer, useReveal, ThemeProvider, ThemeToggle, useTheme, SpotlightWordmark }); /* ── Glass surface helper ── */ const GLASS = (opts = {}) => ({ background: opts.strong ? 'color-mix(in oklab, var(--bg3) 70%, transparent)' : 'color-mix(in oklab, var(--bg3) 55%, transparent)', backdropFilter: 'blur(18px) saturate(140%)', WebkitBackdropFilter: 'blur(18px) saturate(140%)', border: `1px solid color-mix(in oklab, var(--fg) 8%, transparent)`, boxShadow: opts.strong ? '0 20px 60px rgba(0,0,0,.18), inset 0 1px 0 color-mix(in oklab, var(--fg) 6%, transparent)' : '0 10px 32px rgba(0,0,0,.12), inset 0 1px 0 color-mix(in oklab, var(--fg) 4%, transparent)', }); /* ── Tilt card (subtle 3D on hover, follows cursor) ── */ function TiltCard({ children, strength = 6, style, ...rest }) { const ref = useRef(null); const onMove = (e) => { const el = ref.current; if (!el) return; const r = el.getBoundingClientRect(); const x = (e.clientX - r.left) / r.width; const y = (e.clientY - r.top) / r.height; const rx = ((0.5 - y) * strength).toFixed(2); const ry = ((x - 0.5) * strength).toFixed(2); el.style.transform = `perspective(900px) rotateX(${rx}deg) rotateY(${ry}deg) translateZ(0)`; el.style.setProperty('--sx', `${x * 100}%`); el.style.setProperty('--sy', `${y * 100}%`); }; const reset = () => { const el = ref.current; if (!el) return; el.style.transform = 'perspective(900px) rotateX(0) rotateY(0) translateZ(0)'; }; return (

{children} {/* Shine overlay that follows cursor */}

); } /* ── Number count-up (animates when element enters viewport) ── */ function CountUp({ to, from = 0, duration = 1400, prefix = '', suffix = '', decimals = 0, format }) { const ref = useRef(null); const [val, setVal] = useState(from); const done = useRef(false); useEffect(() => { const el = ref.current; if (!el) return; const runAnim = () => { if (done.current) return; done.current = true; const t0 = performance.now(); const tick = (now) => { const p = Math.min(1, (now - t0) / duration); const eased = 1 - Math.pow(1 - p, 3); setVal(from + (to - from) * eased); if (p < 1) requestAnimationFrame(tick); }; requestAnimationFrame(tick); }; const check = () => { const rect = el.getBoundingClientRect(); return rect.top < window.innerHeight + 100 && rect.bottom > -100; }; const raf1 = requestAnimationFrame(() => { if (check()) { runAnim(); return; } const root = document.getElementById('scroll-root') || null; const io = new IntersectionObserver((entries) => { for (const en of entries) if (en.isIntersecting) { runAnim(); io.disconnect(); } }, { threshold: 0.3, root }); io.observe(el); }); const safety = setTimeout(() => runAnim(), 2500); return () => { cancelAnimationFrame(raf1); clearTimeout(safety); }; }, [to, from, duration]); const display = format ? format(val) : prefix + val.toFixed(decimals).replace(/\B(?=(\d{3})+(?!\d))/g, '.') + suffix; return {display}; } /* ── Word-by-word reveal (stagger fade+rise) ── */ function WordReveal({ children, delayBase = 0, stagger = 60, className = '', style }) { // Accept string or array of segments ({t, gradient?, className?}) const segs = Array.isArray(children) ? children : [{t: String(children)}]; let idx = 0; return ( {segs.map((seg, si) => { const words = seg.t.split(/(\s+)/); return words.map((w, wi) => { if (/^\s+$/.test(w)) return {w}; const d = delayBase + idx * stagger; idx++; const inner = ( {w} ); return {inner}; }); })} ); } Object.assign(window, { TiltCard, CountUp, WordReveal, GLASS });