// Tweakable defaults rewritten on disk by the host when user saves
const TWEAK_DEFAULTS = /*EDITMODE-BEGIN*/{
  "palette": "neon",
  "heroVariant": "vende",
  "density": "regular",
  "showUrgency": true,
  "showBadges": true
}/*EDITMODE-END*/;

const PALETTES = {
  neon:    { green:'#00E47A', green2:'#00ff88', glow:'rgba(0,228,122,0.45)', soft:'rgba(0,228,122,0.12)' },
  electric:{ green:'#39FF6A', green2:'#9EFF6E', glow:'rgba(57,255,106,0.45)', soft:'rgba(57,255,106,0.12)' },
  emerald: { green:'#10B981', green2:'#34D399', glow:'rgba(16,185,129,0.45)',  soft:'rgba(16,185,129,0.12)' },
  cyan:    { green:'#22D3EE', green2:'#67E8F9', glow:'rgba(34,211,238,0.45)',  soft:'rgba(34,211,238,0.12)' },
};

const HERO_VARIANTS = {
  vende: {
    h1: ['A IA que |fecha vendas| no', 'WhatsApp |—| enquanto', 'você |dorme.|'],
    sub: 'ZapFlux qualifica seus leads em |menos de 3 segundos|, agenda reuniões, fecha pedidos e entrega tudo no seu CRM. Sem script engessado. Sem time inflado.'
  },
  escala: {
    h1: ['Escale atendimento |sem|', '|inflar| o time. Sem perder', 'o controle |humano.|'],
    sub: 'A primeira plataforma multi-tenant que combina |IA Claude 4.5| com a API oficial do WhatsApp. De 100 a 15.000 mensagens/min na mesma stack.'
  },
  responde: {
    h1: ['Responda em |3 segundos.|', 'Venda em |3 minutos.|', 'Cresça em |3 meses.|'],
    sub: 'Tempo médio de resposta menor que o tempo de carregar a página do concorrente. ZapFlux trabalha 24/7, em português, com a personalidade da sua marca.'
  },
};

const App = () => {
  const t = TWEAK_DEFAULTS;
  useScrollReveal();

  React.useEffect(() => {
    const p = PALETTES[t.palette] || PALETTES.neon;
    const r = document.documentElement;
    r.style.setProperty('--green', p.green);
    r.style.setProperty('--green-2', p.green2);
    r.style.setProperty('--green-glow', p.glow);
    r.style.setProperty('--green-soft', p.soft);
  }, []);

  return (
    <>
      <Nav/>
      <main>
        <Hero/>
        <Marquee/>
        <Problem/>
        <Features/>
        <HowItWorks/>
        <Tech/>
        <Dashboard/>
        <ROI/>
        <Testimonials/>
        <Pricing/>
        <FAQ/>
        <CTA showUrgency={t.showUrgency}/>
      </main>
      <Footer/>
      <a
        href="https://wa.me/5548996485048?text=Ol%C3%A1%20gostaria%20de%20saber%20mais%20sobre%20a%20zapflux"
        target="_blank" rel="noopener" aria-label="Falar no WhatsApp"
        className="wa-float"
        style={{
          position:'fixed', right:24, bottom:24, zIndex:60,
          width:60, height:60, borderRadius:'50%',
          background:'#25D366', color:'#fff',
          display:'grid', placeItems:'center',
          boxShadow:'0 8px 28px rgba(37,211,102,0.45)',
          transition:'transform .2s ease, box-shadow .2s ease',
        }}
      >
        <Icon name="whatsapp" size={30} stroke="#fff"/>
      </a>
      <style>{`
        .wa-float:hover { transform: scale(1.08); box-shadow: 0 12px 36px rgba(37,211,102,0.6); }
        @media (max-width:520px){ .wa-float { right:16px; bottom:16px; width:54px; height:54px; } }
      `}</style>
    </>
  );
};

// custom helper omitted — inline

ReactDOM.createRoot(document.getElementById('root')).render(<App/>);