PageSourceSearch

https://www.plati.ai/

html plati.ai collected 2026-10-05 12:24:56 UTC 72,420 bytes, 1,471 lines download raw bytes

1<!DOCTYPE html>
2<html lang="pt-BR">
3<head>
4  <meta charset="utf-8">
5  <title>Plati AI</title>
6  <meta content="AI conversacional para WhatsApp - Automatize atendimento e processos com AI que age, não apenas conversa" name="description">
7  <meta content="Plati AI" property="og:title">
8  <meta content="AI conversacional para WhatsApp - Automatize atendimento e processos com AI que age, não apenas conversa" property="og:description">
9  <meta content="/images/Thumb.webp" property="og:image">
10  <meta content="Plati AI" property="twitter:title">
11  <meta content="AI conversacional para WhatsApp - Automatize atendimento e processos com AI que age, não apenas conversa" property="twitter:description">
12  <meta content="/images/Thumb.webp" property="twitter:image">
13  <meta property="og:type" content="website">
14  <meta content="summary_large_image" name="twitter:card">
15  <meta content="width=device-width, initial-scale=1" name="viewport">
16  <link href="css/normalize.css" rel="stylesheet" type="text/css">
17  <link href="css/site-base.css" rel="stylesheet" type="text/css">
18  <link href="css/platii.css" rel="stylesheet" type="text/css">
19  <link href="https://fonts.googleapis.com" rel="preconnect">
20  <link href="https://fonts.gstatic.com" rel="preconnect" crossorigin="anonymous">
21  
21<script src="https://ajax.googleapis.com/ajax/libs/webfont/1.6.26/webfont.js" type="text/javascript"></script>
21
22  
22<script type="text/javascript">WebFont.load({  google: {    families: ["Montserrat:100,100italic,200,200italic,300,300italic,400,400italic,500,500italic,600,600italic,700,700italic,800,800italic,900,900italic","Plus Jakarta Sans:regular,500,600,700,800"]  }});</script>
22
23  
23<script type="text/javascript">!function(o,c){var n=c.documentElement,t=" w-mod-";n.className+=t+"js",("ontouchstart"in o||o.DocumentTouch&&c instanceof DocumentTouch)&&(n.className+=t+"touch")}(window,document);</script>
23
24  <link href="images/favicon.svg" rel="shortcut icon" type="image/x-icon">
25  <link href="images/webclip.svg" rel="apple-touch-icon">
vendor: 69 bytes, lines 25-26
25
26  <script async="" src="https://www.googletagmanager.com/gtag/js?id=
26G-YT8X4Z2M7X
vendor: 14 bytes, lines 26-27
26"></script>
27  
27<script type="text/javascript">window.dataLayer = window.dataLayer || [];function gtag(){dataLayer.push(arguments);}gtag('js', new Date());gtag('set', 'developer_id.dZGVlNj', true);gtag('config', 'G-YT8X4Z2M7X');gtag('config', 'AW-18193694068');</script>
27
28  <!-- Meta Pixel Code -->
29  
29<script>
vendor: 399 bytes, lines 29-38
29
30!function(f,b,e,v,n,t,s)
31{if(f.fbq)return;n=f.fbq=function(){n.callMethod?
32n.callMethod.apply(n,arguments):n.queue.push(arguments)};
33if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
34n.queue=[];t=b.createElement(e);t.async=!0;
35t.src=v;s=b.getElementsByTagName(e)[0];
36s.parentNode.insertBefore(t,s)}(window, document,'script',
37'https://connect.facebook.net/en_US/fbevents.js');
38fbq('init', '
384438410089732878
vendor: 30 bytes, lines 38-39
38');
39fbq('track', 'PageView');
40</script>
40
41  
41<script defer src="/js/posthog-home.js"></script>
41
42  
42<script defer src="/js/lite-nav-split.js"></script>
42
43<style>
44    @media screen and (max-width: 767px) {
45      .navigation-wrap { justify-content: space-between; }
46      .navigation-wrap .div-block-4 { display: flex !important; }
47      .navigation-wrap .div-block-4 > :not(.lite-nav-link) { display: none !important; }
48      .navigation-wrap .lite-nav-link { display: inline-flex; margin: 0; padding: 8px 4px; }
49    }
50
51    :root { --lite-banner-height: 44px; }
52
53    .lite-banner {
54      position: relative;
55      z-index: 1100;
56      display: flex;
57      align-items: center;
58      justify-content: center;
59      flex-wrap: wrap;
60      gap: 4px 10px;
61      min-height: var(--lite-banner-height);
62      padding: 8px 16px;
63      background-color: #e0fe60;
64      border-bottom: 1px solid rgba(10, 10, 10, .12);
65      color: #0a0a0a;
66      font-family: 'Plus Jakarta Sans', sans-serif;
67      font-size: 14px;
68      line-height: 1.2;
69      text-align: center;
70      text-decoration: none;
71      transition: background-color .25s;
72    }
73    .lite-banner:hover { background-color: #d5f742; }
74    .lite-banner-tag {
75      flex: none;
76      padding: 3px 8px;
77      border-radius: 999px;
78      background-color: #0a0a0a;
79      color: #e0fe60;
80      font-size: 11px;
81      font-weight: 700;
82      letter-spacing: .08em;
83      text-transform: uppercase;
84    }
85    .lite-banner-text { color: rgba(10, 10, 10, .82); }
86    .lite-banner-text strong { color: #0a0a0a; font-weight: 600; }
87    .lite-banner-text-short { display: none; }
88    .lite-banner-cta { flex: none; color: #0a0a0a; font-weight: 700; white-space: nowrap; }
89    .lite-banner-cta i { font-style: normal; display: inline-block; transition: transform .25s; }
90    .lite-banner:hover .lite-banner-cta i { transform: translateX(3px); }
91
92    /* O header é absoluto no topo da página: desce ele abaixo do banner. */
93    .navigation { top: var(--lite-banner-offset, var(--lite-banner-height)); }
94
95    @media screen and (max-width: 767px) {
96      :root { --lite-banner-height: 40px; }
97      .lite-banner { gap: 4px 8px; padding: 8px 12px; font-size: 12px; }
98      .lite-banner-text { display: none; }
99      .lite-banner-text-short { display: inline; color: rgba(10, 10, 10, .82); }
100    }
101    @media screen and (max-width: 420px) {
102      .lite-banner-tag { display: none; }
103    }
104  </style>
105</head>
106<body class="body">
107  <noscript><img height="1" width="1" style="display:none"
108src="https://www.facebook.com/tr?id=4438410089732878&ev=PageView&noscript=1"
109/></noscript>
110  <!-- End Meta Pixel Code -->
111
112  <a href="/lite/" class="lite-banner lite-nav-link">
113    <span class="lite-banner-tag">Novo</span>
114    <span class="lite-banner-text"><strong>Plati Lite:</strong> WhatsApp Business com superpoderes — pare de perder vendas e follow-ups.</span>
115    <span class="lite-banner-text-short"><strong>Plati Lite:</strong> WhatsApp com superpoderes.</span>
116    <span class="lite-banner-cta">Comece grátis <i aria-hidden="true">→</i></span>
117  </a>
118  
118<script>
119    (function () {
120      var banner = document.currentScript.previousElementSibling;
121      function sync() {
122        document.documentElement.style.setProperty('--lite-banner-offset', banner.offsetHeight + 'px');
123      }
124      if (window.ResizeObserver) {
125        new ResizeObserver(sync).observe(banner);
126      } else {
127        window.addEventListener('resize', sync);
128      }
129      sync();
130    })();
131  </script>
131
132
133  <div data-collapse="medium" data-animation="default" data-duration="400" data-easing="ease" data-easing2="ease" role="banner" class="navigation w-nav">
134    <div class="navigation-wrap">
135      <a href="index.html" aria-current="page" class="logo-link w-nav-brand w--current">
136        <div data-w-id="433410cd-f96f-d866-b0de-29c36f8f8669">
137          <div class="wrap-logo-icon _2"><img src="images/Logo-Arc-Big.svg" loading="lazy" alt="" class="logo-arc-big"><img src="images/Logo-Arc-Small.svg" loading="lazy" alt="" class="logo-arc-small"><img src="images/Logo-Circle.svg" loading="lazy" alt="" class="logo-circle"></div><img src="images/Logo-Text.svg" loading="lazy" alt="Logo Plati">
138        </div>
139      </a>
140      <div class="div-block-4">
141        <a href="/lite/" class="link-block lite-nav-link w-inline-block"><div class="link">LITE</div></a>
142        <a href="whatsapp-pricing/" class="link-block w-inline-block">
143          <div class="link">Pricing</div>
144        </a>
145        <a href="https://wa.me/5511936209757?text=Ol%C3%A1%21%20Quero%20ver%20use%20cases" target="_blank" class="link-block w-inline-block">
146          <div class="link">Use Cases</div>
147        </a>
148        <a href="https://api.whatsapp.com/send/?phone=5511936209757&text=quero%20trabalhar%20na%20plati&type=phone_number&app_absent=0" target="_blank" class="link-block trabalhe w-inline-block">
149          <div class="link">Trabalhe Conosco</div>
150        </a>
151        <a href="en.html" class="link-block en hide w-inline-block">
152          <div class="link">🇺🇸 EN</div>
153        </a>
154        <link rel="prefetch" href="/en">
155        <a href="https://wa.me/5511936209757?text=Ol%C3%A1%21%20Quero%20come%C3%A7ar%20agora" target="_blank" class="primary-button cc-contact-us w-inline-block">
156          <div class="text-block">Começar agora</div>
157        </a>
158      </div>
159    </div>
160  </div>
161  <div class="wrap-sections cc-store-home-wrap">
162    <div class="intro-header cyberpunk-hero" style="position: relative; overflow: hidden;">
163      <!-- FlickeringGrid Background -->
164      <canvas id="flickeringGrid" class="flickering-grid-canvas"></canvas>
165      
166      <div class="container">
167        <div class="intro-content cc-homepage">
168          <div class="intro-text">
169            <div class="wrap-32">
170              <div class="wrap-heading-hero">
171                <h1 class="heading-jumbo">IA conversacional feita para transformar as operações da sua empresa no WhatsApp</h1>
172                <div class="paragraph-bigger cc-bigger-white-light">Criamos assistentes de IA personalizados, que se integram perfeitamente a seus sistemas externos, transformando suas conversas no WhatsApp em operações completas que funcionam 24/7</div>
173                <a href="https://wa.me/5511936209757?text=Ol%C3%A1%21%20Quero%20ver%20uma%20demo" data-w-id="86e64837-0616-515b-4568-76c147234d27" target="_blank" class="primary-button w-inline-block">
174                  <div class="wrap-logo-icon"><img src="images/Logo-Circle.svg" loading="lazy" alt="" class="logo-circle"><img src="images/Logo-Arc-Small.svg" loading="lazy" style="-webkit-transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(-45deg) skew(0, 0);-moz-transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(-45deg) skew(0, 0);-ms-transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(-45deg) skew(0, 0);transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(-45deg) skew(0, 0)" alt="" class="logo-arc-small"><img src="images/Logo-Arc-Big.svg" loading="lazy" style="-webkit-transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(45deg) skew(0, 0);-moz-transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(45deg) skew(0, 0);-ms-transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(45deg) skew(0, 0);transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(45deg) skew(0, 0)" alt="" class="logo-arc-big"></div>
175                  <div class="text-block-2">Ver demonstração</div>
176                </a>
177              </div>
178            </div>
179          </div>
180          <div class="video">
181            <!-- Vídeo otimizado e simplificado -->
182            <video autoplay loop muted playsinline style="width: 100%; height: 100%; object-fit: cover; border-radius: 20px;">
183              <source src="https://plati-video-server.plati-ai.workers.dev/videos/Scene-720p.webm" type="video/webm">
184              <source src="https://plati-video-server.plati-ai.workers.dev/videos/Scene-720p.mp4" type="video/mp4">
185              <img src="https://plati-video-server.plati-ai.workers.dev/videos/Scene-poster-00001.jpg" alt="Video poster" style="width: 100%; height: 100%; object-fit: cover;">
186            </video>
187          </div>
188        </div>
189      </div>
190      <div class="bg">
191        <div data-w-id="4d9d27b8-72bf-b620-1c23-a807f0256b06" class="texture-1"></div>
192        <div data-w-id="698f5a77-00f5-f0c5-e771-6319539b2fdf" class="texture-2"></div>
193        <div data-w-id="98abc3cb-1656-c7c6-51a4-86676853ffc9" class="texture-3"></div>
194      </div>
195    </div>
196    
197    <!-- Barra Verde com Badges e Investidores -->
198    <div class="partners-investors-bar">
199      <div class="partners-investors-container">
200        <!-- Badges de Parceiros - Topo -->
201        <div class="partners-section">
202          <div class="partners-badges">
203            <div class="partner-card">
204              <img src="meta.png" loading="lazy" alt="Meta Tech Provider" class="partner-badge-green meta-logo">
205            </div>
206            <div class="partner-card">
207              <img src="cloud.png" loading="lazy" alt="Google Cloud" class="partner-badge-green google-logo">
208            </div>
209            <div class="partner-card whatsapp-card">
210              <img src="whatsapp.png" loading="lazy" alt="Meta AI Startup Hub" class="partner-badge-green whatsapp-logo">
211            </div>
212          </div>
213        </div>
214        
215        <!-- Separador horizontal -->
216        <div class="bar-divider-horizontal"></div>
217        
218        <!-- Investidores - Embaixo -->
219        <div class="investors-section">
220          <div class="investors-label">apoiado pelos principais investidores e fundadores latam</div>
221          <div class="investors-logos">
222            <img width="Auto" height="28" alt="Canary" src="images/Canary.png" loading="lazy" class="investor-logo">
223            <img loading="lazy" height="28" alt="Latitud" src="images/Latitud.png" class="investor-logo">
224            <img loading="lazy" height="28" alt="Koyamaki" src="images/Koyamaki.png" class="investor-logo">
225          </div>
226        </div>
227      </div>
228    </div>
229    
230    <div class="privacy-policy">
231      <div class="container">
232        <!-- 1. Título e Parágrafo -->
233        <div class="wrap-header center-align" style="margin-bottom: 40px; margin-top: 0;">
234          <h2 class="heading contained">Com a Plati AI, seu WhatsApp corporativo age, não apenas conversa</h2>
235          <p class="paragraph contained" style="margin-top: 12px;">Cuidamos da criação de assistentes de IA para sua empresa, conectando LLMs, APIs externas, bancos de dados e muito mais.</p>
236        </div>
237        
238        <!-- 2. Comparativo (Animação sequencial com fading neon de um bloco por vez) -->
239        <div class="beyond-faq-wrapper" style="margin-bottom: 80px; width: 100%;">
240          <div class="beyond-faq-container">
241            
242            <div class="beyond-faq-columns">
243              <!-- Coluna Esquerda: Chatbots Tradicionais -->
244              <div class="beyond-faq-column-left">
245                <h2 class="beyond-faq-title-left">Chatbots tradicionais</h2>
246                <p class="beyond-faq-text">Só respondem perguntas simples de FAQ. No máximo 15 a 20% das interações reais de atendimento e vendas.</p>
247                
248                <div class="beyond-faq-pills-left">
249                  <div class="beyond-faq-pill-traditional">Qual o horário de funcionamento?</div>
250                  <div class="beyond-faq-pill-traditional">Como cancelo minha assinatura?</div>
251                  <div class="beyond-faq-pill-traditional">Tem estacionamento?</div>
252                </div>
253                
254                <div class="beyond-faq-only-this">...e só isso.</div>
255              </div>
256              
257              <!-- Divisor Vertical -->
258              <div class="beyond-faq-divider"></div>
259              
260              <!-- Coluna Direita: Plati AI -->
261              <div class="beyond-faq-column-right">
262                <h2 class="beyond-faq-title-right">Plati AI</h2>
263                <p class="beyond-faq-text">Gerencia o ciclo completo: qualificação, agendamento, pagamento, KYC, suporte, retenção e upsell. Integrado às suas APIs.</p>
264                
265                <div class="beyond-faq-grid-right">
266                  <div class="beyond-faq-btn-plati" style="animation-delay: 0s;">Qualificar lead</div>
267                  <div class="beyond-faq-btn-plati" style="animation-delay: -8s;">Agendar reunião</div>
268                  <div class="beyond-faq-btn-plati" style="animation-delay: -7s;">Processar pagamento</div>
269                  
270                  <div class="beyond-faq-btn-plati" style="animation-delay: -6s;">Suporte pós-venda</div>
271                  <div class="beyond-faq-btn-plati" style="animation-delay: -5s;">Rastrear pedido</div>
272                  <div class="beyond-faq-btn-plati" style="animation-delay: -4s;">KYC automático</div>
273                  
274                  <div class="beyond-faq-btn-plati" style="animation-delay: -3s;">Onboarding guiado</div>
275                  <div class="beyond-faq-btn-plati" style="animation-delay: -2s;">Reter cliente</div>
276                  <div class="beyond-faq-btn-plati" style="animation-delay: -1s;">Cobrar boleto</div>
277                </div>
278              </div>
279            </div>
280          </div>
281        </div>
282
283        <style>
284          .privacy-policy {
285            background-color: #f5f3eb !important;
286            padding-top: 60px;
287            padding-bottom: 80px;
288          }
289          .beyond-faq-wrapper {
290            width: 100%;
291            margin-top: 20px;
292          }
293          .beyond-faq-container {
294            width: 100%;
295            max-width: 1100px;
296            margin: 0 auto;
297          }
298          .beyond-faq-label {
299            font-size: 15px;
300            font-weight: 500;
301            color: #1a1a1a;
302            margin-bottom: 48px;
303            display: flex;
304            align-items: center;
305          }
306          .beyond-faq-columns {
307            display: flex;
308            gap: 60px;
309            background-color: #ffffff;
310            border-radius: 24px;
311            padding: 56px 48px;
312            border: 1px solid rgba(26, 27, 31, 0.05);
313            box-shadow: 0 12px 40px rgba(0, 0, 0, 0.02), 0 2px 12px rgba(0, 0, 0, 0.01);
314          }
315          .beyond-faq-column-left {
316            flex: 1;
317            display: flex;
318            flex-direction: column;
319          }
320          .beyond-faq-divider {
321            width: 1px;
322            background-color: rgba(26, 27, 31, 0.1);
323            align-self: stretch;
324          }
325          .beyond-faq-column-right {
326            flex: 1.5;
327            display: flex;
328            flex-direction: column;
329          }
330          .beyond-faq-title-left {
331            font-size: 44px;
332            font-weight: 400;
333            color: #b0aaa0;
334            margin: 0 0 16px 0;
335            letter-spacing: -0.02em;
336            line-height: 1.1;
337          }
338          .beyond-faq-title-right {
339            font-size: 44px;
340            font-weight: 600;
341            color: #1a1a1a;
342            margin: 0 0 16px 0;
343            letter-spacing: -0.02em;
344            line-height: 1.1;
345          }
346          .beyond-faq-text {
347            font-size: 17px;
348            line-height: 1.5;
349            color: #5a5550;
350            margin: 0 0 40px 0;
351            max-width: 520px;
352          }
353          .beyond-faq-pills-left {
354            display: flex;
355            flex-direction: column;
356            gap: 12px;
357            align-items: flex-start;
358            margin-bottom: 24px;
359          }
360          .beyond-faq-pill-traditional {
361            background-color: #eae6db;
362            color: #5a5550;
363            padding: 12px 22px;
364            border-radius: 50px;
365            font-size: 14px;
366            font-weight: 500;
367          }
368          .beyond-faq-only-this {
369            font-size: 14px;
370            font-style: italic;
371            color: #b0aaa0;
372            margin-top: 8px;
373          }
374          .beyond-faq-grid-right {
375            display: grid;
376            grid-template-columns: repeat(3, 1fr);
377            gap: 12px;
378          }
379          .beyond-faq-btn-plati {
380            display: flex;
381            align-items: center;
382            justify-content: center;
383            text-align: center;
384            padding: 14px 12px;
385            border-radius: 8px;
386            font-size: 14px;
387            transition: all 0.3s ease;
388            box-sizing: border-box;
389            min-height: 48px;
390            background-color: #eae6db;
391            color: #5a5550;
392            font-weight: 500;
393            border: 1px solid rgba(0, 0, 0, 0.04);
394            animation: pill-highlight 9s infinite ease-in-out;
395          }
396          
397          @keyframes pill-highlight {
398            0% {
399              background-color: #eae6db;
400              color: #5a5550;
401              font-weight: 500;
402              box-shadow: none;
403              border: 1px solid rgba(0, 0, 0, 0.04);
404            }
405            2%, 9.11% {
406              background-color: #ccff00;
407              color: #000000;
408              font-weight: 600;
409              box-shadow: 0 4px 12px rgba(204, 255, 0, 0.15);
410              border-color: transparent;
411            }
412            11.11%, 100% {
413              background-color: #eae6db;
414              color: #5a5550;
415              font-weight: 500;
416              box-shadow: none;
417              border: 1px solid rgba(0, 0, 0, 0.04);
418            }
419          }
420          
421          /* Responsividade */
422          @media (max-width: 991px) {
423            .beyond-faq-columns {
424              flex-direction: column;
425              gap: 48px;
426              padding: 40px 24px;
427            }
428            .beyond-faq-divider {
429              width: 100%;
430              height: 1px;
431              align-self: auto;
432            }
433            .beyond-faq-grid-right {
434              grid-template-columns: repeat(2, 1fr);
435            }
436          }
437          @media (max-width: 479px) {
438            .beyond-faq-grid-right {
439              grid-template-columns: 1fr;
440            }
441            .beyond-faq-title-left, .beyond-faq-title-right {
442              font-size: 36px;
443            }
444          }
445        </style>
446
447        <!-- 3. Vídeo de demonstração com os textos de features ao lado -->
448        <div class="w-layout-grid features-grid">
449          <div id="w-node-b4e20d19-524e-258d-6fa7-833f64178354-f13e6ec6" class="wrap-image-feature">
450            <div data-poster-url="https://plati-video-server.plati-ai.workers.dev/videos/Doctor-poster-00001.jpg" data-video-urls="https://plati-video-server.plati-ai.workers.dev/videos/Doctor-transcode.mp4,https://plati-video-server.plati-ai.workers.dev/videos/Doctor-transcode.webm" data-autoplay="true" data-loop="true" class="background-video w-background-video w-background-video-atom"><video id="3a54c264-7df7-b25b-3f75-fd6492694fd6-video" autoplay="" loop="" style="background-image:url(&quot;https://plati-video-server.plati-ai.workers.dev/videos/Doctor-poster-00001.jpg&quot;)" muted="" playsinline="" data-object-fit="cover">
451                <source src="https://plati-video-server.plati-ai.workers.dev/videos/Doctor-transcode.mp4">
452                <source src="https://plati-video-server.plati-ai.workers.dev/videos/Doctor-transcode.webm">
453              </video></div>
454          </div>
455          <div id="w-node-_02ce462e-5de5-4099-ddc4-39cf034dced4-f13e6ec6" class="div-block">
456            <div id="w-node-_6bdbcbc5-924c-46a1-d031-09a55e598673-f13e6ec6" class="feature">
457              <div class="heading-title">
458                <div class="wrap-icon"><img src="images/lightbulb-fill.svg" loading="lazy" alt=""></div>
459                <h3 class="heading-2">Reasoning Avançado</h3>
460              </div>
461              <p class="paragraph-light">A AI interpreta intenções do cliente, toma decisões e executa ações em tempo real (como agendamentos, consultas, vendas).</p>
462            </div>
463            <div class="feature">
464              <div class="heading-title">
465                <div class="wrap-icon"><img src="images/plug-fill.svg" loading="lazy" alt=""></div>
466                <h3 class="heading-2">Integração Simples com APIs Externas e MCPs</h3>
467              </div>
468              <p class="paragraph-light">Conecte sua AI a qualquer API (pagamentos, CRMs, ERPs, suporte, etc.) com facilidade. Use o MCP (Model Context Protocol) para o contexto do agente de forma inteligente, ampliando o poder de automação e integração da AI.</p>
469            </div>
470            <div class="feature">
471              <div class="heading-title">
472                <div class="wrap-icon"><img src="images/globe-fill.svg" loading="lazy" alt=""></div>
473                <h3 class="heading-2">WhatsApp Business API Nativa</h3>
474              </div>
475              <p class="paragraph-light">Automatize processos, atendimento e operações diretamente no WhatsApp. Integração nativa com WhatsApp Business API para escalar conversas sem limites.</p>
476            </div>
477          </div>
478        </div>
479
480        <!-- Botão Começar agora (no final da seção unificada) -->
481        <div style="display: flex; justify-content: center; margin-top: 60px;">
482          <a href="https://wa.me/5511936209757?text=Ol%C3%A1%21%20Quero%20come%C3%A7ar
482%20agora" data-w-id="2d3892a9-4332-a742-4bec-491184efde0b" target="_blank" class="primary-button w-inline-block">
483            <div class="wrap-logo-icon"><img src="images/Logo-Arc-Big.svg" loading="lazy" style="-webkit-transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(45deg) skew(0, 0);-moz-transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(45deg) skew(0, 0);-ms-transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(45deg) skew(0, 0);transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(45deg) skew(0, 0)" alt="" class="logo-arc-big"><img src="images/Logo-Arc-Small.svg" loading="lazy" style="-webkit-transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(-45deg) skew(0, 0);-moz-transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(-45deg) skew(0, 0);-ms-transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(-45deg) skew(0, 0);transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(-45deg) skew(0, 0)" alt="" class="logo-arc-small"><img src="images/Logo-Circle.svg" loading="lazy" alt="" class="logo-circle"></div>
484            <div class="text-block-2">Comece agora</div>
485          </a>
486        </div>
487      </div>
488    </div>
489    <div id="Implementacao" class="section-3">
490      <div class="container">
491        <div class="wrap-header center">
492          <h2 class="heading center">Implementação 10x Mais Rápida</h2>
493          <p class="paragraph">Conecte qualquer modelo de AI (OpenAI, Anthropic, Mistral, etc.), gerencie APIs externas e automatize processos internos sem fricção. Crie soluções personalizadas para sua empresa em horas de forma segura e escalável.</p>
494          <a href="https://wa.me/5511936209757?text=Ol%C3%A1%21%20Quero%20come%C3%A7ar%20agora" data-w-id="5cb56f26-0ade-53c4-61e5-5832efb598da" target="_blank" class="primary-button w-inline-block">
495            <div class="wrap-logo-icon"><img src="images/Logo-Arc-Big.svg" loading="lazy" style="-webkit-transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0deg) skew(0, 0);-moz-transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0deg) skew(0, 0);-ms-transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0deg) skew(0, 0);transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0deg) skew(0, 0)" alt="" class="logo-arc-big"><img src="images/Logo-Arc-Small.svg" loading="lazy" style="-webkit-transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0deg) skew(0, 0);-moz-transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0deg) skew(0, 0);-ms-transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0deg) skew(0, 0);transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0deg) skew(0, 0)" alt="" class="logo-arc-small"><img src="images/Logo-Circle.svg" loading="lazy" alt="" class="logo-circle"></div>
496            <div class="text-block-2">Comece agora</div>
497          </a>
498        </div>
499        <div class="w-layout-grid features-grid">
500          <div id="w-node-f22051ed-4ac1-5e80-77c4-8d1add48c8a3-f13e6ec6" class="wrap-image-feature">
501            <div data-poster-url="https://plati-video-server.plati-ai.workers.dev/videos/Gift-poster-00001.jpg" data-video-urls="https://plati-video-server.plati-ai.workers.dev/videos/Gift-transcode.mp4,https://plati-video-server.plati-ai.workers.dev/videos/Gift-transcode.webm" data-autoplay="true" data-loop="true" class="background-video w-background-video w-background-video-atom"><video id="f22051ed-4ac1-5e80-77c4-8d1add48c8a4-video" autoplay="" loop="" style="background-image:url(&quot;https://plati-video-server.plati-ai.workers.dev/videos/Gift-poster-00001.jpg&quot;)" muted="" playsinline="" data-object-fit="cover">
502                <source src="https://plati-video-server.plati-ai.workers.dev/videos/Gift-transcode.mp4">
503                <source src="https://plati-video-server.plati-ai.workers.dev/videos/Gift-transcode.webm">
504              </video></div>
505          </div>
506          <div id="w-node-_6ff86bdf-2064-10ca-2ed7-fb45b7dab67a-f13e6ec6" class="div-block">
507            <div id="w-node-_6ff86bdf-2064-10ca-2ed7-fb45b7dab67b-f13e6ec6" class="feature">
508              <div class="heading-title">
509                <div class="wrap-icon"><img src="images/sliders3-fill.svg" loading="lazy" alt=""></div>
510                <h3 class="heading-2">Orquestração Multi-LLM</h3>
511              </div>
512              <p class="paragraph-light">Escolha os melhores modelos para sua necessidade (OpenAI, Anthropic, Mistral, etc.) e combine múltiplas IAs para um resultado mais preciso.</p>
513            </div>
514            <div class="feature">
515              <div class="heading-title">
516                <div class="wrap-icon"><img src="images/bookmark-fill.svg" loading="lazy" alt=""></div>
517                <h3 class="heading-2">Memória Inteligente</h3>
518              </div>
519              <p class="paragraph-light">Nosso sistema de memória permite que a AI lembre informações relevantes ao longo do tempo, criando interações mais naturais, contínuas e personalizadas.</p>
520            </div>
521            <div class="feature">
522              <div class="heading-title">
523                <div class="wrap-icon"><img src="images/people-fill.svg" loading="lazy" alt=""></div>
524                <h3 class="heading-2">Gestão Avançada de Usuários e Acessos</h3>
525              </div>
526              <p class="paragraph-light">Sistema robusto de gestão de usuários e controle de permissões, garantindo segurança, rastreabilidade e compliance.</p>
527            </div>
528          </div>
529        </div>
530      </div>
531    </div>
532    
533    <!-- Seção de Comparação -->
534    <div class="comparison-section" style="background-color: #f5f3eb !important; padding: 100px 24px;">
535      <div class="container" style="max-width: 1100px; margin: 0 auto;">
536        
537        <div class="comparison-header-new" style="margin-bottom: 60px; width: 100%;">
538          <h2 class="comparison-title-new">Stack completa de WhatsApp,<br>deploy em dias</h2>
539        </div>
540        
541        <div class="minimal-comparison-table">
542          <!-- Header Row -->
543          <div class="minimal-table-row header-row">
544            <div class="minimal-cell empty-header"></div>
545            <div class="minimal-cell plati-header-cell">
546              <span class="plati-header-title">Plati AI</span>
547            </div>
548            <div class="minimal-cell text-header">Plataformas tradicionais</div>
549            <div class="minimal-cell text-header">Desenvolvimento in-house</div>
550          </div>
551          
552          <!-- Row 1: Equipe necessária -->
553          <div class="minimal-table-row">
554            <div class="minimal-cell feature-label">Equipe necessária</div>
555            <div class="minimal-cell plati-value-cell">Zero. Solução chave na mão</div>
556            <div class="minimal-cell other-value">1 pessoa dedicada (sem suporte)</div>
557            <div class="minimal-cell other-value">5 a 8 pessoas</div>
558          </div>
559          
560          <!-- Row 2: Time to market -->
561          <div class="minimal-table-row">
562            <div class="minimal-cell feature-label">Time to market</div>
563            <div class="minimal-cell plati-value-cell">~2 dias</div>
564            <div class="minimal-cell other-value">1-3 meses</div>
565            <div class="minimal-cell other-value">4-12 meses</div>
566          </div>
567          
568          <!-- Row 3: Manutenção -->
569          <div class="minimal-table-row">
570            <div class="minimal-cell feature-label">Manutenção</div>
571            <div class="minimal-cell plati-value-cell">Automática e gerenciada</div>
572            <div class="minimal-cell other-value">Limitada e frágil</div>
573            <div class="minimal-cell other-value">Time dedicado contínuo</div>
574          </div>
575          
576          <!-- Row 4: Velocidade de retorno -->
577          <div class="minimal-table-row">
578            <div class="minimal-cell feature-label">Velocidade de retorno</div>
579            <div class="minimal-cell plati-value-cell">ROI desde o dia 1</div>
580            <div class="minimal-cell other-value">Cresce com a complexidade</div>
581            <div class="minimal-cell other-value">Custo 10x maior</div>
582          </div>
583          
584          <!-- Row 5: Escalabilidade -->
585          <div class="minimal-table-row">
586            <div class="minimal-cell feature-label">Escalabilidade</div>
587            <div class="minimal-cell plati-value-cell last-plati-cell">Ilimitada e gerenciada</div>
588            <div class="minimal-cell other-value">Limitada pela plataforma</div>
589            <div class="minimal-cell other-value">Depende do seu time</div>
590          </div>
591        </div>
592        
593        <div class="comparison-cta" style="margin-top: 60px; text-align: center;">
594          <p class="comparison-conclusion" style="font-size: 18px; color: #5a5550; font-family: 'Plus Jakarta Sans', sans-serif; margin-bottom: 24px;">Foque 100% no seu negócio enquanto Plati cuida do seu WhatsApp</p>
595          <a href="https://wa.me/5511936209757?text=Ol%C3%A1%21%20Quero%20ver%20uma%20demo" data-w-id="comp-cta-button" target="_blank" class="primary-button w-inline-block">
596            <div class="wrap-logo-icon"><img src="images/Logo-Circle.svg" loading="lazy" alt="" class="logo-circle"><img src="images/Logo-Arc-Small.svg" loading="lazy" style="-webkit-transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(-45deg) skew(0, 0);-moz-transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(-45deg) skew(0, 0);-ms-transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(-45deg) skew(0, 0);transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(-45deg) skew(0, 0)" alt="" class="logo-arc-small"><img src="images/Logo-Arc-Big.svg" loading="lazy" style="-webkit-transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(45deg) skew(0, 0);-moz-transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(45deg) skew(0, 0);-ms-transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(45deg) skew(0, 0);transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(45deg) skew(0, 0)" alt="" class="logo-arc-big"></div>
597            <div class="text-block-2">Ver demonstração</div>
598          </a>
599        </div>
600      </div>
601    </div>
602
603    <style>
604      .comparison-title-new {
605        font-family: 'Plus Jakarta Sans', 'Montserrat', sans-serif;
606        font-size: 56px;
607        font-weight: 500;
608        line-height: 1.1;
609        letter-spacing: -0.02em;
610        color: #1a1a1a;
611        margin: 0;
612        text-align: left;
613      }
614      .minimal-comparison-table {
615        display: grid;
616        grid-template-columns: 1fr 1fr 1fr 1fr;
617        width: 100%;
618        max-width: 1100px;
619        margin: 0 auto;
620        font-family: 'Plus Jakarta Sans', sans-serif;
621      }
622      .minimal-table-row {
623        display: contents;
624      }
625      .minimal-cell {
626        padding: 24px 20px;
627        font-size: 15px;
628        border-bottom: 1px solid rgba(26, 27, 31, 0.08);
629        display: flex;
630        align-items: center;
631        box-sizing: border-box;
632      }
633      .minimal-table-row.header-row .minimal-cell {
634        border-bottom: none;
635        padding-bottom: 16px;
636      }
637      .minimal-cell.empty-header {
638        border-bottom: none;
639      }
640      .minimal-cell.text-header {
641        font-weight: 600;
642        color: #1a1a1a;
643        font-size: 16px;
644        justify-content: flex-start;
645      }
646      .minimal-cell.feature-label {
647        font-weight: 600;
648        color: #1a1a1a;
649        justify-content: flex-start;
650        padding-left: 0;
651      }
652      
653      /* Plati AI Column Styling */
654      .minimal-cell.plati-header-cell {
655        background-color: #131111;
656        color: #ccff00;
657        border-top-left-radius: 12px;
658        border-top-right-radius: 12px;
659        justify-content: center;
660        padding: 16px 20px;
661      }
662      .plati-header-title {
663        font-weight: 700;
664        font-size: 16px;
665        letter-spacing: 0.02em;
666      }
667      .minimal-cell.plati-value-cell {
668        background-color: #f1faf2;
669        color: #1b7a3a;
670        font-weight: 600;
671        justify-content: center;
672        text-align: center;
673        border-bottom: none;
674      }
675      .minimal-cell.last-plati-cell {
676        border-bottom-left-radius: 12px;
677        border-bottom-right-radius: 12px;
678      }
679      .minimal-cell.other-value {
680        color: #5a5550;
681        font-weight: 400;
682        justify-content: flex-start;
683      }
684      
685      /* Responsividade */
686      @media (max-width: 991px) {
687        .minimal-comparison-table {
688          grid-template-columns: 1.2fr 1.5fr 1fr 1fr;
689        }
690        .comparison-title-new {
691          font-size: 42px;
692        }
693        .minimal-cell {
694          padding: 18px 12px;
695          font-size: 14px;
696        }
697      }
698      @media (max-width: 767px) {
699        .minimal-comparison-table {
700          display: block;
701          overflow-x: auto;
702          white-space: nowrap;
703        }
704        .minimal-table-row {
705          display: flex;
706          width: max-content;
707          min-width: 100%;
708        }
709        .minimal-cell {
710          width: 180px;
711          flex-shrink: 0;
712          white-space: normal;
713        }
714        .minimal-cell.feature-label {
715          width: 150px;
716        }
717        .minimal-cell.plati-header-cell, .minimal-cell.plati-value-cell {
718          width: 190px;
719        }
720      }
721    </style>
722        
723      </div>
724    </div>
725    
726    <div id="Security" class="section-security">
727      <div class="container">
728        <div class="wrap-header center">
729          <h2 class="heading center bright">Segurança de AI Nativa</h2>
730          <p class="paragraph bright">Proteja-se contra prompt attacks e outros riscos com nossa camada de segurança nativa.</p>
731          <a href="https://wa.me/5511936209757?text=Ol%C3%A1%21%20Quero%20come%C3%A7ar
731%20agora" data-w-id="e6a69ec2-e6d2-8b21-e459-87acf5779234" target="_blank" class="primary-button w-inline-block">
732            <div class="wrap-logo-icon"><img src="images/Logo-Arc-Big.svg" loading="lazy" style="-webkit-transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(45deg) skew(0, 0);-moz-transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(45deg) skew(0, 0);-ms-transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(45deg) skew(0, 0);transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(45deg) skew(0, 0)" alt="" class="logo-arc-big"><img src="images/Logo-Arc-Small.svg" loading="lazy" style="-webkit-transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(-45deg) skew(0, 0);-moz-transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(-45deg) skew(0, 0);-ms-transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(-45deg) skew(0, 0);transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(-45deg) skew(0, 0)" alt="" class="logo-arc-small"><img src="images/Logo-Circle.svg" loading="lazy" alt="" class="logo-circle"></div>
733            <div class="text-block-2">Comece agora</div>
734          </a>
735        </div>
736        <div class="w-layout-grid features-grid">
737          <div id="w-node-_14bfc006-1a82-d70d-47f3-00946461e470-f13e6ec6" class="wrap-image-feature"><img src="images/Code.webp" sizes="(max-width: 1190px) 100vw, 1190px" srcset="images/Code-p-500.webp 500w, images/Code-p-800.webp 800w, images/Code-p-1080.webp 1080w, images/Code.webp 1190w" alt="" class="image-code"><img src="images/Code.webp" sizes="(max-width: 1190px) 100vw, 1190px" srcset="images/Code-p-500.webp 500w, images/Code-p-800.webp 800w, images/Code-p-1080.webp 1080w, images/Code.webp 1190w" alt="" class="image-en hide"></div>
738          <div id="w-node-_14bfc006-1a82-d70d-47f3-00946461e472-f13e6ec6" class="div-block">
739            <div id="w-node-_14bfc006-1a82-d70d-47f3-00946461e473-f13e6ec6" class="feature">
740              <div class="heading-title">
741                <div class="wrap-icon"><img src="images/shield-fill.svg" loading="lazy" alt=""></div>
742                <h3 class="heading-2 bright">Firewall Contra Prompt Attacks</h3>
743              </div>
744              <p class="paragraph-light bright">Plati AI oferece uma camada de segurança nativa, protegendo sua AI de ataques e vazamento de dados sensíveis.</p>
745            </div>
746            <div class="feature">
747              <div class="heading-title">
748                <div class="wrap-icon"><img src="images/clipboard-fill.svg" loading="lazy" alt=""></div>
749                <h3 class="heading-2 bright">KYC &amp; Onboarding Automático via AI</h3>
750              </div>
751              <p class="paragraph-light bright">Automatize processos de conheça seu cliente (KYC) e onboarding com AI segura e compatível com normas regulatórias.</p>
752            </div>
753            <div class="feature">
754              <div class="heading-title">
755                <div class="wrap-icon"><img src="images/code-slash.svg" loading="lazy" alt=""></div>
756                <h4 class="heading-2 bright">Comprometido com padrões de segurança internacionais</h4>
757              </div>
758              <div class="wrap-logos"><img src="images/GDPR.png" loading="lazy" alt="GDPR" class="image-5"><img src="images/ISO-27018-Certification-Emblem.png" loading="lazy" alt="ISO-27018-Certification-Emblem" class="image-5"><img src="images/ISO-27017-2015.png" loading="lazy" alt="ISO-27017-2015" class="image-5"><img src="images/SOC-2-Type-2.png" loading="lazy" alt="SOC-2-Type-2" class="image-5"><img src="images/ISO-27017-2015.png" loading="lazy" alt="ISO-27017-2015" class="image-5"><img src="images/pci-dss-compliance-post-icon.png" loading="lazy" alt="pci-dss-compliance-post-icon" class="image-5"></div>
759            </div>
760          </div>
761        </div>
762      </div>
763    </div>
764    <div id="faq" class="faq" style="padding-top: 100px; padding-bottom: 100px;">
765      <div class="divider"></div>
766      <div class="container" style="max-width: 900px; margin: 0 auto; width: 100%;">
767        <div class="wrap-header center" style="margin-bottom: 48px;">
768          <h2 class="heading center bright">Tem perguntas?</h2>
769          <p class="paragraph bright">Fale com a nossa AI para tirar as dúvidas ou peça para ela agendar uma demonstração para sua empresa</p>
770          <a href="https://wa.me/5511936209757?text=Ol%C3%A1%2C%20gostaria%20de%20marcar%20uma%20reuni%C3%A3o" data-w-id="c93d814d-c3e1-5ff7-3229-d10aa3de4486" target="_blank" class="primary-button w-inline-block">
771            <div class="wrap-logo-icon"><img src="images/Logo-Arc-Big.svg" loading="lazy" style="-webkit-transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0deg) skew(0, 0);-moz-transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0deg) skew(0, 0);-ms-transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0deg) skew(0, 0);transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0deg) skew(0, 0)" alt="" class="logo-arc-big"><img src="images/Logo-Arc-Small.svg" loading="lazy" style="-webkit-transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0deg) skew(0, 0);-moz-transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0deg) skew(0, 0);-ms-transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0deg) skew(0, 0);transform:translate3d(0, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0deg) skew(0, 0)" alt="" class="logo-arc-small"><img src="images/Logo-Circle.svg" loading="lazy" alt="" class="logo-circle"></div>
772            <div class="text-block-2">Fale conosco</div>
773          </a>
774        </div>
775        
776        <!-- Accordion FAQ List -->
777        <div class="custom-faq-list">
778          <!-- FAQ 1 -->
779          <details class="custom-faq-item">
780            <summary class="custom-faq-question">Como a Plati AI se diferencia de um chatbot tradicional?</summary>
781            <div class="custom-faq-answer">
782              Os chatbots tradicionais apenas respondem FAQs simples de forma engessada. A Plati AI utiliza inteligência artificial conversacional avançada para ir muito além: ela interpreta intenções de forma fluida, toma decisões lógicas em tempo real e executa ações complexas integradas a seus sistemas (como agendamentos, pagamentos, KYC e muito mais).
783            </div>
784          </details>
785          
786          <!-- FAQ 2 -->
787          <details class="custom-faq-item">
788            <summary class="custom-faq-question">Quais sistemas e APIs posso conectar com a Plati AI?</summary>
789            <div class="custom-faq-answer">
790              Suportamos integração nativa com praticamente qualquer sistema externo através de APIs REST. Conectamos seu assistente a CRMs (HubSpot, Salesforce), ERPs, gateways de pagamento, plataformas de agendamento (Calendly), helpdesks de atendimento e bancos de dados de forma totalmente segura.
791            </div>
792          </details>
793          
794          <!-- FAQ 3 -->
795          <details class="custom-faq-item">
796            <summary class="custom-faq-question">Quanto tempo demora para colocar um assistente personalizado no ar?</summary>
797            <div class="custom-faq-answer">
798              Nossa infraestrutura ágil permite que os assistentes de IA personalizados entrem em produção em tempo recorde. Em média, um assistente completo e integrado aos seus sistemas já está operando e automatizando seus processos no WhatsApp em cerca de 2 dias úteis.
799            </div>
800          </details>
801          
802          <!-- FAQ 4 -->
803          <details class="custom-faq-item">
804            <summary class="custom-faq-question">Como funciona a segurança dos dados e o compliance com leis de privacidade?</summary>
805            <div class="custom-faq-answer">
806              A segurança é nossa maior prioridade. Nossos assistentes possuem firewall ativo contra prompt attacks, controle de acessos robusto e encriptação ponta a ponta. Além disso, a plataforma está totalmente alinhada com as exigências da LGPD e da GDPR para garantir total compliance em suas operações.
807            </div>
808          </details>
809          
810          <!-- FAQ 5 -->
811          <details class="custom-faq-item">
812            <summary class="custom-faq-question">O suporte, orquestração e a manutenção contínua estão inclusos?</summary>
813            <div class="custom-faq-answer">
814              Sim! Nós gerenciamos todo o ciclo de vida da inteligência artificial da sua empresa. Cuidamos das integrações, monitoramos a performance, refinamos as respostas e atualizamos automaticamente os modelos de linguagem. Sua equipe foca em expandir o negócio enquanto nós orquestramos sua operação conversacional 24/7.
815            </div>
816          </details>
817        </div>
818      </div>
819    </div>
820    
821    <style>
822      .custom-faq-list {
823        display: flex;
824        flex-direction: column;
825        gap: 16px;
826        width: 100%;
827        margin-top: 60px;
828        text-align: left;
829      }
830      .custom-faq-item {
831        background-color: rgba(255, 255, 255, 0.03);
832        border: 1px solid rgba(255, 255, 255, 0.08);
833        border-radius: 12px;
834        overflow: hidden;
835        transition: all 0.3s ease;
836      }
837      .custom-faq-item[open] {
838        background-color: rgba(255, 255, 255, 0.06);
839        border-color: rgba(204, 255, 0, 0.3);
840      }
841      .custom-faq-question {
842        padding: 20px 24px;
843        font-size: 16px;
844        font-weight: 600;
845        color: #ffffff;
846        cursor: pointer;
847        list-style: none;
848        display: flex;
849        justify-content: space-between;
850        align-items: center;
851        outline: none;
852        user-select: none;
853      }
854      .custom-faq-question::-webkit-details-marker {
855        display: none;
856      }
857      .custom-faq-question::after {
858        content: '+';
859        font-size: 20px;
860        font-weight: 400;
861        color: #ccff00;
862        transition: transform 0.3s ease;
863      }
864      .custom-faq-item[open] .custom-faq-question::after {
865        content: '−';
866        transform: rotate(180deg);
867      }
868      .custom-faq-answer {
869        padding: 0 24px 24px 24px;
870        font-size: 15px;
871        line-height: 1.6;
872        color: #b0aaa0;
873      }
874    </style>
875    <section class="footer-dark">
876      <div class="container-2">
877        <div class="footer-modern">
878          <div class="footer-brand-section">
879            <a href="index.html" class="footer-brand w-inline-block"><img src="images/Logo-Plati.svg" loading="lazy" alt="Logo Plati"></a>
880          </div>
881          <div class="footer-links-section">
882            <div class="footer-nav-block">
883              <div class="footer-nav-title">Navegação</div>
884              <a href="index.html" class="footer-nav-link">Home</a>
885              <a href="#Implementacao" class="footer-nav-link">Implementação</a>
886              <a href="#Security" class="footer-nav-link">Segurança</a>
887              <a href="#faq" class="footer-nav-link">FAQ</a>
888              <a href="https://docs.plati.ai/" target="_blank" class="footer-nav-link">Documentação</a>
889            </div>
890            <div class="footer-legal-block">
891              <div class="footer-nav-title">Legal</div>
892              <a href="termos-de-uso.html" class="footer-nav-link">Termos de Uso</a>
893              <a href="politica-de-privacidade.html" class="footer-nav-link pt-copy">Política de Privacidade</a>
894              <a href="privacy-policy.html" class="footer-nav-link en-copy">Privacy Policy</a>
895            </div>
896          </div>
897          <div class="footer-contact-section">
898            <div class="footer-nav-title">Contato</div>
899            <div class="footer-contact-info">
900              <div class="footer-contact-item">
901                <a href="https://wa.me/5511936209757?text=Ol%C3%A1%2C%20gostaria%20de%20marcar%20uma%20reuni%C3%A3o" target="_blank" class="footer-contact-link">Fale conosco</a>
902              </div>
903              <div class="footer-contact-item">
904                <a href="https://api.whatsapp.com/send/?phone=5511936209757&text=quero%20trabalhar%20na%20plati&type=phone_number&app_absent=0" target="_blank" class="footer-contact-link">Trabalhe Conosco</a>
905              </div>
906            </div>
907            <div class="footer-nav-title" style="margin-top: 16px;">Siga-nos</div>
908            <div class="footer-socials" style="display: flex; gap: 12px; margin-top: 8px;">
909              <a href="https://www.linkedin.com/company/platiai" target="_blank" rel="noopener noreferrer" aria-label="LinkedIn" class="footer-social-link" style="display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 8px; background: rgba(19,17,35,0.14); border: 1px solid rgba(19,17,35,0.28); color: #131123; transition: background 0.2s, border-color 0.2s, color 0.2s;">
910                <svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433c-1.144 0-2.063-.926-2.063-2.065 0-1.138.92-2.063 2.063-2.063 1.14 0 2.064.925 2.064 2.063 0 1.139-.925 2.065-2.064 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z"/></svg>
911              </a>
912              <a href="https://api.whatsapp.com/send/?phone=5511936209757" target="_blank" rel="noopener noreferrer" aria-label="WhatsApp" class="footer-social-link" style="display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 8px; background: rgba(19,17,35,0.14); border: 1px solid rgba(19,17,35,0.28); color: #131123; transition: background 0.2s, border-color 0.2s, color 0.2s;">
913                <svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.
913198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 00-3.48-8.413z"/></svg>
914              </a>
915            </div>
916          </div>
917        </div>
918        <div class="footer-bottom">
919          <div class="footer-copyright">© Plati AI 2026</div>
920        </div>
921      </div>
922    </section>
923  </div>
924  
924<script src="https://d3e54v103j8qbb.cloudfront.net/js/jquery-3.5.1.min.dc5e7f18c8.js?site=67d9a09217a2fcdbf13e6e84" type="text/javascript" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
924
925  
925<script src="js/site.js" type="text/javascript"></script>
925
926  
927  <!-- FlickeringGrid Script -->
928  
928<script src="js/flickering-grid.js" type="text/javascript"></script>
928
929  
930  <style>
931    /* Background cinza claro para hero */
932    .intro-header.cyberpunk-hero {
933      background-color: #F0F0F0 !important;
934      background: #F0F0F0 !important;
935      color: #1a1a1a !important;
936    }
937    
938    /* Ajusta cores do texto para funcionar em fundo branco */
939    .intro-header.cyberpunk-hero .heading-jumbo {
940      color: #1a1a1a !important;
941    }
942    
943    .intro-header.cyberpunk-hero .paragraph-bigger {
944      color: #525151 !important;
945    }
946    
947    .intro-header.cyberpunk-hero .paragraph-bigger.cc-bigger-white-light {
948      color: #525151 !important;
949      text-shadow: none !important;
950    }
951    
952    .intro-header.cyberpunk-hero .paragraph-bigger {
953      text-shadow: none !important;
954    }
955    
956    /* Background cinza claro também para o .bg dentro da hero */
957    .intro-header.cyberpunk-hero .bg {
958      background-color: #F0F0F0 !important;
959      background: #F0F0F0 !important;
960    }
961    
962    /* Remove shadow do logo Meta */
963    .intro-header.cyberpunk-hero .meta-partner-logo {
964      filter: none !important;
965    }
966    
967    .intro-header.cyberpunk-hero .meta-partner-logo img {
968      filter: none !important;
969    }
970    
971    /* FlickeringGrid Canvas Styles */
972    .flickering-grid-canvas {
973      position: absolute;
974      top: 0;
975      left: 0;
976      width: 100%;
977      height: 100%;
978      z-index: 0;
979      pointer-events: none;
980    }
981    
982    /* Hover effect for navbar links */
983    .link-block:hover {
984      opacity: 0.6;
985      transition: opacity 0.2s ease;
986    }
987    .footer-social-link:hover {
988      background: rgba(19,17,35,0.24) !important;
989      border-color: rgba(19,17,35,0.36) !important;
990      color: #000 !important;
991    }
992  </style>
993  
994  
994<script>
995    // Inicializa FlickeringGrid quando a página carregar
996    window.addEventListener('load', function() {
997      if (typeof FlickeringGrid !== 'undefined') {
998        new FlickeringGrid('flickeringGrid', {
999          squareSize: 5, // 20% menor (era 6)
1000          gridGap: 6, // Reduzido proporcionalmente
1001          flickerChance: 0.2,
1002          color: 'rgb(150, 150, 150)', // Cinza médio para aparecer em fundo branco
1003          maxOpacity: 0.2 // Opacidade para ser visível em fundo branco
1004        });
1005      }
1006    });
1007  </script>
1007
1008  
1009  <!-- Video Optimization Script (DESABILITADO para debug) -->
1010  <!-- 
1010<script src="js/video-optimizer.js" type="text/javascript"></script>
1010 -->
1011
1012  <!-- Premium Lead Capture Modal Styles -->
1013  <style>
1014    .modal-overlay {
1015      position: fixed;
1016      top: 0; left: 0; right: 0; bottom: 0;
1017      background: rgba(19, 17, 35, 0.4);
1018      backdrop-filter: blur(12px);
1019      -webkit-backdrop-filter: blur(12px);
1020      display: flex;
1021      align-items: center;
1022      justify-content: center;
1023      z-index: 10000;
1024      opacity: 0;
1025      pointer-events: none;
1026      transition: opacity 0.25s ease;
1027    }
1028    .modal-overlay.active {
1029      opacity: 1;
1030      pointer-events: auto;
1031    }
1032    .modal-card {
1033      background: #ffffff;
1034      border: 2px solid #525151;
1035      border-radius: 24px;
1036      padding: 40px;
1037      max-width: 440px;
1038      width: 100%;
1039      position: relative;
1040      box-shadow: 0 20px 50px rgba(19, 17, 35, 0.12);
1041      transform: scale(0.95);
1042      transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
1043      font-family: 'Plus Jakarta Sans', sans-serif;
1044    }
1045    .modal-overlay.active .modal-card {
1046      transform: scale(1);
1047    }
1048    .modal-close-btn {
1049      position: absolute;
1050      top: 20px; right: 24px;
1051      background: transparent;
1052      border: none;
1053      font-size: 24px;
1054      color: #94a3b8;
1055      cursor: pointer;
1056      line-height: 1;
1057      transition: color 0.15s ease;
1058    }
1059    .modal-close-btn:hover {
1060      color: #525151;
1061    }
1062    .modal-brand {
1063      display: flex;
1064      align-items: center;
1065      justify-content: center;
1066      gap: 8px;
1067      margin-bottom: 16px;
1068    }
1069    .modal-brand .wrap-logo-icon._2 {
1070      position: relative;
1071      width: 28px;
1072      height: 28px;
1073      flex-shrink: 0;
1074    }
1075    .modal-brand-name {
1076      font-size: 18px;
1077      font-weight: 800;
1078      color: #131123;
1079      letter-spacing: -0.03em;
1080    }
1081    .modal-h {
1082      font-size: 20px;
1083      font-weight: 800;
1084      color: #525151;
1085      line-height: 1.25;
1086      letter-spacing: -0.02em;
1087      margin-bottom: 24px;
1088      text-align: center;
1089    }
1090    .modal-p {
1091      font-size: 13.5px;
1092      color: #64748b;
1093      line-height: 1.5;
1094      margin-bottom: 24px;
1095      text-align: center;
1096    }
1097    .form-group {
1098      display: flex;
1099      flex-direction: column;
1100      gap: 6px;
1101      margin-bottom: 20px;
1102      text-align: left;
1103    }
1104    .form-group label {
1105      font-size: 11px;
1106      font-weight: 800;
1107      text-transform: uppercase;
1108      color: #64748b;
1109      letter-spacing: 0.05em;
1110    }
1111    .modal-input {
1112      padding: 12px 16px;
1113      border-radius: 12px;
1114      border: 2px solid #525151;
1115      background: #ffffff;
1116      font-size: 14px;
1117      color: #525151;
1118      transition: all 0.15s ease;
1119      font-family: inherit;
1120      width: 100%;
1121      box-sizing: border-box;
1122    }
1123    .modal-input:focus {
1124      background: #ffffff;
1125      border-color: #e0fe60;
1126      outline: none;
1127      box-shadow: 0 0 0 3px rgba(224, 254, 96, 0.25);
1128    }
1129    select.modal-input {
1130      appearance: none;
1131      background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23525151' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
1132      background-repeat: no-repeat;
1133      background-position: right 16px center;
1134      background-size: 16px;
1135      padding-right: 40px;
1136    }
1137    .modal-submit-btn {
1138      width: 100%;
1139      padding: 14px;
1140      border-radius: 40px;
1141      background-color: #e0fe60;
1142      color: #525151 !important;
1143      border: 2px solid #525151;
1144      font-size: 14px;
1145      font-weight: 700;
1146      cursor: pointer;
1147      transition: background-color 0.15s ease, transform 0.15s ease;
1148      font-family: inherit;
1149      box-shadow: 0 4px 0px rgba(82, 81, 81, 0.15);
1150      text-align: center;
1151      display: block;
1152      text-decoration: none;
1153      box-sizing: border-box;
1154    }
1155    .modal-submit-btn:hover {
1156      background-color: #f6ffd0;
1157      transform: translateY(-1px);
1158    }
1159    .modal-submit-btn:active {
1160      background-color: #e0fe60;
1161      transform: translateY(1px);
1162    }
1163    .success-icon {
1164      font-size: 44px;
1165      margin-bottom: 16px;
1166      text-align: center;
1167      color: #12b878;
1168    }
1169
1170    /* Estilo dos Seletores de Uso por Ícone */
1171    .usage-options {
1172      display: flex;
1173      gap: 12px;
1174      width: 100%;
1175      box-sizing: border-box;
1176      margin-top: 4px;
1177    }
1178    .usage-card {
1179      flex: 1;
1180      display: flex;
1181      flex-direction: column;
1182      align-items: center;
1183      justify-content: center;
1184      padding: 20px 16px;
1185      border: 2px solid #525151;
1186      border-radius: 16px;
1187      background: #ffffff;
1188      cursor: pointer;
1189      transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
1190      text-align: center;
1191      font-size: 13px;
1192      font-weight: 800;
1193      color: #525151;
1194      user-select: none;
1195      box-shadow: 0 4px 0px rgba(82, 81, 81, 0.1);
1196    }
1197    .usage-icon-wrapper {
1198      display: flex;
1199      align-items: center;
1200      justify-content: center;
1201      width: 48px;
1202      height: 48px;
1203      border-radius: 50%;
1204      background: rgba(19, 17, 35, 0.05);
1205      margin-bottom: 12px;
1206      transition: all 0.2s ease;
1207    }
1208    .usage-card:hover {
1209      background: #fafafa;
1210      transform: translateY(-2px);
1211      box-shadow: 0 6px 0px rgba(82, 81, 81, 0.15);
1212    }
1213    .usage-card:hover .usage-icon-wrapper {
1214      background: rgba(224, 254, 96, 0.25);
1215    }
1216    .usage-card:active {
1217      transform: translateY(2px);
1218      box-shadow: 0 2px 0px rgba(82, 81, 81, 0.1);
1219    }
1220    .usage-card.active {
1221      background: #e0fe60;
1222      border-color: #525151;
1223      transform: translateY(1px);
1224      box-shadow: 0 2px 0px rgba(82, 81, 81, 0.15);
1225    }
1226    .usage-card.active .usage-icon-wrapper {
1227      background: #ffffff;
1228    }
1229    .usage-card svg {
1230      color: #525151;
1231      transition: all 0.2s ease;
1232    }
1233    .usage-card .icon-accent-path {
1234      stroke: #525151;
1235      transition: all 0.2s ease;
1236    }
1237    .usage-card.active .icon-accent-path {
1238      stroke: #12b878;
1239      fill: rgba(18, 184, 120, 0.1);
1240    }
1241    .usage-card.active svg {
1242      color: #12b878;
1243    }
1244  </style>
1245
1246  <!-- Elegant Lead Capture Modal HTML -->
1247  <div class="modal-overlay" id="leadModal" style="display: none;">
1248    <div class="modal-card">
1249      <button type="button" class="modal-close-btn" onclick="closeModal()">×</button>
1250
1251      <!-- Stage 1: Capture Form -->
1252      <div id="modalStageForm">
1253        <h3 class="modal-h" id="modalHeader" style="margin-top: 10px;">Acesse a demonstração da Plati AI</h3>
1254
1255        <form id="homeLeadForm" onsubmit="handleHomeLeadSubmit(event)">
1256          <div class="form-group">
1257            <label for="leadEmail">E-mail corporativo</label>
1258            <input type="email" id="leadEmail" required placeholder="[email protected]" class="modal-input">
1259          </div>
1260          <div class="form-group">
1261            <label for="leadCompany">Nome da empresa</label>
1262            <input type="text" id="leadCompany" placeholder="Nome da sua empresa" class="modal-input">
1263          </div>
1264          <div class="form-group">
1265            <label for="leadMessages">Quantas mensagens recebe por mês?</label>
1266            <select id="leadMessages" required class="modal-input">
1267              <option value="" disabled selected>Selecione uma faixa...</option>
1268              <option value="5000">Até 5.000 mensagens</option>
1269              <option value="10000">5.000 a 10.000 mensagens</option>
1270              <option value="50000">10.000 a 50.000 mensagens</option>
1271              <option value="200000">50.000 a 200.000 mensagens</option>
1272              <option value="500000">Mais de 200.000 mensagens</option>
1273            </select>
1274          </div>
1275          <div class="form-group">
1276            <label>Como usa o WhatsApp hoje?</label>
1277            <div class="usage-options">
1278              <div class="usage-card" data-value="App">
1279                <div class="usage-icon-wrapper">
1280                  <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
1281                    <rect x="5" y="2" width="14" height="20" rx="2" ry="2" class="icon-accent-path"></rect>
1282                    <line x1="12" y1="18" x2="12.01" y2="18"></line>
1283                  </svg>
1284                </div>
1285                <span>WhatsApp Business / Pessoal</span>
1286                <span style="font-size: 10px; font-weight: 400; opacity: 0.8; margin-top: 6px; line-height: 1.3;">(Acesso pelos aplicativos do WhatsApp no celular, mais comum em PME)</span>
1287              </div>
1288              <div class="usage-card" data-value="Cloud API">
1289                <div class="usage-icon-wrapper">
1290                  <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
1291                    <path d="M18 10h-1.26A8 8 0 1 0 9 20h9a5 5 0 0 0 0-10z" class="icon-accent-path"></path>
1292                  </svg>
1293                </div>
1294                <span>Cloud API</span>
1295                <span style="font-size: 10px; font-weight: 400; opacity: 0.8; margin-top: 6px; line-height: 1.3;">(Infraestrutura de Nuvem da Meta, mais comum em grandes operacoes)</span>
1296              </div>
1297            </div>
1298            <input type="hidden" id="leadUsage" value="">
1299          </div>
1300
1301          <button type="submit" class="modal-submit-btn" style="margin-top: 10px;">Continuar</button>
1302        </form>
1303      </div>
1304    </div>
1305  </div>
1306
1307  <!-- Modal Control Logic JavaScript -->
1308  
1308<script>
1309    const LEADS_API = 'https://plati-lead-capture.plati-ai.workers.dev';
1310    let lastClickedCtaHref = 'https://wa.me/5511936209757?text=Ol%C3%A1%21%20Preenchi%20o%20formul%C3%A1rio%20no%20site%20e%20gostaria%20de%20falar%20com%20a%20Plati';
1311
1312    function openModal(e, originalHref, ctaText) {
1313      if (e) e.preventDefault();
1314      if (originalHref) {
1315        lastClickedCtaHref = originalHref;
1316      }
1317
1318      // Atualiza o título do modal dinamicamente baseado no texto do CTA clicado
1319      const modalHeader = document.getElementById('modalHeader');
1320      if (ctaText) {
1321        const text = ctaText.toLowerCase();
1322        if (text.includes('demo') || text.includes('demonstração') || text.includes('ver')) {
1323          modalHeader.textContent = 'Veja a demonstração da Plati AI';
1324        } else if (text.includes('case') || text.includes('cases') || text.includes('casos')) {
1325          modalHeader.textContent = 'Veja casos de uso da Plati AI';
1326        } else if (text.includes('começar') || text.includes('comece')) {
1327          modalHeader.textContent = 'Comece a usar a Plati AI';
1328        } else {
1329          modalHeader.textContent = 'Acesse a Plati AI no WhatsApp';
1330        }
1331      } else {
1332        modalHeader.textContent = 'Acesse a demonstração da Plati AI';
1333      }
1334
1335      const modal = document.getElementById('leadModal');
1336      modal.style.display = 'flex';
1337      setTimeout(() => {
1338        modal.classList.add('active');
1339      }, 10);
1340      document.getElementById('modalStageForm').style.display = 'block';
1341      document.getElementById('homeLeadForm').reset();
1342      
1343      // Reset seletores por ícone
1344      document.querySelectorAll('.usage-card').forEach(c => c.classList.remove('active'));
1345      document.getElementById('leadUsage').value = '';
1346    }
1347
1348    function closeModal() {
1349      const modal = document.getElementById('leadModal');
1350      modal.classList.remove('active');
1351      setTimeout(() => {
1352        modal.style.display = 'none';
1353      }, 250);
1354    }
1355
1356    // Intercept escape key to close modal
1357    window.addEventListener('keydown', function(e) {
1358      if (e.key === 'Escape') closeModal();
1359    });
1360
1361    // Close modal on overlay click
1362    document.getElementById('leadModal').addEventListener('click', function(e) {
1363      if (e.target === this) closeModal();
1364    });
1365
1366    function handleHomeLeadSubmit(e) {
1367      e.preventDefault();
1368      const email = document.getElementById('leadEmail').value.trim();
1369      const company = document.getElementById('leadCompany').value.trim();
1370      const conversas = parseInt(document.getElementById('leadMessages').value) || null;
1371      const usage = document.getElementById('leadUsage').value || null;
1372
1373      // Captura parâmetros de UTM e marketing da URL para atribuição de anúncios
1374      const urlParams = new URLSearchParams(window.location.search);
1375      const utmSource = urlParams.get('utm_source');
1376      const utmMedium = urlParams.get('utm_medium');
1377      const utmCampaign = urlParams.get('utm_campaign');
1378      const gclid = urlParams.get('gclid');
1379      const fbclid = urlParams.get('fbclid');
1380
1381      let sourceString = 'home-modal';
1382      if (utmSource) {
1383        sourceString += ` (${utmSource}`;
1384        if (utmMedium) sourceString += ` / ${utmMedium}`;
1385        if (utmCampaign) sourceString += ` - ${utmCampaign}`;
1386        sourceString += `)`;
1387      } else if (gclid) {
1388        sourceString += ' (Google Ads)';
1389      } else if (fbclid) {
1390        sourceString += ' (Meta Ads)';
1391      }
1392
1393      // Garante que respeite o limite de 80 caracteres do campo source no banco/Worker
1394      sourceString = sourceString.slice(0, 80);
1395
1396      const leadPayload = {
1397        email: email,
1398        company: company || 'Lead Home',
1399        conversas: conversas,
1400        model: usage,
1401        source: sourceString,
1402      };
1403
1404      // Save to localStorage
1405      localStorage.setItem('plati_lead_home', JSON.stringify({ ...leadPayload, date: new Date().toISOString() }));
1406
1407      // Send to API (não-bloqueante no background)
1408      fetch(LEADS_API, {
1409        method: 'POST',
1410        headers: { 'Content-Type': 'application/json' },
1411        body: JSON.stringify(leadPayload),
1412      })
1413      .then(r => r.json())
1414      .then(data => {
1415        console.log('Lead salvo com sucesso', data);
1416      })
1417      .catch((err) => {
1418        console.warn('Lead API indisponível', err);
1419      });
1420
1421      // Redireciona imediatamente para o link do WhatsApp correspondente ao CTA clicado em nova aba
1422      window.open(lastClickedCtaHref, '_blank');
1423
1424      // Fecha o modal atual na home
1425      closeModal();
1426    }
1427
1428    // Intercept all WhatsApp CTA clicks to open the modal instead
1429    document.addEventListener('DOMContentLoaded', function() {
1430      // Event listeners para seletores de uso por ícone
1431      const cards = document.querySelectorAll('.usage-card');
1432      const usageInput = document.getElementById('leadUsage');
1433
1434      cards.forEach(card => {
1435        card.addEventListener('click', function() {
1436          const isAlreadyActive = this.classList.contains('active');
1437          
1438          // Clear all active cards
1439          cards.forEach(c => c.classList.remove('active'));
1440          
1441          if (isAlreadyActive) {
1442            // Deselect
1443            usageInput.value = '';
1444          } else {
1445            // Select
1446            this.classList.add('active');
1447            usageInput.value = this.getAttribute('data-value');
1448          }
1449        });
1450      });
1451
1452      // CTAs
1453      const ctas = document.querySelectorAll('a[href*="wa.me/5511936209757"], a[href*="api.whatsapp.com/se
1453nd"]');
1454      ctas.forEach(cta => {
1455        const href = cta.getAttribute('href');
1456        
1457        // Exclude "Trabalhe Conosco" to keep them direct
1458        if (href.includes('trabalhar')) {
1459          return;
1460        }
1461
1462        cta.addEventListener('click', function(e) {
1463          e.preventDefault();
1464          const ctaText = this.textContent.trim();
1465          openModal(e, href, ctaText);
1466        });
1467      });
1468    });
1469  </script>
1469
1470</body>
1471</html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.