youtobe video added

components/video.tsx

@@ -1,4 +1,5 @@
 import { useLanguage } from "@/contexts/language-context"
+import { toEmbedUrl } from "@/lib/embedUrl";
 import { Play } from "lucide-react"
 
 export default function Video() {
@@ -11,15 +12,21 @@ export default function Video() {
           <p className="text-lg text-muted-foreground">{t.action.subtitle}</p>
         </div>
 
-        <div className="relative w-full aspect-video bg-muted rounded-2xl border border-border overflow-hidden group cursor-pointer">
-          <div className="w-full h-full bg-gradient-to-br from-primary/20 via-primary/5 to-background flex items-center justify-center">
-            <div className="absolute inset-0 flex items-center justify-center">
-              <div className="bg-primary rounded-full p-4 group-hover:scale-110 transition-transform duration-300 shadow-lg">
-                <Play size={32} className="text-white fill-white" />
-              </div>
-            </div>
+        {/* YouTube video bo‘limi */}
+        <section className="flex justify-center mb-10">
+          <div className="w-full max-w-3xl aspect-video">
+            <iframe
+              className="w-full h-full rounded-lg shadow-lg"
+              src={toEmbedUrl(
+                'https://youtu.be/jorvR31QgnA?si=fX_CjYwxfUwFZAgY',
+              )}
+              title="Pedagogik yangilanish video"
+              frameBorder="0"
+              allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
+              allowFullScreen
+            ></iframe>
           </div>
-        </div>
+        </section>
       </div>
     </section>
   )