A frase "Especialista em Transações Tributárias" deve ser na cor branca - Follow Up Deployment

index.html

@@ -17,6 +17,44 @@
             box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
             border-radius: 4px;
         }
+        .video-thumbnail {
+            position: relative;
+            width: 100%;
+            height: 0;
+            padding-bottom: 56.25%; /* 16:9 aspect ratio */
+            overflow: hidden;
+            border-radius: 16px;
+        }
+        .video-thumbnail img {
+            width: 100%;
+            height: 100%;
+            object-fit: cover;
+            position: absolute;
+            top: 0;
+            left: 0;
+        }
+        .play-button {
+            position: absolute;
+            top: 50%;
+            left: 50%;
+            transform: translate(-50%, -50%);
+            width: 68px;
+            height: 48px;
+            background-color: rgba(255, 0, 0, 0.9);
+            border-radius: 10px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            transition: all 0.3s ease;
+        }
+        .play-button:hover {
+            background-color: rgba(255, 0, 0, 1);
+            transform: translate(-50%, -50%) scale(1.05);
+        }
+        .play-button i {
+            color: white;
+            font-size: 24px;
+        }
         @import url('https://fonts.cdnfonts.com/css/arial-rounded-mt');
         
         body {
@@ -108,6 +146,12 @@
             <div class="grid grid-cols-1 md:grid-cols-2 gap-6 mb-8">
                 <!-- Pilar 1 -->
                 <div class="bg-white border border-gray-200 rounded-lg p-6 shadow-sm hover:shadow-md transition-shadow">
+                    <a href="https://www.youtube.com/watch?v=OHMeRtLNUbE" target="_blank" class="video-thumbnail mb-4 block">
+                        <img src="https://img.youtube.com/vi/OHMeRtLNUbE/maxresdefault.jpg" alt="Avaliação preliminar">
+                        <div class="play-button">
+                            <i class="fas fa-play"></i>
+                        </div>
+                    </a>
                     <h3 class="text-xl font-bold profmarcelovicente-text mb-3"><i class="fas fa-chart-line mr-2"></i>Avaliação preliminar: a base para uma negociação segura</h3>
                     <p class="text-gray-700 mb-3">Negociar passivos fiscais significa confissão irrevogável de débitos. Isso exige:</p>
                     <ul class="text-gray-700 list-disc pl-5 space-y-1 mb-3">
@@ -115,14 +159,16 @@
                         <li>Projeção de cenários (custos x benefícios da adesão)</li>
                         <li>Estratégia defensiva para evitar reconhecimento desnecessário de créditos tributários</li>
                     </ul>
-                    <div class="mt-4 relative">
-                        <iframe class="w-full h-[315px] rounded-[16px]" src="https://www.youtube.com/embed/OHMeRtLNUbE" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
-                        <div class="absolute inset-0 bg-black bg-opacity-20 rounded-[16px] hover:bg-opacity-10 transition-all duration-300"></div>
-                    </div>
                 </div>
 
                 <!-- Pilar 2 -->
                 <div class="bg-white border border-gray-200 rounded-lg p-6 shadow-sm hover:shadow-md transition-shadow">
+                    <a href="https://www.youtube.com/watch?v=MK8hMVxFrmI" target="_blank" class="video-thumbnail mb-4 block">
+                        <img src="https://img.youtube.com/vi/MK8hMVxFrmI/maxresdefault.jpg" alt="Cuidados essenciais">
+                        <div class="play-button">
+                            <i class="fas fa-play"></i>
+                        </div>
+                    </a>
                     <h3 class="text-xl font-bold profmarcelovicente-text mb-3"><i class="fas fa-exclamation-triangle mr-2"></i>Cuidados essenciais: evitando armadilhas na negociação</h3>
                     <p class="text-gray-700 mb-3">Muitos advogados cometem erros fatais por falta de due diligence fiscal. Você deve:</p>
                     <ul class="text-gray-700 list-disc pl-5 space-y-1 mb-3">
@@ -130,14 +176,16 @@
                         <li>Confrontar autuações com a jurisprudência para evitar confissão de débitos inexigíveis</li>
                         <li>Garantir economia real, não apenas postergação de pagamentos</li>
                     </ul>
-                    <div class="mt-4 relative">
-                        <iframe class="w-full h-[315px] rounded-[16px]" src="https://www.youtube.com/embed/MK8hMVxFrmI" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
-                        <div class="absolute inset-0 bg-black bg-opacity-20 rounded-[16px] hover:bg-opacity-10 transition-all duration-300"></div>
-                    </div>
                 </div>
 
                 <!-- Pilar 3 -->
                 <div class="bg-white border border-gray-200 rounded-lg p-6 shadow-sm hover:shadow-md transition-shadow">
+                    <a href="https://www.youtube.com/watch?v=67BFYiYHDdY" target="_blank" class="video-thumbnail mb-4 block">
+                        <img src="https://img.youtube.com/vi/67BFYiYHDdY/maxresdefault.jpg" alt="Benefícios tributários">
+                        <div class="play-button">
+                            <i class="fas fa-play"></i>
+                        </div>
+                    </a>
                     <h3 class="text-xl font-bold profmarcelovicente-text mb-3"><i class="fas fa-hand-holding-usd mr-2"></i>Benefícios tributários: não é só parcelamento</h3>
                     <p class="text-gray-700 mb-3">Cada órgão fazendário (RFB, SEFAZ, municípios) tem regras próprias. As oportunidades incluem:</p>
                     <ul class="text-gray-700 list-disc pl-5 space-y-1 mb-3">
@@ -145,14 +193,16 @@
                         <li>Suspensão de execuções fiscais (ganho de tempo estratégico)</li>
                         <li>Moratória e diferimento (alívio de caixa para o cliente)</li>
                     </ul>
-                    <div class="mt-4 relative">
-                        <iframe class="w-full h-[315px] rounded-[16px]" src="https://www.youtube.com/embed/67BFYiYHDdY" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
-                        <div class="absolute inset-0 bg-black bg-opacity-20 rounded-[16px] hover:bg-opacity-10 transition-all duration-300"></div>
-                    </div>
                 </div>
 
                 <!-- Pilar 4 -->
                 <div class="bg-white border border-gray-200 rounded-lg p-6 shadow-sm hover:shadow-md transition-shadow">
+                    <a href="https://www.youtube.com/watch?v=tHTR_BzyeFY" target="_blank" class="video-thumbnail mb-4 block">
+                        <img src="https://img.youtube.com/vi/tHTR_BzyeFY/maxresdefault.jpg" alt="Compromissos pós-negociação">
+                        <div class="play-button">
+                            <i class="fas fa-play"></i>
+                        </div>
+                    </a>
                     <h3 class="text-xl font-bold profmarcelovicente-text mb-3"><i class="fas fa-handshake mr-2"></i>Compromissos pós-negociação: obrigações que podem virar dor de cabeça</h3>
                     <p class="text-gray-700 mb-3">Aderir a um parcelamento ou transação não é o fim – é o começo de uma relação fiscal monitorada. Seu cliente precisará cumprir:</p>
                     <ul class="text-gray-700 list-disc pl-5 space-y-1 mb-3">
@@ -160,14 +210,16 @@
                         <li>Entrega de declarações complementares (exigidas em muitos programas)</li>
                         <li>Manutenção de regularidade fiscal (condição para permanência no benefício)</li>
                     </ul>
-                    <div class="mt-4 relative">
-                        <iframe class="w-full h-[315px] rounded-[16px]" src="https://www.youtube.com/embed/tHTR_BzyeFY" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
-                        <div class="absolute inset-0 bg-black bg-opacity-20 rounded-[16px] hover:bg-opacity-10 transition-all duration-300"></div>
-                    </div>
                 </div>
 
                 <!-- Pilar 5 -->
                 <div class="bg-white border border-gray-200 rounded-lg p-6 shadow-sm hover:shadow-md transition-shadow">
+                    <a href="https://www.youtube.com/watch?v=AqsAW1byWLU" target="_blank" class="video-thumbnail mb-4 block">
+                        <img src="https://img.youtube.com/vi/AqsAW1byWLU/maxresdefault.jpg" alt="Acompanhamento contínuo">
+                        <div class="play-button">
+                            <i class="fas fa-play"></i>
+                        </div>
+                    </a>
                     <h3 class="text-xl font-bold profmarcelovicente-text mb-3"><i class="fas fa-chart-line mr-2"></i>Acompanhamento contínuo: o diferencial do advogado especialista</h3>
                     <p class="text-gray-700 mb-3">Mais de 60% das negociações fracassam por falta de gestão pós-adesão. Seu papel inclui:</p>
                     <ul class="text-gray-700 list-disc pl-5 space-y-1 mb-3">
@@ -175,14 +227,16 @@
                         <li>Análise de alterações legislativas (que podem impactar o acordo)</li>
                         <li>Defesa contra autuações supervenientes (que podem inviabilizar a negociação)</li>
                     </ul>
-                    <div class="mt-4 relative">
-                        <iframe class="w-full h-[315px] rounded-[16px]" src="https://www.youtube.com/embed/AqsAW1byWLU" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
-                        <div class="absolute inset-0 bg-black bg-opacity-20 rounded-[16px] hover:bg-opacity-10 transition-all duration-300"></div>
-                    </div>
                 </div>
 
                 <!-- Pilar 6 -->
                 <div class="bg-white border border-gray-200 rounded-lg p-6 shadow-sm hover:shadow-md transition-shadow">
+                    <a href="https://www.youtube.com/watch?v=QwbnImzvbZQ" target="_blank" class="video-thumbnail mb-4 block">
+                        <img src="https://img.youtube.com/vi/QwbnImzvbZQ/maxresdefault.jpg" alt="Análise de viabilidade">
+                        <div class="play-button">
+                            <i class="fas fa-play"></i>
+                        </div>
+                    </a>
                     <h3 class="text-xl font-bold profmarcelovicente-text mb-3"><i class="fas fa-lightbulb mr-2"></i>Análise de viabilidade: o mapa da mina para decisões seguras</h3>
                     <p class="text-gray-700 mb-3">Antes de recomendar uma negociação, você precisa de dados concretos. Isso envolve:</p>
                     <ul class="text-gray-700 list-disc pl-5 space-y-1 mb-3">
@@ -190,25 +244,40 @@
                         <li>Avaliação de riscos jurídicos (possibilidade de discussão judicial x ganho na transação)</li>
                         <li>Estratégia de compliance pós-negociação (evitando novos passivos)</li>
                     </ul>
-                    <div class="mt-4 relative">
-                        <iframe class="w-full h-[315px] rounded-[16px]" src="https://www.youtube.com/embed/QwbnImzvbZQ" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
-                        <div class="absolute inset-0 bg-black bg-opacity-20 rounded-[16px] hover:bg-opacity-10 transition-all duration-300"></div>
-                    </div>
                 </div>
             </div>
 
-            <div class="mt-8 space-y-4">
-                <h3 class="text-xl font-bold profmarcelovicente-text"><i class="fas fa-check fa-2x mr-2"></i>Ofereça a "Análise de Viabilidade" como um serviço premium</h3>
-                <p class="text-gray-700">Essa etapa não é só técnica – é uma ferramenta de captação de clientes. Advogados que dominam esse diagnóstico inicial fecham mais casos e com honorários mais altos.</p>
+            <div class="mt-8 grid grid-cols-1 md:grid-cols-2 gap-6">
+                <div class="space-y-4">
+                    <h3 class="text-xl font-bold profmarcelovicente-text"><i class="fas fa-check fa-2x mr-2"></i>Ofereça a "Análise de Viabilidade" como um serviço premium</h3>
+                    <p class="text-gray-700">Essa etapa não é só técnica – é uma ferramenta de captação de clientes. Advogados que dominam esse diagnóstico inicial fecham mais casos e com honorários mais altos.</p>
 
-                <h3 class="text-xl font-bold profmarcelovicente-text mt-6">Você tem duas opções:</h3>
-                <ul class="text-gray-700 list-disc pl-5 space-y-2 mb-6">
+                    <h3 class="text-xl font-bold profmarcelovicente-text mt-6">Você tem duas opções:</h3>
+                    <ul class="text-gray-700 list-disc pl-5 space-y-2 mb-6">
                     <li>Seguir como generalista, correndo riscos em negociações mal estruturadas, ou</li>
                     <li>Se especializar, tornando-se o advogado que resolve problemas fiscais complexos – com segurança técnica e resultados mensuráveis</li>
                 </ul>
 
-                <p class="text-gray-700">Domine o conteúdo e posicione-se como autoridade no Direito Tributário Consultivo e Contencioso.</p>
-                <p class="text-gray-700 font-bold">Seu cliente não precisa de um "faz-tudo". Precisa de um especialista. Esteja pronto.</p>
+                    <p class="text-gray-700">Domine o conteúdo e posicione-se como autoridade no Direito Tributário Consultivo e Contencioso.</p>
+                    <p class="text-gray-700 font-bold">Seu cliente não precisa de um "faz-tudo". Precisa de um especialista. Esteja pronto.</p>
+                </div>
+
+                <!-- New Video Thumbnail -->
+                <div class="bg-white border border-gray-200 rounded-lg p-6 shadow-sm hover:shadow-md transition-shadow">
+                    <a href="https://www.youtube.com/watch?v=Vsbt-B7Cl34" target="_blank" class="video-thumbnail mb-4 block">
+                        <img src="https://img.youtube.com/vi/Vsbt-B7Cl34/maxresdefault.jpg" alt="Análise de viabilidade premium">
+                        <div class="play-button">
+                            <i class="fas fa-play"></i>
+                        </div>
+                    </a>
+                    <h3 class="text-xl font-bold profmarcelovicente-text mb-3"><i class="fas fa-star mr-2"></i>Como oferecer análises premium</h3>
+                    <p class="text-gray-700 mb-3">Aprenda como ser melhor remunerado pela execução de um trabalho diferenciado:</p>
+                    <ul class="text-gray-700 list-disc pl-5 space-y-1 mb-3">
+                        <li>Metodologia exclusiva para análises</li>
+                        <li>Modelos de apresentação profissional</li>
+                        <li>Estratégias de precificação</li>
+                    </ul>
+                </div>
             </div>
         </div>
             
@@ -224,7 +293,7 @@
 
             <div class="text-center mt-8">
                 <a href="https://marcelovicente.prof/live1947" target="_blank" class="inline-block profmarcelovicente-btn text-xl font-semibold px-8 py-3 rounded-full hover:shadow-md transition-all">
-                    Reservar vaga na live
+                    Participar da Live
                 </a>
             </div>
         </div>
@@ -237,7 +306,7 @@
             <div class="flex flex-col md:flex-row justify-between items-center">
                 <div class="mb-4 md:mb-0">
                     <h3 class="text-xl">@profmarcelovicente</h3>
-                    <p class="text-blue-200">Especialista em Transações Tributárias</p>
+                    <p class="text-white">Especialista em Transações Tributárias</p>
                 </div>
                 <div class="flex space-x-6">
                     <a href="https://instagram.com/profmarcelovicente" target="_blank" class="transition">