the video dont play when click watch trailler - Follow Up Deployment

index.html

@@ -624,7 +624,10 @@
                 <i class="ph ph-x"></i>
             </button>
             <div class="aspect-w-16 aspect-h-9">
-                <iframe id="videoFrame" class="w-full h-96 md:h-[32rem] rounded-lg" src="https://drive.google.com/file/d/1nVi1lALKDSSFVNFlYUrw56b4iK2EwSd7/preview" frameborder="0" allowfullscreen></iframe>
+                <video id="videoPlayer" class="w-full h-96 md:h-[32rem] rounded-lg" controls>
+                    <source src="https://drive.google.com/uc?export=download&id=1nVi1lALKDSSFVNFlYUrw56b4iK2EwSd7" type="video/mp4">
+                    Your browser does not support the video tag.
+                </video>
             </div>
         </div>
     </div>
@@ -707,26 +710,26 @@
         const videoModal = document.getElementById('videoModal');
         const watchTrailerBtn = document.getElementById('watchTrailer');
         const closeModalBtn = document.getElementById('closeModal');
-        const videoFrame = document.getElementById('videoFrame');
+        const videoPlayer = document.getElementById('videoPlayer');
 
         watchTrailerBtn.addEventListener('click', () => {
             videoModal.classList.remove('hidden');
             document.body.style.overflow = 'hidden';
+            videoPlayer.play();
         });
 
         closeModalBtn.addEventListener('click', () => {
+            videoPlayer.pause();
             videoModal.classList.add('hidden');
             document.body.style.overflow = '';
-            // Reset video when closing
-            videoFrame.src = videoFrame.src;
         });
 
         // Close modal when clicking outside
         videoModal.addEventListener('click', (e) => {
             if (e.target === videoModal) {
+                videoPlayer.pause();
                 videoModal.classList.add('hidden');
                 document.body.style.overflow = '';
-                videoFrame.src = videoFrame.src;
             }
         });
     </script>

prompts.txt

@@ -52,4 +52,5 @@ now apply the 3D effect of perspective on mouse over on all Featured Speakers ca
 please adapt this infos and photos from another code on this code in the box of May: <div class="timeline-item pl-12 sm:pl-0" style="opacity: 1; transform: translateY(0px); transition: 0.6s;">                     <div class="bg-white p-6 rounded-xl shadow-lg">                         <div class="text-sm font-semibold text-accent mb-2">MAY</div>                         <h3 class="text-xl font-bold mb-3">Initial Activation</h3>                         <p>Our TON FEST quest with the SBC brand crushed it—putting SBC in front of 29k+ verified users worldwide (exposed to 29k verified users), adding 700+ fresh members to the SBC Summit Telegram channel, and pumping SBC Gaming's X (Twitter) followership by 10%.</p>                         <div class="mt-4 flex flex-wrap gap-2 mb-4">                             <span class="bg-primary/10 text-primary text-xs font-medium px-3 py-1 rounded-full">Telegram 700+</span>                             <span class="bg-secondary/10 text-secondary text-xs font-medium px-3 py-1 rounded-full">Twitter +10%</span>                             <span class="bg-accent/10 text-accent text-xs font-medium px-3 py-1 rounded-full">Exposed to 29k Verified Users</span>                         </div>                         <div class="bg-white p-4 rounded-xl shadow-sm">                             <div class="grid grid-cols-2 gap-4">                                 <div class="bg-gray-50 p-2 rounded-lg">                                     <img src="https://drive.google.com/thumbnail?id=1PMmkbc5gGBGd_hSlV-EuGfJn6oAzdgl9&amp;sz=w1000" alt="TON FEST Activation" class="rounded-lg w-full h-auto">                                 </div>                                 <div class="bg-gray-50 p-2 rounded-lg">                                     <img src="https://drive.google.com/thumbnail?id=1UtRHiou6MiI7Ty5GFPKrS1S0KG5wCap2&amp;sz=w1000" alt="TON FEST Activation" class="rounded-lg w-full h-auto">                                 </div>                                 <div class="bg-gray-50 p-2 rounded-lg">                                     <img src="https://drive.google.com/thumbnail?id=1Dofmf0Xgh3NAXfKa44mMaN-dEc1qZnSa&amp;sz=w1000" alt="TON FEST Activation" class="rounded-lg w-full h-auto">                                 </div>                                 <div class="bg-gray-50 p-2 rounded-lg">                                     <img src="https://drive.google.com/thumbnail?id=1bd2Gbb09zGjEMb5jmGRiTdfjwpSJKgNX&amp;sz=w1000" alt="TON FEST Activation" class="rounded-lg w-full h-auto">                                 </div>                             </div>                         </div>                     </div>                 </div>
 lets do the same with this one creating another box of may bellow the first one: <div class="bg-white p-6 rounded-xl shadow-lg">                         <div class="text-sm font-semibold text-accent mb-2">MAY</div>                         <h3 class="text-xl font-bold mb-3">Web3/Ai Portugal Activation</h3>                         <p>The kickoff TON activation got an extra boost—our event post was shared across Portugal's top-tier Web3 Telegram groups, reaching 8 000+ highly engaged members.</p>                         <div class="mt-4 flex flex-wrap gap-2">                             <span class="bg-primary/10 text-primary text-xs font-medium px-3 py-1 rounded-full">Exposed to 8K Web3/AI Portuguese</span>                         </div>                         <div class="bg-white p-4 rounded-xl shadow-sm mt-4 w-1/2">                             <div class="bg-gray-50 p-2 rounded-lg">                                 <img src="https://drive.google.com/thumbnail?id=1qoNoY_hNEqRgqwrYJgBeHpD4ha4UpZrL&amp;sz=w1000" alt="Planning Strategy" class="rounded-lg w-full h-auto">                             </div>                         </div>                     </div>
 when watch trailler is clcked, opens a video from the google drive link: https://drive.google.com/file/d/1nVi1lALKDSSFVNFlYUrw56b4iK2EwSd7/view?usp=sharing
-can you make the video play in a dialog box inside the website instead of opening google drive?
+can you make the video play in a dialog box inside the website instead of opening google drive?
+the video dont play when click watch trailler