Configurações

Os moldes constantes da Fábrica. Cole aqui seu HTML da landing page e seu Playbook — a IA adapta o conteúdo por nicho mantendo a estrutura (mesmo molde para todos: comparação justa). Criativos-modelo e deck de vendas entram aqui também.

Marca & Empresa

Logo, cores, voz e contexto da empresa

Isto alimenta todos os agentes (LP, criativos, deck, playbook) — a copy sai com o contexto e a voz da sua empresa, não genérica.

Subir logo

Use o logo que apareça bem em fundo escuro (PNG transparente).

Nome da empresa

Sobre / posicionamento

Quem é a empresa, posicionamento e provas. É o contexto que TODOS os agentes (LP, criativos, deck, playbook) usam pra escrever a copy.

Tom de voz

Cor primária

Cor de apoio

Fontes

Landing page

Landing page padrão v1

HTML do molde da landing page

<!DOCTYPE html>
<html lang="pt-BR">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Diagnóstico de IA — [Nicho]</title>
<style>
  :root { --roxo:#7C3AED; --escuro:#2E1A47; --cinza:#f4f4f4; --txt:#1e1e1e; }
  * { box-sizing:border-box; margin:0; padding:0; }
  body { font-family:'Poppins','Segoe UI',system-ui,sans-serif; color:var(--txt); background:#fff; line-height:1.6; }
  .wrap { max-width:680px; margin:0 auto; padding:0 20px; }
  h1,h2 { font-family:'Lexend',sans-serif; letter-spacing:-.02em; line-height:1.15; }
  .hero { background:var(--escuro); color:#fff; text-align:center; padding:64px 0; }
  .hero h1 { font-size:34px; margin-bottom:16px; }
  .hero p { font-size:18px; opacity:.85; max-width:540px; margin:0 auto 28px; }
  .cta { display:inline-block; background:var(--roxo); color:#fff; text-decoration:none; font-weight:600; padding:16px 32px; border-radius:12px; font-size:17px; }
  section { padding:56px 0; }
  .dor { background:var(--cinza); }
  .dor h2, .como h2, .oferta h2, .faq h2 { font-size:26px; margin-bottom:24px; text-align:center; }
  .bullets { list-style:none; max-width:560px; margin:0 auto; }
  .bullets li { background:#fff; border:1px solid #eee; border-radius:12px; padding:14px 18px; margin-bottom:12px; }
  .passos { display:grid; gap:16px; max-width:560px; margin:0 auto; }
  .passo { display:flex; gap:14px; align-items:flex-start; }
  .num { background:var(--roxo); color:#fff; width:32px; height:32px; border-radius:50%; display:grid; place-items:center; font-weight:600; flex-shrink:0; }
  .prova { background:var(--escuro); color:#fff; }
  .depo { max-width:560px; margin:0 auto; text-align:center; font-size:19px; font-style:italic; }
  .depo span { display:block; margin-top:12px; font-size:14px; opacity:.7; font-style:normal; }
  .oferta { text-align:center; }
  .card { border:2px solid var(--roxo); border-radius:16px; padding:32px; max-width:480px; margin:0 auto; }
  .preco { font-size:32px; font-weight:700; color:var(--roxo); margin:16px 0; }
  .garantia { font-size:14px; color:#666; margin-top:16px; }
  .faq dt { font-weight:600; margin-top:18px; }
  .form { max-width:440px; margin:24px auto 0; display:grid; gap:12px; }
  .form input { padding:14px; border:1px solid #ddd; border-radius:10px; font-size:16px; }
  footer { text-align:center; padding:32px 0; font-size:13px; color:#999; }
</style>
</head>
<body>
  <header class="hero">
    <div class="wrap">
      <h1>A headline principal que fala a dor do nicho</h1>
      <p>Subtítulo que reforça a promessa e o resultado desejado em uma frase clara.</p>
      <a class="cta" href="#oferta">Quero meu diagnóstico gratuito</a>
    </div>
  </header>

<section class="dor">
    <div class="wrap">
      <h2>Você reconhece esses problemas?</h2>
      <ul class="bullets">
        <li>Primeira dor concreta do nicho.</li>
        <li>Segunda dor concreta do nicho.</li>
        <li>Terceira dor concreta do nicho.</li>
      </ul>
    </div>
  </section>

<section class="como">
    <div class="wrap">
      <h2>Como funciona</h2>
      <div class="passos">
        <div class="passo"><span class="num">1</span><p>Primeiro passo do mecanismo.</p></div>
        <div class="passo"><span class="num">2</span><p>Segundo passo do mecanismo.</p></div>
        <div class="passo"><span class="num">3</span><p>Terceiro passo do mecanismo.</p></div>
      </div>
    </div>
  </section>

<section class="prova">
    <div class="wrap">
      <p class="depo">"Depoimento ou prova social relevante para o nicho."<span>— Cliente, cargo/empresa</span></p>
    </div>
  </section>

<section class="oferta" id="oferta">
    <div class="wrap">
      <h2>A oferta</h2>
      <div class="card">
        <p>Descrição curta do que está sendo oferecido.</p>
        <div class="preco">Preço ou "Gratuito"</div>
        <a class="cta" href="#form">Garantir agora</a>
        <p class="garantia">Garantia ou redutor de risco.</p>
      </div>
      <form class="form" id="form">
        <input type="text" placeholder="Seu nome" required />
        <input type="email" placeholder="Seu e-mail" required />
        <input type="tel" placeholder="Seu WhatsApp" required />
        <input type="text" placeholder="Sua empresa" />
        <a class="cta" href="#">Enviar</a>
      </form>
    </div>
  </section>

<section class="faq">
    <div class="wrap">
      <h2>Perguntas frequentes</h2>
      <dl>
        <dt>Primeira pergunta comum do nicho?</dt><dd>Resposta clara.</dd>
        <dt>Segunda pergunta comum do nicho?</dt><dd>Resposta clara.</dd>
      </dl>
    </div>
  </section>

<footer>© emploia — Diagnóstico de IA</footer>
</body>
</html>

Instruções de adaptação (como a IA deve adaptar ao nicho)

Landing page

LP padrão de ads (fiel à prospeccao.emploia.com.br)

HTML do molde da landing page

<!DOCTYPE html>
<html lang="pt-BR">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>emplo.ia · Aumente a conversão do seu time</title>
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link href="https://fonts.googleapis.com/css2?family=Krona+One&family=Poppins:wght@400;500;600;700&display=swap" rel="stylesheet" />
<script src="https://unpkg.com/lucide@latest"></script>
<style>
  :root{
    --bg: hsl(0 0% 96%); --fg: hsl(0 0% 12%);
    --muted-fg: hsl(0 0% 40%); --border: hsl(0 0% 85%);
    --purple: #3f1757; --lilac: #CBC5EA; --radius: .75rem;
  }
  *{box-sizing:border-box;border-color:var(--border)}
  html{scroll-behavior:smooth}
  body{margin:0;background:var(--bg);color:var(--fg);font-family:'Poppins',sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
  h1,h2,h3{font-family:'Krona One',sans-serif;letter-spacing:-.02em;font-weight:700;margin:0}
  p{margin:0}
  .container{max-width:1080px;margin:0 auto;padding:0 16px;position:relative;z-index:2}
  .narrow{max-width:880px}
  section{position:relative;padding:96px 16px;overflow:hidden}
  .text-gradient{color:var(--purple)}
  .muted{color:var(--muted-fg)}
  .center{text-align:center}
  /* fundos */
  .bg-grid::before{content:'';position:absolute;inset:0;z-index:0;opacity:.35;background-image:linear-gradient(hsla(277,59%,21%,.04) 1px,transparent 1px),linear-gradient(90deg,hsla(277,59%,21%,.04) 1px,transparent 1px);background-size:60px 60px}
  .glow-top::after{content:'';position:absolute;inset:0;z-index:0;background:radial-gradient(ellipse 80% 50% at 50% 0%,hsla(277,59%,21%,.18) 0%,transparent 60%)}
  .glow-bottom::after{content:'';position:absolute;inset:0;z-index:0;background:radial-gradient(ellipse 80% 50% at 50% 100%,hsla(277,59%,21%,.12) 0%,transparent 60%)}
  /* CTA pill com borda-gradiente animada */
  @property --gradient-angle{syntax:"<angle>";initial-value:0deg;inherits:false}
  .cta-button{position:relative;display:inline-block;background:var(--purple);color:#fff;border-radius:999px;border:none;cursor:pointer;z-index:1;letter-spacing:.02em;font-family:'Poppins',sans-serif;font-weight:600;font-size:16px;padding:16px 36px;text-decoration:none}
  .cta-button.large{font-size:17px;padding:18px 44px}
  .cta-button::before{content:'';position:absolute;inset:-2px;border-radius:inherit;padding:2px;background:conic-gradient(from var(--gradient-angle),#3f1757,#CBC5EA,#3f1757,#CBC5EA);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:cta-rot 4s linear infinite;z-index:-1}
  .cta-button::after{content:'';position:absolute;inset:-6px;border-radius:inherit;background:conic-gradient(from var(--gradient-angle),#3f1757,#CBC5EA,#3f1757,#CBC5EA);filter:blur(12px);opacity:.55;animation:cta-rot 4s linear infinite;z-index:-2}
  .cta-button.light{background:linear-gradient(135deg,#fff 0%,#CBC5EA 100%);color:var(--purple)}
  .cta-button.light::before,.cta-button.light::after{background:conic-gradient(from var(--gradient-angle),#fff,#CBC5EA,#fff,#CBC5EA)}
  @keyframes cta-rot{to{--gradient-angle:360deg}}
  .cta-button:hover::before{animation-play-state:paused}
  /* cards */
  .card{position:relative;background:hsl(0 0% 96%);border-radius:var(--radius);padding:24px;z-index:1;height:100%}
  .card::before{content:'';position:absolute;inset:0;border-radius:var(--radius);padding:1px;background:linear-gradient(135deg,hsla(277,59%,21%,.4) 0%,hsla(252,31%,84%,.25) 50%,hsla(277,59%,21%,.4) 100%);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;z-index:-1}
  .icon-badge{width:48px;height:48px;border-radius:12px;background:linear-gradient(135deg,hsla(277,59%,21%,.15),hsla(252,31%,84%,.15));display:flex;align-items:center;justify-content:center;margin:0 auto 16px}
  .icon-badge svg{width:24px;height:24px;color:var(--purple)}
  /* grids */
  .grid{display:grid;gap:24px}
  @media(min-width:640px){.grid-2sm{grid-template-columns:1fr 1fr}}
  @media(min-width:768px){.grid-2{grid-template-columns:1fr 1fr}}
  @media(min-width:1024px){.grid-4{grid-template-columns:repeat(4,1fr)}}
  /* hero */
  .hero{min-height:92vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:80px 16px}
  .logo-type{font-family:'Poppins',sans-serif;font-weight:700;font-size:34px;color:var(--purple)}
  .logo-type span{color:var(--lilac)}
  .hero h1{font-size:clamp(20px,3.2vw,34px);line-height:1.35;max-width:960px;margin:48px auto 32px}
  .pill{display:inline-block;background:var(--lilac);color:var(--purple);font-weight:600;font-size:16px;padding:12px 24px;border-radius:999px}
  .box-purple{background:var(--purple);border-radius:var(--radius);padding:36px;color:#fff}
  .box-lilac{background:var(--lilac);border-radius:var(--radius);padding:28px;color:var(--purple)}
  ul.clean{list-style:none;padding:0;margin:0}
  ul.clean li{display:flex;gap:10px;align-items:flex-start;margin-bottom:12px;font-size:16px}
  .stat-value{font-size:30px;font-weight:700;color:var(--purple);font-family:'Poppins',sans-serif;margin-bottom:6px}
  /* modal */
  .modal-overlay{position:fixed;inset:0;z-index:9999;background:rgba(0,0,0,.8);backdrop-filter:blur(4px);display:none;align-items:center;justify-content:center;padding:16px}
  .modal-overlay.open{display:flex}
  .modal{position:relative;width:100%;max-width:520px;max-height:90vh;overflow-y:auto;border-radius:16px;padding:32px;background:#f4f4f4}
  .modal h3{font-size:19px;color:#111;text-align:center;margin-bottom:8px}
  .modal .sub{font-size:14px;color:#6b7280;text-align:center;margin-bottom:20px}
  .modal label{display:block;font-size:14px;font-weight:500;color:#374151;margin:0 0 6px}
  .modal .field{margin-bottom:18px}
  .modal input,.modal select{width:100%;padding:12px 16px;border-radius:8px;border:1px solid #d1d5db;background:#fff;color:#111;font-family:'Poppins',sans-serif;font-size:14px}
  .modal input:focus,.modal select:focus{outline:2px solid var(--purple);border-color:transparent}
  .modal .req{color:#ef4444}
  .modal .close{position:absolute;top:12px;right:12px;background:none;border:none;font-size:20px;cursor:pointer;color:#4b5563;line-height:1}
  .btn-solid{width:100%;padding:16px 32px;border-radius:999px;background:var(--purple);color:#fff;font-family:'Poppins',sans-serif;font-weight:600;font-size:16px;border:none;cursor:pointer}
  .btn-solid:disabled{opacity:.6;cursor:not-allowed}
  .err{font-size:12px;color:#ef4444;margin-top:4px;display:none}
  footer{border-top:1px solid hsla(0,0%,85%,.5);padding:48px 16px;text-align:center}
  .fade{animation:fadeUp .7s cubic-bezier(.22,1,.36,1) both}
  @keyframes fadeUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
</style>
</head>
<body>

<section class="hero bg-grid glow-top">
  <div class="container center fade">
    <img src="/brand/emploia-horizontal-colorida.svg" alt="emplo.ia" style="height:52px;width:auto;display:inline-block" />
    <h1>Nós vamos implementar uma IA que <span class="text-gradient">aumenta a conversão dos BDRs do seu time</span>, qualificando e preparando seus leads diretamente no seu pipeline, com previsibilidade e escala.</h1>
    <p class="muted" style="font-size:18px;max-width:720px;margin:0 auto 12px">Sem aumentar equipe, sem depender de mais leads e sem sobrecarregar seu time.</p>
    <p style="font-size:18px;font-weight:600;max-width:720px;margin:0 auto 40px">Apenas mais eficiência, mais reuniões qualificadas e mais vendas.</p>
    <a href="#" class="cta-button large js-open-modal">Quero aumentar a conversão do meu time</a>
  </div>
</section>

<section class="bg-grid">
  <div class="container narrow">
    <div class="center" style="margin-bottom:32px">
      <h2 style="font-size:clamp(24px,3vw,34px)"><span class="text-gradient">Você não precisa de mais leads.</span></h2>
      <p style="font-size:20px;font-weight:600;margin:16px 0 8px">Você precisa parar de desperdiçar os que já tem.</p>
      <p class="muted" style="font-size:17px">Hoje, a maioria dos times comerciais enfrenta:</p>
    </div>
    <div class="grid grid-2sm grid-4" style="margin-bottom:48px">
      <div class="card center"><div class="icon-badge"><i data-lucide="clock"></i></div><p style="font-weight:500">BDRs que passam horas pesquisando antes de agir</p></div>
      <div class="card center"><div class="icon-badge"><i data-lucide="trending-down"></i></div><p style="font-weight:500">Esforço manual repetitivo em cada lead</p></div>
      <div class="card center"><div class="icon-badge"><i data-lucide="rotate-ccw"></i></div><p style="font-weight:500">Follow-up inconsistente</p></div>
      <div class="card center"><div class="icon-badge"><i data-lucide="bar-chart-3"></i></div><p style="font-weight:500">Perda de oportunidades dentro do próprio pipeline</p></div>
    </div>
    <p class="center" style="font-size:20px;font-weight:600;margin-bottom:48px">O problema não está no time. <span class="text-gradient">Está no modelo de operação.</span></p>
    <div class="box-purple">
      <h3 style="font-size:clamp(19px,2.4vw,26px);margin-bottom:16px">O problema dos BDRs do seu time não é esforço. <span style="color:var(--lilac)"><br/>É desperdício de tempo.</span></h3>
      <p style="color:rgba(255,255,255,.8);margin-bottom:20px">Seu BDR não foi contratado para pesquisar. Ele foi contratado para:</p>
      <ul class="clean" style="margin-bottom:20px">
        <li style="color:#fff;font-weight:500">Abrir conversas</li>
        <li style="color:#fff;font-weight:500">Gerar reuniões</li>
        <li style="color:#fff;font-weight:500">Avançar oportunidades</li>
        <li style="color:#fff;font-weight:500">Fechar vendas</li>
      </ul>
      <p style="color:rgba(255,255,255,.7)">Mas hoje grande parte do tempo é consumida em tarefas operacionais.</p>
    </div>
  </div>
</section>

<section class="glow-bottom">
  <div class="container narrow">
    <h2 class="center" style="font-size:clamp(24px,3vw,34px);margin-bottom:48px">Se você tem um <span class="text-gradient">time de prospecção ativo</span></h2>
    <div class="grid grid-2" style="margin-bottom:48px">
      <div class="card">
        <h3 style="font-family:'Poppins';font-size:18px;color:var(--muted-fg);margin-bottom:16px">CENÁRIO ATUAL</h3>
        <ul class="clean muted">
          <li>• Cada BDR pode gastar até 60 minutos por lead</li>
          <li>• Grande parte do dia é consumida em pesquisa</li>
          <li>• Poucos leads são trabalhados diariamente</li>
          <li>• A produtividade real é limitada</li>
        </ul>
      </div>
      <div class="box-lilac">
        <h3 style="font-family:'Poppins';font-size:18px;margin-bottom:16px">OPERAÇÃO OTIMIZADA</h3>
        <ul class="clean">
          <li>• 2 a 3 minutos por lead com IA</li>
          <li>• Até 10 vezes mais leads trabalhados por dia</li>
          <li>• Pipeline sempre ativo</li>
          <li>• BDRs focados em conversar e fechar</li>
        </ul>
      </div>
    </div>
    <div class="center">
      <p style="font-size:20px;font-weight:600;margin-bottom:32px">Isso não é teoria. <span class="text-gradient">É eficiência operacional aplicada.</span></p>
      <a href="#" class="cta-button js-open-modal">Quero aumentar a conversão do meu time</a>
    </div>
  </div>
</section>

<section class="bg-grid">
  <div class="container">
    <h2 class="center" style="font-size:clamp(24px,3vw,34px);margin-bottom:56px">Como aumentamos a produtividade <span class="text-gradient">dos BDRs do seu time</span></h2>
    <div class="grid grid-2" style="margin-bottom:48px">
      <div class="card" style="text-align:left"><div class="icon-badge" style="margin:0 0 16px"><i data-lucide="zap"></i></div><h3 style="font-family:'Poppins';font-size:18px;margin-bottom:10px">Pesquisa automatizada em segundos</h3><p class="muted" style="font-size:14px">A IA levanta todas as informações relevantes do lead de forma imediata</p></div>
      <div class="card" style="text-align:left"><div class="icon-badge" style="margin:0 0 16px"><i data-lucide="target"></i></div><h3 style="font-family:'Poppins';font-size:18px;margin-bottom:10px">Mapeamento de decisores</h3><p class="muted" style="font-size:14px">Identificação dos responsáveis reais pela decisão dentro da empresa</p></div>
      <div class="card" style="text-align:left"><div class="icon-badge" style="margin:0 0 16px"><i data-lucide="file-text"></i></div><h3 style="font-family:'Poppins';font-size:18px;margin-bottom:10px">Script personalizado por lead</h3><p class="muted" style="font-size:14px">Cada abordagem já chega pronta com base no contexto real da empresa</p></div>
      <div class="card" style="text-align:left"><div class="icon-badge" style="margin:0 0 16px"><i data-lucide="crosshair"></i></div><h3 style="font-family:'Poppins';font-size:18px;margin-bottom:10px">Execução com foco total</h3><p class="muted" style="font-size:14px">Os BDRs deixam de pesquisar e passam a atuar diretamente na conversão</p></div>
    </div>
    <p class="center" style="font-size:20px;font-weight:600">Resultado direto: <span class="text-gradient">Mais volume. Mais qualidade. Mais consistência.</span></p>
  </div>
</section>

<section class="glow-bottom">
  <div class="container">
    <h2 class="center" style="font-size:clamp(24px,3vw,34px);margin-bottom:56px">Com a estrutura implementada</h2>
    <div class="grid grid-2sm grid-4" style="margin-bottom:48px">
      <div class="card center"><div class="icon-badge"><i data-lucide="clock"></i></div><div class="stat-value">80%</div><p class="muted" style="font-size:14px">menos tempo por lead</p></div>
      <div class="card center"><div class="icon-badge"><i data-lucide="trending-up"></i></div><div class="stat-value">10x</div><p class="muted" style="font-size:14px">mais leads trabalhados</p></div>
      <div class="card center"><div class="icon-badge"><i data-lucide="users"></i></div><div class="stat-value">100%</div><p class="muted" style="font-size:14px">padronização na abordagem entre BDRs</p></div>
      <div class="card center"><div class="icon-badge"><i data-lucide="bar-chart-3"></i></div><div class="stat-value">+</div><p class="muted" style="font-size:14px">previsibilidade no pipeline</p></div>
    </div>
    <p class="center" style="font-size:20px;font-weight:600;margin-bottom:64px">Na prática: cada BDR passa a produzir muito mais com o mesmo tempo.</p>

<h2 class="center" style="font-size:clamp(24px,3vw,34px);margin-bottom:16px">Enquanto seus BDRs estão em reunião, <span class="text-gradient">a IA continua produzindo</span></h2>
    <p class="center muted" style="font-size:17px;margin-bottom:48px">Enquanto um BDR está em uma call:</p>
    <div class="grid grid-2sm grid-4" style="margin-bottom:48px">
      <div class="card center"><div class="icon-badge"><i data-lucide="search"></i></div><p style="font-weight:500">A IA analisa novos leads</p></div>
      <div class="card center"><div class="icon-badge"><i data-lucide="bar-chart-3"></i></div><p style="font-weight:500">Organiza informações estratégicas</p></div>
      <div class="card center"><div class="icon-badge"><i data-lucide="brain"></i></div><p style="font-weight:500">Gera contexto relevante</p></div>
      <div class="card center"><div class="icon-badge"><i data-lucide="file-text"></i></div><p style="font-weight:500">Prepara abordagens personalizadas</p></div>
    </div>
    <div class="center">
      <p style="font-size:20px;font-weight:600;margin-bottom:32px">O pipeline continua avançando <span class="text-gradient">sem depender do tempo do time.</span></p>
      <a href="#" class="cta-button js-open-modal">Quero aumentar a conversão do meu time</a>
    </div>
  </div>
</section>

<section class="glow-top">
  <div class="container" style="max-width:820px">
    <h2 class="center" style="font-size:clamp(24px,3vw,34px);margin-bottom:48px">Essa solução é indicada <span class="text-gradient">para empresas que</span></h2>
    <div class="box-purple" style="margin-bottom:40px">
      <ul class="clean">
        <li style="color:#fff"><i data-lucide="check" style="width:20px;height:20px;color:#fff;flex-shrink:0"></i> Possuem time de BDRs ativo</li>
        <li style="color:#fff"><i data-lucide="check" style="width:20px;height:20px;color:#fff;flex-shrink:0"></i> Trabalham outbound de forma estruturada</li>
        <li style="color:#fff"><i data-lucide="check" style="width:20px;height:20px;color:#fff;flex-shrink:0"></i> Utilizam CRM</li>
        <li style="color:#fff"><i data-lucide="check" style="width:20px;height:20px;color:#fff;flex-shrink:0"></i> Buscam escala sem aumentar equipe</li>
      </ul>
    </div>
    <h3 class="center" style="font-size:clamp(19px,2.4vw,26px);margin-bottom:24px"><span class="text-gradient">Não indicado para</span></h3>
    <ul class="clean" style="max-width:520px;margin:0 auto">
      <li class="muted" style="justify-content:center"><i data-lucide="x" style="width:18px;height:18px;color:var(--lilac);flex-shrink:0"></i> Empresas sem time de prospecção</li>
      <li class="muted" style="justify-content:center"><i data-lucide="x" style="width:18px;height:18px;color:var(--lilac);flex-shrink:0"></i> Operações que dependem apenas de inbound</li>
      <li class="muted" style="justify-content:center"><i data-lucide="x" style="width:18px;height:18px;color:var(--lilac);flex-shrink:0"></i> Negócios sem processo comercial definido</li>
    </ul>
  </div>
</section>

<section class="glow-bottom">
  <div class="container narrow">
    <div class="center" style="margin-bottom:48px">
      <h2 style="font-size:clamp(24px,3vw,34px);margin-bottom:12px">Não se trata de uma <span class="text-gradient">ferramenta isolada</span></h2>
      <p class="muted" style="font-size:17px">A implementação inclui:</p>
    </div>
    <div class="grid grid-2sm grid-4" style="margin-bottom:64px">
      <div class="card center"><div class="icon-badge"><i data-lucide="settings"></i></div><p style="font-weight:500">Integração com o processo atual</p></div>
      <div class="card center"><div class="icon-badge"><i data-lucide="graduation-cap"></i></div><p style="font-weight:500">Treinamento dos BDRs</p></div>
      <div class="card center"><div class="icon-badge"><i data-lucide="sliders-horizontal"></i></div><p style="font-weight:500">Ajustes conforme operação</p></div>
      <div class="card center"><div class="icon-badge"><i data-lucide="heart-handshake"></i></div><p style="font-weight:500">Acompanhamento contínuo</p></div>
    </div>
    <div class="center">
      <p class="muted" style="font-size:17px;margin-bottom:20px">Com um investimento mensal, não é possível contratar um novo BDR com qualidade.</p>
      <h3 style="font-size:clamp(20px,2.6vw,30px);margin-bottom:32px">Mas é possível <span class="text-gradient">aumentar significativamente a produtividade</span> dos BDRs que você já tem.</h3>
      <div style="display:flex;flex-wrap:wrap;gap:16px;justify-content:center">
        <span class="pill">Mais eficiência</span>
        <span class="pill">Mais aproveitamento</span>
        <span class="pill">Mais resultado com a mesma estrutura</span>
      </div>
    </div>
  </div>
</section>

<section style="background:var(--purple)" class="glow-top">
  <div class="container center" style="max-width:820px">
    <h2 style="font-size:clamp(24px,3vw,34px);color:#fff;margin-bottom:16px">Escalar não depende de contratar mais BDRs. <span style="color:var(--lilac)">Depende de operar melhor.</span></h2>
    <p style="color:rgba(255,255,255,.8);font-size:17px;margin-bottom:40px">Use IA para multiplicar a performance do seu time.</p>
    <a href="#" class="cta-button large light js-open-modal">Quero ver isso funcionando no meu time</a>
    <p style="color:rgba(255,255,255,.6);font-size:14px;margin-top:48px">Durante a demonstração, apresentamos o funcionamento com um lead real do seu pipeline. Em poucos segundos, é possível visualizar o que hoje leva horas para ser feito manualmente.</p>
  </div>
</section>

<footer>
  <img src="/brand/emploia-horizontal-colorida.svg" alt="emplo.ia" style="height:30px;width:auto;opacity:.7" />
  <p class="muted" style="font-size:14px;margin-top:12px">© 2026 emplo.ia. Todos os direitos reservados.</p>
</footer>

<div class="modal-overlay" id="nl-modal">
  <div class="modal">
    <button class="close" type="button" aria-label="Fechar">&times;</button>
    <div id="nl-form-step">
      <h3>FORMULÁRIO DE QUALIFICAÇÃO</h3>
      <p class="sub">Preencha abaixo para ver como podemos aumentar a performance do seu time:</p>
      <form id="nl-qualify" data-nl-wired="1">
        <div class="field"><label>Nome completo <span class="req">*</span></label><input type="text" name="nome" required autocomplete="name" placeholder="Seu nome completo" /></div>
        <div class="field"><label>Email <span class="req">*</span></label><input type="email" name="email" required autocomplete="email" placeholder="seu@email.com" /><p class="err" data-err="email">E-mail inválido</p></div>
        <div class="field"><label>WhatsApp <span class="req">*</span></label><input type="tel" name="whatsapp" required maxlength="15" autocomplete="tel" placeholder="(00) 00000-0000" /><p class="err" data-err="whatsapp">Telefone incompleto</p></div>
        <div class="field"><label>Qual o site da sua empresa? <span class="req">*</span></label><input type="text" name="website" required placeholder="suaempresa.com.br" /></div>
        <div class="field"><label>Qual o segmento da sua empresa? <span class="req">*</span></label>
          <select name="segmento" required>
            <option value="" disabled selected>Selecione o segmento</option>
            <option>Tecnologia / SaaS</option><option>Serviços B2B</option><option>Consultoria</option>
            <option>Marketing e Publicidade</option><option>Educação</option><option>Indústria</option>
            <option>Imobiliário</option><option>Financeiro</option><option>Saúde</option><option>Outro</option>
          </select></div>
        <div class="field"><label>Quantas pessoas tem no seu time comercial? <span class="req">*</span></label>
          <select name="tamanho" required>
            <option value="" disabled selected>Selecione o tamanho</option>
            <option>1 a 2 pessoas</option><option>3 a 5 pessoas</option><option>6 a 10 pessoas</option>
            <option>11 a 20 pessoas</option><option>Mais de 20 pessoas</option>
          </select></div>
        <p class="err" id="nl-submit-err">Não foi possível enviar agora. Tente novamente em instantes.</p>
        <button type="submit" class="btn-solid">Quero aumentar a conversão do meu time</button>
      </form>
    </div>
    <div id="nl-success-step" style="display:none;text-align:center;padding:16px 0">
      <p style="font-size:36px;margin-bottom:16px">🎥</p>
      <h3 style="margin-bottom:16px">Próxima etapa</h3>
      <p style="font-size:15px;color:#4b5563;line-height:1.6;margin-bottom:32px">Perfeito, <span id="nl-lead-name"></span>! Sua próxima etapa é agendar uma reunião por vídeo chamada com nosso time. Nela, você vai entender como ela pode gerar reuniões qualificadas para o seu time de vendas. Escolha o melhor dia e horário para você. Estaremos lá. ✅</p>
      <a href="https://calendly.com/roberto-junqueira-emploia/diagnostico" target="_blank" class="btn-solid" style="display:block;text-decoration:none;text-align:center" id="nl-calendly">Agendar minha reunião</a>
    </div>
  </div>
</div>

var wa=document.querySelector('#nl-qualify [name=whatsapp]');
  wa.addEventListener("input",function(){
    var d=wa.value.replace(/\D/g,"").slice(0,11);
    wa.value=d.length<=2?(d.length?"("+d:""):d.length<=7?"("+d.slice(0,2)+") "+d.slice(2):"("+d.slice(0,2)+") "+d.slice(2,7)+"-"+d.slice(7);
  });

Instruções de adaptação (como a IA deve adaptar ao nicho)

Script / Playbook

Script de vendas padrão v1

Texto do Playbook padrão

Instruções de adaptação (como a IA deve adaptar ao nicho)

Criativos-modelo

Criativo padrão v1

Subir criativos-modelo (imagens)

Suba seus ads estáticos padrão (PNG/JPG). Eles ficam cadastrados aqui e, na geração, a IA replica o estilo ajustando a copy para cada nicho.

Oferta

Logo, cores, voz e contexto da empresa

Landing page padrão v1

LP padrão de ads (fiel à prospeccao.emploia.com.br)

Script de vendas padrão v1

Criativo padrão v1

Oferta padrão v1